@angular-generic-table/core
Version:
A generic table component for Angular
183 lines (182 loc) • 14.6 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
import { Component, EventEmitter, Input, Output, Renderer2 } from '@angular/core';
import { Subject } from 'rxjs/Subject';
import * as Tether from 'tether';
var GtDropdownComponent = /** @class */ (function () {
function GtDropdownComponent(renderer) {
this.renderer = renderer;
this.selectedChange = new EventEmitter();
this.active = false;
this.state = new Subject();
}
Object.defineProperty(GtDropdownComponent.prototype, "selected", {
get: /**
* @return {?}
*/
function () {
return this._selected;
},
set: /**
* @param {?} selection
* @return {?}
*/
function (selection) {
this._selected = selection;
},
enumerable: true,
configurable: true
});
/**
* @param {?} option
* @return {?}
*/
GtDropdownComponent.prototype.select = /**
* @param {?} option
* @return {?}
*/
function (option) {
this.active = false;
this.state.next(this.active);
if (this._selected !== option) {
this.selectedChange.emit(option);
}
};
/**
* @return {?}
*/
GtDropdownComponent.prototype.toggleDropdown = /**
* @return {?}
*/
function () {
var _this = this;
this.active = !this.active;
setTimeout(function () {
_this.state.next(_this.active);
}, 0);
};
/**
* @return {?}
*/
GtDropdownComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
this.state.subscribe(function (state) {
if (state) {
_this.tether = new Tether({
element: '#' + _this.id + '_menu',
target: '#' + _this.id,
attachment: 'top left',
targetAttachment: 'bottom left',
constraints: [
{
to: 'window',
attachment: 'together'
}
]
});
_this.tether.position();
// set up click listener and listen for click outside dropdown
// set up click listener and listen for click outside dropdown
_this.clickListener = _this.renderer.listen('document', 'click', function (event) {
_this.active = false;
_this.state.next(_this.active);
});
// set up keyboard listener and listen for escape key up
// set up keyboard listener and listen for escape key up
_this.keyupListener = _this.renderer.listen('document', 'keyup', function (event) {
switch (event.key) {
case 'Escape':
_this.active = false;
_this.state.next(_this.active);
break;
}
});
}
else {
_this.tether.destroy();
_this.removeListeners();
}
});
};
/**
* @return {?}
*/
GtDropdownComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.removeListeners();
};
/**
* @return {?}
*/
GtDropdownComponent.prototype.removeListeners = /**
* @return {?}
*/
function () {
if (this.clickListener) {
this.clickListener();
}
if (this.keyupListener) {
this.keyupListener();
}
};
GtDropdownComponent.decorators = [
{ type: Component, args: [{
selector: 'gt-dropdown',
template: "\n <div class=\"dropdown gt-dropdown\" [ngClass]=\"{'show':active}\" [attr.id]=\"id\">\n <div class=\"dropdown-toggle\" (click)=\"toggleDropdown()\" [attr.aria-expanded]=\"active\">{{selected}}</div>\n <div class=\"gt-dropdown-menu dropdown-menu\" *ngIf=\"active\" [ngClass]=\"{'show':active}\" [attr.id]=\"id+'_menu'\">\n <button *ngFor=\"let option of options;\" class=\"dropdown-item\" (click)=\"select(option)\" [ngClass]=\"{'active':option === selected}\">{{option}}</button>\n </div>\n </div>\n ",
styles: [
"\n .gt-dropdown .dropdown-toggle {\n cursor: pointer;\n }\n .gt-dropdown .dropdown-toggle::after {\n transition: opacity 0.4s ease-in-out;\n opacity: 0;\n }\n .gt-dropdown .dropdown-toggle:hover::after {\n opacity: 1;\n }\n "
]
},] },
];
/** @nocollapse */
GtDropdownComponent.ctorParameters = function () { return [
{ type: Renderer2, },
]; };
GtDropdownComponent.propDecorators = {
"selected": [{ type: Input },],
"options": [{ type: Input },],
"id": [{ type: Input },],
"selectedChange": [{ type: Output },],
};
return GtDropdownComponent;
}());
export { GtDropdownComponent };
function GtDropdownComponent_tsickle_Closure_declarations() {
/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
GtDropdownComponent.decorators;
/**
* @nocollapse
* @type {function(): !Array<(null|{type: ?, decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>)})>}
*/
GtDropdownComponent.ctorParameters;
/** @type {!Object<string,!Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
GtDropdownComponent.propDecorators;
/** @type {?} */
GtDropdownComponent.prototype._selected;
/** @type {?} */
GtDropdownComponent.prototype.options;
/** @type {?} */
GtDropdownComponent.prototype.id;
/** @type {?} */
GtDropdownComponent.prototype.selectedChange;
/** @type {?} */
GtDropdownComponent.prototype.active;
/** @type {?} */
GtDropdownComponent.prototype.state;
/** @type {?} */
GtDropdownComponent.prototype.tether;
/** @type {?} */
GtDropdownComponent.prototype.clickListener;
/** @type {?} */
GtDropdownComponent.prototype.keyupListener;
/** @type {?} */
GtDropdownComponent.prototype.renderer;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3QtZHJvcGRvd24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGFuZ3VsYXItZ2VuZXJpYy10YWJsZS9jb3JlLyIsInNvdXJjZXMiOlsiY29tcG9uZW50cy9ndC1kcm9wZG93bi5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFDTixTQUFTLEVBQ1QsWUFBWSxFQUNaLEtBQUssRUFHTCxNQUFNLEVBQ04sU0FBUyxFQUNULE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxjQUFjLENBQUM7QUFDdkMsT0FBTyxLQUFLLE1BQU0sTUFBTSxRQUFRLENBQUM7O0lBK0NoQyw2QkFBb0IsUUFBbUI7UUFBbkIsYUFBUSxHQUFSLFFBQVEsQ0FBVzs4QkFSTyxJQUFJLFlBQVksRUFBRTtzQkFFdkQsS0FBSztxQkFDWSxJQUFJLE9BQU8sRUFBRTtLQUtJO0lBbkIzQyxzQkFBSSx5Q0FBUTs7OztRQUFaO1lBQ0MsTUFBTSxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUM7U0FDdEI7Ozs7O2tCQUlZLFNBQVM7WUFDckIsSUFBSSxDQUFDLFNBQVMsR0FBRyxTQUFTLENBQUM7Ozs7T0FMM0I7Ozs7O0lBbUJELG9DQUFNOzs7O0lBQU4sVUFBTyxNQUFXO1FBQ2pCLElBQUksQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO1FBQ3BCLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUM3QixFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsU0FBUyxLQUFLLE1BQU0sQ0FBQyxDQUFDLENBQUM7WUFDL0IsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7U0FDakM7S0FDRDs7OztJQUVELDRDQUFjOzs7SUFBZDtRQUFBLGlCQUtDO1FBSkEsSUFBSSxDQUFDLE1BQU0sR0FBRyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUM7UUFDM0IsVUFBVSxDQUFDO1lBQ1YsS0FBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsS0FBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1NBQzdCLEVBQUUsQ0FBQyxDQUFDLENBQUM7S0FDTjs7OztJQUVELHNDQUFROzs7SUFBUjtRQUFBLGlCQThDQztRQTdDQSxJQUFJLENBQUMsS0FBSyxDQUFDLFNBQVMsQ0FBQyxVQUFBLEtBQUs7WUFDekIsRUFBRSxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztnQkFDWCxLQUFJLENBQUMsTUFBTSxHQUFHLElBQUksTUFBTSxDQUFDO29CQUN4QixPQUFPLEVBQUUsR0FBRyxHQUFHLEtBQUksQ0FBQyxFQUFFLEdBQUcsT0FBTztvQkFDaEMsTUFBTSxFQUFFLEdBQUcsR0FBRyxLQUFJLENBQUMsRUFBRTtvQkFDckIsVUFBVSxFQUFFLFVBQVU7b0JBQ3RCLGdCQUFnQixFQUFFLGFBQWE7b0JBQy9CLFdBQVcsRUFBRTt3QkFDWjs0QkFDQyxFQUFFLEVBQUUsUUFBUTs0QkFDWixVQUFVLEVBQUUsVUFBVTt5QkFDdEI7cUJBQ0Q7aUJBQ0QsQ0FBQyxDQUFDO2dCQUVILEtBQUksQ0FBQyxNQUFNLENBQUMsUUFBUSxFQUFFLENBQUM7O2dCQUd2QixBQURBLDhEQUE4RDtnQkFDOUQsS0FBSSxDQUFDLGFBQWEsR0FBRyxLQUFJLENBQUMsUUFBUSxDQUFDLE1BQU0sQ0FDeEMsVUFBVSxFQUNWLE9BQU8sRUFDUCxVQUFDLEtBQWlCO29CQUNqQixLQUFJLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztvQkFDcEIsS0FBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsS0FBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO2lCQUM3QixDQUNELENBQUM7O2dCQUdGLEFBREEsd0RBQXdEO2dCQUN4RCxLQUFJLENBQUMsYUFBYSxHQUFHLEtBQUksQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUN4QyxVQUFVLEVBQ1YsT0FBTyxFQUNQLFVBQUMsS0FBb0I7b0JBQ3BCLE1BQU0sQ0FBQyxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDO3dCQUNuQixLQUFLLFFBQVE7NEJBQ1osS0FBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7NEJBQ3BCLEtBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQzs0QkFDN0IsS0FBSyxDQUFDO3FCQUNQO2lCQUNELENBQ0QsQ0FBQzthQUNGO1lBQUMsSUFBSSxDQUFDLENBQUM7Z0JBQ1AsS0FBSSxDQUFDLE1BQU0sQ0FBQyxPQUFPLEVBQUUsQ0FBQztnQkFDdEIsS0FBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO2FBQ3ZCO1NBQ0QsQ0FBQyxDQUFDO0tBQ0g7Ozs7SUFFRCx5Q0FBVzs7O0lBQVg7UUFDQyxJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7S0FDdkI7Ozs7SUFFRCw2Q0FBZTs7O0lBQWY7UUFDQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQztZQUN4QixJQUFJLENBQUMsYUFBYSxFQUFFLENBQUM7U0FDckI7UUFDRCxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQztZQUN4QixJQUFJLENBQUMsYUFBYSxFQUFFLENBQUM7U0FDckI7S0FDRDs7Z0JBekhELFNBQVMsU0FBQztvQkFDVixRQUFRLEVBQUUsYUFBYTtvQkFDdkIsUUFBUSxFQUFFLG9oQkFPUjtvQkFDRixNQUFNLEVBQUU7d0JBQ1AseVFBV0M7cUJBQ0Q7aUJBQ0Q7Ozs7Z0JBN0JBLFNBQVM7Ozs2QkFvQ1IsS0FBSzs0QkFJTCxLQUFLO3VCQUNMLEtBQUs7bUNBQ0wsTUFBTTs7OEJBakRSOztTQXFDYSxtQkFBbUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuXHRDb21wb25lbnQsXG5cdEV2ZW50RW1pdHRlcixcblx0SW5wdXQsXG5cdE9uRGVzdHJveSxcblx0T25Jbml0LFxuXHRPdXRwdXQsXG5cdFJlbmRlcmVyMlxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFN1YmplY3QgfSBmcm9tICdyeGpzL1N1YmplY3QnO1xuaW1wb3J0ICogYXMgVGV0aGVyIGZyb20gJ3RldGhlcic7XG5cbkBDb21wb25lbnQoe1xuXHRzZWxlY3RvcjogJ2d0LWRyb3Bkb3duJyxcblx0dGVtcGxhdGU6IGBcbiAgICA8ZGl2IGNsYXNzPVwiZHJvcGRvd24gZ3QtZHJvcGRvd25cIiBbbmdDbGFzc109XCJ7J3Nob3cnOmFjdGl2ZX1cIiBbYXR0ci5pZF09XCJpZFwiPlxuICAgICAgPGRpdiBjbGFzcz1cImRyb3Bkb3duLXRvZ2dsZVwiIChjbGljayk9XCJ0b2dnbGVEcm9wZG93bigpXCIgW2F0dHIuYXJpYS1leHBhbmRlZF09XCJhY3RpdmVcIj57e3NlbGVjdGVkfX08L2Rpdj5cbiAgICAgIDxkaXYgY2xhc3M9XCJndC1kcm9wZG93bi1tZW51IGRyb3Bkb3duLW1lbnVcIiAqbmdJZj1cImFjdGl2ZVwiIFtuZ0NsYXNzXT1cInsnc2hvdyc6YWN0aXZlfVwiIFthdHRyLmlkXT1cImlkKydfbWVudSdcIj5cbiAgICAgICAgPGJ1dHRvbiAqbmdGb3I9XCJsZXQgb3B0aW9uIG9mIG9wdGlvbnM7XCIgY2xhc3M9XCJkcm9wZG93bi1pdGVtXCIgKGNsaWNrKT1cInNlbGVjdChvcHRpb24pXCIgW25nQ2xhc3NdPVwieydhY3RpdmUnOm9wdGlvbiA9PT0gc2VsZWN0ZWR9XCI+e3tvcHRpb259fTwvYnV0dG9uPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIGAsXG5cdHN0eWxlczogW1xuXHRcdGBcbiAgICAuZ3QtZHJvcGRvd24gLmRyb3Bkb3duLXRvZ2dsZSB7XG4gICAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgfVxuICAgIC5ndC1kcm9wZG93biAuZHJvcGRvd24tdG9nZ2xlOjphZnRlciB7XG4gICAgICB0cmFuc2l0aW9uOiBvcGFjaXR5IDAuNHMgZWFzZS1pbi1vdXQ7XG4gICAgICBvcGFjaXR5OiAwO1xuICAgIH1cbiAgICAuZ3QtZHJvcGRvd24gLmRyb3Bkb3duLXRvZ2dsZTpob3Zlcjo6YWZ0ZXIge1xuICAgICAgb3BhY2l0eTogMTtcbiAgICB9XG4gIGBcblx0XVxufSlcbmV4cG9ydCBjbGFzcyBHdERyb3Bkb3duQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3kge1xuXHRnZXQgc2VsZWN0ZWQoKSB7XG5cdFx0cmV0dXJuIHRoaXMuX3NlbGVjdGVkO1xuXHR9XG5cblx0X3NlbGVjdGVkOiBhbnk7XG5cdEBJbnB1dCgpXG5cdHNldCBzZWxlY3RlZChzZWxlY3Rpb24pIHtcblx0XHR0aGlzLl9zZWxlY3RlZCA9IHNlbGVjdGlvbjtcblx0fVxuXHRASW5wdXQoKSBvcHRpb25zOiBBcnJheTxhbnk+O1xuXHRASW5wdXQoKSBpZDogc3RyaW5nO1xuXHRAT3V0cHV0KCkgc2VsZWN0ZWRDaGFuZ2U6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG5cdGFjdGl2ZSA9IGZhbHNlOyAvLyBpcyBkcm9wZG93biBhY3RpdmUgb3Igbm90XG5cdHN0YXRlOiBTdWJqZWN0PGJvb2xlYW4+ID0gbmV3IFN1YmplY3QoKTsgLy8gY3VycmVudCBzdGF0ZSBvZiBkcm9wZG93blxuXHR0ZXRoZXI6IGFueTtcblx0Y2xpY2tMaXN0ZW5lcjogRnVuY3Rpb247XG5cdGtleXVwTGlzdGVuZXI6IEZ1bmN0aW9uO1xuXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMikge31cblxuXHRzZWxlY3Qob3B0aW9uOiBhbnkpIHtcblx0XHR0aGlzLmFjdGl2ZSA9IGZhbHNlO1xuXHRcdHRoaXMuc3RhdGUubmV4dCh0aGlzLmFjdGl2ZSk7XG5cdFx0aWYgKHRoaXMuX3NlbGVjdGVkICE9PSBvcHRpb24pIHtcblx0XHRcdHRoaXMuc2VsZWN0ZWRDaGFuZ2UuZW1pdChvcHRpb24pO1xuXHRcdH1cblx0fVxuXG5cdHRvZ2dsZURyb3Bkb3duKCkge1xuXHRcdHRoaXMuYWN0aXZlID0gIXRoaXMuYWN0aXZlO1xuXHRcdHNldFRpbWVvdXQoKCkgPT4ge1xuXHRcdFx0dGhpcy5zdGF0ZS5uZXh0KHRoaXMuYWN0aXZlKTtcblx0XHR9LCAwKTtcblx0fVxuXG5cdG5nT25Jbml0KCkge1xuXHRcdHRoaXMuc3RhdGUuc3Vic2NyaWJlKHN0YXRlID0+IHtcblx0XHRcdGlmIChzdGF0ZSkge1xuXHRcdFx0XHR0aGlzLnRldGhlciA9IG5ldyBUZXRoZXIoe1xuXHRcdFx0XHRcdGVsZW1lbnQ6ICcjJyArIHRoaXMuaWQgKyAnX21lbnUnLFxuXHRcdFx0XHRcdHRhcmdldDogJyMnICsgdGhpcy5pZCxcblx0XHRcdFx0XHRhdHRhY2htZW50OiAndG9wIGxlZnQnLFxuXHRcdFx0XHRcdHRhcmdldEF0dGFjaG1lbnQ6ICdib3R0b20gbGVmdCcsXG5cdFx0XHRcdFx0Y29uc3RyYWludHM6IFtcblx0XHRcdFx0XHRcdHtcblx0XHRcdFx0XHRcdFx0dG86ICd3aW5kb3cnLFxuXHRcdFx0XHRcdFx0XHRhdHRhY2htZW50OiAndG9nZXRoZXInXG5cdFx0XHRcdFx0XHR9XG5cdFx0XHRcdFx0XVxuXHRcdFx0XHR9KTtcblxuXHRcdFx0XHR0aGlzLnRldGhlci5wb3NpdGlvbigpO1xuXG5cdFx0XHRcdC8vIHNldCB1cCBjbGljayBsaXN0ZW5lciBhbmQgbGlzdGVuIGZvciBjbGljayBvdXRzaWRlIGRyb3Bkb3duXG5cdFx0XHRcdHRoaXMuY2xpY2tMaXN0ZW5lciA9IHRoaXMucmVuZGVyZXIubGlzdGVuKFxuXHRcdFx0XHRcdCdkb2N1bWVudCcsXG5cdFx0XHRcdFx0J2NsaWNrJyxcblx0XHRcdFx0XHQoZXZlbnQ6IE1vdXNlRXZlbnQpID0+IHtcblx0XHRcdFx0XHRcdHRoaXMuYWN0aXZlID0gZmFsc2U7XG5cdFx0XHRcdFx0XHR0aGlzLnN0YXRlLm5leHQodGhpcy5hY3RpdmUpO1xuXHRcdFx0XHRcdH1cblx0XHRcdFx0KTtcblxuXHRcdFx0XHQvLyBzZXQgdXAga2V5Ym9hcmQgbGlzdGVuZXIgYW5kIGxpc3RlbiBmb3IgZXNjYXBlIGtleSB1cFxuXHRcdFx0XHR0aGlzLmtleXVwTGlzdGVuZXIgPSB0aGlzLnJlbmRlcmVyLmxpc3Rlbihcblx0XHRcdFx0XHQnZG9jdW1lbnQnLFxuXHRcdFx0XHRcdCdrZXl1cCcsXG5cdFx0XHRcdFx0KGV2ZW50OiBLZXlib2FyZEV2ZW50KSA9PiB7XG5cdFx0XHRcdFx0XHRzd2l0Y2ggKGV2ZW50LmtleSkge1xuXHRcdFx0XHRcdFx0XHRjYXNlICdFc2NhcGUnOlxuXHRcdFx0XHRcdFx0XHRcdHRoaXMuYWN0aXZlID0gZmFsc2U7XG5cdFx0XHRcdFx0XHRcdFx0dGhpcy5zdGF0ZS5uZXh0KHRoaXMuYWN0aXZlKTtcblx0XHRcdFx0XHRcdFx0XHRicmVhaztcblx0XHRcdFx0XHRcdH1cblx0XHRcdFx0XHR9XG5cdFx0XHRcdCk7XG5cdFx0XHR9IGVsc2Uge1xuXHRcdFx0XHR0aGlzLnRldGhlci5kZXN0cm95KCk7XG5cdFx0XHRcdHRoaXMucmVtb3ZlTGlzdGVuZXJzKCk7XG5cdFx0XHR9XG5cdFx0fSk7XG5cdH1cblxuXHRuZ09uRGVzdHJveSgpIHtcblx0XHR0aGlzLnJlbW92ZUxpc3RlbmVycygpO1xuXHR9XG5cblx0cmVtb3ZlTGlzdGVuZXJzKCkge1xuXHRcdGlmICh0aGlzLmNsaWNrTGlzdGVuZXIpIHtcblx0XHRcdHRoaXMuY2xpY2tMaXN0ZW5lcigpO1xuXHRcdH1cblx0XHRpZiAodGhpcy5rZXl1cExpc3RlbmVyKSB7XG5cdFx0XHR0aGlzLmtleXVwTGlzdGVuZXIoKTtcblx0XHR9XG5cdH1cbn1cbiJdfQ==