@colijnit/transaction 12.1.57 → 12.1.59

package/lib/component/transaction-line/transaction-purchase-line/transaction-purchase-line.module.d.ts

@@ -0,0 +1,2 @@
+export declare class TransactionPurchaseLineModule {
+}

package/lib/component/transaction-line-checkbox-list/style/_layout.scss

@@ -4,9 +4,7 @@
     height: 100%;
 
     .virtual-scroll-container {
-      max-height: $tp-dialog-transaction-line-warehouse-location-height;
-      height: $tp-dialog-transaction-line-warehouse-location-height;
-      min-width: $tp-dialog-transaction-line-warehouse-location-min-width;
+      height: 100%;
       width: 100%;
 
       .virtual-scroll-item {
@@ -31,7 +29,13 @@
       }
 
       .label {
-        width: 50%;
+        &:not(.first) {
+          flex-basis: 100%;
+        }
+        &.first {
+          width: $tp-transaction-line-checkbox-list-item-first-column-width;
+          flex-shrink: 0;
+        }
       }
     }
 

package/lib/component/transaction-line-checkbox-list/style/_material-definition.scss

@@ -8,3 +8,4 @@ $tp-transaction-line-checkbox-list-item-hightlight-font-weight: bold !default;
 $tp-transaction-line-checkbox-list-item-hightlight-font-style: italic !default;
 $tp-transaction-line-checkbox-list-item-hightlight-font-color: green !default;
 $tp-transaction-line-checkbox-list-item-hightlight-text-decoration: underline !default;
+$tp-transaction-line-checkbox-list-item-first-column-width: 100px !default;

package/lib/component/transaction-line-fields/transaction-line-amount.component.d.ts

@@ -0,0 +1,10 @@
+import { TransactionService } from "../../service/transaction.service";
+import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
+export declare class TransactionLineAmountComponent extends TransactionLineBaseComponent<number> {
+    private _service;
+    showClass(): boolean;
+    localAmount: number;
+    constructor(_service: TransactionService);
+    changeLineAmount(amount: number): void;
+    transactionLineSet(): Promise<void>;
+}

package/lib/component/transaction-line-fields/transaction-line-amount.module.d.ts

@@ -0,0 +1,2 @@
+export declare class TransactionLineAmountModule {
+}

package/lib/component/transaction-line-fields/transaction-line-commission-code.component.d.ts

@@ -1,8 +1,8 @@
 import { OnInit } from "@angular/core";
 import { TransactionService } from "../../service/transaction.service";
 import { CoDomainValue } from "@colijnit/transactionapi/build/model/co-domain-value.bo";
-import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
-export declare class TransactionLineCommissionCodeComponent extends TransactionLineBaseComponent<CoDomainValue> implements OnInit {
+import { TransactionFilterPopupBaseComponent } from "../core/base/transaction-filter-popup-base.component";
+export declare class TransactionLineCommissionCodeComponent extends TransactionFilterPopupBaseComponent<CoDomainValue> implements OnInit {
     private _transactionService;
     protected codeField: string;
     protected checkField: string;

package/lib/component/transaction-line-fields/transaction-line-delivery-method.component.d.ts

@@ -1,8 +1,8 @@
 import { OnInit } from "@angular/core";
 import { TransactionService } from "../../service/transaction.service";
 import { DeliveryMethod } from "@colijnit/transactionapi/build/model/delivery-method.bo";
-import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
-export declare class TransactionLineDeliveryMethodComponent extends TransactionLineBaseComponent<DeliveryMethod> implements OnInit {
+import { TransactionFilterPopupBaseComponent } from "../core/base/transaction-filter-popup-base.component";
+export declare class TransactionLineDeliveryMethodComponent extends TransactionFilterPopupBaseComponent<DeliveryMethod> implements OnInit {
     private _transactionService;
     protected codeField: string;
     protected checkField: string;

package/lib/component/transaction-line-fields/transaction-line-price-list.component.d.ts

@@ -1,8 +1,8 @@
 import { OnInit } from "@angular/core";
 import { PriceList } from "@colijnit/transactionapi/build/model/price-list";
 import { TransactionService } from "../../service/transaction.service";
-import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
-export declare class TransactionLinePriceListComponent extends TransactionLineBaseComponent<PriceList> implements OnInit {
+import { TransactionFilterPopupBaseComponent } from "../core/base/transaction-filter-popup-base.component";
+export declare class TransactionLinePriceListComponent extends TransactionFilterPopupBaseComponent<PriceList> implements OnInit {
     private _transactionService;
     protected codeField: string;
     protected checkField: string;

package/lib/component/transaction-line-fields/transaction-line-supplier-button.component.d.ts

@@ -0,0 +1,9 @@
+import { TransactionService } from "../../service/transaction.service";
+import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
+export declare class TransactionLineSupplierButtonComponent extends TransactionLineBaseComponent<number> {
+    private _service;
+    showClass(): boolean;
+    showDialogSupplier: boolean;
+    constructor(_service: TransactionService);
+    transactionLineSet(): Promise<void>;
+}

package/lib/component/transaction-line-fields/transaction-line-supplier-button.module.d.ts

@@ -0,0 +1,2 @@
+export declare class TransactionLineSupplierButtonModule {
+}

package/lib/component/transaction-line-fields/transaction-line-supplier.component.d.ts

@@ -1,13 +1,14 @@
 import { OnInit } from "@angular/core";
 import { TransactionService } from "../../service/transaction.service";
 import { RelationListObject } from "@colijnit/transactionapi/build/model/relation-list-object.bo";
-import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
-export declare class TransactionLineSupplierComponent extends TransactionLineBaseComponent<RelationListObject> implements OnInit {
+import { TransactionFilterPopupBaseComponent } from "../core/base/transaction-filter-popup-base.component";
+export declare class TransactionLineSupplierComponent extends TransactionFilterPopupBaseComponent<RelationListObject> implements OnInit {
     private _transactionService;
-    fields: Object;
-    tempSupplier: string;
+    protected codeField: string;
+    protected checkField: string;
+    protected propsForLabel: string[];
     constructor(_transactionService: TransactionService);
     ngOnInit(): void;
-    commit(code: string): Promise<boolean>;
+    commit(id: number): Promise<boolean>;
     protected transactionLineSet(): void;
 }

package/lib/component/transaction-line-fields/transaction-line-vat.component.d.ts

@@ -1,8 +1,8 @@
 import { OnInit } from "@angular/core";
 import { Vat } from "@colijnit/transactionapi/build/model/vat";
 import { TransactionService } from "../../service/transaction.service";
-import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
-export declare class TransactionLineVatComponent extends TransactionLineBaseComponent<Vat> implements OnInit {
+import { TransactionFilterPopupBaseComponent } from "../core/base/transaction-filter-popup-base.component";
+export declare class TransactionLineVatComponent extends TransactionFilterPopupBaseComponent<Vat> implements OnInit {
     private _transactionService;
     protected codeField: string;
     protected checkField: string;

package/lib/component/transaction-line-fields/transaction-line-warehouse-location.component.d.ts

@@ -1,8 +1,8 @@
 import { OnInit } from "@angular/core";
-import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
 import { StockLocation } from "@colijnit/articleapi/build/model/stock-location.bo";
 import { ArticleService } from "../../service/article.service";
-export declare class TransactionLineWarehouseLocationComponent extends TransactionLineBaseComponent<StockLocation> implements OnInit {
+import { TransactionFilterPopupBaseComponent } from "../core/base/transaction-filter-popup-base.component";
+export declare class TransactionLineWarehouseLocationComponent extends TransactionFilterPopupBaseComponent<StockLocation> implements OnInit {
     private _articleService;
     warehouseNr: number;
     protected codeField: string;

package/lib/component/transaction-line-fields/transaction-line-warehouse.component.d.ts

@@ -1,8 +1,8 @@
 import { OnInit } from "@angular/core";
 import { TransactionService } from "../../service/transaction.service";
-import { TransactionLineBaseComponent } from "../core/base/transaction-line-base.component";
 import { Warehouse } from "@colijnit/transactionapi/build/model/warehouse.bo";
-export declare class TransactionLineWarehouseComponent extends TransactionLineBaseComponent<Warehouse> implements OnInit {
+import { TransactionFilterPopupBaseComponent } from "../core/base/transaction-filter-popup-base.component";
+export declare class TransactionLineWarehouseComponent extends TransactionFilterPopupBaseComponent<Warehouse> implements OnInit {
     private _transactionService;
     branch: string;
     protected codeField: string;

package/lib/component/transaction-line-image-and-description/style/_layout.scss

@@ -1,27 +1,31 @@
-@include export-module('cc-transaction-line-image-and-description-layout') {
+@include export-module('co-transaction-line-image-and-description-layout') {
   .co-transaction-line-image-and-description {
+    font-family: $tp-transaction-line-image-and-description-font-family;
+    display: flex;
+    width: max-content;
+    align-items: center;
     .transaction-line-image {
       display: flex;
-      flex-basis: $tp-transaction-line-image-width;
-      height: $tp-transaction-line-image-height;
+      flex-basis: $tp-transaction-line-image-and-description-image-width;
+      height: $tp-transaction-line-image-and-description-image-height;
       justify-content: center;
       align-items: center;
       flex-shrink: 0;
       &.preview {
-        flex-basis: $tp-transaction-line-preview-image-width;
-        height: $tp-transaction-line-preview-image-height;
+        flex-basis: $tp-transaction-line-image-and-description-preview-image-width;
+        height: $tp-transaction-line-image-and-description-preview-image-height;
       }
     }
     .transaction-line-description {
       display: flex;
       flex-direction: column;
-      row-gap: $tp-transaction-line-row-gap;
+      row-gap: $tp-transaction-line-image-and-description-description-row-gap;
       flex-basis: 100%;
-      padding: $tp-transaction-line-inner-padding;
+      padding: $tp-transaction-line-image-and-description-description-inner-padding;
       .description-wrapper {
         display: flex;
         flex-direction: row;
-        column-gap: $tp-transaction-line-column-gap;
+        column-gap: $tp-transaction-line-image-and-description-description-column-gap;
         align-items: center;
       }
     }
@@ -37,8 +41,8 @@
     }
     .delete-icon {
       cursor: pointer;
-      height: $tp-transaction-line-delete-icon-size;
-      width: $tp-transaction-line-delete-icon-size;
+      height: $tp-transaction-line-image-and-description-delete-icon-size;
+      width: $tp-transaction-line-image-and-description-delete-icon-size;
     }
     .article-text-wrapper {
       display: flex;
@@ -46,9 +50,8 @@
       width: fit-content;
     }
     .article-text {
-      font-family: $tp-transaction-line-font-family;
-      font-size: $tp-transaction-line-article-text-font-size;
-      padding: $tp-transaction-line-article-text-padding;
+      font-size: $tp-transaction-line-image-and-description-article-text-font-size;
+      padding: $tp-transaction-line-image-and-description-article-text-padding;
     }
 
     .transaction-line-article-number-wrapper {

package/lib/component/transaction-line-image-and-description/style/_material-definition.scss

@@ -1 +1,21 @@
-$tp-transaction-line-article-text-font-color: $tp-color-label !default;
+$tp-transaction-line-image-and-description-font-family: $tp-font-family !default;
+$tp-transaction-line-image-and-description-font-size: $tp-font-size !default;
+$tp-transaction-line-image-and-description-article-text-font-color: $tp-color-label !default;
+$tp-transaction-line-image-and-description-image-width: 67px !default;
+$tp-transaction-line-image-and-description-image-height: 50px !default;
+$tp-transaction-line-image-and-description-image-border: none !default;
+$tp-transaction-line-image-and-description-preview-image-width: 75px !default;
+$tp-transaction-line-image-and-description-preview-image-height: 50px !default;
+$tp-transaction-line-image-and-description-description-row-gap: 5px !default;
+$tp-transaction-line-image-and-description-description-inner-padding: 10px !default;
+$tp-transaction-line-image-and-description-description-column-gap: 15px !default;
+$tp-transaction-line-image-and-description-delete-icon-size: 15px !default;
+$tp-transaction-line-image-and-description-article-text-font-size: $tp-font-size !default;
+$tp-transaction-line-image-and-description-article-text-padding: 2px !default;
+$tp-transaction-line-image-and-description-article-text-background-color: white !default;
+$tp-transaction-line-image-and-description-article-text-color: $tp-color-dark !default;
+$tp-transaction-line-image-and-description-delete-color: $tp-color-action !default;
+
+
+
+

package/lib/component/transaction-line-image-and-description/style/_theme.scss

@@ -1,7 +1,24 @@
 @include export-module('co-transaction-line-image-and-description-theme') {
   .co-transaction-line-image-and-description {
+    .transaction-line-image {
+      border: $tp-transaction-line-image-and-description-image-border;
+    }
+    .delete-icon {
+      [fill] {
+        fill: $tp-transaction-line-image-and-description-delete-color;
+      }
+    }
+    .delete-link {
+      font-weight: bold;
+      color: $tp-transaction-line-image-and-description-delete-color;
+    }
+    &.is-text {
+      background-color: $tp-transaction-line-image-and-description-article-text-background-color;
+      color: $tp-transaction-line-image-and-description-article-text-color;
+    }
     .article-text {
-      color: $tp-transaction-line-article-text-font-color;
+      color: $tp-transaction-line-image-and-description-article-text-font-color;
+      background-color: $tp-transaction-line-image-and-description-article-text-background-color;
     }
   }
 }

package/lib/component/transaction-line-statusbar/style/_layout.scss

@@ -1,4 +1,8 @@
 @include export-module('co-transaction-line-statusbar-layout') {
   .co-transaction-line-statusbar {
+    .co-statusbar-wrapper {
+      flex-direction: row;
+      align-items: center;
+    }
   }
 }

package/lib/component/transaction-lines/style/material.scss

@@ -7,5 +7,6 @@
 @import "../../../component/transaction-line/transaction-line/style/material";
 @import "../../../component/transaction-line/transaction-order-delivery-line/style/material";
 @import "../../../component/transaction-line/transaction-receive-goods-line/style/material";
+@import "../../../component/transaction-line/transaction-purchase-line/style/material";
 @import "../../shared/transaction-article-text/style/material";
 @import "../../shared/transaction-article-text-overview/style/material";

package/lib/component/transaction-quick-access/transaction-quick-access/style/_layout.scss

@@ -2,10 +2,14 @@
 
 @include export-module('co-transaction-quick-access-layout') {
   .co-transaction-quick-access {
-    .quick-access-wrapper {
+    font-family: $tp-transaction-quick-access-font-family;
+    font-size: $tp-transaction-quick-access-font-size;
+    width: 100%;
+    .quick-access-content-wrapper {
       display: flex;
       align-items: center;
       width: 100%;
+      justify-content: space-between;
     }
   }
 }

package/lib/component/transaction-quick-access/transaction-quick-access/style/_material-definition.scss

@@ -1 +1,2 @@
-$tp-transaction: $tp-font-family !default;
+$tp-transaction-quick-access-font-family: $tp-font-family !default;
+$tp-transaction-quick-access-font-size: $tp-font-size !default;

package/lib/component/transaction-quick-access/transaction-quick-access/style/material.scss

@@ -5,3 +5,4 @@
 @import "../../transaction-quick-access-received-goods/style/material";
 @import "../../transaction-quick-access-overview/style/material";
 @import "../../transaction-quick-access-order-delivery/style/material";
+@import "../../transaction-quick-access-order-purchase/style/material";

package/lib/component/transaction-quick-access/transaction-quick-access/transaction-quick-access.component.d.ts

@@ -2,18 +2,20 @@ import { ApplicationRef, ComponentFactoryResolver, ElementRef, Injector } from "
 import { TransactionTypeCategory } from "../../../enum/transaction-type-category.enum";
 import { TransactionKind } from "@colijnit/transactionapi/build/enum/transaction-kind.enum";
 import { TransactionMappingService } from "../../../service/transaction-mapping.service";
+import { TransactionInfoResponse } from "@colijnit/transactionapi/build/model/transaction-info-response.bo";
 export declare class TransactionQuickAccessComponent {
     private _mappingService;
     private _compFactoryResolver;
     private appRef;
     private injector;
     quickAccessContainer: ElementRef;
-    set transactionType(value: TransactionKind);
-    get transactionType(): TransactionKind;
+    set transaction(value: TransactionInfoResponse);
+    get transaction(): TransactionInfoResponse;
     set activeCategory(value: TransactionTypeCategory);
     get activeCategory(): TransactionTypeCategory;
     showClass(): boolean;
-    private _transactionType;
+    transactionType: TransactionKind;
+    private _transaction;
     private _activeCategory;
     private _componentRef;
     constructor(_mappingService: TransactionMappingService, _compFactoryResolver: ComponentFactoryResolver, appRef: ApplicationRef, injector: Injector);

package/lib/component/transaction-quick-access/transaction-quick-access-order-delivery/style/_layout.scss

@@ -1,55 +1,8 @@
-@include export-module('cc-transaction-quick-access-order-delivery-layout') {
+@include export-module('co-transaction-quick-access-order-delivery-layout') {
   .co-transaction-quick-access-order-delivery {
-    width: 100%;
-
-    .order-delivery-wrapper {
+    .select-all-wrapper {
       display: flex;
-      justify-content: space-between;
       align-items: center;
-
-      .select-all-wrapper {
-        display: flex;
-        align-items: center;
-
-        .select-all-text {
-          font-family: "Public sans";
-          margin-left: 10px;
-          font-size: 12px;
-          margin-top: 2px;
-        }
-      }
-
-      .send-button-wrapper {
-        display: flex;
-        align-items: center;
-      }
-
-      .button-wrapper {
-        background: #f5f5fc;
-        border-radius: 10px;
-        padding: 5px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-
-        .button-icon {
-          height: 20px;
-          width: 20px;
-          margin: 0 0 5px 0;
-        }
-
-        .button-title {
-          font-size: 10px;
-          font-family: 'Public sans';
-        }
-      }
-
-      .hover-icon {
-        margin-left: 5px;
-        cursor: pointer;
-      }
     }
   }
 }

package/lib/component/transaction-quick-access/transaction-quick-access-order-delivery/transaction-quick-access-order-delivery.component.d.ts

@@ -1,5 +1,4 @@
 import { TransactionBaseComponent } from "../../core/base/transaction-base.component";
-import { Icon } from "../../../enum/icon.enum";
 import { IconCacheService } from "../../../service/icon-cache.service";
 import { TransactionService } from "../../../service/transaction.service";
 import { TransactionEventService } from "../../../service/transaction-event.service";
@@ -7,10 +6,7 @@ export declare class TransactionQuickAccessOrderDeliveryComponent extends Transa
     iconService: IconCacheService;
     protected service: TransactionService;
     private _transactionEventService;
-    readonly icons: typeof Icon;
-    showDialog: boolean;
     showClass(): boolean;
     constructor(iconService: IconCacheService, service: TransactionService, _transactionEventService: TransactionEventService);
-    openDeliveryDocumentDialog(): void;
     handleSelectAllLines(value: boolean): void;
 }

package/lib/component/transaction-quick-access/transaction-quick-access-order-purchase/style/_layout.scss

@@ -0,0 +1,8 @@
+@include export-module('co-transaction-quick-access-order-purchase-layout') {
+  .co-transaction-quick-access-order-purchase {
+    .select-all-wrapper {
+      display: flex;
+      align-items: center;
+    }
+  }
+}

package/lib/component/transaction-quick-access/transaction-quick-access-order-purchase/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('co-transaction-quick-access-order-purchase-theme') {
+  .co-transaction-quick-access-order-purchase {
+  }
+}

package/lib/component/transaction-quick-access/transaction-quick-access-order-purchase/style/material.scss

@@ -0,0 +1,5 @@
+@import "../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";
+@import "../../../transaction-send-button-dialog/style/material";

package/lib/component/transaction-quick-access/transaction-quick-access-order-purchase/transaction-quick-access-order-purchase.component.d.ts

@@ -0,0 +1,13 @@
+import { Icon } from "../../../enum/icon.enum";
+import { TransactionService } from "../../../service/transaction.service";
+import { TransactionEventService } from "../../../service/transaction-event.service";
+import { TransactionBaseComponent } from "../../core/base/transaction-base.component";
+export declare class TransactionQuickAccessOrderPurchaseComponent extends TransactionBaseComponent {
+    protected service: TransactionService;
+    private _transactionEventService;
+    readonly icons: typeof Icon;
+    showClass(): boolean;
+    constructor(service: TransactionService, _transactionEventService: TransactionEventService);
+    handleSelectAllLines(value: boolean): void;
+    handleSendButtonClick(event: MouseEvent): void;
+}

package/lib/component/transaction-quick-access/transaction-quick-access-order-purchase/transaction-quick-access-order-purchase.module.d.ts

@@ -0,0 +1,2 @@
+export declare class TransactionQuickAccessOrderPurchaseModule {
+}

package/lib/component/transaction-search/transaction-filter-historic-state/transaction-filter-historic-state.component.d.ts

@@ -1,15 +1,17 @@
 import { EventEmitter } from "@angular/core";
 import { QuantityInHistoricState } from "@colijnit/transactionapi/build/enum/quantity-in-historic-state.enum";
+import { DictionaryService } from "../../../service/dictionary.service";
 export interface HistoricStates {
-    label: string;
-    value: QuantityInHistoricState;
+    description: string;
+    code: QuantityInHistoricState;
     checked: boolean;
 }
 export declare class TransactionFilterHistoricStateComponent {
+    private _dictionary;
     set label(value: string);
     get label(): string;
     expanded: boolean;
-    filterClicked: EventEmitter<number>;
+    collectionChange: EventEmitter<any>;
     showClass(): boolean;
     private _label;
     groupName: string;
@@ -17,6 +19,6 @@ export declare class TransactionFilterHistoricStateComponent {
     labelPartly: string;
     labelFully: string;
     states: HistoricStates[];
-    handleStateChange(value: any): void;
+    constructor(_dictionary: DictionaryService);
     private _setStates;
 }

package/lib/component/transaction-send-button-dialog/style/_layout.scss

@@ -0,0 +1,47 @@
+@include export-module('co-transaction-send-button-dialog-layout') {
+  .co-transaction-send-button-dialog {
+    font-family: $tp-transaction-send-button-dialog-font-family;
+    font-size: $tp-transaction-send-button-dialog-font-size;
+    .transaction-send-button-content-wrapper {
+      display: flex;
+      flex-direction: row;
+      position: relative;
+    }
+    .transaction-send-button-wrapper {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+      border-radius: $tp-transaction-send-button-dialog-border-radius;
+      border-style: $tp-transaction-send-button-dialog-border-style;
+      border-width: $tp-transaction-send-button-dialog-border-width;
+      padding: $tp-transaction-send-button-dialog-padding;
+      .button-icon {
+        height: $tp-transaction-send-button-dialog-icon-size;
+        width: $tp-transaction-send-button-dialog-icon-size;
+        margin: $tp-transaction-send-button-dialog-icon-margin;
+      }
+      .transaction-send-button-icon-wrapper {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-around;
+        width: 100%;
+      }
+      .send-type-icon {
+        height: $tp-transaction-send-button-dialog-send-type-icon-size;
+        width: $tp-transaction-send-button-dialog-send-type-icon-size;
+      }
+    }
+    .transaction-send-button-hover-icon-wrapper {
+      display: flex;
+      align-items: center;
+      position: absolute;
+      right: 0;
+      transform: translateX(100%);
+      cursor: pointer;
+      height: 100%;
+    }
+  }
+}

package/lib/component/transaction-send-button-dialog/style/_material-definition.scss

@@ -0,0 +1,13 @@
+$tp-transaction-send-button-dialog-font-family: $tp-font-family !default;
+$tp-transaction-send-button-dialog-font-size: $tp-font-size !default;
+$tp-transaction-send-button-dialog-background-color: $tp-default-background-accent !default;
+$tp-transaction-send-button-dialog-border-radius: 10px !default;
+$tp-transaction-send-button-dialog-border-style: solid !default;
+$tp-transaction-send-button-dialog-border-color: $tp-color-border !default;
+$tp-transaction-send-button-dialog-border-width: 1px !default;
+$tp-transaction-send-button-dialog-padding: 5px !default;
+$tp-transaction-send-button-dialog-icon-size: 20px !default;
+$tp-transaction-send-button-dialog-icon-color: $tp-color-font !default;
+$tp-transaction-send-button-dialog-send-type-icon-size: 12px !default;
+$tp-transaction-send-button-dialog-send-type-icon-color: $tp-color-font !default;
+$tp-transaction-send-button-dialog-icon-margin: 0 0 5px 0 !default;

package/lib/component/transaction-send-button-dialog/style/_theme.scss

@@ -0,0 +1,24 @@
+@include export-module('co-transaction-send-button-dialog-theme') {
+  .co-transaction-send-button-dialog {
+    .transaction-send-button-wrapper {
+      background: $tp-transaction-send-button-dialog-background-color;
+      border-color: $tp-transaction-send-button-dialog-border-color;
+      .button-icon {
+        svg { // for fontawesome icons
+          fill: $tp-transaction-send-button-dialog-icon-color;
+        }
+        & [fill] { // for own icons
+          fill: $tp-transaction-send-button-dialog-icon-color;
+        }
+      }
+      .send-type-icon {
+        svg { // for fontawesome icons
+          fill: $tp-transaction-send-button-dialog-send-type-icon-color;
+        }
+        & [fill] { // for own icons
+          fill: $tp-transaction-send-button-dialog-send-type-icon-color;
+        }
+      }
+    }
+  }
+}

package/lib/component/transaction-send-button-dialog/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/transaction-send-button-dialog/transaction-send-button-dialog.component.d.ts

@@ -0,0 +1,16 @@
+import { EventEmitter } from "@angular/core";
+import { IconCacheService } from "../../service/icon-cache.service";
+import { Icon } from "../../enum/icon.enum";
+export declare class TransactionSendButtonDialogComponent {
+    iconService: IconCacheService;
+    readonly icons: typeof Icon;
+    label: string;
+    showSendIcon: boolean;
+    showHoverIcon: boolean;
+    sendButtonClick: EventEmitter<MouseEvent>;
+    showClass(): boolean;
+    showDialog: boolean;
+    showOpenDialogIcon: boolean;
+    constructor(iconService: IconCacheService);
+    openDialog(): void;
+}

package/lib/component/transaction-send-button-dialog/transaction-send-button-dialog.module.d.ts

@@ -0,0 +1,2 @@
+export declare class TransactionSendButtonDialogModule {
+}

package/lib/enum/icon.enum.d.ts

@@ -19,6 +19,7 @@ export declare enum Icon {
     DeliveryTruck = "delivery_truck",
     EditPencil = "edit_pencil",
     EllipsisLight = "ellipsis_light",
+    EllipsisVerticalSolid = "ellipsis_vertical_solid",
     FileCircleInfoSolid = "file_circle_info_solid",
     FilePdfSolid = "file_pdf_solid",
     GearSolid = "gear_solid",

package/lib/model/transaction-bar-button.d.ts

@@ -1,7 +1,10 @@
 import { Icon } from "../enum/icon.enum";
 import { TransactionTypeCategory } from "../enum/transaction-type-category.enum";
-export declare class TransactionBarButton {
+import { TransactionButtonBarButtonBaseComponent } from "../component/transaction-button-bar/transaction-button-bar-button/transaction-button-bar-button-base.component";
+import { Type } from "@angular/core";
+export interface TransactionBarButton {
     title: string;
     icon: Icon;
     category: TransactionTypeCategory;
+    component?: Type<TransactionButtonBarButtonBaseComponent>;
 }