@colijnit/transaction 12.1.112 → 12.1.113

package/lib/component/checkout/style/_layout.scss

@@ -13,6 +13,7 @@
       flex-basis: $tp-checkout-default-width;
       flex-grow: 1;
       flex-shrink: 1;
+      max-width: $tp-checkout-max-width;
     }
     .co-checkout-right-panel {
       display: flex;
@@ -21,6 +22,7 @@
       flex-basis: $tp-checkout-right-panel-width;
       flex-grow: 1;
       flex-shrink: 1;
+      max-width: $tp-checkout-max-width;
     }
     .co-checkout-right-panel-relation {
       display: flex;

package/lib/component/checkout/style/_material-definition.scss

@@ -3,6 +3,7 @@ $tp-checkout-padding: 30px !default;
 $tp-checkout-column-gap: 10px !default;
 $tp-checkout-row-gap: 10px !default;
 $tp-checkout-default-width: 55% !default;
+$tp-checkout-max-width: 80% !default;
 $tp-checkout-right-panel-row-gap: 10px !default;
 $tp-checkout-right-panel-width: 400px !default;
 $tp-checkout-right-panel-width: 50% !default;

package/lib/component/core/relation/customer-groups.component.d.ts

@@ -1,16 +1,19 @@
-import { EventEmitter, OnInit } from "@angular/core";
-import { TransactionConnectorService } from "../../../service/transaction-connector.service";
-import { CustomerGroup } from "@colijnit/transactionapi/build/model/customer-group.bo";
+import { EventEmitter, OnInit } from '@angular/core';
+import { TransactionConnectorService } from '../../../service/transaction-connector.service';
+import { CustomerGroup } from '@colijnit/transactionapi/build/model/customer-group.bo';
 export declare class CustomerGroupsComponent implements OnInit {
     private _connector;
     readonly: boolean;
     required: boolean;
-    model: string;
+    set model(value: string);
+    get model(): string;
     modelChange: EventEmitter<string>;
     customerGroups: CustomerGroup[];
     selectedCustomerGroup: CustomerGroup;
     fields: Object;
+    private _model;
     constructor(_connector: TransactionConnectorService);
     ngOnInit(): Promise<void>;
     handleCustomerGroupChange(customerGroup: CustomerGroup): void;
+    private _setSelectedCustomerGroup;
 }

package/lib/component/transaction-card/transaction-card/style/_layout.scss

@@ -72,7 +72,12 @@
       }
     }
 
-    .transaction-line-totals-price, .transaction-line-totals-discount, .transaction-line-totals-amount, .transaction-line-totals-total {
+    .transaction-line-totals-amount {
+      .amount-number-picker {
+        height: 100%;
+      }
+    }
+    .transaction-line-totals-price, .transaction-line-totals-discount, .transaction-line-totals-total {
       display: flex;
       align-items: center;
       justify-content: center;

package/lib/component/transaction-date-select/style/_layout.scss

@@ -0,0 +1,22 @@
+@include export-module('co-transaction-date-select-layout') {
+  .co-transaction-date-select {
+    font-family: $tp-transaction-date-select-font-family;
+    font-size: $tp-transaction-date-select-font-size;
+    width: 100%;
+    .transaction-date-select-wrapper {
+      width: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      .co-icon {
+        height: $tp-transaction-date-select-icon-size;
+        width: $tp-transaction-date-select-icon-size;
+      }
+      .date-description {
+        text-overflow: ellipsis;
+        overflow: hidden;
+        white-space: nowrap;
+      }
+    }
+  }
+}

package/lib/component/transaction-date-select/style/_material-definition.scss

@@ -0,0 +1,4 @@
+$tp-transaction-date-select-font-family: $tp-font-family !default;
+$tp-transaction-date-select-font-size: $tp-font-size !default;
+$tp-transaction-date-select-icon-size: 13px !default;
+$tp-transaction-date-select-icon-color: 13px !default;

package/lib/component/transaction-date-select/style/_theme.scss

@@ -0,0 +1,12 @@
+@include export-module('co-transaction-date-select-theme') {
+  .co-transaction-date-select {
+    .co-icon {
+      svg { // for fontawesome icons
+        fill: $tp-transaction-date-select-icon-color;
+      }
+      & [fill] { // for own icons
+        fill: $tp-transaction-date-select-icon-color;
+      }
+    }
+  }
+}

package/lib/component/transaction-date-select/style/material.scss

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

package/lib/component/transaction-date-select/transaction-date-select.component.d.ts

@@ -0,0 +1,11 @@
+import { EventEmitter } from '@angular/core';
+import { IconCacheService } from '../../service/icon-cache.service';
+import { Icon } from '../../enum/icon.enum';
+export declare class TransactionDateSelectComponent {
+    iconService: IconCacheService;
+    readonly icons: typeof Icon;
+    date: Date;
+    dateChange: EventEmitter<Date>;
+    showClass(): boolean;
+    constructor(iconService: IconCacheService);
+}

package/lib/component/transaction-date-select/transaction-date-select.module.d.ts

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

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

@@ -2,7 +2,7 @@
   .co-transaction-line {
     font-family: $tp-transaction-line-font-family;
     font-size: $tp-transaction-line-font-size;
-    width: calc(100% - 30px);
+    width: 100%;
     display: flex;
     flex-direction: column;
     border: $tp-transaction-line-border;
@@ -47,6 +47,7 @@
         display: flex;
         flex-wrap: wrap;
         align-content: flex-start;
+        row-gap: $tp-transaction-line-row-gap;
         co-transaction-line-commission-button {
           margin-right: $tp-transaction-line-column-gap;
         }
@@ -54,6 +55,7 @@
       .column2 {
         display: flex;
         flex-direction: column;
+        row-gap: $tp-transaction-line-row-gap;
         margin-right: $tp-transaction-line-column-gap;
         max-width: $tp-transaction-line-button-big-width;
       }
@@ -78,15 +80,20 @@
       co-transaction-line-delivery-date-button {
         //max-width: calc((#{$tp-transaction-line-button-width} * 2) + #{$tp-transaction-line-column-gap});
         .transaction-line-button {
-          align-items: flex-end;
+          align-items: center;
         }
       }
       .co-statusbar-wrapper {
         height: $tp-transaction-line-button-height;
-        align-items: flex-end;
+        align-items: center;
+      }
+    }
+    .transaction-line-totals-amount {
+      .amount-number-picker {
+        height: 100%;
       }
     }
-    .transaction-line-totals-price, .transaction-line-totals-discount, .transaction-line-totals-amount, .transaction-line-totals-total {
+    .transaction-line-totals-price, .transaction-line-totals-discount, .transaction-line-totals-total {
       display: flex;
       align-items: center;
       justify-content: $tp-transaction-line-totals-justify-content;
@@ -225,5 +232,11 @@
         column-gap: $tp-transaction-line-column-gap;
       }
     }
+    &.preview {
+      .transaction-line-totals {
+        grid-template-rows: $tp-transaction-line-button-height;
+        grid-gap: $tp-transaction-line-row-gap;
+      }
+    }
   }
 }

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

@@ -1,10 +1,22 @@
-import { Icon } from "../../enum/icon.enum";
-import { TransactionLineInfo } from "@colijnit/transactionapi/build/model/transaction-line-info.bo";
+import { ChangeDetectorRef, ElementRef } from '@angular/core';
 import { IconCacheService } from "../../service/icon-cache.service";
-export declare class TransactionLineDeliveryDateButtonComponent {
+import { TransactionBaseComponent } from '../core/base/transaction-base.component';
+import { OverlayService } from '@colijnit/corecomponents_v12';
+import { TransactionEventService } from '../../service/transaction-event.service';
+import { TransactionService } from '../../service/transaction.service';
+import { DictionaryService } from '../../service/dictionary.service';
+import { TransactionImageService } from '../../service/transaction-image.service';
+export declare class TransactionLineDeliveryDateButtonComponent extends TransactionBaseComponent {
+    transactionEventService: TransactionEventService;
+    service: TransactionService;
     iconCacheService: IconCacheService;
-    readonly icons: typeof Icon;
-    transactionLine: TransactionLineInfo;
+    protected dictionaryService: DictionaryService;
+    protected imageService: TransactionImageService;
+    protected changeDetector: ChangeDetectorRef;
+    private _overlayService;
+    private _elementRef;
     showClass(): boolean;
-    constructor(iconCacheService: IconCacheService);
+    private _calendarPopupComponentRef;
+    constructor(transactionEventService: TransactionEventService, service: TransactionService, iconCacheService: IconCacheService, dictionaryService: DictionaryService, imageService: TransactionImageService, changeDetector: ChangeDetectorRef, _overlayService: OverlayService, _elementRef: ElementRef);
+    handleShowDialog(event: MouseEvent): void;
 }

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

@@ -65,6 +65,7 @@ export declare enum Icon {
     Purchase = "purchase",
     Resize = "resize",
     ShareSolid = "share_solid",
+    SharpLightTruckMovingClock = "sharp_light_truck_moving_clock",
     ShelvesLight = "shelves_light",
     ShelvesRegular = "shelves_regular",
     ShelvesSolid = "shelves_solid",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colijnit/transaction",
-  "version": "12.1.112",
+  "version": "12.1.113",
   "description": "Colijn IT transaction module for Angular 12",
   "repository": "npm/npm",
   "author": "Colijn IT",