@colijnit/transaction 12.1.18 → 12.1.21

package/lib/component/transaction-search/transaction-search-result/transaction-search-result.component.d.ts

@@ -1,19 +1,30 @@
 import { EventEmitter, OnInit } from "@angular/core";
+import { TransactionKind } from "@colijnit/transactionapi/build/enum/transaction-kind.enum";
 import { TransactionSearchView } from "@colijnit/transactionapi/build/model/transaction-search-view.bo";
 import { ContentViewMode } from "../../../enum/content-view-mode.enum";
 import { Icon } from "../../../enum/icon.enum";
-import { IconCacheService } from "../../../service/icon-cache.service";
+import { SearchViewMode } from "../../../enum/search-view-mode.enum";
 import { TransactionSearchService } from "../service/transaction-search.service";
 export declare class TransactionSearchResultComponent implements OnInit {
     searchService: TransactionSearchService;
-    iconCacheService: IconCacheService;
     readonly icon: typeof Icon;
-    readonly viewModes: typeof ContentViewMode;
-    filterButtonClick: EventEmitter<void>;
+    readonly contentViewModes: typeof ContentViewMode;
+    readonly searchViewModes: typeof SearchViewMode;
+    selectedTransaction: TransactionSearchView;
+    transactionType: TransactionKind;
+    activeSearchViewMode: SearchViewMode;
+    filterClick: EventEmitter<void>;
     transactionClick: EventEmitter<TransactionSearchView>;
+    resizeClick: EventEmitter<void>;
+    closeClick: EventEmitter<void>;
     showClass(): boolean;
-    activeViewMode: ContentViewMode;
-    constructor(searchService: TransactionSearchService, iconCacheService: IconCacheService);
+    activeContentViewMode: ContentViewMode;
+    constructor(searchService: TransactionSearchService);
     ngOnInit(): void;
+    get fullscreen(): boolean;
     onTransactionClick(transaction: TransactionSearchView): void;
+    onResizeClick(): void;
+    onCloseClick(): void;
+    onFilterClick(): void;
+    onPaginationPageChange(pageNr: number): void;
 }

package/lib/component/transaction-search/transaction-search-tile/transaction-search-purchase-order-tile/style/_layout.scss

@@ -0,0 +1,4 @@
+@include export-module('cc-transaction-search-purchase-order-tile-layout') {
+  .co-transaction-search-purchase-order-tile {
+  }
+}

package/lib/component/transaction-search/transaction-search-tile/transaction-search-purchase-order-tile/style/_theme.scss

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

package/lib/component/transaction-search/transaction-search-tile/transaction-search-purchase-order-tile/style/material.scss

@@ -0,0 +1,3 @@
+@import "./material-definition";
+@import "./layout";
+@import "./theme";

package/lib/component/transaction-search/transaction-search-tile/transaction-search-purchase-order-tile/transaction-search-purchase-order-tile.component.d.ts

@@ -0,0 +1,3 @@
+import { TransactionSearchTileBaseComponent } from "../../../core/base/transaction-search-tile-base.component";
+export declare class TransactionSearchPurchaseOrderTileComponent extends TransactionSearchTileBaseComponent {
+}

package/lib/component/transaction-search/transaction-search-tile/transaction-search-purchase-order-tile/transaction-search-purchase-order-tile.module.d.ts

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

package/lib/component/transaction-search/transaction-search-tile/transaction-search-sales-order-tile/style/_layout.scss

@@ -0,0 +1,5 @@
+@include export-module('co-transaction-search-sales-order-tile-layout') {
+  .co-transaction-search-sales-order-tile {
+  }
+}
+

package/lib/component/transaction-search/transaction-search-tile/transaction-search-sales-order-tile/style/_theme.scss

@@ -0,0 +1,4 @@
+@include export-module('co-transaction-search-sales-order-tile-theme') {
+  .co-transaction-search-sales-order-tile {
+  }
+}

package/lib/component/transaction-search/transaction-search-tile/transaction-search-sales-order-tile/transaction-search-sales-order-tile.component.d.ts

@@ -0,0 +1,6 @@
+import { IconCacheService } from "../../../../service/icon-cache.service";
+import { TransactionSearchTileBaseComponent } from "../../../core/base/transaction-search-tile-base.component";
+export declare class TransactionSearchSalesOrderTileComponent extends TransactionSearchTileBaseComponent {
+    iconCacheService: IconCacheService;
+    constructor(iconCacheService: IconCacheService);
+}

package/lib/component/transaction-search/transaction-search-tile/transaction-search-sales-order-tile/transaction-search-sales-order-tile.module.d.ts

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

package/lib/component/transaction-search/transaction-search-tile/transaction-search-tile/style/_layout.scss

@@ -0,0 +1,108 @@
+@include export-module('cc-transaction-search-tile-layout') {
+  .co-transaction-search-tile {
+    .co-transaction-search-tile-content {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      height: $tp-transaction-tile-height;
+
+      @media(max-width: 600px) {
+        width: 85vw;
+      }
+
+      @media(min-width: 601px) {
+        width: $tp-transaction-tile-width;
+      }
+      border-radius: $tp-tile-border-radius;
+      padding: $tp-transaction-tile-padding;
+      row-gap: $tp-transaction-tile-row-gap;
+
+      font-family: $tp-transaction-tile-font-family;
+      font-size: $tp-transaction-tile-font-size;
+
+      .transaction-tile-wrapper {
+        cursor: pointer;
+        width: $tp-transaction-tiles-wrapper-width;
+        height: $tp-transaction-tiles-wrapper-height;
+      }
+
+      .header {
+        font-weight: $tp-transaction-tile-header-font-weight;
+        font-size: $tp-transaction-tile-header-font-size;
+      }
+
+      .transaction-tile-body {
+        display: flex;
+        justify-content: space-between;
+        column-gap: $tp-transaction-tile-column-gap;
+        height: 80px;
+
+        co-avatar {
+          width: $tp-transaction-tile-avatar-width;
+          height: $tp-transaction-tile-avatar-height;
+        }
+
+        .transaction-tile-seller-info {
+          display: flex;
+          flex-direction: column;
+          row-gap: $tp-transaction-tile-row-gap;
+          max-width: 50%;
+        }
+
+        .transaction-tile-order-summary {
+          display: flex;
+          flex-direction: column;
+          align-items: flex-end;
+
+          co-button {
+            font-weight: $tp-transaction-tile-button-font-weight;
+            margin-top: $tp-transaction-tile-button-margin-top;
+            border-radius: $tp-transaction-tile-button-border-radius;
+            height: $tp-transaction-tile-button-height;
+          }
+        }
+      }
+
+      .transaction-tile-footer {
+        display: flex;
+        justify-content: space-between;
+        padding: 10px 0;
+
+        .order-info-section {
+          width: fit-content;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+
+          &:nth-child(2) {
+            padding: 0 15px;
+          }
+
+          .label {
+            font-size: $tp-transaction-tile-font-size-small;
+          }
+
+          .value {
+            display: flex;
+            flex-direction: row;
+            align-items: flex-end;
+            min-width: fit-content;
+            font-size: $tp-transaction-tile-font-size-small;
+            height: $tp-transaction-tile-value-height;
+
+            co-icon {
+              height: $tp-transaction-tile-icon-height;
+              width: $tp-transaction-tile-icon-width;
+
+              svg {
+                position: relative;
+                top: 0.22em;
+              }
+            }
+          }
+        }
+      }
+    }
+
+  }
+}

package/lib/component/transaction-search/transaction-search-tile/transaction-search-tile/style/_theme.scss

@@ -0,0 +1,53 @@
+@include export-module('cc-transaction-search-tile-theme') {
+  .co-transaction-search-tile {
+    .co-transaction-search-tile-content {
+      background-color: $tp-transaction-tile-background-color;
+      border: 1px solid $tp-transaction-tile-border-color;
+
+      .header {
+        color: $tp-transaction-tile-header-font-color;
+      }
+
+      .text {
+        color: $tp-transaction-tile-font-color;
+      }
+
+      .transaction-tile-footer {
+        .order-info-section {
+          &:nth-child(2) {
+            border-left: 0.5px solid  $tp-transaction-tile-border-color;
+            border-right: 0.5px solid  $tp-transaction-tile-border-color;
+          }
+
+          .label {
+            color: $tp-transaction-tile-font-color;
+          }
+
+          .value {
+            color: $tp-transaction-tile-font-color-dark;
+
+            .lock-icon [fill] {
+              fill: $tp-transaction-tile-icon-active-color;
+            }
+
+            .unlock-icon [fill] {
+              fill: $tp-transaction-tile-icon-inactive-color;
+            }
+          }
+        }
+      }
+    }
+
+    &:hover {
+      .co-transaction-search-tile-content {
+        background-color: $tp-transaction-tile-hover-background-color;
+      }
+    }
+
+    &.selected {
+      .co-transaction-search-tile-content {
+        background-color:$tp-transaction-tile-selected-background-color;
+      }
+    }
+  }
+}

package/lib/component/transaction-search/transaction-search-tile/transaction-search-tile/style/material.scss

@@ -0,0 +1,3 @@
+@import "./material-definition";
+@import "./layout";
+@import "./theme";

package/lib/component/transaction-search/transaction-search-tile/transaction-search-tile/transaction-search-tile.component.d.ts

@@ -0,0 +1,25 @@
+import { ApplicationRef, ComponentFactoryResolver, EventEmitter, Injector } from "@angular/core";
+import { TransactionKind } from "@colijnit/transactionapi/build/enum/transaction-kind.enum";
+import { TransactionSearchView } from "@colijnit/transactionapi/build/model/transaction-search-view.bo";
+import { TransactionMappingService } from "../../../../service/transaction-mapping.service";
+import { TransactionSearchService } from "../../service/transaction-search.service";
+export declare class TransactionSearchTileComponent {
+    private _mappingService;
+    private _compFactoryResolver;
+    private appRef;
+    private injector;
+    searchService: TransactionSearchService;
+    set container(content: any);
+    set transactionType(value: TransactionKind);
+    get transactionType(): TransactionKind;
+    set transaction(value: TransactionSearchView);
+    get transaction(): TransactionSearchView;
+    transactionClick: EventEmitter<TransactionSearchView>;
+    showClass(): boolean;
+    private _transactionSearchTileContainer;
+    private _transaction;
+    private _transactionType;
+    private _componentRef;
+    constructor(_mappingService: TransactionMappingService, _compFactoryResolver: ComponentFactoryResolver, appRef: ApplicationRef, injector: Injector, searchService: TransactionSearchService);
+    private _prepareContent;
+}

package/lib/component/transaction-search/transaction-search-tile/transaction-search-tile/transaction-search-tile.module.d.ts

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

package/lib/component/transaction-search/transaction-search.component.d.ts

@@ -1,12 +1,25 @@
 import { EventEmitter } from "@angular/core";
+import { TransactionKind } from "@colijnit/transactionapi/build/enum/transaction-kind.enum";
 import { TransactionSearchView } from "@colijnit/transactionapi/build/model/transaction-search-view.bo";
+import { SearchViewMode } from "../../enum/search-view-mode.enum";
+import { TransactionSearchService } from "./service/transaction-search.service";
 export declare class TransactionSearchComponent {
+    private _transactionSearchService;
+    readonly searchViewModes: typeof SearchViewMode;
+    activeSearchViewMode: SearchViewMode;
+    closeClick: EventEmitter<void>;
+    set transactionType(value: TransactionKind);
+    get transactionType(): TransactionKind;
     transactionClick: EventEmitter<TransactionSearchView>;
+    searchViewModeChange: EventEmitter<SearchViewMode>;
     showClass(): boolean;
     showFilterSidebar: boolean;
-    constructor();
-    handleShowFilter(): void;
+    private _transactionType;
+    constructor(_transactionSearchService: TransactionSearchService);
+    get fullscreen(): boolean;
+    toggleFilter(): void;
     handleHideFilter(): void;
     handleResetFilter(): void;
     onTransactionClick(transaction: TransactionSearchView): void;
+    onResizeClick(): void;
 }

package/lib/enum/direction.enum.d.ts

@@ -0,0 +1,6 @@
+export declare enum Direction {
+    Right = "right",
+    Left = "left",
+    Up = "top",
+    Down = "bottom"
+}

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

@@ -13,12 +13,15 @@ export declare enum Icon {
     CartFlatbedBoxesSolid = "cart_flatbed_boxes_solid",
     CartShoppingSolid = "cart_shopping_solid",
     CashRegister = "cash_register",
+    CreditCardSolid = "credit_card_solid",
     DeliveryTruck = "delivery_truck",
     EditPencil = "edit_pencil",
     IdealLogo = "ideal_logo",
     ListView = "list_view",
     LocationDotSolid = "location_dot_solid",
     Lock = "lock",
+    LockKeyholeOpenSolid = "lock_keyhole_open_solid",
+    LockKeyholeSolid = "lock_keyhole_solid",
     MapMarker = "map_marker",
     MasterDetail = "master_detail",
     MemoCircleCheckSolid = "memo_circle_check_solid",
@@ -26,13 +29,16 @@ export declare enum Icon {
     PalletBoxesSolid = "pallet_boxes_solid",
     PlusRound = "plus_round",
     Purchase = "purchase",
+    Resize = "resize",
     ShelvesSolid = "shelves_solid",
     SidePanel = "side_panel",
+    SlideIn = "slide_in",
     SyncAlt = "sync_alt",
     Tag = "tag",
     ThickLines = "thick_lines",
     ThinLines = "thin_lines",
     TrashBin = "trash_bin",
+    TrashCanLight = "trash_can_light",
     TriangleDown = "triangle_down",
     TriangleUp = "triangle_up",
     Truck = "truck",

package/lib/enum/search-view-mode.enum.d.ts

@@ -0,0 +1,4 @@
+export declare enum SearchViewMode {
+    FullScreen = 0,
+    SideBar = 1
+}

package/lib/model/transaction-search-result.d.ts

@@ -0,0 +1,5 @@
+import { TransactionSearchView } from "@colijnit/transactionapi/build/model/transaction-search-view.bo";
+export declare class TransactionSearchResult {
+    transactions: TransactionSearchView[];
+    count: number;
+}

package/lib/service/payment.service.d.ts

@@ -1,9 +1,11 @@
 import { PaymentMethod } from "@colijnit/transactionapi/build/model/payment-method.bo";
 import { TransactionConnectorService } from "./transaction-connector.service";
+import { CreatePaymentLinkResult } from "@colijnit/transactionapi/build/model/create-payment-link-result.bo";
 export declare class PaymentService {
     private _connector;
     constructor(_connector: TransactionConnectorService);
     createOutstandingEntry(uuid: string, amount: number): Promise<boolean>;
-    registerSalesOrderPayment(uuid: string, amount: number, currencyCode: number, paymentMethod: string, cashRegisterGroupId: number): Promise<boolean>;
+    registerSalesOrderPayment(uuid: string, amount: number, currencyId: number, paymentMethod: string, cashRegisterGroupId: number): Promise<boolean>;
+    createIonePaymentLinkAndQRCode(uuid: string, amount: number, paymentMethodCode: string): Promise<CreatePaymentLinkResult>;
     getPaymentMethods(): Promise<PaymentMethod[]>;
 }

package/lib/service/transaction-connector.service.d.ts

@@ -29,7 +29,6 @@ import { PriceList } from "@colijnit/transactionapi/build/model/price-list";
 import { Vat } from "@colijnit/transactionapi/build/model/vat";
 import { DiscountType } from "@colijnit/transactionapi/build/enum/discount-type.enum";
 import { TransactionSearchViewRequest } from "@colijnit/transactionapi/build/model/transaction-search-view-request";
-import { TransactionSearchView } from "@colijnit/transactionapi/build/model/transaction-search-view.bo";
 import { BranchLov } from "@colijnit/transactionapi/build/model/branch-lov.bo";
 import { SalesPerson } from "@colijnit/transactionapi/build/model/sales-person.bo";
 import { Tag } from "@colijnit/transactionapi/build/model/tag";
@@ -41,6 +40,10 @@ import { ReceiveGoodsForPurchaseOrderRequest } from "@colijnit/transactionapi/bu
 import { GoodsReceiptStatusWithHistory } from "@colijnit/transactionapi/build/model/goods-receipt-status-with-history.bo";
 import { ReceiveGoodsForPurchaseOrderCorrectionRequest } from "@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-correction-request.bo";
 import { PaymentMethod } from "@colijnit/transactionapi/build/model/payment-method.bo";
+import { GetPurchasePortalLine } from "@colijnit/transactionapi/build/model/get-purchase-portal-line";
+import { PurchasePortalLine } from "@colijnit/transactionapi/build/model/purchase-portal-line.bo";
+import { CreatePaymentLinkResult } from "@colijnit/transactionapi/build/model/create-payment-link-result.bo";
+import { TransactionSearchResult } from "../model/transaction-search-result";
 export declare class TransactionConnectorService {
     private _optionsService;
     private _collectionService;
@@ -69,7 +72,7 @@ export declare class TransactionConnectorService {
     getRelationNumber(relationId: number): Promise<string>;
     getPriceLists(code?: string): Promise<PriceList[]>;
     getVatList(onlyValid?: boolean): Promise<Vat[]>;
-    searchTransactions(request: TransactionSearchViewRequest): Promise<TransactionSearchView[]>;
+    searchTransactions(request: TransactionSearchViewRequest): Promise<TransactionSearchResult>;
     getSequenceValue(sequenceName: SequenceName): Promise<number>;
     insertCustomer(relation: CustomerFullObject): Promise<CustomerFullObject>;
     updateCustomer(relation: CustomerFullObject): Promise<CustomerFullObject>;
@@ -114,9 +117,12 @@ export declare class TransactionConnectorService {
     changeHeaderTransactionDefinitive(uuid: string, definitive: boolean): Promise<TransactionInfoResponse>;
     changeTransactionLineCollectionCode(uuid: string, lineUuid: string, code: string): Promise<TransactionInfoResponse>;
     createOutstandingEntry(uuid: string, amount: number): Promise<TransactionInfoResponse>;
-    registerSalesOrderPayment(uuid: string, amount: number, currencyCode: number, paymentMethod: string, cashRegisterGroupId: number): Promise<TransactionInfoResponse>;
+    registerSalesOrderPayment(uuid: string, amount: number, currencyId: number, paymentMethod: string, cashRegisterGroupId: number): Promise<TransactionInfoResponse>;
+    createIonePaymentLinkAndQRCode(uuid: string, amount: number, paymentMethodCode: string): Promise<CreatePaymentLinkResult>;
     getGoodsReceiptStatus(transId: number, lineNr: number): Promise<GoodsReceiptStatusWithHistory>;
     getGoodsReceiptStatusWithHistory(transId: number, lineNr: number): Promise<GoodsReceiptStatusWithHistory>;
     receiveGoodsForPurchaseOrder(request: ReceiveGoodsForPurchaseOrderRequest): Promise<TransactionInfoResponse>;
     receiveGoodsForPurchaseOrderCorrection(request: ReceiveGoodsForPurchaseOrderCorrectionRequest): Promise<TransactionInfoResponse>;
+    getPurchasePortalLines(request: GetPurchasePortalLine): Promise<PurchasePortalLine>;
+    updatePurchasePortalLines(purchasePortalLine: PurchasePortalLine): Promise<boolean>;
 }

package/lib/service/transaction-mapping.service.d.ts

@@ -1,5 +1,8 @@
 import { Type } from "@angular/core";
 import { TransactionKind } from "@colijnit/transactionapi/build/enum/transaction-kind.enum";
+import { TransactionFilterBaseComponent } from "../component/core/base/transaction-filter-base.component";
+import { TransactionSearchGridBaseComponent } from "../component/core/base/transaction-search-grid-base.component";
+import { TransactionSearchTileBaseComponent } from "../component/core/base/transaction-search-tile-base.component";
 import { TransactionBarButton } from "../model/transaction-bar-button";
 import { TransactionTypeCategory } from "../enum/transaction-type-category.enum";
 import { TransactionBaseComponent } from "../component/core/base/transaction-base.component";
@@ -8,7 +11,13 @@ export declare class TransactionMappingService {
     private readonly _buttonBarTransaction;
     private readonly _quickAccessComponent;
     private readonly _transactionGridComponent;
+    private readonly _transactionFilterComponent;
+    private readonly _transactionSearchGridComponent;
+    private readonly _transactionSearchTileComponent;
     getButtonBar(type: TransactionKind): TransactionBarButton[];
     getQuickAccessComponent(type: TransactionKind, category: TransactionTypeCategory): Type<TransactionBaseComponent>;
     getTransactionGridComponent(type: TransactionKind, category: TransactionTypeCategory): Type<TransactionGridBaseComponent>;
+    getTransactionFilterComponent(type: TransactionKind): Type<TransactionFilterBaseComponent>;
+    getTransactionSearchGridComponent(type: TransactionKind): Type<TransactionSearchGridBaseComponent>;
+    getTransactionSearchTileComponent(type: TransactionKind): Type<TransactionSearchTileBaseComponent>;
 }

package/lib/service/transaction.service.d.ts

@@ -27,7 +27,6 @@ import { TransactionArticleWarehouse } from "@colijnit/transactionapi/build/mode
 import { TransactionInfoResponse } from "@colijnit/transactionapi/build/model/transaction-info-response.bo";
 import { TransactionLineInfo } from "@colijnit/transactionapi/build/model/transaction-line-info.bo";
 import { TransactionSearchViewRequest } from "@colijnit/transactionapi/build/model/transaction-search-view-request";
-import { TransactionSearchView } from "@colijnit/transactionapi/build/model/transaction-search-view.bo";
 import { Vat } from "@colijnit/transactionapi/build/model/vat";
 import { Warehouse } from "@colijnit/transactionapi/build/model/warehouse.bo";
 import { StandardText } from "../model/standard-text";
@@ -39,6 +38,9 @@ import { ArticleExtendedRequest } from "@colijnit/articleapi/build/model/article
 import { ArticleLight } from "@colijnit/articleapi/build/model/article-light.bo";
 import { TurnoverGroupImage } from "@colijnit/articleapi/build/model/turnover-group-image.bo";
 import { MainArticle } from "@colijnit/articleapi/build/model/main-article.bo";
+import { GetPurchasePortalLine } from "@colijnit/transactionapi/build/model/get-purchase-portal-line";
+import { PurchasePortalLine } from "@colijnit/transactionapi/build/model/purchase-portal-line.bo";
+import { TransactionSearchResult } from "../model/transaction-search-result";
 export declare class TransactionService extends PendingReasonService {
     pendingLineOperationStatus(lineOperationStatuses: LineOperationStatus[]): LineOperationStatus | undefined;
     updatePriceTransactionLine(uuid: string, lineUuid: string, price: number): Promise<boolean>;
@@ -52,7 +54,7 @@ export declare class TransactionService extends PendingReasonService {
     updateWarehouseTransactionLine(uuid: string, lineUuid: string, warehouseNumber: number): Promise<boolean>;
     updateDeliveryMethodTransactionLine(uuid: string, lineUuid: string, method: string): Promise<boolean>;
     updateDiscountTransactionLine(uuid: string, lineUuid: string, type: DiscountType, discount: number, reason?: string, code?: string): Promise<boolean>;
-    searchTransactions(request: TransactionSearchViewRequest): Promise<TransactionSearchView[]>;
+    searchTransactions(request: TransactionSearchViewRequest): Promise<TransactionSearchResult>;
     saveRelation(): Promise<boolean>;
     getSequenceValue(): Promise<number>;
     getRelationPrivacySettings(): Promise<RelationPrivacySetting[]>;
@@ -107,5 +109,7 @@ export declare class TransactionService extends PendingReasonService {
     getHistoricStateValues(): Promise<CodeDescription[]>;
     getCustomerGroups(): Promise<CustomerGroup[]>;
     getFirstAddress(relation: RelationAnyType): Address;
+    getPurchasePortalLines(request: GetPurchasePortalLine): Promise<PurchasePortalLine>;
+    updatePurchasePortalLines(purchasePortalLine: PurchasePortalLine): Promise<boolean>;
     private _checkAndCreateTransaction;
 }

package/lib/style/_mixin.scss

@@ -7,3 +7,9 @@ $imported-modules: () !default;
     @content;
   }
 }
+
+@mixin screen-mobile {
+  @media only screen and (max-width: 700px) {
+    @content;
+  }
+}

package/lib/style/_variables.scss

@@ -66,38 +66,6 @@ $tp-transaction-header-font-family: $tp-font-family !default;
 $tp-transaction-header-font-size: 14px !default;
 $tp-transaction-header-font-color: $tp-color-dark !default;
 
-$tp-transaction-tiles-wrapper-padding: 20px !default;
-$tp-transaction-tiles-wrapper-row-gap: 5px !default;
-$tp-transaction-tiles-wrapper-width: 100% !default;
-$tp-transaction-tiles-wrapper-height: 100% !default;
-$tp-transaction-tiles-wrapper-column-gap: 5px !default;
-$tp-transaction-tile-background-color: white !default;
-$tp-transaction-tile-font-family: $tp-font-family !default;
-$tp-transaction-tile-font-size: $tp-font-size !default;
-$tp-transaction-tile-height: 180px !default;
-$tp-transaction-tile-width: 300px !default;
-$tp-transaction-tile-padding: 10px !default;
-$tp-transaction-tile-row-gap: 10px !default;
-$tp-transaction-tile-column-gap: 10px !default;
-$tp-transaction-tile-font-size-small: $tp-font-size-small !default;
-$tp-transaction-tile-font-color: #8083A3 !default;
-$tp-transaction-tile-font-color-dark: $tp-color-font !default;
-$tp-transaction-tile-header-font-size: $tp-font-size-big !default;
-$tp-transaction-tile-header-font-weight: bold !default;
-$tp-transaction-tile-header-font-color: $tp-color-font !default;
-$tp-transaction-tile-value-height: 20px !default;
-$tp-transaction-tile-button-color: $tp-color-active-light !default;
-$tp-transaction-tile-button-border-radius: 8px !default;
-$tp-transaction-tile-button-height: 25px !default;
-$tp-transaction-tile-button-margin-top: 10px !default;
-$tp-transaction-tile-button-font-weight: bold !default;
-$tp-transaction-tile-avatar-height: 30px !default;
-$tp-transaction-tile-avatar-width: 30px !default;
-$tp-transaction-tile-icon-width: 1.2rem !default;
-$tp-transaction-tile-icon-height: 1.2rem !default;
-$tp-transaction-tile-icon-active-color: $tp-color-active !default;
-$tp-transaction-tile-icon-inactive-color: $tp-color-font !default;
-
 /* core components override */
 $cc-checkbox-border-radius: 7px;
 $cc-checkbox-check-background-color: white;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colijnit/transaction",
-  "version": "12.1.18",
+  "version": "12.1.21",
   "description": "Colijn IT transaction module for Angular 12",
   "private": false,
   "peerDependencies": {

package/public_api.d.ts

@@ -30,4 +30,8 @@ export * from "./lib/component/transaction-quick-access/transaction-quick-access
 export * from "./lib/component/transaction-quick-access/transaction-quick-access-order-confirmation/transaction-quick-access-order-confirmation.module";
 export * from "./lib/component/transaction-quick-access/transaction-quick-access-received-goods/transaction-quick-access-received-goods.component";
 export * from "./lib/component/transaction-quick-access/transaction-quick-access-received-goods/transaction-quick-access-received-goods.module";
+export * from "./lib/component/transaction-confirmation-details/transaction-confirmation-details.component";
+export * from "./lib/component/transaction-confirmation-details/transaction-confirmation-details.module";
+export * from "./lib/component/transaction-confirmation-history/transaction-confirmation-history.component";
+export * from "./lib/component/transaction-confirmation-history/transaction-confirmation-history.module";
 export * from "./lib/service/transaction.service";