@wizishop/angular-components 0.0.75 → 0.0.78

package/fesm2015/wizishop-angular-components.js

@@ -2474,21 +2474,13 @@ class SelectComponent {
         this.clickOnCallToAction = new EventEmitter();
         this.openCategories = false;
         this.searchValue = '';
-        this.currentLabel = '';
-        this.currentLabelIcon = '';
+        this.indexItemSelected = -1;
+        // ControlValueAccessor methods
+        this.onChange = () => { };
+        this.onTouch = () => { };
     }
     ngOnInit() {
-        this.currentLabel = this.placeholder;
-        this.emptyResult = this.translateService.instant('datatable.noresult ');
-        this.setInitialValues();
-    }
-    setInitialValues() {
-        if (!this.items.length) {
-            return;
-        }
-        this.triggerValueSelect = this.items;
-        const itemSelected = this.getItemSelected();
-        this.setCurrentItem(itemSelected);
+        this.indexItemSelected = this.items.findIndex(item => item.selected);
     }
     onClose() {
         this.openCategories = false;
@@ -2496,25 +2488,20 @@ class SelectComponent {
     customTB(item, index) {
         return `${item.id}-${index}`;
     }
-    onSelectItem(index) {
+    onSelectItem(id) {
         this.unselectAll();
-        const itemSelected = this.items[index];
-        this.setCurrentItem(itemSelected);
-        this.selectValue.emit(index);
+        this.setIndexItemSelected(id);
+        const itemSelected = this.getItemSelected();
+        itemSelected.selected = true;
+        this.selectValue.emit(this.indexItemSelected);
+        this.onChange(itemSelected);
     }
     onClickCallToAction() {
         this.onClose();
         this.clickOnCallToAction.emit(this.callToAction.value);
     }
     getItemSelected() {
-        let itemSelected = null;
-        this.items.forEach(item => {
-            if (!item.selected) {
-                return;
-            }
-            itemSelected = item;
-        });
-        return itemSelected;
+        return this.items[this.indexItemSelected];
     }
     showCategories() {
         this.openCategories = true;
@@ -2522,26 +2509,32 @@ class SelectComponent {
             this.searchElement.nativeElement.focus();
         }, 0);
     }
-    setCurrentItem(itemSelected) {
-        if (!itemSelected) {
+    unselectAll() {
+        this.items.forEach(item => item.selected = false);
+    }
+    setIndexItemSelected(id) {
+        this.indexItemSelected = this.items.findIndex(item => item.id === id);
+    }
+    writeValue(selectItem) {
+        if (!selectItem) {
             return;
         }
-        itemSelected.selected = true;
-        this.currentLabel = itemSelected.name;
-        this.currentLabelIcon = itemSelected.icon;
+        this.unselectAll();
+        selectItem.selected = true;
+        this.setIndexItemSelected(selectItem.id);
     }
-    searchInSelect() {
-        console.log(this.searchValue);
-        this.triggerValueSelect = this.items.filter(item => item.name.indexOf(this.searchValue) >= 0);
+    registerOnChange(fn) {
+        this.onChange = fn;
     }
-    unselectAll() {
-        this.items.forEach(item => item.selected = false);
+    registerOnTouched(fn) {
+        this.onTouch = fn;
     }
 }
 SelectComponent.decorators = [
     { type: Component, args: [{
                 selector: 'wac-select',
-                template: "<p *ngIf=\"label\" [innerHTML]=\"label\" class=\"wac-select__label\"></p>\n<div class=\"wac-select\" wzAutoHide (clickOutside)=\"onClose()\" [ngStyle]=\"{ 'max-width': maxWidth }\" [zIndexToggle]=\"openCategories\">\n  <div class=\"wac-select__current\" [ngClass]=\"{ 'select-disabled' : disabled }\" (click)=\"!disabled && openCategories = !openCategories\" *ngIf=\"!search\">\n    <span *ngIf=\"currentLabelIcon\" class=\"icon\" [innerHTML]=\"currentLabelIcon\"></span><span [innerHTML]=\"currentLabel\"></span><span><i class=\"fas fa-chevron-down\"></i></span>\n  </div>\n  <div class=\"wac-select__current wac-select__current--withSearch\" [ngClass]=\"{ 'select-disabled' : disabled, 'open-search': openCategories }\" *ngIf=\"search\">\n    <div class=\"wac-select__current__search\" *ngIf=\"openCategories && !disabled\">\n      <i class=\"far fa-search\"></i>\n      <input #search type=\"text\" [(ngModel)]=\"searchValue\" (keyup)=\"searchInSelect()\" />\n    </div>\n    <span (click)=\"openCategories = !openCategories;\" *ngIf=\"currentLabelIcon && !openCategories\" class=\"icon\" [innerHTML]=\"currentLabelIcon\"></span>\n    <span (click)=\"showCategories()\" [innerHTML]=\"currentLabel\"></span>\n    <span (click)=\"openCategories = !openCategories;\"><i class=\"fas fa-chevron-down\"></i></span>\n  </div>\n  <div class=\"wac-select__content\" *ngIf=\"!disabled\" [ngClass]=\"{ hidden: !openCategories, open: type === 'open' }\" [ngStyle]=\"{ 'max-width': maxWidthItems }\">\n    <perfect-scrollbar [config]=\"{ suppressScrollX: true }\" *ngIf=\"triggerValueSelect.length > 0\">\n      <div *ngIf=\"callToAction\" class=\"wac-select__content__cta\">\n        <div (click)=\"onClickCallToAction()\">\n          <i *ngIf=\"callToAction.icon\" [classList]=\"callToAction.icon\"></i><strong *ngIf=\"callToAction.boldText\">{{ callToAction.boldText }}</strong\n          ><span>{{ callToAction?.name }}</span>\n        </div>\n      </div>\n      <div (click)=\"onClose()\" class=\"wac-select__content__item\" *ngFor=\"let item of triggerValueSelect; trackBy: customTB; let index = index;\">\n        <div [ngClass]=\"{ selected: item.selected }\" (click)=\"onSelectItem(index)\">\n          <span class=\"icon\" [innerHTML]=\"item.icon\" *ngIf=\"item.icon\"></span>{{ item.name }}\n        </div>\n      </div>\n    </perfect-scrollbar>\n    <div class=\"wac-select__content__empty\" *ngIf=\"triggerValueSelect.length === 0\">\n      <span *ngIf=\"emptyResult\">{{emptyResult}}</span>\n    </div>\n  </div>\n</div>\n"
+                template: "<p *ngIf=\"label\" [innerHTML]=\"label\" class=\"wac-select__label\"></p>\n\n<div class=\"wac-select\" wzAutoHide (clickOutside)=\"onClose()\" [ngStyle]=\"{ 'max-width': maxWidth }\" [zIndexToggle]=\"openCategories\">\n\n  <div class=\"wac-select__current\" [ngClass]=\"{ 'select-disabled' : disabled }\" (click)=\"!disabled && openCategories = !openCategories\" *ngIf=\"!search\">\n    <span *ngIf=\"indexItemSelected !== -1\" class=\"icon\" [innerHTML]=\"items[indexItemSelected].icon\"></span>\n    <span [innerHTML]=\"indexItemSelected !== -1 ? items[indexItemSelected].name : placeholder\"></span><span><i class=\"fas fa-chevron-down\"></i></span>\n  </div>\n\n  <div class=\"wac-select__current wac-select__current--withSearch\" [ngClass]=\"{ 'select-disabled' : disabled, 'open-search': openCategories }\" *ngIf=\"search\">\n    <div class=\"wac-select__current__search\" *ngIf=\"openCategories && !disabled\">\n      <i class=\"far fa-search\"></i>\n      <input #search type=\"text\" [(ngModel)]=\"searchValue\" />\n    </div>\n    <span (click)=\"openCategories = !openCategories;\" *ngIf=\"items[indexItemSelected]?.icon && !openCategories\" class=\"icon\" [innerHTML]=\"items[indexItemSelected].icon\"></span>\n    <span (click)=\"showCategories()\" [innerHTML]=\"items[indexItemSelected]?.name ? items[indexItemSelected].name : placeholder\"></span>\n    <span (click)=\"openCategories = !openCategories;\"><i class=\"fas fa-chevron-down\"></i></span>\n  </div>\n\n  <div class=\"wac-select__content\" *ngIf=\"!disabled\" [ngClass]=\"{ hidden: !openCategories, open: type === 'open' }\" [ngStyle]=\"{ 'max-width': maxWidthItems }\">\n    <perfect-scrollbar [config]=\"{ suppressScrollX: true }\" *ngIf=\"items.length\">\n\n      <div *ngIf=\"callToAction\" class=\"wac-select__content__cta\">\n        <div (click)=\"onClickCallToAction()\">\n          <i *ngIf=\"callToAction.icon\" [classList]=\"callToAction.icon\"></i><strong *ngIf=\"callToAction.boldText\">{{ callToAction.boldText }}</strong\n          ><span>{{ callToAction?.name }}</span>\n        </div>\n      </div>\n\n      <div\n        *ngFor=\"let item of items | selectFilters: searchValue; let index = index;\"\n        (click)=\"onClose()\"\n        class=\"wac-select__content__item\"\n        >\n          <div [ngClass]=\"{ selected: item.selected }\" (click)=\"onSelectItem(item.id)\">\n            <span class=\"icon\" [innerHTML]=\"item.icon\" *ngIf=\"item.icon\"></span>{{ item.name }}\n          </div>\n      </div>\n\n    </perfect-scrollbar>\n\n    <div *ngIf=\"!(items | selectFilters: searchValue)?.length\" class=\"wac-select__content__empty\">\n      <span>{{'wac.datatable.noresult' | translate}}</span>\n    </div>\n\n  </div>\n</div>",
+                providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: SelectComponent, multi: true }]
             },] }
 ];
 SelectComponent.ctorParameters = () => [
@@ -3325,16 +3318,14 @@ class FormatObjectToRecursifTreePipe {
         this.childrenProperties = childrenProperties;
         const treeDepth = 0;
         objectList.forEach(object => this.recursiveFormatObjectToRecursifTree(object, treeDepth));
-        console.log('objectList');
-        console.log(objectList);
         return objectList;
     }
     recursiveFormatObjectToRecursifTree(object, treeDepth) {
         for (const childrenProperty of this.childrenProperties) {
-            object.hasTreeChrildren = true;
+            object.hasTreeChildren = true;
             if (!object.hasOwnProperty(childrenProperty)) {
                 // No more chrildren
-                object.hasTreeChrildren = false;
+                object.hasTreeChildren = false;
                 continue;
             }
             if (!Array.isArray(object[childrenProperty])) {
@@ -3376,10 +3367,10 @@ class FormatObjectToSimpleTreePipe {
                 object.treeLabel = object[property];
                 continue;
             }
-            object.hasTreeChrildren = true;
+            object.hasTreeChildren = true;
             if (!this.childrenProperties.includes(property)) {
                 // No more chrildren
-                object.hasTreeChrildren = false;
+                object.hasTreeChildren = false;
                 continue;
             }
             if (!Array.isArray(object[property])) {
@@ -3399,14 +3390,31 @@ FormatObjectToSimpleTreePipe.decorators = [
             },] }
 ];
 
+class SelectFiltersPipe {
+    transform(items, filterName) {
+        return items.filter(item => {
+            const regexp = new RegExp(filterName, 'i');
+            return regexp.test(item.name);
+        });
+    }
+}
+SelectFiltersPipe.decorators = [
+    { type: Pipe, args: [{
+                name: 'selectFilters'
+            },] }
+];
+
 const exportedPipes = [FormatObjectToRecursifTreePipe, FormatObjectToSimpleTreePipe];
+const pipes$1 = [
+    SelectFiltersPipe
+];
 class SharedPipes {
 }
 SharedPipes.decorators = [
     { type: NgModule, args: [{
                 imports: [CommonModule, FormsModule],
-                declarations: exportedPipes,
-                exports: exportedPipes
+                declarations: [...exportedPipes, ...pipes$1],
+                exports: [...exportedPipes, ...pipes$1]
             },] }
 ];
 
@@ -3494,6 +3502,7 @@ SharedComponentsModule.decorators = [
                     TranslateModule.forChild(),
                     ReactiveFormsModule,
                     SharedDirectives,
+                    SharedPipes,
                     CdkTableModule,
                     TagInputModule,
                     PaginationModule,
@@ -3537,5 +3546,5 @@ WiziComponentsModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractDebounceDirective, AlertComponent, AlertPopupComponent, AlertPopupModule, AlertPopupService, AutoHideDirective, BackComponent, BlockComponent, ButtonComponent, CalendarComponent, CheckBoxRow, CheckboxComponent, DebounceKeyupDirective, DeleteComponent, DropdownComponent, FiltersComponent, FiltersTableService, FormatObjectToRecursifTreePipe, FormatObjectToSimpleTreePipe, FreePopinComponent, H1Component, H2Component, H3Component, H4Component, HeaderPageComponent, HtmlContainer, ImageComponent, InfoComponent, InputComponent, InputSearchComponent, InputWithSelectComponent, LabelComponent, LinkComponent, LoaderComponent, LogoComponent, MultipleSearchComponent, MultipleSearchPlusComponent, PaginationComponent, PopinComponent, ProgressBarComponent, RadioComponent, SearchComponent, SelectComponent, SelectInTextComponent, SelectedListComponent, SeparatorComponent, SettingsComponent, SharedComponentsModule, SharedDirectives, SharedPipes, SnackbarComponent, StateComponent, SwitchComponent, TabComponent, TableColumn, TableColumnHeader, TableComponent, TableRow, TagComponent, TextAreaComponent, TextComponent, TooltipComponent, TreeComponent, TreeModule, UploadComponent, WiziComponentsModule, WrapperBlocsComponent, WrapperComponent, WzEditInPlaceComponent, ZindexToggleDirective, DomService as ɵa, PaginationModule as ɵb, PagniationArrayTotalPages as ɵc, PagniationIsLastPage as ɵd, PagniationText as ɵe, TableModule as ɵf, InputSearchModule as ɵg, InputModule as ɵh, TooltipModule as ɵi, ProgressBarModule as ɵj, LoaderModule as ɵk, CheckboxModule as ɵl, inOutY as ɵm, inOutX as ɵn };
+export { AbstractDebounceDirective, AlertComponent, AlertPopupComponent, AlertPopupModule, AlertPopupService, AutoHideDirective, BackComponent, BlockComponent, ButtonComponent, CalendarComponent, CheckBoxRow, CheckboxComponent, DebounceKeyupDirective, DeleteComponent, DropdownComponent, FiltersComponent, FiltersTableService, FormatObjectToRecursifTreePipe, FormatObjectToSimpleTreePipe, FreePopinComponent, H1Component, H2Component, H3Component, H4Component, HeaderPageComponent, HtmlContainer, ImageComponent, InfoComponent, InputComponent, InputSearchComponent, InputWithSelectComponent, LabelComponent, LinkComponent, LoaderComponent, LogoComponent, MultipleSearchComponent, MultipleSearchPlusComponent, PaginationComponent, PopinComponent, ProgressBarComponent, RadioComponent, SearchComponent, SelectComponent, SelectFiltersPipe, SelectInTextComponent, SelectedListComponent, SeparatorComponent, SettingsComponent, SharedComponentsModule, SharedDirectives, SharedPipes, SnackbarComponent, StateComponent, SwitchComponent, TabComponent, TableColumn, TableColumnHeader, TableComponent, TableRow, TagComponent, TextAreaComponent, TextComponent, TooltipComponent, TreeComponent, TreeModule, UploadComponent, WiziComponentsModule, WrapperBlocsComponent, WrapperComponent, WzEditInPlaceComponent, ZindexToggleDirective, DomService as ɵa, PaginationModule as ɵb, PagniationArrayTotalPages as ɵc, PagniationIsLastPage as ɵd, PagniationText as ɵe, TableModule as ɵf, InputSearchModule as ɵg, InputModule as ɵh, TooltipModule as ɵi, ProgressBarModule as ɵj, LoaderModule as ɵk, CheckboxModule as ɵl, inOutY as ɵm, inOutX as ɵn };
 //# sourceMappingURL=wizishop-angular-components.js.map