UNPKG

@jaspero/ng-helpers

Version:

[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release) [![CircleCI](https://circleci.com/gh/Jaspero/ng-helpers.svg?style=svg)](https://circleci.

76 lines 9.11 kB
import { Directive, Inject, Input } from '@angular/core'; import { finalize } from 'rxjs/operators'; import { LOAD_CLICK_CLASS } from './load-click-class.const'; import * as i0 from "@angular/core"; /** * Directive will add loading class to the host element on click event * Usage: [jpLoadClick]="save()" * Function save() should return observable */ export class LoadClickDirective { _el; _renderer; _defaultLoadClickClass; constructor(_el, _renderer, _defaultLoadClickClass) { this._el = _el; this._renderer = _renderer; this._defaultLoadClickClass = _defaultLoadClickClass; } jpLoadClick; loadClickEventType = 'click'; loadClickStopPropagation = false; loadClickPreventDefault = false; loadClickClass; disableAttribute = true; subscription; ngOnInit() { this._renderer.listen(this._el.nativeElement, this.loadClickEventType, event => { const defaultClass = this.loadClickClass || this._defaultLoadClickClass; if (this.loadClickStopPropagation) { event.stopPropagation(); } if (this.loadClickPreventDefault) { event.preventDefault(); } this._renderer.addClass(this._el.nativeElement, defaultClass); if (this.disableAttribute) { this._renderer.setAttribute(this._el.nativeElement, 'disabled', ''); } this.subscription = this.jpLoadClick() .pipe(finalize(() => { this._renderer.removeClass(this._el.nativeElement, defaultClass); if (this.disableAttribute) { this._renderer.removeAttribute(this._el.nativeElement, 'disabled'); } })) .subscribe(); }); } ngOnDestroy() { if (this.subscription) { this.subscription.unsubscribe(); } } /** @nocollapse */ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadClickDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: LOAD_CLICK_CLASS }], target: i0.ɵɵFactoryTarget.Directive }); /** @nocollapse */ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: LoadClickDirective, selector: "[jpLoadClick]", inputs: { jpLoadClick: "jpLoadClick", loadClickEventType: "loadClickEventType", loadClickStopPropagation: "loadClickStopPropagation", loadClickPreventDefault: "loadClickPreventDefault", loadClickClass: "loadClickClass", disableAttribute: "disableAttribute" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadClickDirective, decorators: [{ type: Directive, args: [{ selector: '[jpLoadClick]' }] }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined, decorators: [{ type: Inject, args: [LOAD_CLICK_CLASS] }] }], propDecorators: { jpLoadClick: [{ type: Input }], loadClickEventType: [{ type: Input }], loadClickStopPropagation: [{ type: Input }], loadClickPreventDefault: [{ type: Input }], loadClickClass: [{ type: Input }], disableAttribute: [{ type: Input }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZC1jbGljay5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1oZWxwZXJzL3NyYy9kaXJlY3RpdmVzL2xvYWQtY2xpY2svbG9hZC1jbGljay5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBYyxNQUFNLEVBQUUsS0FBSyxFQUErQixNQUFNLGVBQWUsQ0FBQztBQUVqRyxPQUFPLEVBQUMsUUFBUSxFQUFDLE1BQU0sZ0JBQWdCLENBQUM7QUFDeEMsT0FBTyxFQUFDLGdCQUFnQixFQUFDLE1BQU0sMEJBQTBCLENBQUM7O0FBRTFEOzs7O0dBSUc7QUFHSCxNQUFNLE9BQU8sa0JBQWtCO0lBRW5CO0lBQ0E7SUFDMEI7SUFIcEMsWUFDVSxHQUFlLEVBQ2YsU0FBb0IsRUFDTSxzQkFBOEI7UUFGeEQsUUFBRyxHQUFILEdBQUcsQ0FBWTtRQUNmLGNBQVMsR0FBVCxTQUFTLENBQVc7UUFDTSwyQkFBc0IsR0FBdEIsc0JBQXNCLENBQVE7SUFDL0QsQ0FBQztJQUdKLFdBQVcsQ0FBd0I7SUFHbkMsa0JBQWtCLEdBQUcsT0FBTyxDQUFDO0lBRzdCLHdCQUF3QixHQUFHLEtBQUssQ0FBQztJQUdqQyx1QkFBdUIsR0FBRyxLQUFLLENBQUM7SUFHaEMsY0FBYyxDQUFTO0lBR3ZCLGdCQUFnQixHQUFHLElBQUksQ0FBQztJQUV4QixZQUFZLENBQWU7SUFFM0IsUUFBUTtRQUNOLElBQUksQ0FBQyxTQUFTLENBQUMsTUFBTSxDQUNuQixJQUFJLENBQUMsR0FBRyxDQUFDLGFBQWEsRUFDdEIsSUFBSSxDQUFDLGtCQUFrQixFQUN2QixLQUFLLENBQUMsRUFBRTtZQUNOLE1BQU0sWUFBWSxHQUFHLElBQUksQ0FBQyxjQUFjLElBQUksSUFBSSxDQUFDLHNCQUFzQixDQUFDO1lBRXhFLElBQUksSUFBSSxDQUFDLHdCQUF3QixFQUFFLENBQUM7Z0JBQ2xDLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztZQUMxQixDQUFDO1lBRUQsSUFBSSxJQUFJLENBQUMsdUJBQXVCLEVBQUUsQ0FBQztnQkFDakMsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3pCLENBQUM7WUFFRCxJQUFJLENBQUMsU0FBUyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLGFBQWEsRUFBRSxZQUFZLENBQUMsQ0FBQztZQUU5RCxJQUFJLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO2dCQUMxQixJQUFJLENBQUMsU0FBUyxDQUFDLFlBQVksQ0FDekIsSUFBSSxDQUFDLEdBQUcsQ0FBQyxhQUFhLEVBQ3RCLFVBQVUsRUFDVixFQUFFLENBQ0gsQ0FBQztZQUNKLENBQUM7WUFFRCxJQUFJLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQyxXQUFXLEVBQUU7aUJBQ25DLElBQUksQ0FDSCxRQUFRLENBQUMsR0FBRyxFQUFFO2dCQUNaLElBQUksQ0FBQyxTQUFTLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsYUFBYSxFQUFFLFlBQVksQ0FBQyxDQUFDO2dCQUVqRSxJQUFJLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO29CQUMxQixJQUFJLENBQUMsU0FBUyxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLGFBQWEsRUFBRSxVQUFVLENBQUMsQ0FBQztnQkFDckUsQ0FBQztZQUNILENBQUMsQ0FBQyxDQUNIO2lCQUNBLFNBQVMsRUFBRSxDQUFDO1FBQ2pCLENBQUMsQ0FDRixDQUFDO0lBQ0osQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQztZQUN0QixJQUFJLENBQUMsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ2xDLENBQUM7SUFDSCxDQUFDOzJIQXZFVSxrQkFBa0IscUVBSW5CLGdCQUFnQjsrR0FKZixrQkFBa0I7OzRGQUFsQixrQkFBa0I7a0JBRDlCLFNBQVM7bUJBQUMsRUFBQyxRQUFRLEVBQUUsZUFBZSxFQUFDOzswQkFLakMsTUFBTTsyQkFBQyxnQkFBZ0I7eUNBSTFCLFdBQVc7c0JBRFYsS0FBSztnQkFJTixrQkFBa0I7c0JBRGpCLEtBQUs7Z0JBSU4sd0JBQXdCO3NCQUR2QixLQUFLO2dCQUlOLHVCQUF1QjtzQkFEdEIsS0FBSztnQkFJTixjQUFjO3NCQURiLEtBQUs7Z0JBSU4sZ0JBQWdCO3NCQURmLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0RpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5qZWN0LCBJbnB1dCwgT25EZXN0cm95LCBPbkluaXQsIFJlbmRlcmVyMn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge09ic2VydmFibGUsIFN1YnNjcmlwdGlvbn0gZnJvbSAncnhqcyc7XG5pbXBvcnQge2ZpbmFsaXplfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5pbXBvcnQge0xPQURfQ0xJQ0tfQ0xBU1N9IGZyb20gJy4vbG9hZC1jbGljay1jbGFzcy5jb25zdCc7XG5cbi8qKlxuICogRGlyZWN0aXZlIHdpbGwgYWRkIGxvYWRpbmcgY2xhc3MgdG8gdGhlIGhvc3QgZWxlbWVudCBvbiBjbGljayBldmVudFxuICogVXNhZ2U6IFtqcExvYWRDbGlja109XCJzYXZlKClcIlxuICogRnVuY3Rpb24gc2F2ZSgpIHNob3VsZCByZXR1cm4gb2JzZXJ2YWJsZVxuICovXG5cbkBEaXJlY3RpdmUoe3NlbGVjdG9yOiAnW2pwTG9hZENsaWNrXSd9KVxuZXhwb3J0IGNsYXNzIExvYWRDbGlja0RpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95IHtcbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSBfZWw6IEVsZW1lbnRSZWYsXG4gICAgcHJpdmF0ZSBfcmVuZGVyZXI6IFJlbmRlcmVyMixcbiAgICBASW5qZWN0KExPQURfQ0xJQ0tfQ0xBU1MpIHByaXZhdGUgX2RlZmF1bHRMb2FkQ2xpY2tDbGFzczogc3RyaW5nXG4gICkge31cblxuICBASW5wdXQoKVxuICBqcExvYWRDbGljazogKCkgPT4gT2JzZXJ2YWJsZTxhbnk+O1xuXG4gIEBJbnB1dCgpXG4gIGxvYWRDbGlja0V2ZW50VHlwZSA9ICdjbGljayc7XG5cbiAgQElucHV0KClcbiAgbG9hZENsaWNrU3RvcFByb3BhZ2F0aW9uID0gZmFsc2U7XG5cbiAgQElucHV0KClcbiAgbG9hZENsaWNrUHJldmVudERlZmF1bHQgPSBmYWxzZTtcblxuICBASW5wdXQoKVxuICBsb2FkQ2xpY2tDbGFzczogc3RyaW5nO1xuXG4gIEBJbnB1dCgpXG4gIGRpc2FibGVBdHRyaWJ1dGUgPSB0cnVlO1xuXG4gIHN1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMuX3JlbmRlcmVyLmxpc3RlbihcbiAgICAgIHRoaXMuX2VsLm5hdGl2ZUVsZW1lbnQsXG4gICAgICB0aGlzLmxvYWRDbGlja0V2ZW50VHlwZSxcbiAgICAgIGV2ZW50ID0+IHtcbiAgICAgICAgY29uc3QgZGVmYXVsdENsYXNzID0gdGhpcy5sb2FkQ2xpY2tDbGFzcyB8fCB0aGlzLl9kZWZhdWx0TG9hZENsaWNrQ2xhc3M7XG5cbiAgICAgICAgaWYgKHRoaXMubG9hZENsaWNrU3RvcFByb3BhZ2F0aW9uKSB7XG4gICAgICAgICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgICAgIH1cblxuICAgICAgICBpZiAodGhpcy5sb2FkQ2xpY2tQcmV2ZW50RGVmYXVsdCkge1xuICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIH1cblxuICAgICAgICB0aGlzLl9yZW5kZXJlci5hZGRDbGFzcyh0aGlzLl9lbC5uYXRpdmVFbGVtZW50LCBkZWZhdWx0Q2xhc3MpO1xuXG4gICAgICAgIGlmICh0aGlzLmRpc2FibGVBdHRyaWJ1dGUpIHtcbiAgICAgICAgICB0aGlzLl9yZW5kZXJlci5zZXRBdHRyaWJ1dGUoXG4gICAgICAgICAgICB0aGlzLl9lbC5uYXRpdmVFbGVtZW50LFxuICAgICAgICAgICAgJ2Rpc2FibGVkJyxcbiAgICAgICAgICAgICcnXG4gICAgICAgICAgKTtcbiAgICAgICAgfVxuXG4gICAgICAgIHRoaXMuc3Vic2NyaXB0aW9uID0gdGhpcy5qcExvYWRDbGljaygpXG4gICAgICAgICAgLnBpcGUoXG4gICAgICAgICAgICBmaW5hbGl6ZSgoKSA9PiB7XG4gICAgICAgICAgICAgIHRoaXMuX3JlbmRlcmVyLnJlbW92ZUNsYXNzKHRoaXMuX2VsLm5hdGl2ZUVsZW1lbnQsIGRlZmF1bHRDbGFzcyk7XG5cbiAgICAgICAgICAgICAgaWYgKHRoaXMuZGlzYWJsZUF0dHJpYnV0ZSkge1xuICAgICAgICAgICAgICAgIHRoaXMuX3JlbmRlcmVyLnJlbW92ZUF0dHJpYnV0ZSh0aGlzLl9lbC5uYXRpdmVFbGVtZW50LCAnZGlzYWJsZWQnKTtcbiAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgfSlcbiAgICAgICAgICApXG4gICAgICAgICAgLnN1YnNjcmliZSgpO1xuICAgICAgfVxuICAgICk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpIHtcbiAgICBpZiAodGhpcy5zdWJzY3JpcHRpb24pIHtcbiAgICAgIHRoaXMuc3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCk7XG4gICAgfVxuICB9XG59XG4iXX0=