@wizishop/angular-components 15.1.66 → 15.1.68

package/fesm2020/wizishop-angular-components.mjs

@@ -1,7 +1,7 @@
 import * as i3 from '@wizishop/ng-wizi-bulma';
 import { NwbAllModule, NwbFilterGroup } from '@wizishop/ng-wizi-bulma';
 import * as i0 from '@angular/core';
-import { Component, ViewEncapsulation, Input, EventEmitter, Directive, Output, HostListener, Injectable, InjectionToken, HostBinding, ContentChildren, NgModule, Inject, Pipe, Attribute, Optional, ViewChild, ChangeDetectionStrategy, ContentChild } from '@angular/core';
+import { Component, ViewEncapsulation, Input, EventEmitter, Directive, Output, HostListener, Injectable, InjectionToken, HostBinding, ContentChildren, NgModule, Inject, Pipe, ChangeDetectionStrategy, Attribute, Optional, ViewChild, ContentChild } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, DOCUMENT, DatePipe } from '@angular/common';
 import * as i2 from '@angular/forms';
@@ -1974,23 +1974,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
 class TabComponent {
     set selected(value) {
         this._selected = value;
-        this.changeDetectorRef.detectChanges();
+        this.changeDetectorRef.markForCheck();
     }
     get selected() {
         return this._selected;
     }
     constructor(changeDetectorRef) {
         this.changeDetectorRef = changeDetectorRef;
-    }
-    select(selected) {
-        this._selected = selected;
+        this._selected = false;
     }
 }
 TabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: TabComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: TabComponent, isStandalone: true, selector: "wac-tab", inputs: { label: "label", selected: "selected" }, ngImport: i0, template: "<div class=\"wac-tab\">\n  <ng-content *ngIf=\"selected\"></ng-content>\n</div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
+TabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: TabComponent, isStandalone: true, selector: "wac-tab", inputs: { label: "label", selected: "selected" }, ngImport: i0, template: "<div class=\"wac-tab\">\n  <ng-content *ngIf=\"selected\"></ng-content>\n</div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: TabComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'wac-tab', encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule], template: "<div class=\"wac-tab\">\n  <ng-content *ngIf=\"selected\"></ng-content>\n</div>" }]
+            args: [{ selector: 'wac-tab', encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"wac-tab\">\n  <ng-content *ngIf=\"selected\"></ng-content>\n</div>" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
                 type: Input
             }], selected: [{
@@ -2006,7 +2004,6 @@ class TabsComponent {
             return;
         }
         this.setIndex(null, selectedIndex);
-        this.onChange(selectedIndex);
     }
     constructor(changeDetectorRef) {
         this.changeDetectorRef = changeDetectorRef;
@@ -2020,8 +2017,16 @@ class TabsComponent {
         this.onTouched = () => { };
         this.onChange = (selectedIndex) => { };
     }
+    ngAfterViewInit() {
+        setTimeout(() => {
+            this.setIndex(null, this._selectedIndex);
+        }, 0);
+    }
     writeValue(selectedIndex) {
-        this.setIndex(null, selectedIndex);
+        if (!selectedIndex) {
+            return;
+        }
+        this.selectedIndex = selectedIndex;
     }
     registerOnChange(onChange) {
         this.onChange = onChange;
@@ -2044,7 +2049,7 @@ class TabsComponent {
             this.selected = (currentIndex === index ? tab : this.selected);
         });
         this.listIsOpen = false;
-        this.onChange(currentIndex);
+        this.onChange(this._selectedIndex);
     }
     openList($event) {
         $event?.stopPropagation();
@@ -2054,12 +2059,12 @@ class TabsComponent {
 TabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: TabsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 TabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: TabsComponent, isStandalone: true, selector: "wac-tabs", inputs: { underline: "underline", button: "button", right: "right", marginBottom: "marginBottom" }, providers: [
         { provide: NG_VALUE_ACCESSOR, useExisting: TabsComponent, multi: true },
-    ], queries: [{ propertyName: "tabList", predicate: TabComponent }], ngImport: i0, template: "<div class=\"wac-tabs\"\n [ngClass]=\"{'wac-tabs--underline': underline, 'wac-tabs--button' : button, 'wac-tabs--right' : right}\"\n wzAutoHide\n (clickOutside)=\"listIsOpen = false\"\n [triggerElement]=\"'wac-select__header__selection'\"\n>\n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__mobile\" (click)=\"openList($event)\">\n    <div>{{ selected?.label }}</div><i [class]=\"'fa-solid fa-caret-' + (listIsOpen ? 'up' : 'down')\"></i>\n  </div>\n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__wrapper\" [ngClass]=\"{ 'open' : listIsOpen }\" [ngStyle]=\"{'margin-bottom': marginBottom}\">\n    <a\n      *ngFor=\"let tab of tabList; let i = index\"\n      class=\"wac-tabs__wrapper__tab\"\n      [ngClass]=\"{'wac-tabs__wrapper__tab--selected': i === selectedIndex}\"\n      (click)=\"setIndex($event, i)\"\n    >\n    {{ tab.label }}\n    </a>\n  </div>\n</div>\n<ng-content></ng-content>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: SharedDirectives }, { kind: "directive", type: AutoHideDirective, selector: "[wzAutoHide]", inputs: ["triggerElement", "forceOn"], outputs: ["clickOutside"] }], encapsulation: i0.ViewEncapsulation.None });
+    ], queries: [{ propertyName: "tabList", predicate: TabComponent }], ngImport: i0, template: "<div class=\"wac-tabs\"\n [ngClass]=\"{'wac-tabs--underline': underline, 'wac-tabs--button' : button, 'wac-tabs--right' : right}\"\n wzAutoHide\n (clickOutside)=\"listIsOpen = false\"\n [triggerElement]=\"'wac-select__header__selection'\"\n> \n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__mobile\" (click)=\"openList($event)\">\n    <div>{{ selected?.label }}</div><i [class]=\"'fa-solid fa-caret-' + (listIsOpen ? 'up' : 'down')\"></i>\n  </div>\n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__wrapper\" [ngClass]=\"{ 'open' : listIsOpen }\" [ngStyle]=\"{'margin-bottom': marginBottom}\">\n    <a\n      *ngFor=\"let tab of tabList; let i = index\"\n      class=\"wac-tabs__wrapper__tab\"\n      [ngClass]=\"{'wac-tabs__wrapper__tab--selected': i === selectedIndex}\"\n      (click)=\"setIndex($event, i)\"\n    >\n    {{ tab.label }}\n    </a>\n  </div>\n</div>\n<ng-content></ng-content>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: SharedDirectives }, { kind: "directive", type: AutoHideDirective, selector: "[wzAutoHide]", inputs: ["triggerElement", "forceOn"], outputs: ["clickOutside"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: TabsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'wac-tabs', encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule, FormsModule, TabComponent, SharedDirectives], providers: [
                         { provide: NG_VALUE_ACCESSOR, useExisting: TabsComponent, multi: true },
-                    ], template: "<div class=\"wac-tabs\"\n [ngClass]=\"{'wac-tabs--underline': underline, 'wac-tabs--button' : button, 'wac-tabs--right' : right}\"\n wzAutoHide\n (clickOutside)=\"listIsOpen = false\"\n [triggerElement]=\"'wac-select__header__selection'\"\n>\n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__mobile\" (click)=\"openList($event)\">\n    <div>{{ selected?.label }}</div><i [class]=\"'fa-solid fa-caret-' + (listIsOpen ? 'up' : 'down')\"></i>\n  </div>\n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__wrapper\" [ngClass]=\"{ 'open' : listIsOpen }\" [ngStyle]=\"{'margin-bottom': marginBottom}\">\n    <a\n      *ngFor=\"let tab of tabList; let i = index\"\n      class=\"wac-tabs__wrapper__tab\"\n      [ngClass]=\"{'wac-tabs__wrapper__tab--selected': i === selectedIndex}\"\n      (click)=\"setIndex($event, i)\"\n    >\n    {{ tab.label }}\n    </a>\n  </div>\n</div>\n<ng-content></ng-content>" }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"wac-tabs\"\n [ngClass]=\"{'wac-tabs--underline': underline, 'wac-tabs--button' : button, 'wac-tabs--right' : right}\"\n wzAutoHide\n (clickOutside)=\"listIsOpen = false\"\n [triggerElement]=\"'wac-select__header__selection'\"\n> \n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__mobile\" (click)=\"openList($event)\">\n    <div>{{ selected?.label }}</div><i [class]=\"'fa-solid fa-caret-' + (listIsOpen ? 'up' : 'down')\"></i>\n  </div>\n  <div *ngIf=\"tabList.length > 1\" class=\"wac-tabs__wrapper\" [ngClass]=\"{ 'open' : listIsOpen }\" [ngStyle]=\"{'margin-bottom': marginBottom}\">\n    <a\n      *ngFor=\"let tab of tabList; let i = index\"\n      class=\"wac-tabs__wrapper__tab\"\n      [ngClass]=\"{'wac-tabs__wrapper__tab--selected': i === selectedIndex}\"\n      (click)=\"setIndex($event, i)\"\n    >\n    {{ tab.label }}\n    </a>\n  </div>\n</div>\n<ng-content></ng-content>" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { underline: [{
                 type: Input
             }], button: [{
@@ -3113,10 +3118,10 @@ class HeaderPageComponent {
     }
 }
 HeaderPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: HeaderPageComponent, deps: [{ token: HistoryService }, { token: i1.Location }], target: i0.ɵɵFactoryTarget.Component });
-HeaderPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: HeaderPageComponent, selector: "wac-header-page", inputs: { title: "title", linkBack: "linkBack", withImg: "withImg", center: "center", useHistory: "useHistory" }, ngImport: i0, template: "<div class=\"wac-header-page\">\n  <div class=\"wac-header-page__maxWidth\">\n    <div class=\"wac-header-page__maxWidth__top\" [ngClass]=\"{'center':center}\">\n      <div class=\"wac-header-page__maxWidth__top__left\" [ngClass]=\"{'fullsize':center}\">\n        <!-- TODO Hard to use when only want a button and not a router link -->\n        <div class=\"wac-header-page__maxWidth__top__left__nowrap\">\n          <a *ngIf=\"linkBack\" (click)=\"back()\"><i class=\"fas fa-chevron-left\"></i></a>\n          <wac-h1 [center]=\"center\" [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\n        </div>\n        <p class=\"subtitle\"><ng-content select=\"[role=subtitle]\"></ng-content></p>\n      </div>\n      <div class=\"wac-header-page__maxWidth__top__right\" *ngIf=\"!center\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: H1Component, selector: "wac-h1", inputs: ["annotation", "withImg", "center", "color"] }] });
+HeaderPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: HeaderPageComponent, selector: "wac-header-page", inputs: { title: "title", linkBack: "linkBack", withImg: "withImg", center: "center", useHistory: "useHistory" }, ngImport: i0, template: "<div class=\"wac-header-page\">\n  <div class=\"wac-header-page__maxWidth\">\n    <div class=\"wac-header-page__maxWidth__top\" [ngClass]=\"{'center':center}\">\n      <div class=\"wac-header-page__maxWidth__top__left\" [ngClass]=\"{'fullsize':center}\">\n        <div class=\"wac-header-page__maxWidth__top__left__nowrap\">\n          <a *ngIf=\"linkBack\" (click)=\"back()\"><i class=\"fas fa-chevron-left\"></i></a>\n          <wac-h1 [center]=\"center\" [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\n        </div>\n        <p class=\"subtitle\"><ng-content select=\"[role=subtitle]\"></ng-content></p>\n      </div>\n      <div class=\"wac-header-page__maxWidth__top__right\" *ngIf=\"!center\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: H1Component, selector: "wac-h1", inputs: ["annotation", "withImg", "center", "color"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: HeaderPageComponent, decorators: [{
             type: 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\" [ngClass]=\"{'center':center}\">\n      <div class=\"wac-header-page__maxWidth__top__left\" [ngClass]=\"{'fullsize':center}\">\n        <!-- TODO Hard to use when only want a button and not a router link -->\n        <div class=\"wac-header-page__maxWidth__top__left__nowrap\">\n          <a *ngIf=\"linkBack\" (click)=\"back()\"><i class=\"fas fa-chevron-left\"></i></a>\n          <wac-h1 [center]=\"center\" [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\n        </div>\n        <p class=\"subtitle\"><ng-content select=\"[role=subtitle]\"></ng-content></p>\n      </div>\n      <div class=\"wac-header-page__maxWidth__top__right\" *ngIf=\"!center\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+            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\" [ngClass]=\"{'center':center}\">\n      <div class=\"wac-header-page__maxWidth__top__left\" [ngClass]=\"{'fullsize':center}\">\n        <div class=\"wac-header-page__maxWidth__top__left__nowrap\">\n          <a *ngIf=\"linkBack\" (click)=\"back()\"><i class=\"fas fa-chevron-left\"></i></a>\n          <wac-h1 [center]=\"center\" [withImg]=\"withImg\">{{ title }}<ng-content select=\"[role=header]\"></ng-content></wac-h1>\n        </div>\n        <p class=\"subtitle\"><ng-content select=\"[role=subtitle]\"></ng-content></p>\n      </div>\n      <div class=\"wac-header-page__maxWidth__top__right\" *ngIf=\"!center\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: HistoryService }, { type: i1.Location }]; }, propDecorators: { title: [{
                 type: Input
             }], linkBack: [{
@@ -6007,6 +6012,7 @@ class RowComponent {
         this.childrenByLine = 0;
         this.padding = '';
         this.lastChildIsDown = false;
+        this.addClass = '';
         this.halfMarginChild = '';
         this.nbChildsClass = '';
     }
@@ -6073,10 +6079,10 @@ class RowComponent {
     }
 }
 RowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: RowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-RowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: RowComponent, selector: "wac-row", inputs: { position: "position", width: "width", height: "height", responsiveAuto: "responsiveAuto", childrensWidthAuto: "childrensWidthAuto", visibility: "visibility", marginChild: "marginChild", marginBottom: "marginBottom", marginBottomChild: "marginBottomChild", addWacBlock: "addWacBlock", lineDisplayContent: "lineDisplayContent", border: "border", multipleLine: "multipleLine", childrenByLine: "childrenByLine", padding: "padding", lastChildIsDown: "lastChildIsDown" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div [ngStyle]=\"{'padding': padding,'margin-bottom': marginBottom,'transform': (childs > 1 || multipleLine ? 'translateX(-' + halfMarginChild + ')' : 'wrong'), 'width': ((childs > 1 && !addWacBlock) || multipleLine ? 'calc(100% + ' + marginChild  + ')' : 'wrong')}\" class=\"wac-row {{ addWacBlock ? 'white-block' : '' }} {{ multipleLine ? 'multiple-line' : '' }} {{ lineDisplayContent ? 'direction-column' : '' }} {{ border ? 'with-border' : '' }} {{ lastChildIsDown ? 'last-child-down' : '' }} {{ childrensWidthAuto ? 'childrens-width-auto' : '' }} {{ position ? position : '' }} {{ visibility ? visibility : '' }} {{ responsiveClass ? responsiveClass : '' }} {{nbChildsClass}} {{classWidth}}\" #container [ngClass]=\"{\n  'multiple-child': childs > 3,\n  'five-or-more-child': childs > 4,\n  'alone': childs === 1\n}\" [id]=\"id\">\n  <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None });
+RowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: RowComponent, selector: "wac-row", inputs: { position: "position", width: "width", height: "height", responsiveAuto: "responsiveAuto", childrensWidthAuto: "childrensWidthAuto", visibility: "visibility", marginChild: "marginChild", marginBottom: "marginBottom", marginBottomChild: "marginBottomChild", addWacBlock: "addWacBlock", lineDisplayContent: "lineDisplayContent", border: "border", multipleLine: "multipleLine", childrenByLine: "childrenByLine", padding: "padding", lastChildIsDown: "lastChildIsDown", addClass: "addClass" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div [ngStyle]=\"{'padding': padding,'margin-bottom': marginBottom,'transform': (childs > 1 || multipleLine ? 'translateX(-' + halfMarginChild + ')' : 'wrong'), 'width': ((childs > 1 && !addWacBlock) || multipleLine ? 'calc(100% + ' + marginChild  + ')' : 'wrong')}\" class=\"wac-row {{ addWacBlock ? 'white-block' : '' }} {{ multipleLine ? 'multiple-line' : '' }} {{ lineDisplayContent ? 'direction-column' : '' }} {{ border ? 'with-border' : '' }} {{ lastChildIsDown ? 'last-child-down' : '' }} {{ childrensWidthAuto ? 'childrens-width-auto' : '' }} {{ position ? position : '' }} {{ visibility ? visibility : '' }} {{ responsiveClass ? responsiveClass : '' }} {{addClass}} {{nbChildsClass}} {{classWidth}}\" #container [ngClass]=\"{\n  'multiple-child': childs > 3,\n  'five-or-more-child': childs > 4,\n  'alone': childs === 1\n}\" [id]=\"id\">\n  <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: RowComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'wac-row', encapsulation: ViewEncapsulation.None, template: "<div [ngStyle]=\"{'padding': padding,'margin-bottom': marginBottom,'transform': (childs > 1 || multipleLine ? 'translateX(-' + halfMarginChild + ')' : 'wrong'), 'width': ((childs > 1 && !addWacBlock) || multipleLine ? 'calc(100% + ' + marginChild  + ')' : 'wrong')}\" class=\"wac-row {{ addWacBlock ? 'white-block' : '' }} {{ multipleLine ? 'multiple-line' : '' }} {{ lineDisplayContent ? 'direction-column' : '' }} {{ border ? 'with-border' : '' }} {{ lastChildIsDown ? 'last-child-down' : '' }} {{ childrensWidthAuto ? 'childrens-width-auto' : '' }} {{ position ? position : '' }} {{ visibility ? visibility : '' }} {{ responsiveClass ? responsiveClass : '' }} {{nbChildsClass}} {{classWidth}}\" #container [ngClass]=\"{\n  'multiple-child': childs > 3,\n  'five-or-more-child': childs > 4,\n  'alone': childs === 1\n}\" [id]=\"id\">\n  <ng-content></ng-content>\n</div>\n" }]
+            args: [{ selector: 'wac-row', encapsulation: ViewEncapsulation.None, template: "<div [ngStyle]=\"{'padding': padding,'margin-bottom': marginBottom,'transform': (childs > 1 || multipleLine ? 'translateX(-' + halfMarginChild + ')' : 'wrong'), 'width': ((childs > 1 && !addWacBlock) || multipleLine ? 'calc(100% + ' + marginChild  + ')' : 'wrong')}\" class=\"wac-row {{ addWacBlock ? 'white-block' : '' }} {{ multipleLine ? 'multiple-line' : '' }} {{ lineDisplayContent ? 'direction-column' : '' }} {{ border ? 'with-border' : '' }} {{ lastChildIsDown ? 'last-child-down' : '' }} {{ childrensWidthAuto ? 'childrens-width-auto' : '' }} {{ position ? position : '' }} {{ visibility ? visibility : '' }} {{ responsiveClass ? responsiveClass : '' }} {{addClass}} {{nbChildsClass}} {{classWidth}}\" #container [ngClass]=\"{\n  'multiple-child': childs > 3,\n  'five-or-more-child': childs > 4,\n  'alone': childs === 1\n}\" [id]=\"id\">\n  <ng-content></ng-content>\n</div>\n" }]
         }], propDecorators: { position: [{
                 type: Input
             }], width: [{
@@ -6109,6 +6115,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
                 type: Input
             }], lastChildIsDown: [{
                 type: Input
+            }], addClass: [{
+                type: Input
             }], container: [{
                 type: ViewChild,
                 args: [`container`]