@wizishop/angular-components 0.0.135 → 0.0.140

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/overlay'), require('@angular/cdk/table'), require('@angular/animations'), require('ngx-chips'), 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', '@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['@ngx-translate/core'], global.ng.router));
-}(this, (function (exports, i1$1, i0, common, forms, ngxPerfectScrollbar, rxjs, operators, i1, table, animations, ngxChips, 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('@ngx-translate/core'), require('@angular/router'), require('ngx-autosize')) :
+    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', '@ngx-translate/core', '@angular/router', 'ngx-autosize'], 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['@ngx-translate/core'], global.ng.router, global.ngxAutosize));
+}(this, (function (exports, i1$1, i0, common, forms, ngxPerfectScrollbar, rxjs, operators, i1, table, animations, ngxChips, core, router, ngxAutosize) { 'use strict';
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -1991,6 +1991,7 @@
             this.size = null;
             this.min = null;
             this.max = null;
+            this.dynamicSize = false;
             this.progressBar = false;
             this.disabled = false;
             this.id = 'wac-textarea__' +
@@ -2026,7 +2027,7 @@
     TextAreaComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'wac-text-area',
-                    template: "<div class=\"field wac-text-area\">\n  <div class=\"field-label is-normal has-text-left\">\n    <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n  </div>\n  <div class=\"field-body\">\n    <div class=\"field\">\n      <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n        <textarea\n          class=\"textarea\"\n          [id]=\"id\"\n          [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n          [placeholder]=\"placeholder\"\n          [attr.size]=\"size\"\n          [(ngModel)]=\"value\"\n          (ngModelChange)=\"onChange($event)\"\n          (blur)=\"onBlur()\"\n          [disabled]=\"disabled\"\n        ></textarea>\n\n        <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n          <i class=\"fal fa-times has-text-danger\"></i>\n        </span>\n        <span\n          *ngIf=\"textInfo && (textError === null || textError === '')\"\n          class=\"is-size-7 wac-text-area__info text-info\"\n          [innerHtml]=\"textInfo\"\n        ></span>\n        <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n        <span\n          *ngIf=\"size && !progressBar\"\n          class=\"is-size-7 wac-text-area__size\"\n          [ngClass]=\"value && value.length > size ? 'has-text-danger' : ''\"\n          >{{ value ? value.length : 0 }}/{{ size }}</span\n        >\n      </p>\n      <wac-progress-bar *ngIf=\"progressBar && value\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n    </div>\n  </div>\n</div>\n",
+                    template: "<div class=\"field wac-text-area\" [ngClass]=\"{'dynamic': dynamicSize}\">\n  <div class=\"field-label is-normal has-text-left\">\n    <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n  </div>\n  <div class=\"field-body\">\n    <div class=\"field\">\n      <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n        <textarea\n          class=\"textarea\"\n          [id]=\"id\"\n          [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n          [placeholder]=\"placeholder\"\n          [attr.size]=\"size\"\n          [(ngModel)]=\"value\"\n          (ngModelChange)=\"onChange($event)\"\n          (blur)=\"onBlur()\"\n          [disabled]=\"disabled\"\n          [autosize]=\"dynamicSize\"\n          [onlyGrow]=\"true\"\n        ></textarea>\n\n        <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n          <i class=\"fal fa-times has-text-danger\"></i>\n        </span>\n        <span\n          *ngIf=\"textInfo && (textError === null || textError === '')\"\n          class=\"is-size-7 wac-text-area__info text-info\"\n          [innerHtml]=\"textInfo\"\n        ></span>\n        <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n        <span\n          *ngIf=\"size && !progressBar\"\n          class=\"is-size-7 wac-text-area__size\"\n          [ngClass]=\"value && value.length > size ? 'has-text-danger' : ''\"\n          >{{ value ? value.length : 0 }}/{{ size }}</span\n        >\n      </p>\n      <wac-progress-bar *ngIf=\"progressBar && value\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n    </div>\n  </div>\n</div>\n",
                     providers: [{ provide: forms.NG_VALUE_ACCESSOR, useExisting: TextAreaComponent, multi: true }]
                 },] }
     ];
@@ -2039,11 +2040,13 @@
         size: [{ type: i0.Input }],
         min: [{ type: i0.Input }],
         max: [{ type: i0.Input }],
+        dynamicSize: [{ type: i0.Input }],
         progressBar: [{ type: i0.Input }]
     };
 
     var H1Component = /** @class */ (function () {
         function H1Component() {
+            this.withImg = false;
         }
         H1Component.prototype.ngOnInit = function () { };
         return H1Component;
@@ -2051,10 +2054,13 @@
     H1Component.decorators = [
         { type: i0.Component, args: [{
                     selector: 'wac-h1',
-                    template: "<h1 class=\"wac-h1\"><ng-content></ng-content></h1>\n"
+                    template: "<h1 class=\"wac-h1\" [ngClass]=\"{'with-img': withImg}\"><ng-content></ng-content></h1>\n"
                 },] }
     ];
     H1Component.ctorParameters = function () { return []; };
+    H1Component.propDecorators = {
+        withImg: [{ type: i0.Input }]
+    };
 
     var H2Component = /** @class */ (function () {
         function H2Component() {
@@ -2090,6 +2096,7 @@
 
     var HeaderPageComponent = /** @class */ (function () {
         function HeaderPageComponent() {
+            this.withImg = false;
         }
         HeaderPageComponent.prototype.ngOnInit = function () { };
         return HeaderPageComponent;
@@ -2097,13 +2104,14 @@
     HeaderPageComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'wac-header-page',
-                    template: "<div class=\"wac-header-page\">\n  <div class=\"wac-header-page__maxWidth\">\n    <div class=\"wac-header-page__maxWidth__top\">\n      <div class=\"wac-header-page__maxWidth__top__left\">\n        <!-- TODO Hard to use when only want a button and not a router link -->\n        <a *ngIf=\"linkBack\" [routerLink]=\"linkBack\"><i class=\"fas fa-chevron-left\"></i></a>\n        <wac-h1>{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\n      </div>\n      <div class=\"wac-header-page__maxWidth__top__right\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n"
+                    template: "<div class=\"wac-header-page\">\n  <div class=\"wac-header-page__maxWidth\">\n    <div class=\"wac-header-page__maxWidth__top\">\n      <div class=\"wac-header-page__maxWidth__top__left\">\n        <!-- TODO Hard to use when only want a button and not a router link -->\n        <a *ngIf=\"linkBack\" [routerLink]=\"linkBack\"><i class=\"fas fa-chevron-left\"></i></a>\n        <wac-h1 [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\n      </div>\n      <div class=\"wac-header-page__maxWidth__top__right\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n"
                 },] }
     ];
     HeaderPageComponent.ctorParameters = function () { return []; };
     HeaderPageComponent.propDecorators = {
         title: [{ type: i0.Input }],
-        linkBack: [{ type: i0.Input }]
+        linkBack: [{ type: i0.Input }],
+        withImg: [{ type: i0.Input }]
     };
 
     var InputComponent = /** @class */ (function () {
@@ -2368,6 +2376,7 @@
             this.textStateDisable = '';
             this.showInput = false;
             this.danger = false;
+            this.whiteSpace = false;
             this.switchChange = new i0.EventEmitter(); // todo set emitted type
             this.changeInput = new i0.EventEmitter(); // todo set emitted type
         }
@@ -2385,7 +2394,7 @@
     SwitchComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'wac-switch',
-                    template: "<div class=\"wac-switch\">\n  <input type=\"checkbox\" [checked]=\"value\" (change)=\"changeValue($event)\" [id]=\"id\" [ngClass]=\"{ danger: danger }\"/>\n  <label [for]=\"id\" class=\"wac-switch__label\">\n    <span class=\"wac-switch__label__text\"\n      ><ng-content></ng-content\n      ><span *ngIf=\"textState\"\n        >{{ textState }} <strong class=\"disable\" *ngIf=\"textStateDisable\">{{ textStateDisable }}</strong>\n        <strong class=\"enable\" *ngIf=\"textStateEnable\">{{ textStateEnable }}</strong></span\n      ></span\n    >\n  </label>\n</div>\n<div class=\"wac-show-input\" *ngIf=\"showInput && value\">\n  <input [placeholder]=\"placholderInput\" type=\"text\" [(ngModel)]=\"valueInput\" (blur)=\"triggerInput()\" />\n</div>\n"
+                    template: "<div class=\"wac-switch\">\n  <input type=\"checkbox\" [checked]=\"value\" (change)=\"changeValue($event)\" [id]=\"id\" [ngClass]=\"{ danger: danger }\"/>\n  <label [for]=\"id\" class=\"wac-switch__label\">\n    <span class=\"wac-switch__label__text\"\n      ><ng-content></ng-content\n      ><span\n        *ngIf=\"textState\"\n        [ngStyle]=\"{'whiteSpace': whiteSpace ? 'nowrap' :'normal'}\"\n        >{{ textState }} <strong class=\"disable\" *ngIf=\"textStateDisable\">{{ textStateDisable }}</strong>\n        <strong class=\"enable\" *ngIf=\"textStateEnable\">{{ textStateEnable }}</strong></span\n      ></span\n    >\n  </label>\n</div>\n<div class=\"wac-show-input\" *ngIf=\"showInput && value\">\n  <input [placeholder]=\"placholderInput\" type=\"text\" [(ngModel)]=\"valueInput\" (blur)=\"triggerInput()\" />\n</div>\n"
                 },] }
     ];
     SwitchComponent.ctorParameters = function () { return []; };
@@ -2397,6 +2406,7 @@
         showInput: [{ type: i0.Input }],
         placholderInput: [{ type: i0.Input }],
         danger: [{ type: i0.Input }],
+        whiteSpace: [{ type: i0.Input }],
         switchChange: [{ type: i0.Output }],
         changeInput: [{ type: i0.Output }]
     };
@@ -4177,6 +4187,72 @@
                 },] }
     ];
 
+    var WrapperSidebarComponent = /** @class */ (function () {
+        function WrapperSidebarComponent() {
+            this.reverse = false;
+        }
+        WrapperSidebarComponent.prototype.ngOnInit = function () {
+        };
+        return WrapperSidebarComponent;
+    }());
+    WrapperSidebarComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'wac-wrapper-sidebar',
+                    template: "<div class=\"wac-wrapper-sidebar\" [ngClass]=\"{'reverse': reverse}\">\n  <div class=\"wac-wrapper-sidebar__left\">\n    <ng-content select=\"[sidebar]\"></ng-content>\n  </div>\n  <div class=\"wac-wrapper-sidebar__right\">\n    <ng-content select=\"[content]\"></ng-content>\n  </div>\n</div>\n"
+                },] }
+    ];
+    WrapperSidebarComponent.ctorParameters = function () { return []; };
+    WrapperSidebarComponent.propDecorators = {
+        reverse: [{ type: i0.Input }]
+    };
+
+    var BreadcrumbsComponent = /** @class */ (function () {
+        function BreadcrumbsComponent() {
+        }
+        BreadcrumbsComponent.prototype.ngOnInit = function () {
+        };
+        return BreadcrumbsComponent;
+    }());
+    BreadcrumbsComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'wac-breadcrumbs',
+                    template: "<div class=\"wac-breadcrumbs\">\n  <div class=\"wac-breadcrumbs__wrapper\">\n    <div class=\"wac-breadcrumbs__item\" *ngFor=\"let b of breadcrumbs; let i = index;\">\n      <div class=\"round\" [ngClass]=\"{'valid': b.valid, 'current': b['current']}\"><span *ngIf=\"!b.valid\"><span *ngIf=\"i < 9\">0</span>{{ i + 1 }}</span><i class=\"fas fa-check\" *ngIf=\"b.valid\"></i></div>\n      <div class=\"name\" [ngClass]=\"{'valid': b.valid}\">{{ b.name }}</div>\n      <i class=\"fas fa-chevron-right\"></i>\n    </div>\n  </div>\n</div>\n"
+                },] }
+    ];
+    BreadcrumbsComponent.ctorParameters = function () { return []; };
+    BreadcrumbsComponent.propDecorators = {
+        breadcrumbs: [{ type: i0.Input }]
+    };
+
+    var CardPriceComponent = /** @class */ (function () {
+        function CardPriceComponent() {
+            this.click = new i0.EventEmitter();
+        }
+        CardPriceComponent.prototype.ngOnInit = function () {
+        };
+        CardPriceComponent.prototype.triggerClick = function () {
+            this.click.emit(true);
+        };
+        return CardPriceComponent;
+    }());
+    CardPriceComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'wac-card-price',
+                    template: "<div class=\"wac-card-price\">\n  <strong>{{amount}}</strong>\n  <p>{{title}}</p>\n  <div class=\"price\">\n    <span class=\"amount\">{{price}} <span>{{currency}}</span></span><span class=\"month\">{{priceWording}}</span>\n  </div>\n  <div class=\"subtitle\">{{subtitle}}</div>\n  <div class=\"cta\">\n    <wac-button [label]=\"btnLabel\" extraClasses=\"is-success\" (click)=\"triggerClick()\"></wac-button>\n  </div>\n</div>\n"
+                },] }
+    ];
+    CardPriceComponent.ctorParameters = function () { return []; };
+    CardPriceComponent.propDecorators = {
+        amount: [{ type: i0.Input }],
+        title: [{ type: i0.Input }],
+        price: [{ type: i0.Input }],
+        currency: [{ type: i0.Input }],
+        priceWording: [{ type: i0.Input }],
+        subtitle: [{ type: i0.Input }],
+        btnLabel: [{ type: i0.Input }],
+        click: [{ type: i0.Output }]
+    };
+
     var components = [
         TagComponent,
         TabComponent,
@@ -4218,7 +4294,10 @@
         WrapperBlocsComponent,
         SnackbarComponent,
         SearchComponent,
-        SelectedListComponent
+        SelectedListComponent,
+        WrapperSidebarComponent,
+        BreadcrumbsComponent,
+        CardPriceComponent
     ];
     var exportsFromModule = [
         PaginationComponent,
@@ -4263,6 +4342,7 @@
                         ngxPerfectScrollbar.PerfectScrollbarModule,
                         AlertPopupModule,
                         router.RouterModule,
+                        ngxAutosize.AutosizeModule,
                         TreeModule
                     ],
                     declarations: components,
@@ -4319,8 +4399,10 @@
     exports.AutoHideDirective = AutoHideDirective;
     exports.BackComponent = BackComponent;
     exports.BlockComponent = BlockComponent;
+    exports.BreadcrumbsComponent = BreadcrumbsComponent;
     exports.ButtonComponent = ButtonComponent;
     exports.CalendarComponent = CalendarComponent;
+    exports.CardPriceComponent = CardPriceComponent;
     exports.CheckBoxRow = CheckBoxRow;
     exports.CheckboxComponent = CheckboxComponent;
     exports.DebounceKeyupDirective = DebounceKeyupDirective;
@@ -4383,6 +4465,7 @@
     exports.WiziComponentsModule = WiziComponentsModule;
     exports.WrapperBlocsComponent = WrapperBlocsComponent;
     exports.WrapperComponent = WrapperComponent;
+    exports.WrapperSidebarComponent = WrapperSidebarComponent;
     exports.WzEditInPlaceComponent = WzEditInPlaceComponent;
     exports.ZindexToggleDirective = ZindexToggleDirective;
     exports.ɵa = DomService;