@asi-ngtools/lib
Version:
This project is a little components library, simple to use, which will help you to simplify your project.
200 lines (199 loc) • 13.9 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
import { Component, Input, Output, ViewChild, ElementRef, Renderer2, EventEmitter } from '@angular/core';
export class AsiFaIconComponent {
/**
* @param {?} renderer
* @param {?} elementRef
*/
constructor(renderer, elementRef) {
this.renderer = renderer;
this.elementRef = elementRef;
/**
* label position
*/
this.labelPosition = 'top';
/**
* Click on the icon submit form
*/
this.submit = false;
/**
* tooltip position
*/
this.tooltipPosition = 'bottom';
/**
* disable click on label
*/
this.noClickOnLabel = false;
/**
* event emitted when click on label or icon
*/
this.onClick = new EventEmitter();
}
/**
* @return {?}
*/
ngOnInit() {
this.renderer.addClass(this.elementRef.nativeElement, 'label-' + this.labelPosition);
this.renderer.addClass(this.tooltipElement.nativeElement, 'tooltip-' + this.tooltipPosition);
if (this.icon != null) {
this.renderIcons(this.icon);
}
if (this.size != null) {
this.renderSize(this.size);
}
}
/**
* Allow to dynamically change the rendered icon and size
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes["icon"] && !changes["icon"].isFirstChange()) {
/** @type {?} */
let iconChange = changes["icon"];
this.resetClasses(iconChange.previousValue);
this.renderIcons(iconChange.currentValue);
}
if (changes["size"] && !changes["size"].isFirstChange()) {
/** @type {?} */
let sizeChange = changes["size"];
this.resetClasses(sizeChange.previousValue);
this.renderSize(sizeChange.currentValue);
}
}
/**
* @param {?} event
* @return {?}
*/
click(event) {
if (!this.disabled) {
this.onClick.emit(event);
}
}
/**
* @param {?} oldIcons string representing the classes to remove
* @return {?}
*/
resetClasses(oldIcons) {
if (!!oldIcons) {
/** @type {?} */
let oldIconsArray = oldIcons.trim().split(' ');
oldIconsArray.forEach((icon) => {
this.renderer.removeClass(this.iconElement.nativeElement, icon);
});
}
}
/**
* Add classes from a string
* @param {?} icons string representing css classes
* @return {?}
*/
renderIcons(icons) {
if (!!icons) {
/** @type {?} */
let newIcons = icons.trim().split(' ');
newIcons.forEach((icon) => {
this.renderer.addClass(this.iconElement.nativeElement, icon);
});
}
}
/**
* @param {?} size the font awesome css class representing the icon size
* @return {?}
*/
renderSize(size) {
if (!!size) {
this.renderer.addClass(this.iconElement.nativeElement, 'fa-' + size);
}
}
}
AsiFaIconComponent.decorators = [
{ type: Component, args: [{
selector: 'asi-fa-icon',
host: { 'class': 'asi-component asi-fa-icon' },
template: "<span (click)=\"!noClickOnLabel && click($event)\" class=\"input-label\" [ngClass]=\"{'enabled' : !disabled && !noClickOnLabel}\" *ngIf=\"label != null\">{{label | translate}}</span>\n<div class=\"icon-panel\">\n <button [disabled]=\"disabled\" [attr.type]=\"submit ? 'submit' : 'button'\" (click)=\"click($event)\" #icon aria-hidden=\"true \">\n <div class=\"asi-tooltip\" #tooltipView>\n <span class=\"tooltip-item\" *ngIf=\"tooltip !=null \" [translate]=\"tooltip \"></span>\n </div>\n </button>\n</div>\n"
}] }
];
/** @nocollapse */
AsiFaIconComponent.ctorParameters = () => [
{ type: Renderer2 },
{ type: ElementRef }
];
AsiFaIconComponent.propDecorators = {
icon: [{ type: Input }],
size: [{ type: Input }],
label: [{ type: Input }],
labelPosition: [{ type: Input }],
submit: [{ type: Input }],
disabled: [{ type: Input }],
tooltip: [{ type: Input }],
tooltipPosition: [{ type: Input }],
noClickOnLabel: [{ type: Input }],
onClick: [{ type: Output }],
tooltipElement: [{ type: ViewChild, args: ['tooltipView',] }],
iconElement: [{ type: ViewChild, args: ['icon',] }]
};
if (false) {
/**
* icon from fontawesome website
* @type {?}
*/
AsiFaIconComponent.prototype.icon;
/**
* icon size
* @type {?}
*/
AsiFaIconComponent.prototype.size;
/**
* label to display (is translated)
* @type {?}
*/
AsiFaIconComponent.prototype.label;
/**
* label position
* @type {?}
*/
AsiFaIconComponent.prototype.labelPosition;
/**
* Click on the icon submit form
* @type {?}
*/
AsiFaIconComponent.prototype.submit;
/**
* is enabled/disabled
* @type {?}
*/
AsiFaIconComponent.prototype.disabled;
/**
* tooltip when mouse over
* @type {?}
*/
AsiFaIconComponent.prototype.tooltip;
/**
* tooltip position
* @type {?}
*/
AsiFaIconComponent.prototype.tooltipPosition;
/**
* disable click on label
* @type {?}
*/
AsiFaIconComponent.prototype.noClickOnLabel;
/**
* event emitted when click on label or icon
* @type {?}
*/
AsiFaIconComponent.prototype.onClick;
/** @type {?} */
AsiFaIconComponent.prototype.tooltipElement;
/** @type {?} */
AsiFaIconComponent.prototype.iconElement;
/** @type {?} */
AsiFaIconComponent.prototype.renderer;
/** @type {?} */
AsiFaIconComponent.prototype.elementRef;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXNpLWZhLWljb24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGFzaS1uZ3Rvb2xzL2xpYi8iLCJzb3VyY2VzIjpbImxpYi9jb21wb25lbnRzL2FzaS1mYS1pY29uL2FzaS1mYS1pY29uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUNMLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQ2hDLFNBQVMsRUFBRSxZQUFZLEVBQ3ZDLE1BQU0sZUFBZSxDQUFDO0FBT3ZCLE1BQU07Ozs7O0lBMkJKLFlBQW9CLFFBQW1CLEVBQVUsVUFBc0I7UUFBbkQsYUFBUSxHQUFSLFFBQVEsQ0FBVztRQUFVLGVBQVUsR0FBVixVQUFVLENBQVk7Ozs7NkJBbEJ3QixLQUFLOzs7O3NCQUVsRixLQUFLOzs7OytCQU15QyxRQUFROzs7OzhCQUU5QyxLQUFLOzs7O3VCQUdYLElBQUksWUFBWSxFQUFjO0tBTWpEOzs7O0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLFFBQVEsR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDckYsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxhQUFhLEVBQUUsVUFBVSxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUMsQ0FBQztRQUU3RixFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxJQUFJLElBQUksQ0FBQyxDQUFDLENBQUM7WUFDdEIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7U0FDN0I7UUFFRCxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxJQUFJLElBQUksQ0FBQyxDQUFDLENBQUM7WUFDdEIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7U0FDNUI7S0FDRjs7Ozs7O0lBTUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLEVBQUUsQ0FBQyxDQUFDLE9BQU8sWUFBUyxDQUFDLE9BQU8sU0FBTSxhQUFhLEVBQUUsQ0FBQyxDQUFDLENBQUM7O1lBQ2xELElBQUksVUFBVSxHQUFHLE9BQU8sU0FBTTtZQUM5QixJQUFJLENBQUMsWUFBWSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsQ0FBQztZQUM1QyxJQUFJLENBQUMsV0FBVyxDQUFDLFVBQVUsQ0FBQyxZQUFZLENBQUMsQ0FBQztTQUMzQztRQUNELEVBQUUsQ0FBQyxDQUFDLE9BQU8sWUFBUyxDQUFDLE9BQU8sU0FBTSxhQUFhLEVBQUUsQ0FBQyxDQUFDLENBQUM7O1lBQ2xELElBQUksVUFBVSxHQUFHLE9BQU8sU0FBTTtZQUM5QixJQUFJLENBQUMsWUFBWSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsQ0FBQztZQUM1QyxJQUFJLENBQUMsVUFBVSxDQUFDLFVBQVUsQ0FBQyxZQUFZLENBQUMsQ0FBQztTQUMxQztLQUNGOzs7OztJQUVNLEtBQUssQ0FBQyxLQUFpQjtRQUM1QixFQUFFLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDO1lBQ25CLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1NBQzFCOzs7Ozs7SUFNSyxZQUFZLENBQUMsUUFBZ0I7UUFDbkMsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUM7O1lBQ2YsSUFBSSxhQUFhLEdBQUcsUUFBUSxDQUFDLElBQUksRUFBRSxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUMvQyxhQUFhLENBQUMsT0FBTyxDQUFDLENBQUMsSUFBSSxFQUFFLEVBQUU7Z0JBQzdCLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsYUFBYSxFQUFFLElBQUksQ0FBQyxDQUFDO2FBQ2pFLENBQUMsQ0FBQztTQUNKOzs7Ozs7O0lBT0ssV0FBVyxDQUFDLEtBQWE7UUFDL0IsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7O1lBQ1osSUFBSSxRQUFRLEdBQUcsS0FBSyxDQUFDLElBQUksRUFBRSxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUN2QyxRQUFRLENBQUMsT0FBTyxDQUFDLENBQUMsSUFBSSxFQUFFLEVBQUU7Z0JBQ3hCLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsYUFBYSxFQUFFLElBQUksQ0FBQyxDQUFDO2FBQzlELENBQUMsQ0FBQztTQUNKOzs7Ozs7SUFNSyxVQUFVLENBQUMsSUFBWTtRQUM3QixFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQztZQUNYLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsYUFBYSxFQUFFLEtBQUssR0FBRyxJQUFJLENBQUMsQ0FBQztTQUN0RTs7OztZQXRHSixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLGFBQWE7Z0JBQ3ZCLElBQUksRUFBRSxFQUFFLE9BQU8sRUFBRSwyQkFBMkIsRUFBRTtnQkFDOUMscWhCQUEyQzthQUM1Qzs7OztZQVBnQixTQUFTO1lBRGEsVUFBVTs7O21CQVk5QyxLQUFLO21CQUVMLEtBQUs7b0JBRUwsS0FBSzs0QkFFTCxLQUFLO3FCQUVMLEtBQUs7dUJBRUwsS0FBSztzQkFFTCxLQUFLOzhCQUVMLEtBQUs7NkJBRUwsS0FBSztzQkFHTCxNQUFNOzZCQUVOLFNBQVMsU0FBQyxhQUFhOzBCQUN2QixTQUFTLFNBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgVmlld0NoaWxkLCBFbGVtZW50UmVmLCBPbkluaXQsIE9uQ2hhbmdlcyxcbiAgU2ltcGxlQ2hhbmdlcywgUmVuZGVyZXIyLCBFdmVudEVtaXR0ZXJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2FzaS1mYS1pY29uJyxcbiAgaG9zdDogeyAnY2xhc3MnOiAnYXNpLWNvbXBvbmVudCBhc2ktZmEtaWNvbicgfSxcbiAgdGVtcGxhdGVVcmw6ICcuL2FzaS1mYS1pY29uLmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBBc2lGYUljb25Db21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG5cbiAgLyoqIGljb24gZnJvbSBmb250YXdlc29tZSB3ZWJzaXRlICovXG4gIEBJbnB1dCgpIGljb246IHN0cmluZztcbiAgLyoqIGljb24gc2l6ZSAqL1xuICBASW5wdXQoKSBzaXplOiAnMXgnIHwgJzJ4JyB8ICczeCcgfCAnNHgnO1xuICAvKiogbGFiZWwgdG8gZGlzcGxheSAoaXMgdHJhbnNsYXRlZCkgKi9cbiAgQElucHV0KCkgbGFiZWw6IHN0cmluZztcbiAgLyoqIGxhYmVsIHBvc2l0aW9uICovXG4gIEBJbnB1dCgpIGxhYmVsUG9zaXRpb246ICd0b3AnIHwgJ2xlZnQnIHwgJ3JpZ2h0JyB8ICdib3R0b20nIHwgJ2JvdHRvbS1jZW50ZXInIHwgJ3RvcC1jZW50ZXInID0gJ3RvcCc7XG4gIC8qKiBDbGljayBvbiB0aGUgaWNvbiBzdWJtaXQgZm9ybSAqL1xuICBASW5wdXQoKSBzdWJtaXQgPSBmYWxzZTtcbiAgLyoqIGlzIGVuYWJsZWQvZGlzYWJsZWQgKi9cbiAgQElucHV0KCkgZGlzYWJsZWQ6IGJvb2xlYW47XG4gIC8qKiB0b29sdGlwIHdoZW4gbW91c2Ugb3ZlciAqL1xuICBASW5wdXQoKSB0b29sdGlwOiBzdHJpbmc7XG4gIC8qKiB0b29sdGlwIHBvc2l0aW9uICovXG4gIEBJbnB1dCgpIHRvb2x0aXBQb3NpdGlvbjogJ3RvcCcgfCAnbGVmdCcgfCAncmlnaHQnIHwgJ2JvdHRvbScgPSAnYm90dG9tJztcbiAgLyoqIGRpc2FibGUgY2xpY2sgb24gbGFiZWwgKi9cbiAgQElucHV0KCkgbm9DbGlja09uTGFiZWwgPSBmYWxzZTtcblxuICAvKiogZXZlbnQgZW1pdHRlZCB3aGVuIGNsaWNrIG9uIGxhYmVsIG9yIGljb24gKi9cbiAgQE91dHB1dCgpIG9uQ2xpY2sgPSBuZXcgRXZlbnRFbWl0dGVyPE1vdXNlRXZlbnQ+KCk7XG5cbiAgQFZpZXdDaGlsZCgndG9vbHRpcFZpZXcnKSB0b29sdGlwRWxlbWVudDogRWxlbWVudFJlZjtcbiAgQFZpZXdDaGlsZCgnaWNvbicpIGljb25FbGVtZW50OiBFbGVtZW50UmVmO1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMiwgcHJpdmF0ZSBlbGVtZW50UmVmOiBFbGVtZW50UmVmKSB7XG4gIH1cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLnJlbmRlcmVyLmFkZENsYXNzKHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LCAnbGFiZWwtJyArIHRoaXMubGFiZWxQb3NpdGlvbik7XG4gICAgdGhpcy5yZW5kZXJlci5hZGRDbGFzcyh0aGlzLnRvb2x0aXBFbGVtZW50Lm5hdGl2ZUVsZW1lbnQsICd0b29sdGlwLScgKyB0aGlzLnRvb2x0aXBQb3NpdGlvbik7XG5cbiAgICBpZiAodGhpcy5pY29uICE9IG51bGwpIHtcbiAgICAgIHRoaXMucmVuZGVySWNvbnModGhpcy5pY29uKTtcbiAgICB9XG5cbiAgICBpZiAodGhpcy5zaXplICE9IG51bGwpIHtcbiAgICAgIHRoaXMucmVuZGVyU2l6ZSh0aGlzLnNpemUpO1xuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBBbGxvdyB0byBkeW5hbWljYWxseSBjaGFuZ2UgdGhlIHJlbmRlcmVkIGljb24gYW5kIHNpemVcbiAgICogQHBhcmFtIGNoYW5nZXNcbiAgICovXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcbiAgICBpZiAoY2hhbmdlcy5pY29uICYmICFjaGFuZ2VzLmljb24uaXNGaXJzdENoYW5nZSgpKSB7XG4gICAgICBsZXQgaWNvbkNoYW5nZSA9IGNoYW5nZXMuaWNvbjtcbiAgICAgIHRoaXMucmVzZXRDbGFzc2VzKGljb25DaGFuZ2UucHJldmlvdXNWYWx1ZSk7XG4gICAgICB0aGlzLnJlbmRlckljb25zKGljb25DaGFuZ2UuY3VycmVudFZhbHVlKTtcbiAgICB9XG4gICAgaWYgKGNoYW5nZXMuc2l6ZSAmJiAhY2hhbmdlcy5zaXplLmlzRmlyc3RDaGFuZ2UoKSkge1xuICAgICAgbGV0IHNpemVDaGFuZ2UgPSBjaGFuZ2VzLnNpemU7XG4gICAgICB0aGlzLnJlc2V0Q2xhc3NlcyhzaXplQ2hhbmdlLnByZXZpb3VzVmFsdWUpO1xuICAgICAgdGhpcy5yZW5kZXJTaXplKHNpemVDaGFuZ2UuY3VycmVudFZhbHVlKTtcbiAgICB9XG4gIH1cblxuICBwdWJsaWMgY2xpY2soZXZlbnQ6IE1vdXNlRXZlbnQpIHtcbiAgICBpZiAoIXRoaXMuZGlzYWJsZWQpIHtcbiAgICAgIHRoaXMub25DbGljay5lbWl0KGV2ZW50KTtcbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogQHBhcmFtIG9sZEljb25zIHN0cmluZyByZXByZXNlbnRpbmcgdGhlIGNsYXNzZXMgdG8gcmVtb3ZlXG4gICAqL1xuICBwcml2YXRlIHJlc2V0Q2xhc3NlcyhvbGRJY29uczogc3RyaW5nKSB7XG4gICAgaWYgKCEhb2xkSWNvbnMpIHtcbiAgICAgIGxldCBvbGRJY29uc0FycmF5ID0gb2xkSWNvbnMudHJpbSgpLnNwbGl0KCcgJyk7XG4gICAgICBvbGRJY29uc0FycmF5LmZvckVhY2goKGljb24pID0+IHtcbiAgICAgICAgdGhpcy5yZW5kZXJlci5yZW1vdmVDbGFzcyh0aGlzLmljb25FbGVtZW50Lm5hdGl2ZUVsZW1lbnQsIGljb24pO1xuICAgICAgfSk7XG4gICAgfVxuICB9XG5cbiAgLyoqXG4gICAqIEFkZCBjbGFzc2VzIGZyb20gYSBzdHJpbmdcbiAgICogQHBhcmFtIGljb25zIHN0cmluZyByZXByZXNlbnRpbmcgY3NzIGNsYXNzZXNcbiAgICovXG4gIHByaXZhdGUgcmVuZGVySWNvbnMoaWNvbnM6IHN0cmluZykge1xuICAgIGlmICghIWljb25zKSB7XG4gICAgICBsZXQgbmV3SWNvbnMgPSBpY29ucy50cmltKCkuc3BsaXQoJyAnKTtcbiAgICAgIG5ld0ljb25zLmZvckVhY2goKGljb24pID0+IHtcbiAgICAgICAgdGhpcy5yZW5kZXJlci5hZGRDbGFzcyh0aGlzLmljb25FbGVtZW50Lm5hdGl2ZUVsZW1lbnQsIGljb24pO1xuICAgICAgfSk7XG4gICAgfVxuICB9XG5cbiAgLyoqXG4gICAqIEBwYXJhbSBzaXplIHRoZSBmb250IGF3ZXNvbWUgY3NzIGNsYXNzIHJlcHJlc2VudGluZyB0aGUgaWNvbiBzaXplXG4gICAqL1xuICBwcml2YXRlIHJlbmRlclNpemUoc2l6ZTogc3RyaW5nKSB7XG4gICAgaWYgKCEhc2l6ZSkge1xuICAgICAgdGhpcy5yZW5kZXJlci5hZGRDbGFzcyh0aGlzLmljb25FbGVtZW50Lm5hdGl2ZUVsZW1lbnQsICdmYS0nICsgc2l6ZSk7XG4gICAgfVxuICB9XG59XG4iXX0=