all files / auto-complete/ auto-complete.js

95.67% Statements 221/231
86.87% Branches 172/198
95% Functions 38/40
95.56% Lines 215/225
18 statements, 7 functions, 29 branches Ignored     
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366              93× 93× 93× 93×   98×   14×   200×   131× 131× 131× 131×   125× 88× 88× 13×     75× 75×     125× 121×         121×   125×   106× 106× 106× 106× 44×   106× 106× 15× 15× 15× 15×   91× 91× 91×               91× 91× 81× 81×         89× 89× 80×       89×   26× 22×   26×     129× 129× 129× 129× 115×   129×   129× 11× 11× 11× 11× 11×       97× 51× 51×   46×   13× 13× 13× 13× 13× 13×         33×     134× 134× 134× 132× 86440× 19×           19×                 134×   627×   108× 108×   32×   98×   15×   46× 46× 46×             44×     18×   17×   16× 16× 16×         142× 142×   74× 74×   74× 77× 77×                 74× 74× 74×                             24472×   98×                                                                            
/* istanbul ignore next */ 
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
/* istanbul ignore next */ 
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "../drop-down-list/drop-down-list", "../combo-box/combo-box", "../common/highlight-search", "../common/incremental-search", "../drop-down-base/drop-down-base", "@syncfusion/ej2-inputs", "@syncfusion/ej2-data"], function (require, exports, ej2_base_1, ej2_base_2, ej2_base_3, drop_down_list_1, combo_box_1, highlight_search_1, incremental_search_1, drop_down_base_1, ej2_inputs_1, ej2_data_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    drop_down_list_1.dropDownListClasses.root = 'e-autocomplete';
    drop_down_list_1.dropDownListClasses.icon = 'e-input-group-icon e-ddl-icon e-search-icon';
    var AutoComplete = (function (_super) {
        __extends(AutoComplete, _super);
        function AutoComplete(options, element) {
            var _this_1 = _super.call(this, options, element) || this;
            _this_1.isFiltered = false;
            _this_1.searchList = false;
            return _this_1;
        }
        AutoComplete.prototype.preRender = function () {
            _super.prototype.preRender.call(this);
        };
        AutoComplete.prototype.getLocaleName = function () {
            return 'auto-complete';
        };
        AutoComplete.prototype.getNgDirective = function () {
            return 'EJS-AUTOCOMPLETE';
        };
        AutoComplete.prototype.getQuery = function (query) {
            var filterQuery = query ? query.clone() : this.query ? this.query.clone() : new ej2_data_1.Query();
            var filterType = (this.queryString === '' && !ej2_base_1.isNullOrUndefined(this.value)) ? 'equal' : this.filterType;
            var queryString = (this.queryString === '' && !ej2_base_1.isNullOrUndefined(this.value)) ? this.value : this.queryString;
            if (this.isFiltered) {
                return filterQuery;
            }
            if (this.queryString !== null && this.queryString !== '') {
                var dataType = this.typeOfData(this.dataSource).typeof;
                if (!(this.dataSource instanceof ej2_data_1.DataManager) && dataType === 'string' || dataType === 'number') {
                    filterQuery.where('', filterType, queryString, this.ignoreCase, this.ignoreAccent);
                }
                else {
                    var mapping = !ej2_base_1.isNullOrUndefined(this.fields.value) ? this.fields.value : '';
                    filterQuery.where(mapping, filterType, queryString, this.ignoreCase, this.ignoreAccent);
                }
            }
            if (!ej2_base_1.isNullOrUndefined(this.suggestionCount)) {
                if (this.suggestionCount !== 20) {
                    for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
                        Iif (filterQuery.queries[queryElements].fn === 'onTake') {
                            filterQuery.queries.splice(queryElements, 1);
                        }
                    }
                }
                filterQuery.take(this.suggestionCount);
            }
            return filterQuery;
        };
        AutoComplete.prototype.searchLists = function (e) {
            var _this_1 = this;
            this.isTyped = true;
            this.isDataFetched = this.isSelectCustom = false;
            if (ej2_base_1.isNullOrUndefined(this.list)) {
                _super.prototype.renderList.call(this, e, true);
            }
            this.queryString = this.filterInput.value;
            if (e.type !== 'mousedown' && (e.keyCode === 40 || e.keyCode === 38)) {
                this.queryString = this.queryString === '' ? null : this.queryString;
                this.beforePopupOpen = true;
                this.resetList(this.dataSource, this.fields, null, e);
                return;
            }
            this.isSelected = false;
            this.activeIndex = null;
            var eventArgs = {
                preventDefaultAction: false,
                text: this.filterInput.value,
                updateData: function (dataSource, query, fields) {
                    if (eventArgs.cancel) {
                        return;
                    }
                    _this_1.isFiltered = true;
                    _this_1.filterAction(dataSource, query, fields);
                },
                cancel: false
            };
            this.trigger('filtering', eventArgs, function (eventArgs) {
                if (!eventArgs.cancel && !_this_1.isFiltered && !eventArgs.preventDefaultAction) {
                    _this_1.searchList = true;
                    _this_1.filterAction(_this_1.dataSource, null, _this_1.fields, e);
                }
            });
        };
        AutoComplete.prototype.filter = function (dataSource, query, fields) {
            this.isFiltered = true;
            this.filterAction(dataSource, query, fields);
        };
        AutoComplete.prototype.filterAction = function (dataSource, query, fields, e) {
            this.beforePopupOpen = true;
            if (this.queryString !== '' && (this.queryString.length >= this.minLength)) {
                this.resetList(dataSource, fields, query, e);
            }
            else {
                this.hidePopup(e);
                this.beforePopupOpen = false;
            }
            this.renderReactTemplates();
        };
        AutoComplete.prototype.clearAll = function (e, property) {
            if (ej2_base_1.isNullOrUndefined(property) || (!ej2_base_1.isNullOrUndefined(property) && ej2_base_1.isNullOrUndefined(property.dataSource))) {
                _super.prototype.clearAll.call(this, e);
            }
            if (this.beforePopupOpen) {
                this.hidePopup();
            }
        };
        AutoComplete.prototype.onActionComplete = function (ulElement, list, e, isUpdated) {
            this.fixedHeaderElement = null;
            _super.prototype.onActionComplete.call(this, ulElement, list, e);
            var item = this.list.querySelector('.' + drop_down_list_1.dropDownListClasses.li);
            if (!ej2_base_1.isNullOrUndefined(item)) {
                ej2_base_3.removeClass([item], drop_down_list_1.dropDownListClasses.focus);
            }
            this.postBackAction();
        };
        AutoComplete.prototype.postBackAction = function () {
            if (this.autofill && !ej2_base_1.isNullOrUndefined(this.liCollections[0]) && this.searchList) {
                var items = [this.liCollections[0]];
                var searchItem = incremental_search_1.Search(this.inputElement.value, items, 'StartsWith', this.ignoreCase);
                this.searchList = false;
                Eif (!ej2_base_1.isNullOrUndefined(searchItem.item)) {
                    _super.prototype.setAutoFill.call(this, this.liCollections[0], true);
                }
            }
        };
        AutoComplete.prototype.setSelection = function (li, e) {
            if (!this.isValidLI(li)) {
                this.selectedLI = li;
                return;
            }
            if (!ej2_base_1.isNullOrUndefined(e) && e.type === 'keydown' && e.action !== 'enter'
                && e.action !== 'tab' && this.isValidLI(li)) {
                var value = this.getFormattedValue(li.getAttribute('data-value'));
                this.activeIndex = this.getIndexByValue(value);
                this.setHoverList(li);
                this.selectedLI = li;
                this.setScrollPosition(e);
                if (this.autofill && this.isPopupOpen) {
                    this.preventAutoFill = false;
                    var isKeyNavigate = (e && e.action === 'down' || e.action === 'up' ||
                        e.action === 'home' || e.action === 'end' || e.action === 'pageUp' || e.action === 'pageDown');
                    _super.prototype.setAutoFill.call(this, li, isKeyNavigate);
                }
            }
            else {
                _super.prototype.setSelection.call(this, li, e);
            }
        };
        AutoComplete.prototype.listOption = function (dataSource, fieldsSettings) {
            var _this_1 = this;
            var fields = _super.prototype.listOption.call(this, dataSource, fieldsSettings);
            if (ej2_base_1.isNullOrUndefined(fields.itemCreated)) {
                fields.itemCreated = function (e) {
                    if (_this_1.highlight) {
                        Iif (_this_1.element.tagName === _this_1.getNgDirective() && _this_1.itemTemplate) {
                            setTimeout(function () {
                                highlight_search_1.highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);
                            }, 0);
                        }
                        else {
                            highlight_search_1.highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);
                        }
                    }
                };
            }
            else {
                var itemCreated_1 = fields.itemCreated;
                fields.itemCreated = function (e) {
                    if (_this_1.highlight) {
                        highlight_search_1.highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);
                    }
                    itemCreated_1.apply(_this_1, [e]);
                };
            }
            return fields;
        };
        AutoComplete.prototype.isFiltering = function () {
            return true;
        };
        AutoComplete.prototype.renderPopup = function (e) {
            this.list.scrollTop = 0;
            _super.prototype.renderPopup.call(this, e);
        };
        AutoComplete.prototype.isEditTextBox = function () {
            return true && this.inputElement.value.trim() !== '';
        };
        AutoComplete.prototype.isPopupButton = function () {
            return this.showPopupButton;
        };
        AutoComplete.prototype.isSelectFocusItem = function (element) {
            return false;
        };
        AutoComplete.prototype.setInputValue = function (newProp, oldProp) {
            var oldValue = oldProp && oldProp.text ? oldProp.text : oldProp ? oldProp.value : oldProp;
            var value = newProp && newProp.text ? newProp.text : newProp && newProp.value ? newProp.value : this.value;
            if (value && this.typedString === '' && !this.allowCustom && !(this.dataSource instanceof ej2_data_1.DataManager)) {
                var checkFields_1_1 = this.typeOfData(this.dataSource).typeof === 'string' ? '' : this.fields.value;
                var listLength_1 = this.getItems().length;
                var query = new ej2_data_1.Query();
                var _this_2 = this;
                new ej2_data_1.DataManager(this.dataSource).executeQuery(query.where(new ej2_data_1.Predicate(checkFields_1_1, 'equal', value)))
                    .then(function (e) {
                    if (e.result.length > 0) {
                        _this_2.value = checkFields_1_1 !== '' ? e.result[0][_this_2.fields.value].toString() : e.result[0].toString();
                        _this_2.addItem(e.result, listLength_1);
                        _this_2.updateValues();
                    }
                    else {
                        newProp && newProp.text ? _this_2.setOldText(oldValue) : newProp && newProp.value ? _this_2.setOldValue(oldValue) : _this_2.updateValues();
                    }
                });
            }
            else if (newProp) {
                newProp.text ? this.setOldText(oldValue) : this.setOldValue(oldValue);
            }
        };
        AutoComplete.prototype.showPopup = function (e) {
            if (!this.enabled) {
                return;
            }
            if (this.beforePopupOpen) {
                this.refreshPopup();
                return;
            }
            this.beforePopupOpen = true;
            this.preventAutoFill = true;
            if (ej2_base_1.isNullOrUndefined(this.list)) {
                this.renderList(e);
            }
            else {
                this.resetList(this.dataSource, this.fields, null, e);
            }
        };
        AutoComplete.prototype.hidePopup = function (e) {
            _super.prototype.hidePopup.call(this, e);
            this.activeIndex = -1;
        };
        AutoComplete.prototype.onPropertyChanged = function (newProp, oldProp) {
            Eif (this.getModuleName() === 'autocomplete') {
                this.setUpdateInitial(['fields', 'query', 'dataSource'], newProp);
            }
            for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {
                var prop = _a[_i];
                switch (prop) {
                    case 'showPopupButton':
                        if (this.showPopupButton) {
                            var button = ej2_inputs_1.Input.appendSpan(drop_down_list_1.dropDownListClasses.icon, this.inputWrapper.container, this.createElement);
                            this.inputWrapper.buttons[0] = button;
                            ej2_inputs_1.Input.calculateWidth(this.inputElement, this.inputWrapper.container);
                            Iif (!ej2_base_1.isNullOrUndefined(this.inputWrapper.buttons[0]) && !ej2_base_1.isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {
                                this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');
                            }
                            Eif (this.inputWrapper && this.inputWrapper.buttons && this.inputWrapper.buttons[0]) {
                                ej2_base_1.EventHandler.add(this.inputWrapper.buttons[0], 'click', this.dropDownClick, this);
                            }
                        }
                        else {
                            ej2_base_1.detach(this.inputWrapper.buttons[0]);
                            this.inputWrapper.buttons[0] = null;
                        }
                        break;
                    default: {
                        var atcProps = this.getPropObject(prop, newProp, oldProp);
                        _super.prototype.onPropertyChanged.call(this, atcProps.newProperty, atcProps.oldProperty);
                        break;
                    }
                }
            }
        };
        AutoComplete.prototype.renderHightSearch = function () {
            if (this.highlight) {
                for (var i = 0; i < this.liCollections.length; i++) {
                    var isHighlight = this.ulElement.querySelector('.e-active');
                    if (!isHighlight) {
                        highlight_search_1.revertHighlightSearch(this.liCollections[i]);
                        highlight_search_1.highlightSearch(this.liCollections[i], this.queryString, this.ignoreCase, this.filterType);
                    }
                }
            }
        };
        AutoComplete.prototype.getModuleName = function () {
            return 'autocomplete';
        };
        AutoComplete.prototype.render = function () {
            _super.prototype.render.call(this);
        };
        __decorate([
            ej2_base_2.Complex({ value: null, iconCss: null, groupBy: null }, drop_down_base_1.FieldSettings)
        ], AutoComplete.prototype, "fields", void 0);
        __decorate([
            ej2_base_1.Property(true)
        ], AutoComplete.prototype, "ignoreCase", void 0);
        __decorate([
            ej2_base_1.Property(false)
        ], AutoComplete.prototype, "showPopupButton", void 0);
        __decorate([
            ej2_base_1.Property(false)
        ], AutoComplete.prototype, "highlight", void 0);
        __decorate([
            ej2_base_1.Property(20)
        ], AutoComplete.prototype, "suggestionCount", void 0);
        __decorate([
            ej2_base_1.Property({})
        ], AutoComplete.prototype, "htmlAttributes", void 0);
        __decorate([
            ej2_base_1.Property(null)
        ], AutoComplete.prototype, "query", void 0);
        __decorate([
            ej2_base_1.Property(1)
        ], AutoComplete.prototype, "minLength", void 0);
        __decorate([
            ej2_base_1.Property('Contains')
        ], AutoComplete.prototype, "filterType", void 0);
        __decorate([
            ej2_base_2.Event()
        ], AutoComplete.prototype, "filtering", void 0);
        __decorate([
            ej2_base_1.Property(null)
        ], AutoComplete.prototype, "index", void 0);
        __decorate([
            ej2_base_1.Property('Never')
        ], AutoComplete.prototype, "floatLabelType", void 0);
        __decorate([
            ej2_base_1.Property(null)
        ], AutoComplete.prototype, "valueTemplate", void 0);
        __decorate([
            ej2_base_1.Property(null)
        ], AutoComplete.prototype, "filterBarPlaceholder", void 0);
        __decorate([
            ej2_base_1.Property(false)
        ], AutoComplete.prototype, "allowFiltering", void 0);
        __decorate([
            ej2_base_1.Property(null)
        ], AutoComplete.prototype, "text", void 0);
        AutoComplete = __decorate([
            ej2_base_3.NotifyPropertyChanges
        ], AutoComplete);
        return AutoComplete;
    }(combo_box_1.ComboBox));
    exports.AutoComplete = AutoComplete;
});