@colijnit/sharedcomponents 1.0.40 → 1.0.41

package/fesm2015/colijnit-sharedcomponents.js

@@ -23,7 +23,7 @@ import { BusinessObjectFactory } from '@colijnit/ioneconnector/build/factory/bus
 import { SendMethod as SendMethod$1 } from '@colijnit/mainapi/build/model/send-method.bo';
 import { PrintStockStickers } from '@colijnit/sharedapi/build/model/print-stock-stickers';
 import { ArticleStock as ArticleStock$1 } from '@colijnit/articleapi/build/model/article-stock';
-import { InputCheckboxModule, IconModule, CoDialogModule, ButtonModule, ClickoutsideModule, InputComboBoxModule, CoGridModule, InputRadioButtonModule, DropDownModule, SimpleGridModule, ImageModule, InputTextModule, InputNumberPickerModule, CoDialogWizardModule, InputTextareaModule, InputDatePickerModule } from '@colijnit/corecomponents_v12';
+import { InputCheckboxModule, IconModule, CoDialogModule, ButtonModule, OverlayService, ClickoutsideModule, OverlayModule, InputComboBoxModule, CoGridModule, InputRadioButtonModule, DropDownModule, SimpleGridModule, ImageModule, InputTextModule, InputNumberPickerModule, CoDialogWizardModule, InputTextareaModule, InputDatePickerModule } from '@colijnit/corecomponents_v12';
 import * as i1 from '@angular/platform-browser';
 import { DomSanitizer } from '@angular/platform-browser';
 import { ArticleStockManagement } from '@colijnit/articleapi/build/model/article-stock-management';
@@ -3603,11 +3603,40 @@ CoLinearGaugeModule.decorators = [
             },] }
 ];
 
-class StatusbarComponent {
+class StatusbarPopupComponent {
     constructor() {
+        this.statusbarData = [];
+        this.showClass = true;
+    }
+}
+StatusbarPopupComponent.decorators = [
+    { type: Component, args: [{
+                selector: "co-statusbar-popup",
+                template: `
+        <div class="co-statusbar-popup-wrapper" [overlay]="parentForOverlay">
+            <div class="status-descriptions">
+                <div *ngFor="let data of statusbarData; let index = index" class="status-description">
+                    <co-circular-gauge [value]="data.percentage"></co-circular-gauge>
+                    <span [textContent]="data.label"></span>
+                </div>
+            </div>
+        </div>
+    `,
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+StatusbarPopupComponent.propDecorators = {
+    statusbarData: [{ type: Input }],
+    parentForOverlay: [{ type: Input }],
+    showClass: [{ type: HostBinding, args: ["class.co-statusbar-popup",] }]
+};
+
+class StatusbarComponent {
+    constructor(_elementRef, _overlayService) {
+        this._elementRef = _elementRef;
+        this._overlayService = _overlayService;
         this.statusbarClick = new EventEmitter();
-        this.showPopup = false;
-        this.popupClass = 'dropdown';
+        this.popupShowing = false;
     }
     set statusbarData(value) {
         this._statusbarData = value;
@@ -3619,23 +3648,21 @@ class StatusbarComponent {
     showClass() {
         return true;
     }
-    onStatusbarClick(event) {
-        this.showPopup = !this.showPopup;
-        if (this.showPopup) {
-            this._mouseY = event.screenY;
-            this._windowHeight = window.innerHeight;
-            this.setPopupClass();
-        }
+    handleClick(event) {
+        this.handleShowPopup(event);
     }
-    setPopupClass() {
-        const popupHeight = this.statusbarData.length * 30;
-        let dropdownInScreen = (this._mouseY + popupHeight) <= this._windowHeight;
-        if (dropdownInScreen) {
-            this.popupClass = 'dropdown';
-        }
-        else {
-            this.popupClass = 'dropup';
+    handleShowPopup(event) {
+        if (this.popupShowing) {
+            return;
         }
+        event.preventDefault();
+        event.stopPropagation();
+        this._overlayService.createComponent(StatusbarPopupComponent, { parentForOverlay: this._elementRef, statusbarData: this.statusbarData });
+        this.popupShowing = true;
+    }
+    handleHidePopup() {
+        this._overlayService.removeComponent();
+        this.popupShowing = false;
     }
     adjustTooHighPercentages() {
         this._statusbarData.forEach(data => data.percentage > 100 ? data.percentage = 100 : false);
@@ -3645,25 +3672,19 @@ StatusbarComponent.decorators = [
     { type: Component, args: [{
                 selector: "co-statusbar",
                 template: `
-    <div class="co-statusbar-wrapper"
-         *ngIf="statusbarData"
-         (click)="onStatusbarClick($event)">
+    <div class="co-statusbar-wrapper" *ngIf="statusbarData" [clickOutside]="popupShowing"
+         (clickOutside)="handleHidePopup()">
       <div class="statuses">
         <div *ngFor="let data of statusbarData; let index = index" class="status">
           <co-linear-gauge [class.focused-status]="focusedStatusIndex !== undefined && focusedStatusIndex === index"
-            [value]="data.percentage" [count]="data.count ? data.count : undefined"></co-linear-gauge>
-        </div>
-      </div>
-      <div class=status-description-popup *ngIf="showPopup" @showHidePopup [ngClass]="popupClass" clickOutside (clickOutside)="showPopup=false">
-        <div class="status-descriptions">
-          <div *ngFor="let data of statusbarData; let index = index" class="status-description">
-            <co-circular-gauge [value]="data.percentage"></co-circular-gauge>
-            <span [textContent]="data.label"></span>
-          </div>
+                           [value]="data.percentage" [count]="data.count ? data.count : undefined"></co-linear-gauge>
         </div>
       </div>
     </div>
   `,
+                providers: [
+                    OverlayService
+                ],
                 animations: [
                     trigger("showHidePopup", [
                         state("void", style({ opacity: 0 })),
@@ -3674,12 +3695,16 @@ StatusbarComponent.decorators = [
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
-StatusbarComponent.ctorParameters = () => [];
+StatusbarComponent.ctorParameters = () => [
+    { type: ElementRef },
+    { type: OverlayService }
+];
 StatusbarComponent.propDecorators = {
     statusbarData: [{ type: Input }],
     focusedStatusIndex: [{ type: Input }],
     statusbarClick: [{ type: Output }],
-    showClass: [{ type: HostBinding, args: ["class.co-statusbar",] }]
+    showClass: [{ type: HostBinding, args: ["class.co-statusbar",] }],
+    handleClick: [{ type: HostListener, args: ["click", ["$event"],] }]
 };
 
 class StatusbarModule {
@@ -3690,13 +3715,16 @@ StatusbarModule.decorators = [
                     CommonModule,
                     CoCircularGaugeModule,
                     CoLinearGaugeModule,
-                    ClickoutsideModule
+                    ClickoutsideModule,
+                    OverlayModule
                 ],
                 declarations: [
-                    StatusbarComponent
+                    StatusbarComponent,
+                    StatusbarPopupComponent
                 ],
                 exports: [
-                    StatusbarComponent
+                    StatusbarComponent,
+                    StatusbarPopupComponent
                 ]
             },] }
 ];
@@ -6030,5 +6058,5 @@ DatePlanningModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { CoCircularGaugeComponent, CoCircularGaugeModule, CoLinearGaugeComponent, CoLinearGaugeModule, DatePlanningComponent, DatePlanningModule, DocsignComponent, DocsignModule, KeyPadComponent, KeyPadModule, LayoutSwitcherComponent, LayoutSwitcherModule, SendMethodDialogComponent, SendMethodDialogModule, SharedService, StatusbarComponent, StatusbarModule, StockComponent, StockModule, sendMethodsWithIcon, SignatureComponent as ɵa, SignaturesComponent as ɵb, StockTabsComponent as ɵba, StockHistoryTabsComponent as ɵbb, OrderStockTabComponent as ɵbc, StockLocationComponent as ɵbd, StockHistoryComponent as ɵbe, OrderSupplyStockHistoryComponent as ɵbf, OrderCommissionStockHistoryComponent as ɵbg, OrderStockHistoryComponent as ɵbh, AllocationStockHistoryComponent as ɵbi, SendMethod as ɵbj, Icon as ɵbk, CalendarAllYearsComponent as ɵbl, CalendarAllMonthsComponent as ɵbm, CalendarHeaderComponent as ɵbn, CalendarComponent as ɵbo, CalendarViewComponent as ɵbp, LanguageCode as ɵbq, AgendaHeaderComponent as ɵbr, AgendaViewComponent as ɵbs, AgendaMonthViewComponent as ɵbt, AgendaBaseViewComponent as ɵbu, AgendaDayViewComponent as ɵbv, AgendaWeekViewComponent as ɵbw, AgendaWeekSelectViewComponent as ɵbx, AgendaHourViewComponent as ɵby, AgendaHourCellComponent as ɵbz, StockService as ɵc, AgendaHourViewLabelsComponent as ɵca, AgendaHalfHourCellComponent as ɵcb, AgendaEventsComponent as ɵcc, AgendaEventComponent as ɵcd, ViewSelectComponent as ɵce, AgendaSelectEventComponent as ɵcf, MASTER_PIPES as ɵcg, ArrayNumberPipe as ɵch, UCfirstPipe as ɵci, SharedConnectorService as ɵd, OptionsService as ɵe, DictionaryService as ɵf, IconCacheService as ɵg, SendMethodService as ɵh, SendMethodEmailModule as ɵi, LayoutSelectionModule as ɵj, LayoutSelectionComponent as ɵk, SendMethodEmailComponent as ɵl, SendMethodPrinterModule as ɵm, PrinterSelectionModule as ɵn, PrinterSelectionComponent as ɵo, SendMethodPrinterComponent as ɵp, TabBarModule as ɵq, TabBarComponent as ɵr, StockStatusbarModule as ɵs, StockStatusbarComponent as ɵt, StockInformationComponent as ɵu, StockInformationGridComponent as ɵv, StockTransferComponent as ɵw, StockChangeAmountComponent as ɵx, StockTabComponent as ɵy, OrderTabComponent as ɵz };
+export { CoCircularGaugeComponent, CoCircularGaugeModule, CoLinearGaugeComponent, CoLinearGaugeModule, DatePlanningComponent, DatePlanningModule, DocsignComponent, DocsignModule, KeyPadComponent, KeyPadModule, LayoutSwitcherComponent, LayoutSwitcherModule, SendMethodDialogComponent, SendMethodDialogModule, SharedService, StatusbarComponent, StatusbarModule, StockComponent, StockModule, sendMethodsWithIcon, SignatureComponent as ɵa, SignaturesComponent as ɵb, OrderTabComponent as ɵba, StockTabsComponent as ɵbb, StockHistoryTabsComponent as ɵbc, OrderStockTabComponent as ɵbd, StockLocationComponent as ɵbe, StockHistoryComponent as ɵbf, OrderSupplyStockHistoryComponent as ɵbg, OrderCommissionStockHistoryComponent as ɵbh, OrderStockHistoryComponent as ɵbi, AllocationStockHistoryComponent as ɵbj, SendMethod as ɵbk, Icon as ɵbl, CalendarAllYearsComponent as ɵbm, CalendarAllMonthsComponent as ɵbn, CalendarHeaderComponent as ɵbo, CalendarComponent as ɵbp, CalendarViewComponent as ɵbq, LanguageCode as ɵbr, AgendaHeaderComponent as ɵbs, AgendaViewComponent as ɵbt, AgendaMonthViewComponent as ɵbu, AgendaBaseViewComponent as ɵbv, AgendaDayViewComponent as ɵbw, AgendaWeekViewComponent as ɵbx, AgendaWeekSelectViewComponent as ɵby, AgendaHourViewComponent as ɵbz, StockService as ɵc, AgendaHourCellComponent as ɵca, AgendaHourViewLabelsComponent as ɵcb, AgendaHalfHourCellComponent as ɵcc, AgendaEventsComponent as ɵcd, AgendaEventComponent as ɵce, ViewSelectComponent as ɵcf, AgendaSelectEventComponent as ɵcg, MASTER_PIPES as ɵch, ArrayNumberPipe as ɵci, UCfirstPipe as ɵcj, SharedConnectorService as ɵd, OptionsService as ɵe, DictionaryService as ɵf, IconCacheService as ɵg, SendMethodService as ɵh, SendMethodEmailModule as ɵi, LayoutSelectionModule as ɵj, LayoutSelectionComponent as ɵk, SendMethodEmailComponent as ɵl, SendMethodPrinterModule as ɵm, PrinterSelectionModule as ɵn, PrinterSelectionComponent as ɵo, SendMethodPrinterComponent as ɵp, TabBarModule as ɵq, TabBarComponent as ɵr, StatusbarPopupComponent as ɵs, StockStatusbarModule as ɵt, StockStatusbarComponent as ɵu, StockInformationComponent as ɵv, StockInformationGridComponent as ɵw, StockTransferComponent as ɵx, StockChangeAmountComponent as ɵy, StockTabComponent as ɵz };
 //# sourceMappingURL=colijnit-sharedcomponents.js.map