npm - @colijnit/corecomponents_v12 - Versions diffs - 259.1.20 → 259.1.21 - Mend

@colijnit/corecomponents_v12 259.1.20 → 259.1.21

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 (13) hide show

package/esm2015/lib/components/list-of-icons/list-of-icons.component.js CHANGED Viewed

@@ -1,10 +1,8 @@
 import { Component, EventEmitter, HostBinding, Input, Output, ViewEncapsulation } from "@angular/core";
 import { CoreComponentsIcon } from "../../core/enum/core-components-icon.enum";
 import { IconCacheService } from "../icon/icon-cache.service";
-import { BatchDeliveryCategory } from '../../core/enum/batch-delivery-category.enum';
 export class ListOfIconsComponent {
-    constructor(iconCacheService, icons) {
-        this.iconCacheService = iconCacheService;
+    constructor(icons) {
         this.icons = icons;
         this.iconSize = 25;
         this.itemSelected = new EventEmitter();
@@ -12,10 +10,6 @@ export class ListOfIconsComponent {
         this.showMenu = false;
         this.showSubCategories = false;
         this._collection = [];
-        this.subCategories = [
-            { icon: this.iconCacheService.getIcon(this.Icon.BoxesPackingRegular), label: BatchDeliveryCategory.ToPick },
-            { icon: this.iconCacheService.getIcon(this.Icon.RegularBoxesPackingCircleCheck), label: BatchDeliveryCategory.Picked }
-        ];
     }
     set collection(value) {
         this._collection = value || [];
@@ -36,7 +30,7 @@ export class ListOfIconsComponent {
         this.showMenu = !this.showMenu;
     }
     selectItem(item) {
-        if (item.label.toUpperCase() === BatchDeliveryCategory.Logistics) {
+        if (item.children) {
             this.showSubCategories = !this.showSubCategories;
             return;
         }
@@ -45,8 +39,9 @@ export class ListOfIconsComponent {
         this.itemSelected.emit(this.activeItem);
     }
     handlePickingCategoryClicked(subCategory) {
-        this.itemSelected.emit(subCategory);
+        this.activeItem = subCategory;
         this.showMenu = false;
+        this.itemSelected.emit(subCategory);
         this.showSubCategories = false;
     }
     onClickOutside() {
@@ -58,35 +53,37 @@ ListOfIconsComponent.decorators = [
     { type: Component, args: [{
                 selector: 'co-list-of-icons',
                 template: `
-    <div class="icon-item active" [class.menu-opened]="showMenu" (click)="toggleMenu()">
-      <co-icon [iconData]="activeItem.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
-      <co-icon *ngIf="!showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretDownSolid)"></co-icon>
-      <co-icon *ngIf="showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretUpSolid)"></co-icon>
-    </div>
-    <div class="dropdown-menu" *ngIf="showMenu" (clickOutside)="onClickOutside()">
-      <div class="icon-item" *ngFor="let item of collection" (click)="selectItem(item)"
-           [class.active]="item === activeItem">
-        <co-icon [iconData]="item.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
-          <div class="label" [textContent]="item.label | coreLocalize"></div>
+      <div class="icon-item active" [class.menu-opened]="showMenu" (click)="toggleMenu()">
+          <co-icon [iconData]="activeItem.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
+          <co-icon *ngIf="!showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretDownSolid)"></co-icon>
+          <co-icon *ngIf="showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretUpSolid)"></co-icon>
       </div>
-      <div class="picking-type-wrapper" *ngIf="showSubCategories">
-        <div class="button-wrapper" *ngFor="let subCategory of subCategories" (click)="handlePickingCategoryClicked(subCategory)">
-          <co-icon
-                  class="co-transaction-button-bar-icon"
-                  [iconData]="subCategory.icon"
-                  [style.width.px]="iconSize"
-                  [style.height.px]="iconSize">
-          </co-icon>
-          <span class="button-title" [textContent]="subCategory.label | coreLocalize"></span>
-        </div>
+      <div class="dropdown-menu" *ngIf="showMenu" (clickOutside)="onClickOutside()">
+          <div class="icon-item" *ngFor="let item of collection" (click)="selectItem(item)"
+               [class.active]="item === activeItem">
+              <co-icon [iconData]="item.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
+              <div class="label" [textContent]="item.label | coreLocalize"></div>
+              <div class="picking-type-wrapper" *ngIf="showSubCategories && item.children?.length > 0">
+                  <div
+                          class="button-wrapper"
+                          *ngFor="let subCategory of item.children"
+                          (click)="handlePickingCategoryClicked(subCategory)">
+                      <co-icon
+                              class="co-transaction-button-bar-icon"
+                              [iconData]="subCategory.icon"
+                              [style.width.px]="iconSize"
+                              [style.height.px]="iconSize">
+                      </co-icon>
+                      <span class="button-title" [textContent]="subCategory.label | coreLocalize"></span>
+                  </div>
+              </div>
+          </div>
       </div>
-    </div>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
 ListOfIconsComponent.ctorParameters = () => [
-    { type: IconCacheService },
     { type: IconCacheService }
 ];
 ListOfIconsComponent.propDecorators = {
@@ -96,4 +93,4 @@ ListOfIconsComponent.propDecorators = {
     itemSelected: [{ type: Output }],
     showClass: [{ type: HostBinding, args: ['class.co-list-of-icons',] }]
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdC1vZi1pY29ucy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvbGlzdC1vZi1pY29ucy9saXN0LW9mLWljb25zLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFFLFlBQVksRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBRSxpQkFBaUIsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUM3RyxPQUFPLEVBQUMsa0JBQWtCLEVBQUMsTUFBTSwyQ0FBMkMsQ0FBQztBQUM3RSxPQUFPLEVBQUMsZ0JBQWdCLEVBQUMsTUFBTSw0QkFBNEIsQ0FBQztBQUU1RCxPQUFPLEVBQUMscUJBQXFCLEVBQUMsTUFBTSw4Q0FBOEMsQ0FBQztBQStCbkYsTUFBTSxPQUFPLG9CQUFvQjtJQW1DL0IsWUFDUyxnQkFBa0MsRUFDbEMsS0FBdUI7UUFEdkIscUJBQWdCLEdBQWhCLGdCQUFnQixDQUFrQjtRQUNsQyxVQUFLLEdBQUwsS0FBSyxDQUFrQjtRQXpCekIsYUFBUSxHQUFXLEVBQUUsQ0FBQztRQU10QixpQkFBWSxHQUErQixJQUFJLFlBQVksRUFBZ0IsQ0FBQztRQU9uRSxTQUFJLEdBQVEsa0JBQWtCLENBQUM7UUFDeEMsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUMxQixzQkFBaUIsR0FBWSxLQUFLLENBQUM7UUFDbEMsZ0JBQVcsR0FBbUIsRUFBRSxDQUFDO1FBRWxDLGtCQUFhLEdBQW1CO1lBQ3JDLEVBQUMsSUFBSSxFQUFFLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxFQUFFLEtBQUssRUFBRSxxQkFBcUIsQ0FBQyxNQUFNLEVBQUM7WUFDekcsRUFBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLGdCQUFnQixDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLDhCQUE4QixDQUFDLEVBQUUsS0FBSyxFQUFFLHFCQUFxQixDQUFDLE1BQU0sRUFBQztTQUNySCxDQUFDO0lBTUYsQ0FBQztJQXRDRCxJQUNXLFVBQVUsQ0FBQyxLQUFxQjtRQUN6QyxJQUFJLENBQUMsV0FBVyxHQUFHLEtBQUssSUFBSSxFQUFFLENBQUM7UUFDL0IsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ3ZDLENBQUM7SUFFRCxJQUFXLFVBQVU7UUFDbkIsT0FBTyxJQUFJLENBQUMsV0FBVyxDQUFDO0lBQzFCLENBQUM7SUFZTSxTQUFTO1FBQ2QsT0FBTyxJQUFJLENBQUM7SUFDZCxDQUFDO0lBa0JNLFFBQVE7UUFDYixJQUFJLElBQUksQ0FBQyxVQUFVLEtBQUssU0FBUyxFQUFFO1lBQ2pDLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztTQUN0QztJQUNILENBQUM7SUFFTSxVQUFVO1FBQ2YsSUFBSSxDQUFDLFFBQVEsR0FBRyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDakMsQ0FBQztJQUVNLFVBQVUsQ0FBQyxJQUFrQjtRQUNsQyxJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsV0FBVyxFQUFFLEtBQUsscUJBQXFCLENBQUMsU0FBUyxFQUFFO1lBQ2hFLElBQUksQ0FBQyxpQkFBaUIsR0FBRyxDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQztZQUNqRCxPQUFPO1NBQ1I7UUFFRCxJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQztRQUN2QixJQUFJLENBQUMsUUFBUSxHQUFHLEtBQUssQ0FBQztRQUN0QixJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDMUMsQ0FBQztJQUVNLDRCQUE0QixDQUFDLFdBQXlCO1FBQzNELElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQ3BDLElBQUksQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO1FBQ3RCLElBQUksQ0FBQyxpQkFBaUIsR0FBRyxLQUFLLENBQUM7SUFDakMsQ0FBQztJQUVNLGNBQWM7UUFDbkIsSUFBSSxDQUFDLFFBQVEsR0FBRyxLQUFLLENBQUM7UUFDdEIsSUFBSSxDQUFDLGlCQUFpQixHQUFHLEtBQUssQ0FBQztJQUNqQyxDQUFDOzs7WUFwR0YsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxrQkFBa0I7Z0JBQzVCLFFBQVEsRUFBRTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBd0JUO2dCQUNELGFBQWEsRUFBRSxpQkFBaUIsQ0FBQyxJQUFJO2FBQ3RDOzs7WUFoQ08sZ0JBQWdCO1lBQWhCLGdCQUFnQjs7O3lCQWtDckIsS0FBSzt1QkFVTCxLQUFLO3lCQUdMLEtBQUs7MkJBR0wsTUFBTTt3QkFHTixXQUFXLFNBQUMsd0JBQXdCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSG9zdEJpbmRpbmcsIElucHV0LCBPbkluaXQsIE91dHB1dCwgVmlld0VuY2Fwc3VsYXRpb259IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcbmltcG9ydCB7Q29yZUNvbXBvbmVudHNJY29ufSBmcm9tIFwiLi4vLi4vY29yZS9lbnVtL2NvcmUtY29tcG9uZW50cy1pY29uLmVudW1cIjtcclxuaW1wb3J0IHtJY29uQ2FjaGVTZXJ2aWNlfSBmcm9tIFwiLi4vaWNvbi9pY29uLWNhY2hlLnNlcnZpY2VcIjtcclxuaW1wb3J0IHtJY29uTGlzdEl0ZW19IGZyb20gXCIuLi8uLi9tb2RlbC9pY29uLWxpc3QtaXRlbVwiO1xyXG5pbXBvcnQge0JhdGNoRGVsaXZlcnlDYXRlZ29yeX0gZnJvbSAnLi4vLi4vY29yZS9lbnVtL2JhdGNoLWRlbGl2ZXJ5LWNhdGVnb3J5LmVudW0nO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdjby1saXN0LW9mLWljb25zJyxcclxuICB0ZW1wbGF0ZTogYFxyXG4gICAgPGRpdiBjbGFzcz1cImljb24taXRlbSBhY3RpdmVcIiBbY2xhc3MubWVudS1vcGVuZWRdPVwic2hvd01lbnVcIiAoY2xpY2spPVwidG9nZ2xlTWVudSgpXCI+XHJcbiAgICAgIDxjby1pY29uIFtpY29uRGF0YV09XCJhY3RpdmVJdGVtLmljb25cIiBbc3R5bGUud2lkdGgucHhdPVwiaWNvblNpemVcIiBbc3R5bGUuaGVpZ2h0LnB4XT1cImljb25TaXplXCI+PC9jby1pY29uPlxyXG4gICAgICA8Y28taWNvbiAqbmdJZj1cIiFzaG93TWVudVwiIGNsYXNzPVwiZHJvcC1hcnJvd1wiIFtpY29uRGF0YV09XCJpY29ucy5nZXRJY29uKEljb24uQ2FyZXREb3duU29saWQpXCI+PC9jby1pY29uPlxyXG4gICAgICA8Y28taWNvbiAqbmdJZj1cInNob3dNZW51XCIgY2xhc3M9XCJkcm9wLWFycm93XCIgW2ljb25EYXRhXT1cImljb25zLmdldEljb24oSWNvbi5DYXJldFVwU29saWQpXCI+PC9jby1pY29uPlxyXG4gICAgPC9kaXY+XHJcbiAgICA8ZGl2IGNsYXNzPVwiZHJvcGRvd24tbWVudVwiICpuZ0lmPVwic2hvd01lbnVcIiAoY2xpY2tPdXRzaWRlKT1cIm9uQ2xpY2tPdXRzaWRlKClcIj5cclxuICAgICAgPGRpdiBjbGFzcz1cImljb24taXRlbVwiICpuZ0Zvcj1cImxldCBpdGVtIG9mIGNvbGxlY3Rpb25cIiAoY2xpY2spPVwic2VsZWN0SXRlbShpdGVtKVwiXHJcbiAgICAgICAgICAgW2NsYXNzLmFjdGl2ZV09XCJpdGVtID09PSBhY3RpdmVJdGVtXCI+XHJcbiAgICAgICAgPGNvLWljb24gW2ljb25EYXRhXT1cIml0ZW0uaWNvblwiIFtzdHlsZS53aWR0aC5weF09XCJpY29uU2l6ZVwiIFtzdHlsZS5oZWlnaHQucHhdPVwiaWNvblNpemVcIj48L2NvLWljb24+XHJcbiAgICAgICAgICA8ZGl2IGNsYXNzPVwibGFiZWxcIiBbdGV4dENvbnRlbnRdPVwiaXRlbS5sYWJlbCB8IGNvcmVMb2NhbGl6ZVwiPjwvZGl2PlxyXG4gICAgICA8L2Rpdj5cclxuICAgICAgPGRpdiBjbGFzcz1cInBpY2tpbmctdHlwZS13cmFwcGVyXCIgKm5nSWY9XCJzaG93U3ViQ2F0ZWdvcmllc1wiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJidXR0b24td3JhcHBlclwiICpuZ0Zvcj1cImxldCBzdWJDYXRlZ29yeSBvZiBzdWJDYXRlZ29yaWVzXCIgKGNsaWNrKT1cImhhbmRsZVBpY2tpbmdDYXRlZ29yeUNsaWNrZWQoc3ViQ2F0ZWdvcnkpXCI+XHJcbiAgICAgICAgICA8Y28taWNvblxyXG4gICAgICAgICAgICAgICAgICBjbGFzcz1cImNvLXRyYW5zYWN0aW9uLWJ1dHRvbi1iYXItaWNvblwiXHJcbiAgICAgICAgICAgICAgICAgIFtpY29uRGF0YV09XCJzdWJDYXRlZ29yeS5pY29uXCJcclxuICAgICAgICAgICAgICAgICAgW3N0eWxlLndpZHRoLnB4XT1cImljb25TaXplXCJcclxuICAgICAgICAgICAgICAgICAgW3N0eWxlLmhlaWdodC5weF09XCJpY29uU2l6ZVwiPlxyXG4gICAgICAgICAgPC9jby1pY29uPlxyXG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJidXR0b24tdGl0bGVcIiBbdGV4dENvbnRlbnRdPVwic3ViQ2F0ZWdvcnkubGFiZWwgfCBjb3JlTG9jYWxpemVcIj48L3NwYW4+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgIDwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbiAgYCxcclxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgTGlzdE9mSWNvbnNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpXHJcbiAgcHVibGljIHNldCBjb2xsZWN0aW9uKHZhbHVlOiBJY29uTGlzdEl0ZW1bXSkge1xyXG4gICAgdGhpcy5fY29sbGVjdGlvbiA9IHZhbHVlIHx8IFtdO1xyXG4gICAgdGhpcy5hY3RpdmVJdGVtID0gdGhpcy5jb2xsZWN0aW9uWzBdO1xyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBjb2xsZWN0aW9uKCk6IEljb25MaXN0SXRlbVtdIHtcclxuICAgIHJldHVybiB0aGlzLl9jb2xsZWN0aW9uO1xyXG4gIH1cclxuXHJcbiAgQElucHV0KClcclxuICBwdWJsaWMgaWNvblNpemU6IG51bWJlciA9IDI1O1xyXG5cclxuICBASW5wdXQoKVxyXG4gIHB1YmxpYyBhY3RpdmVJdGVtPzogSWNvbkxpc3RJdGVtO1xyXG5cclxuICBAT3V0cHV0KClcclxuICBwdWJsaWMgaXRlbVNlbGVjdGVkOiBFdmVudEVtaXR0ZXI8SWNvbkxpc3RJdGVtPiA9IG5ldyBFdmVudEVtaXR0ZXI8SWNvbkxpc3RJdGVtPigpO1xyXG5cclxuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmNvLWxpc3Qtb2YtaWNvbnMnKVxyXG4gIHB1YmxpYyBzaG93Q2xhc3MoKSB7XHJcbiAgICByZXR1cm4gdHJ1ZTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyByZWFkb25seSBJY29uOiBhbnkgPSBDb3JlQ29tcG9uZW50c0ljb247XHJcbiAgcHVibGljIHNob3dNZW51OiBib29sZWFuID0gZmFsc2U7XHJcbiAgcHVibGljIHNob3dTdWJDYXRlZ29yaWVzOiBib29sZWFuID0gZmFsc2U7XHJcbiAgcHJpdmF0ZSBfY29sbGVjdGlvbjogSWNvbkxpc3RJdGVtW10gPSBbXTtcclxuXHJcbiAgcHVibGljIHN1YkNhdGVnb3JpZXM6IEljb25MaXN0SXRlbVtdID0gW1xyXG4gICAge2ljb246IHRoaXMuaWNvbkNhY2hlU2VydmljZS5nZXRJY29uKHRoaXMuSWNvbi5Cb3hlc1BhY2tpbmdSZWd1bGFyKSwgbGFiZWw6IEJhdGNoRGVsaXZlcnlDYXRlZ29yeS5Ub1BpY2t9LFxyXG4gICAge2ljb246IHRoaXMuaWNvbkNhY2hlU2VydmljZS5nZXRJY29uKHRoaXMuSWNvbi5SZWd1bGFyQm94ZXNQYWNraW5nQ2lyY2xlQ2hlY2spLCBsYWJlbDogQmF0Y2hEZWxpdmVyeUNhdGVnb3J5LlBpY2tlZH1cclxuICBdO1xyXG5cclxuICBjb25zdHJ1Y3RvcihcclxuICAgIHB1YmxpYyBpY29uQ2FjaGVTZXJ2aWNlOiBJY29uQ2FjaGVTZXJ2aWNlLFxyXG4gICAgcHVibGljIGljb25zOiBJY29uQ2FjaGVTZXJ2aWNlXHJcbiAgKSB7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICBpZiAodGhpcy5hY3RpdmVJdGVtID09PSB1bmRlZmluZWQpIHtcclxuICAgICAgdGhpcy5hY3RpdmVJdGVtID0gdGhpcy5jb2xsZWN0aW9uWzBdO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcHVibGljIHRvZ2dsZU1lbnUoKTogdm9pZCB7XHJcbiAgICB0aGlzLnNob3dNZW51ID0gIXRoaXMuc2hvd01lbnU7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgc2VsZWN0SXRlbShpdGVtOiBJY29uTGlzdEl0ZW0pOiB2b2lkIHtcclxuICAgIGlmIChpdGVtLmxhYmVsLnRvVXBwZXJDYXNlKCkgPT09IEJhdGNoRGVsaXZlcnlDYXRlZ29yeS5Mb2dpc3RpY3MpIHtcclxuICAgICAgdGhpcy5zaG93U3ViQ2F0ZWdvcmllcyA9ICF0aGlzLnNob3dTdWJDYXRlZ29yaWVzO1xyXG4gICAgICByZXR1cm47XHJcbiAgICB9XHJcblxyXG4gICAgdGhpcy5hY3RpdmVJdGVtID0gaXRlbTtcclxuICAgIHRoaXMuc2hvd01lbnUgPSBmYWxzZTtcclxuICAgIHRoaXMuaXRlbVNlbGVjdGVkLmVtaXQodGhpcy5hY3RpdmVJdGVtKTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBoYW5kbGVQaWNraW5nQ2F0ZWdvcnlDbGlja2VkKHN1YkNhdGVnb3J5OiBJY29uTGlzdEl0ZW0pOiB2b2lkIHtcclxuICAgIHRoaXMuaXRlbVNlbGVjdGVkLmVtaXQoc3ViQ2F0ZWdvcnkpO1xyXG4gICAgdGhpcy5zaG93TWVudSA9IGZhbHNlO1xyXG4gICAgdGhpcy5zaG93U3ViQ2F0ZWdvcmllcyA9IGZhbHNlO1xyXG4gIH1cclxuXHJcbiAgcHVibGljIG9uQ2xpY2tPdXRzaWRlKCk6IHZvaWQge1xyXG4gICAgdGhpcy5zaG93TWVudSA9IGZhbHNlO1xyXG4gICAgdGhpcy5zaG93U3ViQ2F0ZWdvcmllcyA9IGZhbHNlO1xyXG4gIH1cclxufVxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdC1vZi1pY29ucy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvbGlzdC1vZi1pY29ucy9saXN0LW9mLWljb25zLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFFLFlBQVksRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBRSxpQkFBaUIsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUM3RyxPQUFPLEVBQUMsa0JBQWtCLEVBQUMsTUFBTSwyQ0FBMkMsQ0FBQztBQUM3RSxPQUFPLEVBQUMsZ0JBQWdCLEVBQUMsTUFBTSw0QkFBNEIsQ0FBQztBQW1DNUQsTUFBTSxPQUFPLG9CQUFvQjtJQThCL0IsWUFDUyxLQUF1QjtRQUF2QixVQUFLLEdBQUwsS0FBSyxDQUFrQjtRQW5CekIsYUFBUSxHQUFXLEVBQUUsQ0FBQztRQU10QixpQkFBWSxHQUErQixJQUFJLFlBQVksRUFBZ0IsQ0FBQztRQU9uRSxTQUFJLEdBQVEsa0JBQWtCLENBQUM7UUFDeEMsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUMxQixzQkFBaUIsR0FBWSxLQUFLLENBQUM7UUFDbEMsZ0JBQVcsR0FBbUIsRUFBRSxDQUFDO0lBS3pDLENBQUM7SUFoQ0QsSUFDVyxVQUFVLENBQUMsS0FBcUI7UUFDekMsSUFBSSxDQUFDLFdBQVcsR0FBRyxLQUFLLElBQUksRUFBRSxDQUFDO1FBQy9CLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztJQUN2QyxDQUFDO0lBRUQsSUFBVyxVQUFVO1FBQ25CLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQztJQUMxQixDQUFDO0lBWU0sU0FBUztRQUNkLE9BQU8sSUFBSSxDQUFDO0lBQ2QsQ0FBQztJQVlNLFFBQVE7UUFDYixJQUFJLElBQUksQ0FBQyxVQUFVLEtBQUssU0FBUyxFQUFFO1lBQ2pDLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztTQUN0QztJQUNILENBQUM7SUFFTSxVQUFVO1FBQ2YsSUFBSSxDQUFDLFFBQVEsR0FBRyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDakMsQ0FBQztJQUVNLFVBQVUsQ0FBQyxJQUFrQjtRQUNsQyxJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUU7WUFDakIsSUFBSSxDQUFDLGlCQUFpQixHQUFHLENBQUMsSUFBSSxDQUFDLGlCQUFpQixDQUFDO1lBQ2pELE9BQU87U0FDUjtRQUVELElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO1FBQ3RCLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUMxQyxDQUFDO0lBRU0sNEJBQTRCLENBQUMsV0FBeUI7UUFDM0QsSUFBSSxDQUFDLFVBQVUsR0FBRyxXQUFXLENBQUM7UUFDOUIsSUFBSSxDQUFDLFFBQVEsR0FBRyxLQUFLLENBQUM7UUFDdEIsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDcEMsSUFBSSxDQUFDLGlCQUFpQixHQUFHLEtBQUssQ0FBQztJQUNqQyxDQUFDO0lBRU0sY0FBYztRQUNuQixJQUFJLENBQUMsUUFBUSxHQUFHLEtBQUssQ0FBQztRQUN0QixJQUFJLENBQUMsaUJBQWlCLEdBQUcsS0FBSyxDQUFDO0lBQ2pDLENBQUM7OztZQWxHRixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLGtCQUFrQjtnQkFDNUIsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0EyQlQ7Z0JBQ0QsYUFBYSxFQUFFLGlCQUFpQixDQUFDLElBQUk7YUFDdEM7OztZQWxDTyxnQkFBZ0I7Ozt5QkFvQ3JCLEtBQUs7dUJBVUwsS0FBSzt5QkFHTCxLQUFLOzJCQUdMLE1BQU07d0JBR04sV0FBVyxTQUFDLHdCQUF3QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIEhvc3RCaW5kaW5nLCBJbnB1dCwgT25Jbml0LCBPdXRwdXQsIFZpZXdFbmNhcHN1bGF0aW9ufSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5pbXBvcnQge0NvcmVDb21wb25lbnRzSWNvbn0gZnJvbSBcIi4uLy4uL2NvcmUvZW51bS9jb3JlLWNvbXBvbmVudHMtaWNvbi5lbnVtXCI7XHJcbmltcG9ydCB7SWNvbkNhY2hlU2VydmljZX0gZnJvbSBcIi4uL2ljb24vaWNvbi1jYWNoZS5zZXJ2aWNlXCI7XHJcbmltcG9ydCB7SWNvbkxpc3RJdGVtfSBmcm9tIFwiLi4vLi4vbW9kZWwvaWNvbi1saXN0LWl0ZW1cIjtcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnY28tbGlzdC1vZi1pY29ucycsXHJcbiAgdGVtcGxhdGU6IGBcclxuICAgICAgPGRpdiBjbGFzcz1cImljb24taXRlbSBhY3RpdmVcIiBbY2xhc3MubWVudS1vcGVuZWRdPVwic2hvd01lbnVcIiAoY2xpY2spPVwidG9nZ2xlTWVudSgpXCI+XHJcbiAgICAgICAgICA8Y28taWNvbiBbaWNvbkRhdGFdPVwiYWN0aXZlSXRlbS5pY29uXCIgW3N0eWxlLndpZHRoLnB4XT1cImljb25TaXplXCIgW3N0eWxlLmhlaWdodC5weF09XCJpY29uU2l6ZVwiPjwvY28taWNvbj5cclxuICAgICAgICAgIDxjby1pY29uICpuZ0lmPVwiIXNob3dNZW51XCIgY2xhc3M9XCJkcm9wLWFycm93XCIgW2ljb25EYXRhXT1cImljb25zLmdldEljb24oSWNvbi5DYXJldERvd25Tb2xpZClcIj48L2NvLWljb24+XHJcbiAgICAgICAgICA8Y28taWNvbiAqbmdJZj1cInNob3dNZW51XCIgY2xhc3M9XCJkcm9wLWFycm93XCIgW2ljb25EYXRhXT1cImljb25zLmdldEljb24oSWNvbi5DYXJldFVwU29saWQpXCI+PC9jby1pY29uPlxyXG4gICAgICA8L2Rpdj5cclxuICAgICAgPGRpdiBjbGFzcz1cImRyb3Bkb3duLW1lbnVcIiAqbmdJZj1cInNob3dNZW51XCIgKGNsaWNrT3V0c2lkZSk9XCJvbkNsaWNrT3V0c2lkZSgpXCI+XHJcbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiaWNvbi1pdGVtXCIgKm5nRm9yPVwibGV0IGl0ZW0gb2YgY29sbGVjdGlvblwiIChjbGljayk9XCJzZWxlY3RJdGVtKGl0ZW0pXCJcclxuICAgICAgICAgICAgICAgW2NsYXNzLmFjdGl2ZV09XCJpdGVtID09PSBhY3RpdmVJdGVtXCI+XHJcbiAgICAgICAgICAgICAgPGNvLWljb24gW2ljb25EYXRhXT1cIml0ZW0uaWNvblwiIFtzdHlsZS53aWR0aC5weF09XCJpY29uU2l6ZVwiIFtzdHlsZS5oZWlnaHQucHhdPVwiaWNvblNpemVcIj48L2NvLWljb24+XHJcbiAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cImxhYmVsXCIgW3RleHRDb250ZW50XT1cIml0ZW0ubGFiZWwgfCBjb3JlTG9jYWxpemVcIj48L2Rpdj5cclxuICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwicGlja2luZy10eXBlLXdyYXBwZXJcIiAqbmdJZj1cInNob3dTdWJDYXRlZ29yaWVzICYmIGl0ZW0uY2hpbGRyZW4/Lmxlbmd0aCA+IDBcIj5cclxuICAgICAgICAgICAgICAgICAgPGRpdlxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgIGNsYXNzPVwiYnV0dG9uLXdyYXBwZXJcIlxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICpuZ0Zvcj1cImxldCBzdWJDYXRlZ29yeSBvZiBpdGVtLmNoaWxkcmVuXCJcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAoY2xpY2spPVwiaGFuZGxlUGlja2luZ0NhdGVnb3J5Q2xpY2tlZChzdWJDYXRlZ29yeSlcIj5cclxuICAgICAgICAgICAgICAgICAgICAgIDxjby1pY29uXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNsYXNzPVwiY28tdHJhbnNhY3Rpb24tYnV0dG9uLWJhci1pY29uXCJcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgW2ljb25EYXRhXT1cInN1YkNhdGVnb3J5Lmljb25cIlxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICBbc3R5bGUud2lkdGgucHhdPVwiaWNvblNpemVcIlxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICBbc3R5bGUuaGVpZ2h0LnB4XT1cImljb25TaXplXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgICA8L2NvLWljb24+XHJcbiAgICAgICAgICAgICAgICAgICAgICA8c3BhbiBjbGFzcz1cImJ1dHRvbi10aXRsZVwiIFt0ZXh0Q29udGVudF09XCJzdWJDYXRlZ29yeS5sYWJlbCB8IGNvcmVMb2NhbGl6ZVwiPjwvc3Bhbj5cclxuICAgICAgICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICA8L2Rpdj5cclxuICAgICAgPC9kaXY+XHJcbiAgYCxcclxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgTGlzdE9mSWNvbnNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpXHJcbiAgcHVibGljIHNldCBjb2xsZWN0aW9uKHZhbHVlOiBJY29uTGlzdEl0ZW1bXSkge1xyXG4gICAgdGhpcy5fY29sbGVjdGlvbiA9IHZhbHVlIHx8IFtdO1xyXG4gICAgdGhpcy5hY3RpdmVJdGVtID0gdGhpcy5jb2xsZWN0aW9uWzBdO1xyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBjb2xsZWN0aW9uKCk6IEljb25MaXN0SXRlbVtdIHtcclxuICAgIHJldHVybiB0aGlzLl9jb2xsZWN0aW9uO1xyXG4gIH1cclxuXHJcbiAgQElucHV0KClcclxuICBwdWJsaWMgaWNvblNpemU6IG51bWJlciA9IDI1O1xyXG5cclxuICBASW5wdXQoKVxyXG4gIHB1YmxpYyBhY3RpdmVJdGVtPzogSWNvbkxpc3RJdGVtO1xyXG5cclxuICBAT3V0cHV0KClcclxuICBwdWJsaWMgaXRlbVNlbGVjdGVkOiBFdmVudEVtaXR0ZXI8SWNvbkxpc3RJdGVtPiA9IG5ldyBFdmVudEVtaXR0ZXI8SWNvbkxpc3RJdGVtPigpO1xyXG5cclxuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmNvLWxpc3Qtb2YtaWNvbnMnKVxyXG4gIHB1YmxpYyBzaG93Q2xhc3MoKSB7XHJcbiAgICByZXR1cm4gdHJ1ZTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyByZWFkb25seSBJY29uOiBhbnkgPSBDb3JlQ29tcG9uZW50c0ljb247XHJcbiAgcHVibGljIHNob3dNZW51OiBib29sZWFuID0gZmFsc2U7XHJcbiAgcHVibGljIHNob3dTdWJDYXRlZ29yaWVzOiBib29sZWFuID0gZmFsc2U7XHJcbiAgcHJpdmF0ZSBfY29sbGVjdGlvbjogSWNvbkxpc3RJdGVtW10gPSBbXTtcclxuXHJcbiAgY29uc3RydWN0b3IoXHJcbiAgICBwdWJsaWMgaWNvbnM6IEljb25DYWNoZVNlcnZpY2VcclxuICApIHtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICAgIGlmICh0aGlzLmFjdGl2ZUl0ZW0gPT09IHVuZGVmaW5lZCkge1xyXG4gICAgICB0aGlzLmFjdGl2ZUl0ZW0gPSB0aGlzLmNvbGxlY3Rpb25bMF07XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgdG9nZ2xlTWVudSgpOiB2b2lkIHtcclxuICAgIHRoaXMuc2hvd01lbnUgPSAhdGhpcy5zaG93TWVudTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBzZWxlY3RJdGVtKGl0ZW06IEljb25MaXN0SXRlbSk6IHZvaWQge1xyXG4gICAgaWYgKGl0ZW0uY2hpbGRyZW4pIHtcclxuICAgICAgdGhpcy5zaG93U3ViQ2F0ZWdvcmllcyA9ICF0aGlzLnNob3dTdWJDYXRlZ29yaWVzO1xyXG4gICAgICByZXR1cm47XHJcbiAgICB9XHJcblxyXG4gICAgdGhpcy5hY3RpdmVJdGVtID0gaXRlbTtcclxuICAgIHRoaXMuc2hvd01lbnUgPSBmYWxzZTtcclxuICAgIHRoaXMuaXRlbVNlbGVjdGVkLmVtaXQodGhpcy5hY3RpdmVJdGVtKTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBoYW5kbGVQaWNraW5nQ2F0ZWdvcnlDbGlja2VkKHN1YkNhdGVnb3J5OiBJY29uTGlzdEl0ZW0pOiB2b2lkIHtcclxuICAgIHRoaXMuYWN0aXZlSXRlbSA9IHN1YkNhdGVnb3J5O1xyXG4gICAgdGhpcy5zaG93TWVudSA9IGZhbHNlO1xyXG4gICAgdGhpcy5pdGVtU2VsZWN0ZWQuZW1pdChzdWJDYXRlZ29yeSk7XHJcbiAgICB0aGlzLnNob3dTdWJDYXRlZ29yaWVzID0gZmFsc2U7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgb25DbGlja091dHNpZGUoKTogdm9pZCB7XHJcbiAgICB0aGlzLnNob3dNZW51ID0gZmFsc2U7XHJcbiAgICB0aGlzLnNob3dTdWJDYXRlZ29yaWVzID0gZmFsc2U7XHJcbiAgfVxyXG59XHJcbiJdfQ==

package/esm2015/lib/model/icon-list-item.js CHANGED Viewed

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1saXN0LWl0ZW0uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlY29tcG9uZW50cy9zcmMvbGliL21vZGVsL2ljb24tbGlzdC1pdGVtLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1NhZmVIdG1sfSBmcm9tIFwiQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3NlclwiO1xyXG5cclxuZXhwb3J0IGludGVyZmFjZSBJY29uTGlzdEl0ZW0ge1xyXG4gIGlkPzogbnVtYmVyO1xyXG4gIGljb246IFNhZmVIdG1sO1xyXG4gIGxhYmVsOiBzdHJpbmc7XHJcbn1cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1saXN0LWl0ZW0uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlY29tcG9uZW50cy9zcmMvbGliL21vZGVsL2ljb24tbGlzdC1pdGVtLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1NhZmVIdG1sfSBmcm9tIFwiQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3NlclwiO1xyXG5cclxuZXhwb3J0IGludGVyZmFjZSBJY29uTGlzdEl0ZW0ge1xyXG4gIGlkPzogbnVtYmVyO1xyXG4gIGljb246IFNhZmVIdG1sO1xyXG4gIGxhYmVsOiBzdHJpbmc7XHJcbiAgY2hpbGRyZW4/OiBJY29uTGlzdEl0ZW1bXTtcclxufVxyXG4iXX0=

package/fesm2015/colijnit-corecomponents_v12.js CHANGED Viewed

@@ -11926,22 +11926,8 @@ ListOfValuesModule.decorators = [
             },] }
 ];
-// Values are corresponding dictionary keys in text_nl.
-var BatchDeliveryCategory;
-(function (BatchDeliveryCategory) {
-    BatchDeliveryCategory["Overview"] = "OVERVIEW";
-    BatchDeliveryCategory["Purchase"] = "COST_OF_SALES";
-    BatchDeliveryCategory["Allocate"] = "ALLOCATION";
-    BatchDeliveryCategory["Logistics"] = "LOGISTICS";
-    BatchDeliveryCategory["DeliveryOrder"] = "DELIVERY_ORDER";
-    BatchDeliveryCategory["Invoice"] = "INVOICE";
-    BatchDeliveryCategory["ToPick"] = "TO_PICK";
-    BatchDeliveryCategory["Picked"] = "PICKED";
-})(BatchDeliveryCategory || (BatchDeliveryCategory = {}));
 class ListOfIconsComponent {
-    constructor(iconCacheService, icons) {
-        this.iconCacheService = iconCacheService;
+    constructor(icons) {
         this.icons = icons;
         this.iconSize = 25;
         this.itemSelected = new EventEmitter();
@@ -11949,10 +11935,6 @@ class ListOfIconsComponent {
         this.showMenu = false;
         this.showSubCategories = false;
         this._collection = [];
-        this.subCategories = [
-            { icon: this.iconCacheService.getIcon(this.Icon.BoxesPackingRegular), label: BatchDeliveryCategory.ToPick },
-            { icon: this.iconCacheService.getIcon(this.Icon.RegularBoxesPackingCircleCheck), label: BatchDeliveryCategory.Picked }
-        ];
     }
     set collection(value) {
         this._collection = value || [];
@@ -11973,7 +11955,7 @@ class ListOfIconsComponent {
         this.showMenu = !this.showMenu;
     }
     selectItem(item) {
-        if (item.label.toUpperCase() === BatchDeliveryCategory.Logistics) {
+        if (item.children) {
             this.showSubCategories = !this.showSubCategories;
             return;
         }
@@ -11982,8 +11964,9 @@ class ListOfIconsComponent {
         this.itemSelected.emit(this.activeItem);
     }
     handlePickingCategoryClicked(subCategory) {
-        this.itemSelected.emit(subCategory);
+        this.activeItem = subCategory;
         this.showMenu = false;
+        this.itemSelected.emit(subCategory);
         this.showSubCategories = false;
     }
     onClickOutside() {
@@ -11995,35 +11978,37 @@ ListOfIconsComponent.decorators = [
     { type: Component, args: [{
                 selector: 'co-list-of-icons',
                 template: `
-    <div class="icon-item active" [class.menu-opened]="showMenu" (click)="toggleMenu()">
-      <co-icon [iconData]="activeItem.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
-      <co-icon *ngIf="!showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretDownSolid)"></co-icon>
-      <co-icon *ngIf="showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretUpSolid)"></co-icon>
-    </div>
-    <div class="dropdown-menu" *ngIf="showMenu" (clickOutside)="onClickOutside()">
-      <div class="icon-item" *ngFor="let item of collection" (click)="selectItem(item)"
-           [class.active]="item === activeItem">
-        <co-icon [iconData]="item.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
-          <div class="label" [textContent]="item.label | coreLocalize"></div>
+      <div class="icon-item active" [class.menu-opened]="showMenu" (click)="toggleMenu()">
+          <co-icon [iconData]="activeItem.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
+          <co-icon *ngIf="!showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretDownSolid)"></co-icon>
+          <co-icon *ngIf="showMenu" class="drop-arrow" [iconData]="icons.getIcon(Icon.CaretUpSolid)"></co-icon>
       </div>
-      <div class="picking-type-wrapper" *ngIf="showSubCategories">
-        <div class="button-wrapper" *ngFor="let subCategory of subCategories" (click)="handlePickingCategoryClicked(subCategory)">
-          <co-icon
-                  class="co-transaction-button-bar-icon"
-                  [iconData]="subCategory.icon"
-                  [style.width.px]="iconSize"
-                  [style.height.px]="iconSize">
-          </co-icon>
-          <span class="button-title" [textContent]="subCategory.label | coreLocalize"></span>
-        </div>
+      <div class="dropdown-menu" *ngIf="showMenu" (clickOutside)="onClickOutside()">
+          <div class="icon-item" *ngFor="let item of collection" (click)="selectItem(item)"
+               [class.active]="item === activeItem">
+              <co-icon [iconData]="item.icon" [style.width.px]="iconSize" [style.height.px]="iconSize"></co-icon>
+              <div class="label" [textContent]="item.label | coreLocalize"></div>
+              <div class="picking-type-wrapper" *ngIf="showSubCategories && item.children?.length > 0">
+                  <div
+                          class="button-wrapper"
+                          *ngFor="let subCategory of item.children"
+                          (click)="handlePickingCategoryClicked(subCategory)">
+                      <co-icon
+                              class="co-transaction-button-bar-icon"
+                              [iconData]="subCategory.icon"
+                              [style.width.px]="iconSize"
+                              [style.height.px]="iconSize">
+                      </co-icon>
+                      <span class="button-title" [textContent]="subCategory.label | coreLocalize"></span>
+                  </div>
+              </div>
+          </div>
       </div>
-    </div>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
 ListOfIconsComponent.ctorParameters = () => [
-    { type: IconCacheService },
     { type: IconCacheService }
 ];
 ListOfIconsComponent.propDecorators = {