@wizishop/angular-components 14.3.33 → 14.4.2

package/fesm2020/wizishop-angular-components.mjs

@@ -547,7 +547,7 @@ class ValueChangeService {
         });
     }
     updateSelectPlaceholder() {
-        if (!this.value) {
+        if (!this.value && typeof this.value !== 'number') {
             this.selectedOptionContent = null;
             return;
         }
@@ -770,6 +770,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
                 args: ['keydown', ['$event']]
             }] } });
 
+class TwoDigitDecimalNumberDirective {
+    constructor(el) {
+        this.el = el;
+        this.regex = new RegExp(/^\d+[.,]?\d{0,2}$/g); // user can put . or , char.
+        // input also cannot start from , or .
+        this.specialKeys = ['Backspace', 'Tab', 'End', 'Home', '-', 'ArrowLeft', 'ArrowRight', 'Del', 'Delete'];
+    }
+    onKeyDown(event) {
+        if (this.specialKeys.includes(event.key)) {
+            return;
+        }
+        const current = this.el.nativeElement.value;
+        const position = this.el.nativeElement.selectionStart;
+        const next = [current.slice(0, position), event.key == 'Decimal' ? '.' : event.key, current.slice(position)].join('');
+        if (next && !String(next).match(this.regex)) {
+            event.preventDefault();
+        }
+    }
+}
+TwoDigitDecimalNumberDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: TwoDigitDecimalNumberDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+TwoDigitDecimalNumberDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.7", type: TwoDigitDecimalNumberDirective, selector: "[wacTwoDigitDecimalNumber]", host: { listeners: { "keydown": "onKeyDown($event)" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: TwoDigitDecimalNumberDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[wacTwoDigitDecimalNumber]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { onKeyDown: [{
+                type: HostListener,
+                args: ['keydown', ['$event']]
+            }] } });
+
 const directives$2 = [
     DebounceKeyupDirective,
     AbstractDebounceDirective,
@@ -779,7 +810,8 @@ const directives$2 = [
     KeypressEnterDirective,
     SelectOptionDirective,
     SelectDirective,
-    OnlyNumberDirective
+    OnlyNumberDirective,
+    TwoDigitDecimalNumberDirective
 ];
 class SharedDirectives {
 }
@@ -792,7 +824,8 @@ SharedDirectives.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         KeypressEnterDirective,
         SelectOptionDirective,
         SelectDirective,
-        OnlyNumberDirective], imports: [CommonModule, FormsModule], exports: [DebounceKeyupDirective,
+        OnlyNumberDirective,
+        TwoDigitDecimalNumberDirective], imports: [CommonModule, FormsModule], exports: [DebounceKeyupDirective,
         AbstractDebounceDirective,
         AutoHideDirective,
         ZindexToggleDirective,
@@ -800,7 +833,8 @@ SharedDirectives.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         KeypressEnterDirective,
         SelectOptionDirective,
         SelectDirective,
-        OnlyNumberDirective] });
+        OnlyNumberDirective,
+        TwoDigitDecimalNumberDirective] });
 SharedDirectives.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: SharedDirectives, imports: [CommonModule, FormsModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: SharedDirectives, decorators: [{
             type: NgModule,
@@ -3809,82 +3843,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
                 type: Output
             }] } });
 
-class FindOptionSelectedPipe {
-    transform(options, field) {
-        const isFieldArray = Array.isArray(field);
-        if (!options) {
-            return isFieldArray ? [] : '';
-        }
-        const optionSelected = options.find((item) => item.active);
-        if (!optionSelected) {
-            return isFieldArray ? [] : '';
-        }
-        if (isFieldArray) {
-            return field.reduce((acc, curr) => {
-                return acc[curr];
-            }, optionSelected);
-        }
-        return optionSelected[field];
+class LabelComponent {
+    constructor() { }
+    ngOnInit() {
     }
 }
-FindOptionSelectedPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: FindOptionSelectedPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-FindOptionSelectedPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.0.7", ngImport: i0, type: FindOptionSelectedPipe, name: "wacFindOptionSelectedField" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: FindOptionSelectedPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'wacFindOptionSelectedField'
-                }]
-        }] });
+LabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+LabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LabelComponent, selector: "wac-label", host: { classAttribute: "wac-label" }, ngImport: i0, template: "<ng-content></ng-content>" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LabelComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'wac-label', host: {
+                        'class': 'wac-label'
+                    }, template: "<ng-content></ng-content>" }]
+        }], ctorParameters: function () { return []; } });
 
 class InputWithSelectComponent {
-    constructor() {
-        this.showSelect = false;
-        this.inputValueChange = new EventEmitter();
-        this.selectValueChange = new EventEmitter();
-    }
-    onClickItem(index) {
-        this.unActiveAll();
-        const optionSelected = this.options[index];
-        optionSelected.active = true;
-        this.showSelect = false;
-        this.selectValueChange.emit(index);
-    }
-    onToggleSelect() {
-        this.showSelect = !this.showSelect;
-    }
-    onCloseSelect() {
-        this.showSelect = false;
-    }
-    onChangeInputValue(e) {
-        this.inputValueChange.emit(e.target.value);
-    }
-    unActiveAll() {
-        this.options.forEach((item) => {
-            item.active = false;
-        });
-    }
 }
 InputWithSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: InputWithSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-InputWithSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: InputWithSelectComponent, selector: "wac-input-with-select", inputs: { label: "label", text: "text", options: "options", placeholder: "placeholder", id: "id", value: "value" }, outputs: { inputValueChange: "inputValueChange", selectValueChange: "selectValueChange" }, ngImport: i0, template: "<div class=\"wac-input-with-select\" [zIndexToggle]=\"showSelect\">\n  <label class=\"wac-input-with-select__label\" [for]=\"id\" [innerHTML]=\"label\"></label>\n  <div class=\"wac-input-with-select__wrapper\">\n    <div class=\"wac-input-with-select__wrapper__left\" wzAutoHide (clickOutside)=\"onCloseSelect()\">\n      <input [id]=\"id\" type=\"text\" [placeholder]=\"placeholder\" [(ngModel)]=\"value\" (ngModelChange)=\"onChangeInputValue($event)\"/>\n      <div class=\"wac-input-with-select__wrapper__left__current\">\n        <span (click)=\"onToggleSelect()\">{{ options | wacFindOptionSelectedField: 'label' }}</span>\n      </div>\n      <div class=\"wac-input-with-select__wrapper__left__select\" *ngIf=\"showSelect\">\n        <div class=\"wac-input-with-select__wrapper__left__select__item\" *ngFor=\"let option of options; let index = index\">\n          <div (click)=\"onClickItem(index)\">{{ option.label }}</div>\n        </div>\n      </div>\n    </div>\n    <div class=\"wac-input-with-select__wrapper__right\">\n      <p [innerHTML]=\"text\"></p>\n    </div>\n  </div>\n</div>\n", dependencies: [{ 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: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoHideDirective, selector: "[wzAutoHide]", inputs: ["triggerElement", "forceOn"], outputs: ["clickOutside"] }, { kind: "directive", type: ZindexToggleDirective, selector: "[zIndexToggle]", inputs: ["zIndexToggle"], outputs: ["onEventChange"] }, { kind: "pipe", type: FindOptionSelectedPipe, name: "wacFindOptionSelectedField" }] });
+InputWithSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: InputWithSelectComponent, selector: "wac-input-with-select", queries: [{ propertyName: "label", first: true, predicate: LabelComponent, descendants: true }], ngImport: i0, template: "<p *ngIf=\"!!label\" class=\"wac-select-test__label\">\n  <ng-content select=\"wac-label, .wac-label\" ></ng-content>\n</p>\n\n<div class=\"wac-input-with-select\">\n  <div class=\"wac-input-with-select__wrapper\">\n    <div class=\"wac-input-with-select__wrapper__left\">\n      <ng-content select=\"input\"></ng-content>\n      <ng-content select=\"wac-select-test\"></ng-content>\n    </div>\n    <div class=\"wac-input-with-select__wrapper__right\">\n      <ng-content select=\"[text]\"></ng-content>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: InputWithSelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'wac-input-with-select', template: "<div class=\"wac-input-with-select\" [zIndexToggle]=\"showSelect\">\n  <label class=\"wac-input-with-select__label\" [for]=\"id\" [innerHTML]=\"label\"></label>\n  <div class=\"wac-input-with-select__wrapper\">\n    <div class=\"wac-input-with-select__wrapper__left\" wzAutoHide (clickOutside)=\"onCloseSelect()\">\n      <input [id]=\"id\" type=\"text\" [placeholder]=\"placeholder\" [(ngModel)]=\"value\" (ngModelChange)=\"onChangeInputValue($event)\"/>\n      <div class=\"wac-input-with-select__wrapper__left__current\">\n        <span (click)=\"onToggleSelect()\">{{ options | wacFindOptionSelectedField: 'label' }}</span>\n      </div>\n      <div class=\"wac-input-with-select__wrapper__left__select\" *ngIf=\"showSelect\">\n        <div class=\"wac-input-with-select__wrapper__left__select__item\" *ngFor=\"let option of options; let index = index\">\n          <div (click)=\"onClickItem(index)\">{{ option.label }}</div>\n        </div>\n      </div>\n    </div>\n    <div class=\"wac-input-with-select__wrapper__right\">\n      <p [innerHTML]=\"text\"></p>\n    </div>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { label: [{
-                type: Input
-            }], text: [{
-                type: Input
-            }], options: [{
-                type: Input
-            }], placeholder: [{
-                type: Input
-            }], id: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], inputValueChange: [{
-                type: Output
-            }], selectValueChange: [{
-                type: Output
+            args: [{ selector: 'wac-input-with-select', encapsulation: ViewEncapsulation.None, template: "<p *ngIf=\"!!label\" class=\"wac-select-test__label\">\n  <ng-content select=\"wac-label, .wac-label\" ></ng-content>\n</p>\n\n<div class=\"wac-input-with-select\">\n  <div class=\"wac-input-with-select__wrapper\">\n    <div class=\"wac-input-with-select__wrapper__left\">\n      <ng-content select=\"input\"></ng-content>\n      <ng-content select=\"wac-select-test\"></ng-content>\n    </div>\n    <div class=\"wac-input-with-select__wrapper__right\">\n      <ng-content select=\"[text]\"></ng-content>\n    </div>\n  </div>\n</div>\n" }]
+        }], propDecorators: { label: [{
+                type: ContentChild,
+                args: [LabelComponent]
             }] } });
 
 class PopinComponent {
@@ -4644,6 +4626,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
                 }]
         }] });
 
+class FindOptionSelectedPipe {
+    transform(options, field) {
+        const isFieldArray = Array.isArray(field);
+        if (!options) {
+            return isFieldArray ? [] : '';
+        }
+        const optionSelected = options.find((item) => item.active);
+        if (!optionSelected) {
+            return isFieldArray ? [] : '';
+        }
+        if (isFieldArray) {
+            return field.reduce((acc, curr) => {
+                return acc[curr];
+            }, optionSelected);
+        }
+        return optionSelected[field];
+    }
+}
+FindOptionSelectedPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: FindOptionSelectedPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+FindOptionSelectedPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.0.7", ngImport: i0, type: FindOptionSelectedPipe, name: "wacFindOptionSelectedField" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: FindOptionSelectedPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'wacFindOptionSelectedField'
+                }]
+        }] });
+
 const exportedPipes = [
     FormatObjectToRecursifTreePipe,
     FormatObjectToSimpleTreePipe,
@@ -4733,20 +4742,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
                 args: ['searchInput']
             }] } });
 
-class LabelComponent {
-    constructor() { }
-    ngOnInit() {
-    }
-}
-LabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LabelComponent, selector: "wac-label", host: { classAttribute: "wac-label" }, ngImport: i0, template: "<ng-content></ng-content>" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LabelComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'wac-label', host: {
-                        'class': 'wac-label'
-                    }, template: "<ng-content></ng-content>" }]
-        }], ctorParameters: function () { return []; } });
-
 class SelectTestComponent extends SelectDirective {
     constructor(valueChangeService) {
         super(valueChangeService);
@@ -6192,5 +6187,5 @@ class TableFiltersGroup extends NwbFilterGroup {
  * Generated bundle index. Do not edit.
  */
 
-export { ACCORDION_ITEM, AbstractDebounceDirective, AccordionComponent, AlertComponent, AlertPopupComponent, AlertPopupModule, AlertPopupService, AreAllOptionsSelectedPipe, AutoHideDirective, BackComponent, BlockComponent, BlockSeparatorComponent, BlockTitleLegacyComponent, BlockWithCheckboxComponent, BreadcrumbsComponent, ButtonComponent, CalendarComponent, CardPriceComponent, ChargingBarComponent, CheckBoxRow, CheckboxComponent, ConfirmDeleteComponent, ContentWithButtonsComponent, DebounceKeyupDirective, DeleteComponent, DraganddropListComponent, DropdownComponent, EXPANSION_PANEL_HEADER, ExpandedPanelComponent, ExpansionExport, ExpansionModule, ExpansionPanelBase, ExpansionPanelComponent, ExpansionPanelDirective, ExpansionPanelHeaderComponent, ExpansionPanelHeaderDirective, FilterOptionsPipe, FiltersComponent, FiltersTableService, FindOptionSelectedPipe, FormatObjectToRecursifTreePipe, FormatObjectToSimpleTreePipe, FreePopinComponent, GooglePreviewComponent, H1Component, H2Component, H3Component, H4Component, HeaderPageComponent, HtmlContainer, ImageComponent, InfoComponent, InputComponent, InputSearchComponent, InputWithSelectComponent, KeypressEnterDirective, LabelComponent, LinkComponent, LoaderComponent, LogoComponent, MosaicComponent, MultipleSearchComponent, MultipleSearchPlusComponent, OnlyNumberDirective, OptionCallToActionComponent, OptionComponent, OptionalDisableContainerComponent, PaginationComponent, PlaceholderComponent, PopinComponent, ProgressBarComponent, RadioComponent, SearchComponent, SelectComponent, SelectDirective, SelectFiltersPipe, SelectInTextComponent, SelectOptionDirective, SelectSearchTriggerComponent, SelectTestComponent, SelectedListComponent, SeparatorComponent, SettingsComponent, SharedComponentsModule, SharedDirectives, SharedPipes, SnackbarComponent, StateComponent, SummaryComponent, SwitchComponent, TabComponent, TableColumn, TableColumnHeader, TableComponent, TableFiltersGroup, TableRow, TagComponent, TagLabelComponent, TextAreaComponent, TextComponent, TokenCheckComponent, TooltipComponent, TreeComponent, TreeModule, UploadComponent, ValueChangeService, VarDirective, WiziComponentsModule, WrapperBlocsComponent, WrapperComponent, WrapperMultipleBlockComponent, WrapperSidebarComponent, WzEditInPlaceComponent, ZindexToggleDirective };
+export { ACCORDION_ITEM, AbstractDebounceDirective, AccordionComponent, AlertComponent, AlertPopupComponent, AlertPopupModule, AlertPopupService, AreAllOptionsSelectedPipe, AutoHideDirective, BackComponent, BlockComponent, BlockSeparatorComponent, BlockTitleLegacyComponent, BlockWithCheckboxComponent, BreadcrumbsComponent, ButtonComponent, CalendarComponent, CardPriceComponent, ChargingBarComponent, CheckBoxRow, CheckboxComponent, ConfirmDeleteComponent, ContentWithButtonsComponent, DebounceKeyupDirective, DeleteComponent, DraganddropListComponent, DropdownComponent, EXPANSION_PANEL_HEADER, ExpandedPanelComponent, ExpansionExport, ExpansionModule, ExpansionPanelBase, ExpansionPanelComponent, ExpansionPanelDirective, ExpansionPanelHeaderComponent, ExpansionPanelHeaderDirective, FilterOptionsPipe, FiltersComponent, FiltersTableService, FindOptionSelectedPipe, FormatObjectToRecursifTreePipe, FormatObjectToSimpleTreePipe, FreePopinComponent, GooglePreviewComponent, H1Component, H2Component, H3Component, H4Component, HeaderPageComponent, HtmlContainer, ImageComponent, InfoComponent, InputComponent, InputSearchComponent, InputWithSelectComponent, KeypressEnterDirective, LabelComponent, LinkComponent, LoaderComponent, LogoComponent, MosaicComponent, MultipleSearchComponent, MultipleSearchPlusComponent, OnlyNumberDirective, OptionCallToActionComponent, OptionComponent, OptionalDisableContainerComponent, PaginationComponent, PlaceholderComponent, PopinComponent, ProgressBarComponent, RadioComponent, SearchComponent, SelectComponent, SelectDirective, SelectFiltersPipe, SelectInTextComponent, SelectOptionDirective, SelectSearchTriggerComponent, SelectTestComponent, SelectedListComponent, SeparatorComponent, SettingsComponent, SharedComponentsModule, SharedDirectives, SharedPipes, SnackbarComponent, StateComponent, SummaryComponent, SwitchComponent, TabComponent, TableColumn, TableColumnHeader, TableComponent, TableFiltersGroup, TableRow, TagComponent, TagLabelComponent, TextAreaComponent, TextComponent, TokenCheckComponent, TooltipComponent, TreeComponent, TreeModule, TwoDigitDecimalNumberDirective, UploadComponent, ValueChangeService, VarDirective, WiziComponentsModule, WrapperBlocsComponent, WrapperComponent, WrapperMultipleBlockComponent, WrapperSidebarComponent, WzEditInPlaceComponent, ZindexToggleDirective };
 //# sourceMappingURL=wizishop-angular-components.mjs.map