@wizishop/angular-components 0.0.60 → 0.0.61

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

@@ -3607,6 +3607,67 @@
                 },] }
     ];
 
+    var SearchComponent = /** @class */ (function () {
+        function SearchComponent() {
+            this.alwaysOpen = false;
+            this.emptyResult = '';
+            this.search = '';
+            this.openSelect = false;
+            this.selectValue = new i0.EventEmitter();
+            this.selectValueByIndex = new i0.EventEmitter();
+        }
+        SearchComponent.prototype.ngOnInit = function () {
+            this.triggerOptions = this.options;
+        };
+        SearchComponent.prototype.customTB = function (item, index) {
+            return item.id + "-" + index;
+        };
+        SearchComponent.prototype.onClose = function () {
+            this.openSelect = false;
+        };
+        SearchComponent.prototype.setSearchValueToQuery = function (value) {
+            var _this = this;
+            this.search = value.target.value;
+            if (this.search.length > 0) {
+                this.openSelect = true;
+                this.triggerOptions = this.options.filter(function (element) { return element.label.toLowerCase().indexOf(_this.search.toLowerCase()) !== -1; });
+            }
+            else {
+                this.triggerOptions = this.options;
+            }
+        };
+        SearchComponent.prototype.closeSelect = function () {
+            // this.openSelect = false;
+        };
+        SearchComponent.prototype.onSelectItem = function (index) {
+            this.selectValueByIndex.emit(index);
+            this.selectValue.emit(this.options[index]);
+            this.search = '';
+            this.openSelect = false;
+        };
+        SearchComponent.prototype.resetAllVue = function () {
+            this.search = '';
+            this.closeSelect();
+        };
+        return SearchComponent;
+    }());
+    SearchComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'wac-search',
+                    template: "<div class=\"wac-search\" [ngClass]=\"{ open: openSelect || alwaysOpen }\" [zIndexToggle]=\"openSelect\" wzAutoHide (clickOutside)=\"closeSelect()\">\n  <div class=\"wac-search__wrapper\">\n    <button><i class=\"fal fa-search\"></i></button>\n    <input [value]=\"search\" type=\"text\" required [placeholder]=\"placeholder\" (focus)=\"openSelect = true;\" (keyup)=\"setSearchValueToQuery($event)\" />\n  </div>\n  <div class=\"wac-search__absolute\" *ngIf=\"triggerOptions\" [ngClass]=\"{'hidden': !openSelect}\">\n    <perfect-scrollbar [config]=\"{ suppressScrollX: true }\" *ngIf=\"triggerOptions.length > 0\">\n      <div (click)=\"onClose()\" class=\"wac-select__content__item\" *ngFor=\"let item of triggerOptions; trackBy: customTB; let index = index;\">\n        <div [ngClass]=\"{ selected: item.active }\" (click)=\"onSelectItem(index)\">\n          {{ item.label }}\n        </div>\n      </div>\n    </perfect-scrollbar>\n    <div class=\"wac-select__content__empty\" *ngIf=\"triggerOptions.length === 0\">\n      <span *ngIf=\"emptyResult\">{{emptyResult}}</span>\n    </div>\n  </div>\n</div>\n"
+                },] }
+    ];
+    SearchComponent.ctorParameters = function () { return []; };
+    SearchComponent.propDecorators = {
+        placeholder: [{ type: i0.Input }],
+        alwaysOpen: [{ type: i0.Input }],
+        label: [{ type: i0.Input }],
+        options: [{ type: i0.Input }],
+        emptyResult: [{ type: i0.Input }],
+        selectValue: [{ type: i0.Output }],
+        selectValueByIndex: [{ type: i0.Output }]
+    };
+
     var components = [
         TagComponent,
         TabComponent,
@@ -3646,7 +3707,8 @@
         WrapperComponent,
         FiltersComponent,
         WrapperBlocsComponent,
-        SnackbarComponent
+        SnackbarComponent,
+        SearchComponent
     ];
     var exportsFromModule = [
         PaginationComponent,
@@ -3759,6 +3821,7 @@
     exports.PopinComponent = PopinComponent;
     exports.ProgressBarComponent = ProgressBarComponent;
     exports.RadioComponent = RadioComponent;
+    exports.SearchComponent = SearchComponent;
     exports.SelectComponent = SelectComponent;
     exports.SelectInTextComponent = SelectInTextComponent;
     exports.SeparatorComponent = SeparatorComponent;