@wizishop/angular-components 0.0.38 → 0.0.42

package/bundles/wizishop-angular-components.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@wizishop/ng-wizi-bulma'), require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('ngx-perfect-scrollbar'), require('rxjs'), require('rxjs/operators'), require('@angular/cdk/table'), require('@angular/animations'), require('ngx-chips'), require('uuid'), require('@ngx-translate/core'), require('@angular/router')) :
-    typeof define === 'function' && define.amd ? define('@wizishop/angular-components', ['exports', '@wizishop/ng-wizi-bulma', '@angular/core', '@angular/common', '@angular/forms', 'ngx-perfect-scrollbar', 'rxjs', 'rxjs/operators', '@angular/cdk/table', '@angular/animations', 'ngx-chips', 'uuid', '@ngx-translate/core', '@angular/router'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wizishop = global.wizishop || {}, global.wizishop['angular-components'] = {}), global['ng-wizi-bulma'], global.ng.core, global.ng.common, global.ng.forms, global['ngx-perfect-scrollbar'], global.rxjs, global.rxjs.operators, global.ng.cdk.table, global.ng.animations, global['ngx-chips'], global.uuid, global['@ngx-translate/core'], global.ng.router));
-}(this, (function (exports, i1, i0, common, forms, ngxPerfectScrollbar, rxjs, operators, table, animations, ngxChips, uuid, core, router) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@wizishop/ng-wizi-bulma'), require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('ngx-perfect-scrollbar'), require('rxjs'), require('rxjs/operators'), require('@angular/cdk/overlay'), require('@angular/cdk/table'), require('@angular/animations'), require('ngx-chips'), require('uuid'), require('@ngx-translate/core'), require('@angular/router')) :
+    typeof define === 'function' && define.amd ? define('@wizishop/angular-components', ['exports', '@wizishop/ng-wizi-bulma', '@angular/core', '@angular/common', '@angular/forms', 'ngx-perfect-scrollbar', 'rxjs', 'rxjs/operators', '@angular/cdk/overlay', '@angular/cdk/table', '@angular/animations', 'ngx-chips', 'uuid', '@ngx-translate/core', '@angular/router'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wizishop = global.wizishop || {}, global.wizishop['angular-components'] = {}), global['ng-wizi-bulma'], global.ng.core, global.ng.common, global.ng.forms, global['ngx-perfect-scrollbar'], global.rxjs, global.rxjs.operators, global.ng.cdk.overlay, global.ng.cdk.table, global.ng.animations, global['ngx-chips'], global.uuid, global['@ngx-translate/core'], global.ng.router));
+}(this, (function (exports, i1$1, i0, common, forms, ngxPerfectScrollbar, rxjs, operators, i1, table, animations, ngxChips, uuid, core, router) { 'use strict';
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -448,7 +448,11 @@
     };
 
     var DomService = /** @class */ (function () {
-        function DomService() {
+        function DomService(componentFactoryResolver, appRef, injector, overlayContainer) {
+            this.componentFactoryResolver = componentFactoryResolver;
+            this.appRef = appRef;
+            this.injector = injector;
+            this.overlayContainer = overlayContainer;
             this.documentEventSource = new rxjs.Subject();
             this.documentEventDone = this.documentEventSource.asObservable();
             this.eventInitialisation = true;
@@ -478,14 +482,32 @@
                 _this.documentScrollSource.next(window);
             };
         };
+        DomService.prototype.attachComponentPortal = function (component, injector) {
+            var componentRef = this.componentFactoryResolver
+                .resolveComponentFactory(component)
+                .create(injector ? injector : this.injector);
+            this.appRef.attachView(componentRef.hostView);
+            this.overlayContainer.getContainerElement().appendChild(this._getComponentRootNode(componentRef));
+            return componentRef;
+        };
+        /** Gets the root HTMLElement for an instantiated component. */
+        DomService.prototype._getComponentRootNode = function (componentRef) {
+            return componentRef.hostView.rootNodes[0];
+        };
         return DomService;
     }());
-    DomService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DomService_Factory() { return new DomService(); }, token: DomService, providedIn: "root" });
+    DomService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DomService_Factory() { return new DomService(i0.ɵɵinject(i0.ComponentFactoryResolver), i0.ɵɵinject(i0.ApplicationRef), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(i1.OverlayContainer)); }, token: DomService, providedIn: "root" });
     DomService.decorators = [
         { type: i0.Injectable, args: [{
                     providedIn: 'root'
                 },] }
     ];
+    DomService.ctorParameters = function () { return [
+        { type: i0.ComponentFactoryResolver },
+        { type: i0.ApplicationRef },
+        { type: i0.Injector },
+        { type: i1.OverlayContainer }
+    ]; };
 
     var AutoHideDirective = /** @class */ (function () {
         function AutoHideDirective(_elementRef, domService) {
@@ -713,14 +735,14 @@
         };
         return FiltersTableService;
     }());
-    FiltersTableService.ɵprov = i0.ɵɵdefineInjectable({ factory: function FiltersTableService_Factory() { return new FiltersTableService(i0.ɵɵinject(i1.NwbFilterRoutingBuilder)); }, token: FiltersTableService, providedIn: "root" });
+    FiltersTableService.ɵprov = i0.ɵɵdefineInjectable({ factory: function FiltersTableService_Factory() { return new FiltersTableService(i0.ɵɵinject(i1$1.NwbFilterRoutingBuilder)); }, token: FiltersTableService, providedIn: "root" });
     FiltersTableService.decorators = [
         { type: i0.Injectable, args: [{
                     providedIn: 'root'
                 },] }
     ];
     FiltersTableService.ctorParameters = function () { return [
-        { type: i1.NwbFilterRoutingBuilder }
+        { type: i1$1.NwbFilterRoutingBuilder }
     ]; };
 
     var TableComponent = /** @class */ (function () {
@@ -891,6 +913,7 @@
             this.iconFontSize = 12;
             this.hasLoader = false;
             this.disabled = false;
+            this.whiteSpaceNowrap = false;
             this.click = new i0.EventEmitter();
             this.isLoading = false;
             this.interval = null;
@@ -930,7 +953,7 @@
     ButtonComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'wac-button',
-                    template: "<a\n  [class]=\"'wac-button ' + extraClasses\"\n  (click)=\"onButtonClick($event)\"\n  [ngClass]=\"[label === '' ? 'alone' : '', isLoading ? 'is-loading' : '', disabled ? 'disabled' : '', widthAuto ? 'width-auto' : '']\"\n>\n  <span class=\"wac-button__wrapper\">\n    <i *ngIf=\"icon !== ''\" [ngClass]=\"icon\" [style.font-size.px]=\"iconFontSize\"></i>\n    {{ label }}\n    <i *ngIf=\"iconNext !== ''\" [ngClass]=\"iconNext\" [style.font-size.px]=\"iconFontSize\"></i>\n  </span>\n  <span\n    class=\"wac-button__loader\"\n    [ngClass]=\"extraClasses.includes('is-outlined') ? 'outlined' : ''\"\n    *ngIf=\"isLoading || interval !== null\"\n    [style.width]=\"currentLoading + '%'\"\n  >\n    <span *ngIf=\"extraClasses.includes('is-outlined')\">\n      <i *ngIf=\"icon !== ''\" [ngClass]=\"icon\" [style.font-size.px]=\"iconFontSize\"></i>\n      {{ label }}\n      <i *ngIf=\"iconNext !== ''\" [ngClass]=\"iconNext\" [style.font-size.px]=\"iconFontSize\"></i>\n    </span>\n  </span>\n</a>\n"
+                    template: "<a\n  [class]=\"'wac-button ' + extraClasses\"\n  (click)=\"onButtonClick($event)\"\n  [ngClass]=\"[label === '' ? 'alone' : '', isLoading ? 'is-loading' : '', disabled ? 'disabled' : '', widthAuto ? 'width-auto' : '', whiteSpaceNowrap ? 'white-space-no-wrap' : '']\"\n>\n  <span class=\"wac-button__wrapper\">\n    <i *ngIf=\"icon !== ''\" [ngClass]=\"icon\" [style.font-size.px]=\"iconFontSize\"></i>\n    {{ label }}\n    <i *ngIf=\"iconNext !== ''\" [ngClass]=\"iconNext\" [style.font-size.px]=\"iconFontSize\"></i>\n  </span>\n  <span\n    class=\"wac-button__loader\"\n    [ngClass]=\"extraClasses.includes('is-outlined') ? 'outlined' : ''\"\n    *ngIf=\"isLoading || interval !== null\"\n    [style.width]=\"currentLoading + '%'\"\n  >\n    <span *ngIf=\"extraClasses.includes('is-outlined')\">\n      <i *ngIf=\"icon !== ''\" [ngClass]=\"icon\" [style.font-size.px]=\"iconFontSize\"></i>\n      {{ label }}\n      <i *ngIf=\"iconNext !== ''\" [ngClass]=\"iconNext\" [style.font-size.px]=\"iconFontSize\"></i>\n    </span>\n  </span>\n</a>\n"
                 },] }
     ];
     ButtonComponent.ctorParameters = function () { return []; };
@@ -943,6 +966,7 @@
         iconFontSize: [{ type: i0.Input }],
         hasLoader: [{ type: i0.Input }],
         disabled: [{ type: i0.Input }],
+        whiteSpaceNowrap: [{ type: i0.Input }],
         click: [{ type: i0.Output }]
     };
 
@@ -1000,7 +1024,7 @@
     DropdownComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'wac-dropdown',
-                    template: "<div class=\"wac-dropdown\">\n  <div class=\"wac-dropdown__wrapper\">\n    <i class=\"wac-dropdown__wrapper__icon far fa-ellipsis-v\"></i>\n    <div class=\"wac-dropdown__wrapper__sublevel\">\n      <ul class=\"wac-dropdown__wrapper__sublevel__container\">\n        <li\n          *ngFor=\"let item of items\"\n          class=\"wac-dropdown__wrapper__sublevel__container__item\"\n          (click)=\"onUserInput(item.index)\"\n        >\n          <i\n            *ngIf=\"hasIcons\"\n            [class]=\"item.icon\"\n            [style.font-size.px]=\"item.iconFontSize ? item.iconFontSize : '14'\"\n          ></i>\n          {{ item.label }}\n        </li>\n      </ul>\n    </div>\n  </div>\n</div>\n"
+                    template: "<div class=\"wac-dropdown\">\n  <div class=\"wac-dropdown__wrapper\">\n    <i class=\"wac-dropdown__wrapper__icon far fa-ellipsis-v\"></i>\n    <div class=\"wac-dropdown__wrapper__sublevel\">\n      <ul class=\"wac-dropdown__wrapper__sublevel__container\">\n        <li\n          *ngFor=\"let item of items\"\n          class=\"wac-dropdown__wrapper__sublevel__container__item\"\n          (click)=\"onUserInput(item.index)\"\n        >\n          <i\n            *ngIf=\"hasIcons\"\n            [class]=\"item.icon\"\n            [style.font-size.px]=\"item.iconFontSize ? item.iconFontSize : '14'\"\n          ></i>\n          <span>{{ item.label }}</span>\n        </li>\n      </ul>\n    </div>\n  </div>\n</div>\n"
                 },] }
     ];
     DropdownComponent.ctorParameters = function () { return []; };
@@ -3438,6 +3462,91 @@
         response: [{ type: i0.Output }]
     };
 
+    var AlertPopupComponent = /** @class */ (function () {
+        function AlertPopupComponent() {
+            /** Subject for notifying the user that the dialog has finished closing. */
+            this.afterClosedPopup = new rxjs.Subject();
+            this.open = false;
+        }
+        AlertPopupComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            setTimeout(function () {
+                _this.open = true;
+            }, 50);
+            if (this.config.duration > 0) {
+                this.timer = setTimeout(function () { return _this.dismiss(); }, this.config.duration);
+            }
+        };
+        AlertPopupComponent.prototype.dismiss = function () {
+            var _this = this;
+            this.open = false;
+            setTimeout(function () {
+                _this.afterClosedPopup.next(true);
+                _this.afterClosedPopup.complete();
+            }, 200);
+        };
+        /**
+         * Gets an observable that is notified when the dialog is finished closing.
+         */
+        AlertPopupComponent.prototype.afterClosed = function () {
+            return this.afterClosedPopup.asObservable();
+        };
+        return AlertPopupComponent;
+    }());
+    AlertPopupComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'wac-alert-popup',
+                    template: "<div\n  [class]=\"'alert ' + ((config.color) ? config.color : ' is-primary') + ((config.extraClasses) ? ' ' + config.extraClasses : '') + ((config.position) ? ' ' + config.position : '') + ((config.fullsize) ? ' fullsize' : '') + ((config.opacity) ? ' opacity-active' : '') + ((config.small) ? ' small' : '')\"\n  [ngClass]=\"{'is-active': open}\"\n>\n  <div class=\"alert--message\">\n    <span class=\"icon\" *ngIf=\"config.icon\">\n        <i [class]=\"config.icon\"></i>\n    </span>\n    <span (click)=\"dismiss()\" class=\"wac-alert-popup__close\"><i class=\"fas fa-times\"></i></span>\n    <p *ngIf=\"config.title\" class=\"wac-alert-popup__title\" [innerHTML]=\"config.title\"></p>\n    <p *ngIf=\"config.message\" class=\"wac-alert-popup__text\" [innerHTML]=\"config.message\"></p>\n  </div>\n</div>\n",
+                    host: {
+                        class: 'wac-alert-popup'
+                    },
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+
+    var AlertPopupService = /** @class */ (function () {
+        function AlertPopupService(domService) {
+            this.domService = domService;
+        }
+        AlertPopupService.prototype.open = function (config) {
+            var componentRef = this.getComponentRef(config);
+            return componentRef.instance;
+        };
+        AlertPopupService.prototype.getComponentRef = function (config) {
+            var componentRef = this.domService.attachComponentPortal(AlertPopupComponent);
+            config = Object.assign({
+                position: 'is-top'
+            }, config);
+            componentRef.instance.config = config;
+            componentRef.instance.afterClosed().subscribe(function () {
+                componentRef.destroy();
+            });
+            return componentRef;
+        };
+        return AlertPopupService;
+    }());
+    AlertPopupService.decorators = [
+        { type: i0.Injectable }
+    ];
+    AlertPopupService.ctorParameters = function () { return [
+        { type: DomService }
+    ]; };
+
+    var AlertPopupModule = /** @class */ (function () {
+        function AlertPopupModule() {
+        }
+        return AlertPopupModule;
+    }());
+    AlertPopupModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [common.CommonModule],
+                    providers: [AlertPopupService],
+                    entryComponents: [AlertPopupComponent],
+                    declarations: [AlertPopupComponent],
+                    exports: [AlertPopupComponent]
+                },] }
+    ];
+
     var components = [
         TagComponent,
         TabComponent,
@@ -3503,7 +3612,7 @@
                     imports: [
                         common.CommonModule,
                         forms.FormsModule,
-                        i1.NwbAllModule,
+                        i1$1.NwbAllModule,
                         core.TranslateModule.forChild(),
                         forms.ReactiveFormsModule,
                         SharedDirectives,
@@ -3518,6 +3627,7 @@
                         LoaderModule,
                         ProgressBarModule,
                         ngxPerfectScrollbar.PerfectScrollbarModule,
+                        AlertPopupModule,
                         router.RouterModule
                     ],
                     declarations: components,
@@ -3536,7 +3646,7 @@
                         common.CommonModule,
                         SharedComponentsModule,
                         SharedDirectives,
-                        i1.NwbAllModule
+                        i1$1.NwbAllModule
                     ],
                     exports: [SharedComponentsModule, SharedDirectives]
                 },] }
@@ -3552,6 +3662,8 @@
 
     exports.AbstractDebounceDirective = AbstractDebounceDirective;
     exports.AlertComponent = AlertComponent;
+    exports.AlertPopupComponent = AlertPopupComponent;
+    exports.AlertPopupService = AlertPopupService;
     exports.AutoHideDirective = AutoHideDirective;
     exports.BackComponent = BackComponent;
     exports.BlockComponent = BlockComponent;
@@ -3623,7 +3735,8 @@
     exports.ɵk = LoaderModule;
     exports.ɵl = CheckboxModule;
     exports.ɵm = inOutY;
-    exports.ɵn = inOutX;
+    exports.ɵn = AlertPopupModule;
+    exports.ɵo = inOutX;
 
     Object.defineProperty(exports, '__esModule', { value: true });