@neocomplexx/ngx-neo-completer
Version:
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.0.5.
2,052 lines • 87.9 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/common/http'), require('rxjs'), require('rxjs/operators')) :
typeof define === 'function' && define.amd ? define('@neocomplexx/ngx-neo-completer', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/common/http', 'rxjs', 'rxjs/operators'], factory) :
(global = global || self, factory((global.neocomplexx = global.neocomplexx || {}, global.neocomplexx['ngx-neo-completer'] = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.common.http, global.rxjs, global.rxjs.operators));
}(this, (function (exports, core, common, forms, http, rxjs, operators) { 'use strict';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
/* global Reflect, Promise */
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);
};
function __extends(d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
}
var __assign = function() {
__assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
function __rest(s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
}
function __decorate(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;
}
function __param(paramIndex, decorator) {
return function (target, key) { decorator(target, key, paramIndex); }
}
function __metadata(metadataKey, metadataValue) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
}
function __awaiter(thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
}
function __generator(thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
}
function __createBinding(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}
function __exportStar(m, exports) {
for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) exports[p] = m[p];
}
function __values(o) {
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
if (m) return m.call(o);
if (o && typeof o.length === "number") return {
next: function () {
if (o && i >= o.length) o = void 0;
return { value: o && o[i++], done: !o };
}
};
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
}
function __read(o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m) return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
}
catch (error) { e = { error: error }; }
finally {
try {
if (r && !r.done && (m = i["return"])) m.call(i);
}
finally { if (e) throw e.error; }
}
return ar;
}
function __spread() {
for (var ar = [], i = 0; i < arguments.length; i++)
ar = ar.concat(__read(arguments[i]));
return ar;
}
function __spreadArrays() {
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
};
function __await(v) {
return this instanceof __await ? (this.v = v, this) : new __await(v);
}
function __asyncGenerator(thisArg, _arguments, generator) {
if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
var g = generator.apply(thisArg, _arguments || []), i, q = [];
return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
function fulfill(value) { resume("next", value); }
function reject(value) { resume("throw", value); }
function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
}
function __asyncDelegator(o) {
var i, p;
return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
}
function __asyncValues(o) {
if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
var m = o[Symbol.asyncIterator], i;
return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
}
function __makeTemplateObject(cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
function __importStar(mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
result.default = mod;
return result;
}
function __importDefault(mod) {
return (mod && mod.__esModule) ? mod : { default: mod };
}
function __classPrivateFieldGet(receiver, privateMap) {
if (!privateMap.has(receiver)) {
throw new TypeError("attempted to get private field on non-instance");
}
return privateMap.get(receiver);
}
function __classPrivateFieldSet(receiver, privateMap, value) {
if (!privateMap.has(receiver)) {
throw new TypeError("attempted to set private field on non-instance");
}
privateMap.set(receiver, value);
return value;
}
var CtrCompleter = /** @class */ (function () {
// tslint:disable-next-line:directive-class-suffix
function CtrCompleter() {
this.selected = new core.EventEmitter();
this.highlighted = new core.EventEmitter();
this.opened = new core.EventEmitter();
this.dataSourceChange = new core.EventEmitter();
this._hasHighlighted = false;
this._hasSelected = false;
this._cancelBlur = false;
this._isOpen = false;
}
CtrCompleter.prototype.registerList = function (list) {
this.list = list;
};
CtrCompleter.prototype.registerDropdown = function (dropdown) {
this.dropdown = dropdown;
};
CtrCompleter.prototype.onHighlighted = function (item) {
this.highlighted.emit(item);
this._hasHighlighted = !!item;
};
CtrCompleter.prototype.onSelected = function (item, clearList) {
if (clearList === void 0) { clearList = true; }
this.selected.emit(item);
if (item) {
this._hasSelected = true;
}
if (clearList) {
this.clear();
}
};
CtrCompleter.prototype.onDataSourceChange = function () {
if (this.hasSelected) {
this.selected.emit(null);
this._hasSelected = false;
}
this.dataSourceChange.emit();
};
CtrCompleter.prototype.search = function (term) {
if (this._hasSelected) {
this.selected.emit(null);
this._hasSelected = false;
}
if (this.list) {
this.list.search(term);
}
};
CtrCompleter.prototype.clear = function () {
this._hasHighlighted = false;
this.isOpen = false;
if (this.dropdown) {
this.dropdown.clear();
}
if (this.list) {
this.list.clear();
}
};
CtrCompleter.prototype.selectCurrent = function () {
if (this.dropdown) {
this.dropdown.selectCurrent();
}
};
CtrCompleter.prototype.nextRow = function () {
if (this.dropdown) {
this.dropdown.nextRow();
}
};
CtrCompleter.prototype.prevRow = function () {
if (this.dropdown) {
this.dropdown.prevRow();
}
};
CtrCompleter.prototype.hasHighlighted = function () {
return this._hasHighlighted;
};
CtrCompleter.prototype.cancelBlur = function (cancel) {
this._cancelBlur = cancel;
};
CtrCompleter.prototype.isCancelBlur = function () {
return this._cancelBlur;
};
CtrCompleter.prototype.open = function () {
if (!this._isOpen) {
this.isOpen = true;
this.list.open();
}
};
Object.defineProperty(CtrCompleter.prototype, "isOpen", {
get: function () {
return this._isOpen;
},
set: function (open) {
this._isOpen = open;
this.opened.emit(this._isOpen);
if (this.list) {
this.list.isOpen(open);
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(CtrCompleter.prototype, "autoHighlightIndex", {
get: function () {
return this._autoHighlightIndex;
},
set: function (index) {
this._autoHighlightIndex = index;
if (this.dropdown) {
this.dropdown.highlightRow(this._autoHighlightIndex);
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(CtrCompleter.prototype, "hasSelected", {
get: function () {
return this._hasSelected;
},
enumerable: true,
configurable: true
});
__decorate([
core.Output(),
__metadata("design:type", Object)
], CtrCompleter.prototype, "selected", void 0);
__decorate([
core.Output(),
__metadata("design:type", Object)
], CtrCompleter.prototype, "highlighted", void 0);
__decorate([
core.Output(),
__metadata("design:type", Object)
], CtrCompleter.prototype, "opened", void 0);
__decorate([
core.Output(),
__metadata("design:type", Object)
], CtrCompleter.prototype, "dataSourceChange", void 0);
CtrCompleter = __decorate([
core.Directive({
// tslint:disable-next-line:directive-selector
selector: '[ctrCompleter]',
})
// tslint:disable-next-line:directive-class-suffix
], CtrCompleter);
return CtrCompleter;
}());
'use strict';
var CompleterListItemCmp = /** @class */ (function () {
// tslint:disable-next-line:component-class-suffix
function CompleterListItemCmp() {
this.parts = [];
}
CompleterListItemCmp.prototype.ngOnInit = function () {
if (!this.searchStr) {
this.parts.push({ isMatch: false, text: this.text });
return;
}
var matchStr = this.text.toLowerCase();
var matchPos = matchStr.indexOf(this.searchStr.toLowerCase());
var startIndex = 0;
while (matchPos >= 0) {
var matchText = this.text.slice(matchPos, matchPos + this.searchStr.length);
if (matchPos === 0) {
this.parts.push({ isMatch: true, text: matchText });
startIndex += this.searchStr.length;
}
else if (matchPos > 0) {
var matchPart = this.text.slice(startIndex, matchPos);
this.parts.push({ isMatch: false, text: matchPart });
this.parts.push({ isMatch: true, text: matchText });
startIndex += this.searchStr.length + matchPart.length;
}
matchPos = matchStr.indexOf(this.searchStr.toLowerCase(), startIndex);
}
if (startIndex < this.text.length) {
this.parts.push({ isMatch: false, text: this.text.slice(startIndex, this.text.length) });
}
};
__decorate([
core.Input(),
__metadata("design:type", String)
], CompleterListItemCmp.prototype, "text", void 0);
__decorate([
core.Input(),
__metadata("design:type", String)
], CompleterListItemCmp.prototype, "searchStr", void 0);
__decorate([
core.Input(),
__metadata("design:type", String)
], CompleterListItemCmp.prototype, "matchClass", void 0);
__decorate([
core.Input(),
__metadata("design:type", String)
], CompleterListItemCmp.prototype, "type", void 0);
CompleterListItemCmp = __decorate([
core.Component({
// tslint:disable-next-line:component-selector
selector: 'completer-list-item',
// tslint:disable-next-line:max-line-length
template: "<span class=\"completer-list-item-holder\" [ngClass]=\"{'completer-title': type === 'title', 'completer-description': type === 'description'}\" >\n <span class=\"completer-list-item\" *ngFor=\"let part of parts\" [ngClass]=\"part.isMatch ? matchClass : null\">{{part.text}}</span>\n </span>"
})
// tslint:disable-next-line:component-class-suffix
], CompleterListItemCmp);
return CompleterListItemCmp;
}());
var MAX_CHARS = 524288; // the default max length per the html maxlength attribute
var MIN_SEARCH_LENGTH = 3;
var PAUSE = 10;
var TEXT_SEARCHING = 'Searching...';
var TEXT_NO_RESULTS = 'No results found';
var CLEAR_TIMEOUT = 50;
function isNil(value) {
return typeof value === 'undefined' || value === null;
}
var CtrRowItem = /** @class */ (function () {
function CtrRowItem(row, index) {
this.row = row;
this.index = index;
}
return CtrRowItem;
}());
var CtrDropdown = /** @class */ (function () {
function CtrDropdown(completer, el) {
this.completer = completer;
this.el = el;
this.rows = [];
this._rowMouseDown = false;
this.completer.registerDropdown(this);
}
CtrDropdown.prototype.ngOnDestroy = function () {
this.completer.registerDropdown(null);
};
CtrDropdown.prototype.ngAfterViewInit = function () {
var _this = this;
var css = getComputedStyle(this.el.nativeElement);
var autoHighlightIndex = this.completer.autoHighlightIndex;
this.isScrollOn = !!css.maxHeight && css.overflowY === 'auto';
if (autoHighlightIndex) {
setTimeout(function () {
_this.highlightRow(autoHighlightIndex);
}, 0);
}
};
CtrDropdown.prototype.onMouseDown = function (event) {
var _this = this;
// Support for canceling blur on IE (issue #158)
if (!this._rowMouseDown) {
this.completer.cancelBlur(true);
setTimeout(function () {
_this.completer.cancelBlur(false);
}, 0);
}
else {
this._rowMouseDown = false;
}
};
CtrDropdown.prototype.registerRow = function (row) {
var arrIndex = this.rows.findIndex(function (_row) { return _row.index === row.index; });
if (arrIndex >= 0) {
this.rows[arrIndex] = row;
}
else {
this.rows.push(row);
}
};
CtrDropdown.prototype.unregisterRow = function (rowIndex) {
var arrIndex = this.rows.findIndex(function (_row) { return _row.index === rowIndex; });
this.rows.splice(arrIndex, 1);
if (this.currHighlighted && rowIndex === this.currHighlighted.index) {
this.highlightRow(null);
}
};
CtrDropdown.prototype.highlightRow = function (index) {
var highlighted = this.rows.find(function (row) { return row.index === index; });
// tslint:disable-next-line:no-non-null-assertion
if (isNil(index) || index < 0) {
if (this.currHighlighted) {
this.currHighlighted.row.setHighlighted(false);
}
this.currHighlighted = undefined;
this.completer.onHighlighted(null);
return;
}
if (!highlighted) {
return;
}
if (this.currHighlighted) {
this.currHighlighted.row.setHighlighted(false);
}
this.currHighlighted = highlighted;
this.currHighlighted.row.setHighlighted(true);
this.completer.onHighlighted(this.currHighlighted.row.getDataItem());
if (this.isScrollOn && this.currHighlighted) {
var rowTop = this.dropdownRowTop();
if (!rowTop) {
return;
}
if (rowTop < 0) {
this.dropdownScrollTopTo(rowTop - 1);
}
else {
var row = this.currHighlighted.row.getNativeElement();
if (this.dropdownHeight() < row.getBoundingClientRect().bottom) {
this.dropdownScrollTopTo(this.dropdownRowOffsetHeight(row));
if (this.el.nativeElement.getBoundingClientRect().bottom - this.dropdownRowOffsetHeight(row) <
row.getBoundingClientRect().top) {
this.dropdownScrollTopTo(row.getBoundingClientRect().top -
(this.el.nativeElement.getBoundingClientRect().top +
parseInt(getComputedStyle(this.el.nativeElement).paddingTop, 10)));
}
}
}
}
};
CtrDropdown.prototype.clear = function () {
this.rows = [];
};
CtrDropdown.prototype.onSelected = function (item) {
this.completer.onSelected(item);
};
CtrDropdown.prototype.rowMouseDown = function () {
this._rowMouseDown = true;
};
CtrDropdown.prototype.selectCurrent = function () {
if (this.currHighlighted) {
this.onSelected(this.currHighlighted.row.getDataItem());
}
else if (this.rows.length > 0) {
this.onSelected(this.rows[0].row.getDataItem());
}
};
CtrDropdown.prototype.nextRow = function () {
var nextRowIndex = 0;
if (this.currHighlighted) {
nextRowIndex = this.currHighlighted.index + 1;
}
this.highlightRow(nextRowIndex);
};
CtrDropdown.prototype.prevRow = function () {
var nextRowIndex = -1;
if (this.currHighlighted) {
nextRowIndex = this.currHighlighted.index - 1;
}
this.highlightRow(nextRowIndex);
};
CtrDropdown.prototype.dropdownScrollTopTo = function (offset) {
this.el.nativeElement.scrollTop = this.el.nativeElement.scrollTop + offset;
};
CtrDropdown.prototype.dropdownRowTop = function () {
if (!this.currHighlighted) {
return;
}
return this.currHighlighted.row.getNativeElement().getBoundingClientRect().top -
(this.el.nativeElement.getBoundingClientRect().top +
parseInt(getComputedStyle(this.el.nativeElement).paddingTop, 10));
};
CtrDropdown.prototype.dropdownHeight = function () {
return this.el.nativeElement.getBoundingClientRect().top +
parseInt(getComputedStyle(this.el.nativeElement).maxHeight, 10);
};
CtrDropdown.prototype.dropdownRowOffsetHeight = function (row) {
var css = getComputedStyle(row.parentElement);
return row.parentElement.offsetHeight +
parseInt(css.marginTop, 10) + parseInt(css.marginBottom, 10);
};
CtrDropdown.ctorParameters = function () { return [
{ type: CtrCompleter, decorators: [{ type: core.Host }] },
{ type: core.ElementRef }
]; };
__decorate([
core.HostListener('mousedown', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrDropdown.prototype, "onMouseDown", null);
CtrDropdown = __decorate([
core.Directive({
// tslint:disable-next-line:directive-selector
selector: '[ctrDropdown]',
})
// tslint:disable-next-line:directive-class-suffix
,
__param(0, core.Host()),
__metadata("design:paramtypes", [CtrCompleter, core.ElementRef])
], CtrDropdown);
return CtrDropdown;
}());
// keyboard events
var KEY_DW = 40;
var KEY_RT = 39;
var KEY_UP = 38;
var KEY_LF = 37;
var KEY_ES = 27;
var KEY_EN = 13;
var KEY_TAB = 9;
var KEY_BK = 8;
var KEY_SH = 16;
var KEY_CL = 20;
var KEY_F1 = 112;
var KEY_F12 = 123;
var CtrInput = /** @class */ (function () {
function CtrInput(completer, ngModel, el) {
var _this = this;
this.completer = completer;
this.ngModel = ngModel;
this.el = el;
// tslint:disable:no-input-rename
this.clearSelected = false;
this.clearUnselected = false;
this.overrideSuggested = false;
this.fillHighlighted = true;
this.openOnFocus = false;
this.openOnClick = false;
this.selectOnClick = false;
this.selectOnFocus = false;
this.autoSelectOnEnter = true;
this.ngModelChange = new core.EventEmitter();
this._searchStr = '';
this._displayStr = '';
this.blurTimer = null;
this.completer.selected.subscribe(function (item) {
if (!item) {
return;
}
if (_this.clearSelected) {
_this.searchStr = '';
}
else {
_this.searchStr = item.title;
}
_this.ngModelChange.emit(_this.searchStr);
});
this.completer.highlighted.subscribe(function (item) {
if (_this.fillHighlighted) {
if (item) {
_this._displayStr = item.title;
_this.ngModelChange.emit(item.title);
}
else {
_this._displayStr = _this.searchStr;
_this.ngModelChange.emit(_this.searchStr);
}
}
});
this.completer.dataSourceChange.subscribe(function () {
_this.completer.search(_this.searchStr);
});
if (this.ngModel.valueChanges) {
this.ngModel.valueChanges.subscribe(function (value) {
if (!isNil(value) && _this._displayStr !== value) {
if (_this.searchStr !== value) {
_this.completer.search(value);
}
_this.searchStr = value;
}
});
}
}
CtrInput.prototype.keyupHandler = function (event) {
if (event.keyCode === KEY_LF || event.keyCode === KEY_RT || event.keyCode === KEY_TAB) {
// do nothing
return;
}
if (event.keyCode === KEY_UP || event.keyCode === KEY_EN) {
event.preventDefault();
}
else if (event.keyCode === KEY_DW) {
event.preventDefault();
this.completer.search(this.searchStr);
}
else if (event.keyCode === KEY_ES) {
if (this.completer.isOpen) {
this.restoreSearchValue();
this.completer.clear();
event.stopPropagation();
event.preventDefault();
}
}
};
CtrInput.prototype.pasteHandler = function (event) {
this.completer.open();
};
CtrInput.prototype.keydownHandler = function (event) {
var keyCode = event.keyCode || event.which;
if (keyCode === KEY_EN) {
if (this.completer.hasHighlighted()) {
event.preventDefault();
}
else {
if (this.autoSelectOnEnter) {
event.preventDefault();
this.completer.open();
this.completer.nextRow();
}
}
this.handleSelection();
}
else if (keyCode === KEY_DW) {
event.preventDefault();
this.completer.open();
this.completer.nextRow();
}
else if (keyCode === KEY_UP) {
event.preventDefault();
this.completer.prevRow();
}
else if (keyCode === KEY_TAB) {
this.handleSelection();
}
else if (keyCode === KEY_BK) {
this.completer.open();
}
else if (keyCode === KEY_ES) {
// This is very specific to IE10/11 #272
// without this, IE clears the input text
event.preventDefault();
if (this.completer.isOpen) {
event.stopPropagation();
}
}
else {
if (keyCode !== 0 && keyCode !== KEY_SH && keyCode !== KEY_CL &&
(keyCode <= KEY_F1 || keyCode >= KEY_F12) &&
!event.ctrlKey && !event.metaKey && !event.altKey) {
this.completer.open();
}
}
};
CtrInput.prototype.onBlur = function (event) {
var _this = this;
// Check if we need to cancel Blur for IE
if (this.completer.isCancelBlur()) {
setTimeout(function () {
// get the focus back
_this.el.nativeElement.focus();
}, 0);
return;
}
if (this.completer.isOpen) {
this.blurTimer = rxjs.timer(200).pipe(operators.take(1)).subscribe(function () { return _this.doBlur(); });
}
};
CtrInput.prototype.onfocus = function () {
if (this.blurTimer) {
this.blurTimer.unsubscribe();
this.blurTimer = null;
}
if (this.selectOnFocus) {
this.el.nativeElement.select();
}
if (this.openOnFocus) {
this.completer.open();
}
};
CtrInput.prototype.onClick = function (event) {
if (this.selectOnClick) {
this.el.nativeElement.select();
}
if (this.openOnClick) {
if (this.completer.isOpen) {
this.completer.clear();
}
else {
this.completer.open();
}
}
};
Object.defineProperty(CtrInput.prototype, "searchStr", {
get: function () {
return this._searchStr;
},
set: function (term) {
this._searchStr = term;
this._displayStr = term;
},
enumerable: true,
configurable: true
});
CtrInput.prototype.handleSelection = function () {
if (this.completer.hasHighlighted()) {
this._searchStr = '';
this.completer.selectCurrent();
}
else if (this.overrideSuggested) {
this.completer.onSelected({ title: this.searchStr, originalObject: null });
}
else {
if (this.clearUnselected && !this.completer.hasSelected) {
this.searchStr = '';
this.ngModelChange.emit(this.searchStr);
}
this.completer.clear();
}
};
CtrInput.prototype.restoreSearchValue = function () {
if (this.fillHighlighted) {
if (this._displayStr !== this.searchStr) {
this._displayStr = this.searchStr;
this.ngModelChange.emit(this.searchStr);
}
}
};
CtrInput.prototype.doBlur = function () {
if (this.blurTimer) {
this.blurTimer.unsubscribe();
this.blurTimer = null;
}
if (this.overrideSuggested) {
this.completer.onSelected({ title: this.searchStr, originalObject: null });
}
else {
if (this.clearUnselected && !this.completer.hasSelected) {
this.searchStr = '';
this.ngModelChange.emit(this.searchStr);
}
else {
this.restoreSearchValue();
}
}
this.completer.clear();
};
CtrInput.ctorParameters = function () { return [
{ type: CtrCompleter, decorators: [{ type: core.Host }] },
{ type: forms.NgModel },
{ type: core.ElementRef }
]; };
__decorate([
core.Input('clearSelected'),
__metadata("design:type", Object)
], CtrInput.prototype, "clearSelected", void 0);
__decorate([
core.Input('clearUnselected'),
__metadata("design:type", Object)
], CtrInput.prototype, "clearUnselected", void 0);
__decorate([
core.Input('overrideSuggested'),
__metadata("design:type", Object)
], CtrInput.prototype, "overrideSuggested", void 0);
__decorate([
core.Input('fillHighlighted'),
__metadata("design:type", Object)
], CtrInput.prototype, "fillHighlighted", void 0);
__decorate([
core.Input('openOnFocus'),
__metadata("design:type", Object)
], CtrInput.prototype, "openOnFocus", void 0);
__decorate([
core.Input('openOnClick'),
__metadata("design:type", Object)
], CtrInput.prototype, "openOnClick", void 0);
__decorate([
core.Input('selectOnClick'),
__metadata("design:type", Object)
], CtrInput.prototype, "selectOnClick", void 0);
__decorate([
core.Input('selectOnFocus'),
__metadata("design:type", Object)
], CtrInput.prototype, "selectOnFocus", void 0);
__decorate([
core.Input('autoSelectOnEnter'),
__metadata("design:type", Object)
], CtrInput.prototype, "autoSelectOnEnter", void 0);
__decorate([
core.Output(),
__metadata("design:type", core.EventEmitter)
], CtrInput.prototype, "ngModelChange", void 0);
__decorate([
core.HostListener('keyup', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrInput.prototype, "keyupHandler", null);
__decorate([
core.HostListener('paste', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrInput.prototype, "pasteHandler", null);
__decorate([
core.HostListener('keydown', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrInput.prototype, "keydownHandler", null);
__decorate([
core.HostListener('blur', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrInput.prototype, "onBlur", null);
__decorate([
core.HostListener('focus', []),
__metadata("design:type", Function),
__metadata("design:paramtypes", []),
__metadata("design:returntype", void 0)
], CtrInput.prototype, "onfocus", null);
__decorate([
core.HostListener('click', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrInput.prototype, "onClick", null);
CtrInput = __decorate([
core.Directive({
// tslint:disable-next-line:directive-selector
selector: '[ctrInput]',
})
// tslint:disable-next-line:directive-class-suffix
,
__param(0, core.Host()),
__metadata("design:paramtypes", [CtrCompleter, forms.NgModel, core.ElementRef])
], CtrInput);
return CtrInput;
}());
var CtrListContext = /** @class */ (function () {
function CtrListContext(results, searching, searchInitialized, isOpen) {
this.results = results;
this.searching = searching;
this.searchInitialized = searchInitialized;
this.isOpen = isOpen;
}
return CtrListContext;
}());
var CtrList = /** @class */ (function () {
function CtrList(completer, templateRef, viewContainer, cd) {
this.completer = completer;
this.templateRef = templateRef;
this.viewContainer = viewContainer;
this.cd = cd;
this.ctrListMinSearchLength = MIN_SEARCH_LENGTH;
this.ctrListPause = PAUSE;
this.ctrListAutoMatch = false;
this.ctrListAutoHighlight = false;
this.ctrListDisplaySearching = true;
// private results: CompleterItem[] = [];
this.term = null;
// private searching = false;
this.searchTimer = null;
this.clearTimer = null;
this.ctx = new CtrListContext([], false, false, false);
this._initialValue = null;
this.viewRef = null;
}
CtrList.prototype.ngOnInit = function () {
this.completer.registerList(this);
this.viewRef = this.viewContainer.createEmbeddedView(this.templateRef, new CtrListContext([], false, false, false));
};
Object.defineProperty(CtrList.prototype, "dataService", {
set: function (newService) {
this._dataService = newService;
this.dataServiceSubscribe();
},
enumerable: true,
configurable: true
});
Object.defineProperty(CtrList.prototype, "initialValue", {
set: function (value) {
var _this = this;
if (this._dataService && typeof this._dataService.convertToItem === 'function') {
setTimeout(function () {
var initialItem = _this._dataService.convertToItem(value);
if (initialItem) {
_this.completer.onSelected(initialItem, false);
}
});
}
else if (!this._dataService) {
this._initialValue = value;
}
},
enumerable: true,
configurable: true
});
CtrList.prototype.search = function (term) {
var _this = this;
if (!isNil(term) && term.length >= this.ctrListMinSearchLength && this.term !== term) {
if (this.searchTimer) {
this.searchTimer.unsubscribe();
this.searchTimer = null;
}
if (!this.ctx.searching) {
if (this.ctrListDisplaySearching) {
this.ctx.results = [];
}
this.ctx.searching = true;
this.ctx.searchInitialized = true;
this.refreshTemplate();
}
if (this.clearTimer) {
this.clearTimer.unsubscribe();
}
this.searchTimer = rxjs.timer(this.ctrListPause).pipe(operators.take(1)).subscribe(function () {
_this.searchTimerComplete(term);
});
}
else if (!isNil(term) && term.length < this.ctrListMinSearchLength) {
this.clear();
this.term = '';
}
};
CtrList.prototype.clear = function () {
var _this = this;
if (this.searchTimer) {
this.searchTimer.unsubscribe();
}
this.clearTimer = rxjs.timer(CLEAR_TIMEOUT).pipe(operators.take(1)).subscribe(function () {
_this._clear();
});
};
CtrList.prototype.open = function () {
if (!this.ctx.searchInitialized) {
this.search('');
}
this.refreshTemplate();
};
CtrList.prototype.isOpen = function (open) {
this.ctx.isOpen = open;
};
CtrList.prototype._clear = function () {
if (this.searchTimer) {
this.searchTimer.unsubscribe();
this.searchTimer = null;
}
if (this.dataService) {
this.dataService.cancel();
}
this.viewContainer.clear();
this.viewRef = null;
};
CtrList.prototype.searchTimerComplete = function (term) {
// Begin the search
if (isNil(term) || term.length < this.ctrListMinSearchLength) {
this.ctx.searching = false;
return;
}
this.term = term;
this._dataService.search(term);
};
CtrList.prototype.refreshTemplate = function () {
// create the template if it doesn't exist
if (!this.viewRef) {
this.viewRef = this.viewContainer.createEmbeddedView(this.templateRef, this.ctx);
}
else if (!this.viewRef.destroyed) {
// refresh the template
this.viewRef.context.isOpen = this.ctx.isOpen;
this.viewRef.context.results = this.ctx.results;
this.viewRef.context.searching = this.ctx.searching;
this.viewRef.context.searchInitialized = this.ctx.searchInitialized;
this.viewRef.detectChanges();
}
this.cd.markForCheck();
};
CtrList.prototype.getBestMatchIndex = function () {
var _this = this;
if (!this.ctx.results || !this.term) {
return null;
}
// First try to find the exact term
var bestMatch = this.ctx.results.findIndex(function (item) { return item.title.toLowerCase() === _this.term.toLocaleLowerCase(); });
// If not try to find the first item that starts with the term
if (bestMatch < 0) {
bestMatch = this.ctx.results.findIndex(function (item) { return item.title.toLowerCase().startsWith(_this.term.toLocaleLowerCase()); });
}
// If not try to find the first item that includes the term
if (bestMatch < 0) {
bestMatch = this.ctx.results.findIndex(function (item) { return item.title.toLowerCase().includes(_this.term.toLocaleLowerCase()); });
}
return bestMatch < 0 ? null : bestMatch;
};
CtrList.prototype.dataServiceSubscribe = function () {
var _this = this;
if (this._dataService) {
this._dataService.pipe(operators.catchError(function (err) {
console.error(err);
console.error('Unexpected error in dataService: errors should be handled by the dataService Observable');
return [];
}))
.subscribe(function (results) {
_this.ctx.searchInitialized = true;
_this.ctx.searching = false;
_this.ctx.results = results;
if (_this.ctrListAutoMatch && results && results.length === 1 && results[0].title && !isNil(_this.term) &&
results[0].title.toLocaleLowerCase() === _this.term.toLocaleLowerCase()) {
// Do automatch
_this.completer.onSelected(results[0]);
return;
}
if (_this._initialValue) {
_this.initialValue = _this._initialValue;
_this._initialValue = null;
}
_this.refreshTemplate();
if (_this.ctrListAutoHighlight) {
_this.completer.autoHighlightIndex = _this.getBestMatchIndex();
}
});
if (this._dataService.dataSourceChange) {
this._dataService.dataSourceChange.subscribe(function () {
_this.term = null;
_this.ctx.searchInitialized = false;
_this.ctx.searching = false;
_this.ctx.results = [];
_this.refreshTemplate();
_this.completer.onDataSourceChange();
});
}
}
};
CtrList.ctorParameters = function () { return [
{ type: CtrCompleter, decorators: [{ type: core.Host }] },
{ type: core.TemplateRef },
{ type: core.ViewContainerRef },
{ type: core.ChangeDetectorRef }
]; };
__decorate([
core.Input(),
__metadata("design:type", Object)
], CtrList.prototype, "ctrListMinSearchLength", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CtrList.prototype, "ctrListPause", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CtrList.prototype, "ctrListAutoMatch", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CtrList.prototype, "ctrListAutoHighlight", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CtrList.prototype, "ctrListDisplaySearching", void 0);
__decorate([
core.Input('ctrList'),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], CtrList.prototype, "dataService", null);
__decorate([
core.Input('ctrListInitialValue'),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], CtrList.prototype, "initialValue", null);
CtrList = __decorate([
core.Directive({
// tslint:disable-next-line:directive-selector
selector: '[ctrList]',
})
// tslint:disable:no-non-null-assertion
// tslint:disable-next-line:directive-class-suffix
,
__param(0, core.Host()),
__metadata("design:paramtypes", [CtrCompleter,
core.TemplateRef,
core.ViewContainerRef,
core.ChangeDetectorRef])
], CtrList);
return CtrList;
}());
var CtrRow = /** @class */ (function () {
function CtrRow(el, renderer, dropdown) {
this.el = el;
this.renderer = renderer;
this.dropdown = dropdown;
this.selected = false;
}
CtrRow.prototype.ngOnDestroy = function () {
if (this._rowIndex) {
this.dropdown.unregisterRow(this._rowIndex);
}
};
Object.defineProperty(CtrRow.prototype, "ctrRow", {
set: function (index) {
this._rowIndex = index;
this.dropdown.registerRow(new CtrRowItem(this, this._rowIndex));
},
enumerable: true,
configurable: true
});
Object.defineProperty(CtrRow.prototype, "dataItem", {
set: function (item) {
this._item = item;
},
enumerable: true,
configurable: true
});
CtrRow.prototype.onClick = function (event) {
this.dropdown.onSelected(this._item);
};
CtrRow.prototype.onMouseEnter = function (event) {
this.dropdown.highlightRow(this._rowIndex);
};
CtrRow.prototype.onMouseDown = function (event) {
this.dropdown.rowMouseDown();
};
CtrRow.prototype.setHighlighted = function (selected) {
this.selected = selected;
var highlightClass = 'completer-selected-row';
this.selected ? this.renderer.addClass(this.el.nativeElement, highlightClass) : this.renderer.removeClass(this.el.nativeElement, highlightClass);
};
CtrRow.prototype.getNativeElement = function () {
return this.el.nativeElement;
};
CtrRow.prototype.getDataItem = function () {
return this._item;
};
CtrRow.ctorParameters = function () { return [
{ type: core.ElementRef },
{ type: core.Renderer2 },
{ type: CtrDropdown, decorators: [{ type: core.Host }] }
]; };
__decorate([
core.Input(),
__metadata("design:type", Number),
__metadata("design:paramtypes", [Number])
], CtrRow.prototype, "ctrRow", null);
__decorate([
core.Input(),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], CtrRow.prototype, "dataItem", null);
__decorate([
core.HostListener('click', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrRow.prototype, "onClick", null);
__decorate([
core.HostListener('mouseenter', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrRow.prototype, "onMouseEnter", null);
__decorate([
core.HostListener('mousedown', ['$event']),
__metadata("design:type", Function),
__metadata("design:paramtypes", [Object]),
__metadata("design:returntype", void 0)
], CtrRow.prototype, "onMouseDown", null);
CtrRow = __decorate([
core.Directive({
selector: '[ctrRow]',
}),
__param(2, core.Host()),
__metadata("design:paramtypes", [core.ElementRef, core.Renderer2, CtrDropdown])
], CtrRow);
return CtrRow;
}());
var CompleterBaseData = /** @class */ (function (_super) {
__extends(CompleterBaseData, _super);
function CompleterBaseData() {
return _super.call(this) || this;
}
CompleterBaseData.prototype.cancel = function () {
return;
};
CompleterBaseData.prototype.searchFields = function (searchFields) {
this._searchFields = searchFields;
return this;
};
CompleterBaseData.prototype.titleField = function (titleField) {
this._titleField = titleField;
return this;
};
CompleterBaseData.prototype.descriptionField = function (descriptionField) {
this._descriptionField = descriptionField;
return this;
};
CompleterBaseData.prototype.imageField = function (imageField) {
this._imageField = imageField;
return this;
};
CompleterBaseData.prototype.convertToItem = function (data) {
var image = null;
var formattedText;
var formattedDesc = null;
if (this._titleField) {
formattedText = this.extractTitle(data);
}
else {
formattedText = data;
}
if (typeof formattedText !== 'string') {
formattedText = JSON.stringify(formattedText);
}
if (this._descriptionField) {
formattedDesc = this.extractValue(data, this._descriptionField);
}
if (this._imageField) {
image = this.extractValue(data, this._imageField);
}
if (isNil(formattedText)) {
return null;
}
return {
description: formattedDesc,
image: image,
originalObject: data,
title: formattedText
};
};
CompleterBaseData.prototype.extractMatches = function (data, term) {
var _this = this;
var matches = [];
var searchFields = this._searchFields ? this._searchFields.split(',') : null;
if (this._searchFields !== null && this._searchFields !== undefined && term !== '') {
matches = data.filter(function (item) {
var values = searchFields ? _this.extractBySearchFields(searchFields, item) : [item];
return values.some(function (value) { return value
.toString()
.toLowerCase()
.indexOf(term.toString().toLowerCase()) >= 0; });
});
}
else {
matches = data;
}
return matches;
};
CompleterBaseData.prototype.extractTitle = function (item) {
var _this = this;
// split title fields and run extractValue for each and join with ' '
if (!this._titleField) {
return '';
}
return this._titleField.split(',')
.map(function (field) {
return _this.extractValue(item, field);
})
.reduce(function (acc, titlePart) { return acc ? acc + " " + titlePart : titlePart; });
};
CompleterBaseData.prototype.extractValue = function (obj, key) {
var e_1, _a;
var keys;
var result;
if (key) {
keys = key.split('.');
result = obj;
try {
for (var keys_1 = __values(keys), keys_1_1 = keys_1.next(); !keys_1_1.done; keys_1_1 = keys_1.next()) {
key = keys_1_1.value;
if (result) {
result = result[key];
}
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (keys_1_1 && !keys_1_1.done && (_a = keys_1.return)) _a.call(keys_1);
}
finally { if (e_1) throw e_1.error; }
}
}
else {
result = obj;
}
return result;
};
CompleterBaseData.prototype.processResults = function (matches) {
var i;
var results = [];
if (matches && matches.length > 0) {
for (i = 0; i < matches.length; i++) {
var item = this.convertToItem(matches[i]);
if (item) {
results.push(item);
}
}
}
return results;
};
CompleterBaseData.prototype.extractBySearchFields = function (searchFields, item) {
var _this = this;
return searchFields
.map(function (searchField) { return _this.extractValue(item, searchField); }).filter(function (value) { return !!value; });
};
return CompleterBaseData;
}(rxjs.Subject));
var LocalData = /** @class */ (function (_super) {
__extends(LocalData, _super);
function LocalData() {
var _this = _super.call(this) || this;
_this.dataSourceChange = new core.EventEmitter();
return _this;
}
LocalData.prototype.data = function (data) {
var _this = this;
if (data instanceof rxjs.Observable) {
var data$ = data;
data$
.pipe(operators.catchError(function () { return []; }))
.subscribe(function (res) {
_this._data = res;
if (_this.savedTerm) {
_this.search(_this.savedTerm);
}
_this.dataSourceChange.emit();
});
}
else {
this._data = data;
}
this.dataSourceChange.emit();
return this;
};
LocalData.prototype.search = function (term) {
if (!this._data) {
this.savedTerm = term;
}
else {
this.savedTerm = null;
var matches = this.extractMatches(this._data, term);
this.next(this.processResults(matches));
}
};
LocalData.prototype.convertToItem = function (data) {
return _super.prototype.convertToItem.call(this, data);
};
return LocalData;
}(CompleterBaseData));
var LocalDataFactory = /** @class */ (function () {
function LocalDataFactory() {
}
LocalDataFactory.prototype.create = function () {
return new LocalData();
};
LocalDataFactory = __decorate([
core.Injectable(),
__metadata("design:paramtypes", [])
], LocalDataFactory);
return LocalDataFactory;
}());
var RemoteData = /** @class */ (function (_super) {
__extends(RemoteData, _super);
function RemoteData(http) {
var _this = _super.call(this) || this;
_this.http = http;
_this.dataSourceChange = new core.EventEmitter();
_this._urlFormater = null;
_this._dataField = null;
return _this;
}
RemoteData.prototype.remoteUrl = function (remoteUrl) {
this._remoteUrl = remoteUrl;
this.dataSourceChange.emit();
return this;
};
RemoteData.prototype.urlFormater = function (urlFormater) {
this._urlFormater = urlFormater;
};
RemoteData.prototype.dataField = function (dataField) {
this._dataField = dataField;
};
RemoteData.prototype.requestOptions = function (requestOptions) {
this._requestOptions = requestOptions;
};
RemoteData.prototype.search = function (term) {
var _this = this;
this.cancel();
// let params = {};
var url = '';
if (this._urlFormater) {
url = this._urlFormater(term);
}
else {
url = this._remoteUrl + encodeURIComponent(term);
}
this.remoteSearch = this.http
.get(url, Object.assign({}, this._requestOptions))
.pipe(operators.map(function (data) {
var matches = _this.extractValue(data, _this._dataField);
return _this.extractMatches(matches, term);
}), operators.catchError(function () { return []; }))
.subscribe(function (matches) {
var results = _this.processResults(matches);
_this.next(results);
});
};
RemoteData.prototype.cancel = function () {
if (this.remoteSearch) {
this.remoteSearch.unsubscribe();
}
};
RemoteData.prototype.convertToItem = function (data) {
return _super.prototype.convertToItem.call(this, data);
};
return RemoteData;
}(CompleterBaseData));
var RemoteDataFactory = /** @class */ (function () {
function RemoteDataFactory(http) {
this.http = http;
}
RemoteDataFactory.prototype.create = function () {
return new RemoteData(this.http);
};
RemoteDataFactory.ctorParameters = function () { return [
{ type: http.HttpClient }
]; };
RemoteDataFactory = __decorate([
core.Injectable(),
__metadata("design:paramtypes", [http.HttpClient])
], RemoteDataFactory);
return RemoteDataFactory;
}());
var CompleterService = /** @class */ (function () {
function CompleterService(localDataFactory, // Using any instead of () => LocalData because of AoT errors
remoteDataFactory // Using any instead of () => LocalData because of AoT errors
) {
this.localDataFactory = localDataFactory;
this.remoteDataFactory = remoteDataFactory;
}
CompleterService.prototype.local = function (data, searchFields, titleField) {
if (searchFields === void 0) { searchFields = ''; }
if (titleField === void 0) { titleField = ''; }
var localData = this.localDataFactory.create();
return localData
.data(data)
.searchFields(searchFields)
.titleField(titleField);
};
CompleterService.prototype.remote = function (url, searchFields, titleField) {
if (searchFields === void 0) { searchFields = ''; }
if (titleField === void 0) { titleField = ''; }
var remoteData = this.remoteDataFactory.create();
return remoteData
.remoteUrl(url)
.searchFields(searchFields)
.titleField(titleField);
};
CompleterService.ctorParameters = function () { return [
{ type: LocalDataFactory },
{ type: RemoteDataFactory // Using any instead of () => LocalData because of AoT errors
}
]; };
CompleterService = __decorate([
core.Injectable(),
__metadata("design:paramtypes", [LocalDataFactory,
RemoteDataFactory // Using any instead of () => LocalData because of AoT errors
])
], CompleterService);
return CompleterService;
}());
'use strict';
var noop = function () { };
var ɵ0 = noop;
var COMPLETER_CONTROL_VALUE_ACCESSOR = {
provide: forms.NG_VALUE_ACCESSOR,
useExisting: core.forwardRef(function () { return CompleterCmp; }),
multi: true
};
var CompleterCmp = /** @class */ (function () {
function CompleterCmp(completerService, cdr) {
this.completerService = completerService;
this.cdr = cdr;
this.inputName = '';
this.inputId = '';
this.pause = PAUSE;
this.minSearchLength = MIN_SEARCH_LENGTH;
this.maxChars = MAX_CHARS;
this.overrideSuggested = false;
this.clearSelected = false;
this.clearUnselected = false;
this.fillHighlighted = true;
this.placeholder = '';
this.autoMatch = false;
this.disableInput = false;
this.autofocus = false;
this.openOnFocus = false;
this.openOnClick = false;
this.selectOnClick = false;
this.autoHighlight = false;
this.autoSelectOnEnter = true;
this.selected = new core.EventEmitter();
this.highlighted = new core.EventEmitter();
// tslint:disable:no-output-rename
this.blurEvent = new core.EventEmitter();
this.click = new core.EventEmitter();
this.focusEvent = new core.EventEmitter();
this.opened = new core.EventEmitter();
this.keyup = new core.EventEmitter();
this.keydown = new core.EventEmitter();
this.searchStr = '';
this.control = new forms.FormControl('');
this.displaySearching = true;
this.displayNoResults = true;
this._textNoResults = TEXT_NO_RESULTS;
this._textSearching = TEXT_SEARCHING;
this._onTouchedCallback = noop;
this._onChangeCallback = noop;
this._focus = false;
this._open = false;
}
Object.defineProperty(CompleterCmp.prototype, "value", {
get: function () { return this.searchStr; },
set: function (v) {
if (v !== this.searchStr) {
this.searchStr = v;
}
// Propagate the change in any case
this._onChangeCallback(v);
},
enumerable: true,
configurable: true
});
CompleterCmp.prototype.ngAfterViewInit = function () {
if (this.autofocus) {
this._focus = true;
}
};
CompleterCmp.prototype.ngAfterViewChecked = function () {
var _this = this;
if (this._focus) {
setTimeout(function () {
_this.ctrInput.nativeElement.focus();
_this._focus = false;
}, 0);
}
};
CompleterCmp.prototype.onTouched = function () {
this._onTouchedCallback();
};
CompleterCmp.prototype.writeValue = function (value) {
this.searchStr = value;
};
CompleterCmp.prototype.registerOnChange = function (fn) {
this._onChangeCallback = fn;
};
CompleterCmp.prototype.registerOnTouched = function (fn) {
this._onTouchedCallback = fn;
};
CompleterCmp.prototype.setDisabledState = function (isDisabled) {
this.disableInput = isDisabled;
};
Object.defineProperty(CompleterCmp.prototype, "datasource", {
set: function (source) {
if (source) {
if (source instanceof Array) {
this.dataService = this.completerService.local(source);
}
else if (typeof (source) === 'string') {
this.dataService = this.completerService.remote(source);
}
else {
this.dataService = source;
}
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(CompleterCmp.prototype, "textNoResults", {
set: function (text) {
if (this._textNoResults !== text) {
this._textNoResults = text;
this.displayNoResults = !!this._textNoResults && this._textNoResults !== 'false';
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(CompleterCmp.prototype, "textSearching", {
set: function (text) {
if (this._textSearching !== text) {
this._textSearching = text;
this.displaySearching = !!this._textSearching && this._textSearching !== 'false';
}
},
enumerable: true,
configurable: true
});
CompleterCmp.prototype.ngOnInit = function () {
var _this = this;
this.completer.selected.subscribe(function (item) {
_this.selected.emit(item);
});
this.completer.highlighted.subscribe(function (item) {
_this.highlighted.emit(item);
});
this.completer.opened.subscribe(function (isOpen) {
_this._open = isOpen;
_this.opened.emit(isOpen);
});
};
CompleterCmp.prototype.onBlur = function () {
this.blurEvent.emit();
this.onTouched();
this.cdr.detectChanges();
};
CompleterCmp.prototype.onFocus = function () {
this.focusEvent.emit();
this.onTouched();
};
CompleterCmp.prototype.onClick = function (event) {
this.click.emit(event);
this.onTouched();
};
CompleterCmp.prototype.onKeyup = function (event) {
this.keyup.emit(event);
};
CompleterCmp.prototype.onKeydown = function (event) {
this.keydown.emit(event);
};
CompleterCmp.prototype.onChange = function (value) {
this.value = value;
};
CompleterCmp.prototype.open = function () {
this.completer.open();
};
CompleterCmp.prototype.close = function () {
this.completer.clear();
};
CompleterCmp.prototype.focus = function () {
if (this.ctrInput) {
this.ctrInput.nativeElement.focus();
}
else {
this._focus = true;
}
};
CompleterCmp.prototype.blur = function () {
if (this.ctrInput) {
this.ctrInput.nativeElement.blur();
}
else {
this._focus = false;
}
};
CompleterCmp.prototype.isOpen = function () {
return this._open;
};
CompleterCmp.ctorParameters = function () { return [
{ type: CompleterService },
{ type: core.ChangeDetectorRef }
]; };
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "dataService", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "inputName", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "inputId", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "pause", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "minSearchLength", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "maxChars", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "overrideSuggested", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "clearSelected", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "clearUnselected", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "fillHighlighted", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "placeholder", void 0);
__decorate([
core.Input(),
__metadata("design:type", String)
], CompleterCmp.prototype, "matchClass", void 0);
__decorate([
core.Input(),
__metadata("design:type", Number)
], CompleterCmp.prototype, "fieldTabindex", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "autoMatch", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "disableInput", void 0);
__decorate([
core.Input(),
__metadata("design:type", String)
], CompleterCmp.prototype, "inputClass", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "autofocus", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "openOnFocus", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "openOnClick", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "selectOnClick", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "initialValue", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "autoHighlight", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "autoSelectOnEnter", void 0);
__decorate([
core.Output(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "selected", void 0);
__decorate([
core.Output(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "highlighted", void 0);
__decorate([
core.Output('blur'),
__metadata("design:type", Object)
], CompleterCmp.prototype, "blurEvent", void 0);
__decorate([
core.Output(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "click", void 0);
__decorate([
core.Output('focus'),
__metadata("design:type", Object)
], CompleterCmp.prototype, "focusEvent", void 0);
__decorate([
core.Output(),
__metadata("design:type", Object)
], CompleterCmp.prototype, "opened", void 0);
__decorate([
core.Output(),
__metadata("design:type", core.EventEmitter)
], CompleterCmp.prototype, "keyup", void 0);
__decorate([
core.Output(),
__metadata("design:type", core.EventEmitter)
], CompleterCmp.prototype, "keydown", void 0);
__decorate([
core.ViewChild(CtrCompleter, { static: true }),
__metadata("design:type", CtrCompleter)
], CompleterCmp.prototype, "completer", void 0);
__decorate([
core.ViewChild('ctrInput', { static: true }),
__metadata("design:type", core.ElementRef)
], CompleterCmp.prototype, "ctrInput", void 0);
__decorate([
core.Input(),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], CompleterCmp.prototype, "datasource", null);
__decorate([
core.Input(),
__metadata("design:type", String),
__metadata("design:paramtypes", [String])
], CompleterCmp.prototype, "textNoResults", null);
__decorate([
core.Input(),
__metadata("design:type", String),
__metadata("design:paramtypes", [String])
], CompleterCmp.prototype, "textSearching", null);
CompleterCmp = __decorate([
core.Component({
// tslint:disable:max-line-length
selector: 'neo-completer',
template: "\n <div class=\"completer-holder\" ctrCompleter>\n <input #ctrInput [attr.id]=\"inputId.length > 0 ? inputId : null\" type=\"search\" class=\"completer-input\" ctrInput [ngClass]=\"inputClass\"\n [(ngModel)]=\"searchStr\" (ngModelChange)=\"onChange($event)\" [attr.name]=\"inputName\" [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxChars\" [tabindex]=\"fieldTabindex\" [disabled]=\"disableInput\"\n [clearSelected]=\"clearSelected\" [clearUnselected]=\"clearUnselected\"\n [overrideSuggested]=\"overrideSuggested\" [openOnFocus]=\"openOnFocus\" [fillHighlighted]=\"fillHighlighted\"\n [openOnClick]=\"openOnClick\" [selectOnClick]=\"selectOnClick\" [autoSelectOnEnter]=\"autoSelectOnEnter\"\n (blur)=\"onBlur()\" (focus)=\"onFocus()\" (keyup)=\"onKeyup($event)\" (keydown)=\"onKeydown($event)\" (click)=\"onClick($event)\"\n autocomplete=\"off\" autocorrect=\"off\" autocapitalize=\"off\" />\n\n <div class=\"completer-dropdown-holder\"\n *ctrList=\"dataService;\n minSearchLength: minSearchLength;\n pause: pause;\n autoMatch: autoMatch;\n initialValue: initialValue;\n autoHighlight: autoHighlight;\n displaySearching: displaySearching;\n let items = results;\n let searchActive = searching;\n let isInitialized = searchInitialized;\n let isOpen = isOpen;\">\n <div class=\"completer-dropdown\" ctrDropdown *ngIf=\"isInitialized && isOpen && (( items?.length > 0|| (displayNoResults && !searchActive)) || (searchActive && displaySearching))\">\n <div *ngIf=\"searchActive && displaySearching\" class=\"completer-searching\">{{_textSearching}}</div>\n <div *ngIf=\"!searchActive && (!items || items?.length === 0)\" class=\"completer-no-results\">{{_textNoResults}}</div>\n <div class=\"completer-row-wrapper\" *ngFor=\"let item of items; let rowIndex=index\">\n <div class=\"completer-row\" [ctrRow]=\"rowIndex\" [dataItem]=\"item\">\n <div *ngIf=\"item.image || item.image === ''\" class=\"completer-image-holder\">\n <img *ngIf=\"item.image != ''\" src=\"{{item.image}}\" class=\"completer-image\" />\n <div *ngIf=\"item.image === ''\" class=\"completer-image-default\"></div>\n </div>\n <div class=\"completer-item-text\" [ngClass]=\"{'completer-item-text-image': item.image || item.image === '' }\">\n <completer-list-item class=\"completer-title\" [text]=\"item.title\" [matchClass]=\"matchClass\" [searchStr]=\"searchStr\" [type]=\"'title'\"></completer-list-item>\n <completer-list-item *ngIf=\"item.description && item.description != ''\" class=\"completer-description\" [text]=\"item.description\"\n [matchClass]=\"matchClass\" [searchStr]=\"searchStr\" [type]=\"'description'\">\n </completer-list-item>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n ",
providers: [COMPLETER_CONTROL_VALUE_ACCESSOR],
styles: [".completer-dropdown{border-radius:0;width:calc(100% - 30px);cursor:pointer;z-index:9999;position:absolute;background-color:#fff;max-height:200px;height:200px;overflow-y:auto;overflow-x:hidden;border:1px solid #ececec}.completer-row{color:#000;width:100%;padding:5px 12px}.completer-selected-row{background-color:#add8e6;color:#fff}.completer-description{font-size:14px}.completer-image-default{width:16px;height:16px;background-image:url(demo/res/img/default.png)}.completer-image-holder{float:left;width:10%}.completer-item-text-image{float:right;width:90%}"]
})
// tslint:disable-next-line:component-class-suffix
,
__metadata("design:paramtypes", [CompleterService, core.ChangeDetectorRef])
], CompleterCmp);
return CompleterCmp;
}());
var NgxNeoCompleterModule = /** @class */ (function () {
function NgxNeoCompleterModule() {
}
NgxNeoCompleterModule_1 = NgxNeoCompleterModule;
NgxNeoCompleterModule.forRoot = function () {
return {
ngModule: NgxNeoCompleterModule_1,
providers: [
CompleterService,
LocalDataFactory,
RemoteDataFactory
]
};
};
var NgxNeoCompleterModule_1;
NgxNeoCompleterModule = NgxNeoCompleterModule_1 = __decorate([
core.NgModule({
imports: [
common.CommonModule,
forms.FormsModule,
http.HttpClientModule
],
declarations: [
CompleterListItemCmp,
CtrCompleter,
CtrDropdown,
CtrInput,
CtrList,
CtrRow,
CompleterCmp
],
exports: [
CompleterCmp,
CompleterListItemCmp,
CtrCompleter,
CtrDropdown,
CtrInput,
CtrList,
CtrRow
]
})
], NgxNeoCompleterModule);
return NgxNeoCompleterModule;
}());
/**
* Esta clase permite simplificar el uso de los autocompletadores para funcionar con objetos y no con simples string.
*/
var NgxNeoCompleterService = /** @class */ (function () {
function NgxNeoCompleterService(completerService) {
// variable que realiza el binding con el componente html : [(ngModel)]
this.modelString = '';
// Propiedad sobre la que queremos hacer binding
this.fieldValue = '';
this.completerService = completerService;
}
/**
* Se ejecuta cuando el usuario selecciona un valor del autocompletable
* @author mgesuitti
*/
NgxNeoCompleterService.prototype.onSelected = function (selected) {
if (selected != null) {
this.selectedObject[this.fieldValue] = selected.originalObject;
}
else {
this.selectedObject[this.fieldValue] = this.empty;
}
};
/**
* Se utiliza para asignar los datos locales (cargados previamente desde el servidor)
*
* @author mgesuitti
*/
NgxNeoCompleterService.prototype.local = function (data, selectedObject, fieldValue, searchFields, titleField, emptyObject) {
if (fieldValue === void 0) { fieldValue = ''; }
this.selectedObject = selectedObject;
this.fieldValue = fieldValue;
this.dataSource = this.completerService.local(data, searchFields, titleField);
if (fieldValue !== '') {
this.modelString = this.selectedObject[this.fieldValue][searchFields];
}
else {
this.modelString = this.selectedObject[searchFields];
}
this.empty = emptyObject;
return this.dataSource;
};
return NgxNeoCompleterService;
}());
exports.CompleterBaseData = CompleterBaseData;
exports.CompleterCmp = CompleterCmp;
exports.CompleterListItemCmp = CompleterListItemCmp;
exports.CompleterService = CompleterService;
exports.CtrCompleter = CtrCompleter;
exports.CtrDropdown = CtrDropdown;
exports.CtrInput = CtrInput;
exports.CtrList = CtrList;
exports.CtrListContext = CtrListContext;
exports.CtrRow = CtrRow;
exports.CtrRowItem = CtrRowItem;
exports.LocalData = LocalData;
exports.LocalDataFactory = LocalDataFactory;
exports.NgxNeoCompleterModule = NgxNeoCompleterModule;
exports.NgxNeoCompleterService = NgxNeoCompleterService;
exports.RemoteData = RemoteData;
exports.RemoteDataFactory = RemoteDataFactory;
exports.ɵ0 = ɵ0;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=neocomplexx-ngx-neo-completer.umd.js.map