UNPKG

@ziflow/ngx-simple-modal

Version:

A simple unopinionated framework to implement simple modal based behaviour in angular (v2+) projects.

121 lines 10.5 kB
import { Component, HostListener } from '@angular/core'; import { Observable, BehaviorSubject } from 'rxjs'; import * as i0 from "@angular/core"; /** * Abstract modal * @template T - modal data; * @template T1 - modal result */ class SimpleModalComponent { /** * Observer to return result from modal */ observer; /** * Dialog result * @type {T1} */ result; /** * Dialog wrapper (modal placeholder) */ wrapper; /** * ref of options for this component */ options; /** * ready$ is when all animations and focusing have comleted */ _ready$ = new BehaviorSubject(false); /** * Callback to the holders close function */ closerCallback = () => Promise.resolve(); /** * Constructor */ constructor() { } /** * Maps your object passed in the creation to fields in your own Dialog classes * @param {T} data */ mapDataObject(data) { data = data || {}; const keys = Object.keys(data); for (let i = 0, length = keys.length; i < length; i++) { const key = keys[i]; if (data[key] && this[key] && typeof data[key] === 'object' && typeof this[key] === 'object') { Object.assign(this[key], data[key]); } else { this[key] = data[key]; } } } /** * Setup observer * @return {Observable<T1>} */ setupObserver() { return Observable.create(observer => { this.observer = observer; // called if observable is unsubscribed to return () => { this.close(); }; }); } /** * Defines what happens when close is called - default this * will just call the default remove modal process. If overriden * must include * @param callback */ onClosing(callback) { this.closerCallback = callback; } /** * Closes modal */ close() { return this.closerCallback(this).then(v => { if (this.observer) { this.observer.next(this.result); this.observer.complete(); } return v; }); } /** * keypress binding ngx way * @param evt */ onKeydownHandler(evt) { if (this.options && this.options.closeOnEscape) { this.close(); } } get ready$() { return this._ready$.asObservable(); } markAsReady() { this._ready$.next(true); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: SimpleModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: SimpleModalComponent, selector: "ng-component", host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, ngImport: i0, template: '', isInline: true }); } export { SimpleModalComponent }; i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: SimpleModalComponent, decorators: [{ type: Component, args: [{ template: '', }] }], ctorParameters: function () { return []; }, propDecorators: { onKeydownHandler: [{ type: HostListener, args: ['document:keydown.escape', ['$event']] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2ltcGxlLW1vZGFsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9zaW1wbGUtbW9kYWwvc2ltcGxlLW1vZGFsLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFjLFlBQVksRUFBYSxNQUFNLGVBQWUsQ0FBQztBQUMvRSxPQUFPLEVBQUUsVUFBVSxFQUFxQixlQUFlLEVBQUUsTUFBTSxNQUFNLENBQUM7O0FBU3RFOzs7O0dBSUc7QUFDSCxNQUdzQixvQkFBb0I7SUFDeEM7O09BRUc7SUFDSyxRQUFRLENBQWU7SUFFL0I7OztPQUdHO0lBQ0gsTUFBTSxDQUFLO0lBRVg7O09BRUc7SUFDSCxPQUFPLENBQWE7SUFFcEI7O09BRUc7SUFDSCxPQUFPLENBQXFCO0lBRTVCOztPQUVHO0lBQ0gsT0FBTyxHQUFHLElBQUksZUFBZSxDQUFVLEtBQUssQ0FBQyxDQUFDO0lBRTlDOztPQUVHO0lBQ0ssY0FBYyxHQUFnQyxHQUFHLEVBQUUsQ0FBQyxPQUFPLENBQUMsT0FBTyxFQUFFLENBQUM7SUFFOUU7O09BRUc7SUFDSCxnQkFBZSxDQUFDO0lBRWhCOzs7T0FHRztJQUNILGFBQWEsQ0FBQyxJQUFPO1FBQ25CLElBQUksR0FBRyxJQUFJLElBQU8sRUFBRSxDQUFDO1FBQ3JCLE1BQU0sSUFBSSxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDL0IsS0FBSyxJQUFJLENBQUMsR0FBRyxDQUFDLEVBQUUsTUFBTSxHQUFHLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxHQUFHLE1BQU0sRUFBRSxDQUFDLEVBQUUsRUFBRTtZQUNyRCxNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDcEIsSUFDRSxJQUFJLENBQUMsR0FBRyxDQUFDO2dCQUNULElBQUksQ0FBQyxHQUFHLENBQUM7Z0JBQ1QsT0FBTyxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssUUFBUTtnQkFDN0IsT0FBTyxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssUUFBUSxFQUM3QjtnQkFDQSxNQUFNLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsRUFBRSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQzthQUNyQztpQkFBTTtnQkFDTCxJQUFJLENBQUMsR0FBRyxDQUFDLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO2FBQ3ZCO1NBQ0Y7SUFDSCxDQUFDO0lBRUQ7OztPQUdHO0lBQ0gsYUFBYTtRQUNYLE9BQU8sVUFBVSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsRUFBRTtZQUNsQyxJQUFJLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQztZQUV6QiwwQ0FBMEM7WUFDMUMsT0FBTyxHQUFHLEVBQUU7Z0JBQ1YsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1lBQ2YsQ0FBQyxDQUFDO1FBQ0osQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQ7Ozs7O09BS0c7SUFDSCxTQUFTLENBQUMsUUFBcUU7UUFDN0UsSUFBSSxDQUFDLGNBQWMsR0FBRyxRQUFRLENBQUM7SUFDakMsQ0FBQztJQUVEOztPQUVHO0lBQ0gsS0FBSztRQUNILE9BQU8sSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDeEMsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFO2dCQUNqQixJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7Z0JBQ2hDLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxFQUFFLENBQUM7YUFDMUI7WUFDRCxPQUFPLENBQUMsQ0FBQztRQUNYLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVEOzs7T0FHRztJQUVILGdCQUFnQixDQUFDLEdBQWtCO1FBQ2pDLElBQUksSUFBSSxDQUFDLE9BQU8sSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLGFBQWEsRUFBRTtZQUM5QyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7U0FDZDtJQUNILENBQUM7SUFFRCxJQUFJLE1BQU07UUFDUixPQUFPLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDckMsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUMxQixDQUFDO3VHQWxIbUIsb0JBQW9COzJGQUFwQixvQkFBb0Isb0lBRjlCLEVBQUU7O1NBRVEsb0JBQW9COzJGQUFwQixvQkFBb0I7a0JBSHpDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLEVBQUU7aUJBQ2I7MEVBdUdDLGdCQUFnQjtzQkFEZixZQUFZO3VCQUFDLHlCQUF5QixFQUFFLENBQUMsUUFBUSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBIb3N0TGlzdGVuZXIsIE9uRGVzdHJveSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSwgT2JzZXJ2ZXIsIFN1YmplY3QsIEJlaGF2aW9yU3ViamVjdCB9IGZyb20gJ3J4anMnO1xuXG5pbXBvcnQgeyBTaW1wbGVNb2RhbE9wdGlvbnMgfSBmcm9tICcuL3NpbXBsZS1tb2RhbC1vcHRpb25zJztcblxuZXhwb3J0IGludGVyZmFjZSBPbkRlc3Ryb3lMaWtlIHtcbiAgbmdPbkRlc3Ryb3koKTogdm9pZDtcbiAgW2tleTogc3RyaW5nXTogYW55O1xufVxuXG4vKipcbiAqIEFic3RyYWN0IG1vZGFsXG4gKiBAdGVtcGxhdGUgVCAtIG1vZGFsIGRhdGE7XG4gKiBAdGVtcGxhdGUgVDEgLSBtb2RhbCByZXN1bHRcbiAqL1xuQENvbXBvbmVudCh7XG4gIHRlbXBsYXRlOiAnJyxcbn0pXG5leHBvcnQgYWJzdHJhY3QgY2xhc3MgU2ltcGxlTW9kYWxDb21wb25lbnQ8VCwgVDE+IHtcbiAgLyoqXG4gICAqIE9ic2VydmVyIHRvIHJldHVybiByZXN1bHQgZnJvbSBtb2RhbFxuICAgKi9cbiAgcHJpdmF0ZSBvYnNlcnZlcjogT2JzZXJ2ZXI8VDE+O1xuXG4gIC8qKlxuICAgKiBEaWFsb2cgcmVzdWx0XG4gICAqIEB0eXBlIHtUMX1cbiAgICovXG4gIHJlc3VsdDogVDE7XG5cbiAgLyoqXG4gICAqIERpYWxvZyB3cmFwcGVyIChtb2RhbCBwbGFjZWhvbGRlcilcbiAgICovXG4gIHdyYXBwZXI6IEVsZW1lbnRSZWY7XG5cbiAgLyoqXG4gICAqIHJlZiBvZiBvcHRpb25zIGZvciB0aGlzIGNvbXBvbmVudFxuICAgKi9cbiAgb3B0aW9uczogU2ltcGxlTW9kYWxPcHRpb25zO1xuXG4gIC8qKlxuICAgKiByZWFkeSQgaXMgd2hlbiBhbGwgYW5pbWF0aW9ucyBhbmQgZm9jdXNpbmcgaGF2ZSBjb21sZXRlZFxuICAgKi9cbiAgX3JlYWR5JCA9IG5ldyBCZWhhdmlvclN1YmplY3Q8Ym9vbGVhbj4oZmFsc2UpO1xuXG4gIC8qKlxuICAgKiBDYWxsYmFjayB0byB0aGUgaG9sZGVycyBjbG9zZSBmdW5jdGlvblxuICAgKi9cbiAgcHJpdmF0ZSBjbG9zZXJDYWxsYmFjazogKGNvbXBvbmVudCkgPT4gUHJvbWlzZTxhbnk+ID0gKCkgPT4gUHJvbWlzZS5yZXNvbHZlKCk7XG5cbiAgLyoqXG4gICAqIENvbnN0cnVjdG9yXG4gICAqL1xuICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgLyoqXG4gICAqIE1hcHMgeW91ciBvYmplY3QgcGFzc2VkIGluIHRoZSBjcmVhdGlvbiB0byBmaWVsZHMgaW4geW91ciBvd24gRGlhbG9nIGNsYXNzZXNcbiAgICogQHBhcmFtIHtUfSBkYXRhXG4gICAqL1xuICBtYXBEYXRhT2JqZWN0KGRhdGE6IFQpOiB2b2lkIHtcbiAgICBkYXRhID0gZGF0YSB8fCA8VD57fTtcbiAgICBjb25zdCBrZXlzID0gT2JqZWN0LmtleXMoZGF0YSk7XG4gICAgZm9yIChsZXQgaSA9IDAsIGxlbmd0aCA9IGtleXMubGVuZ3RoOyBpIDwgbGVuZ3RoOyBpKyspIHtcbiAgICAgIGNvbnN0IGtleSA9IGtleXNbaV07XG4gICAgICBpZiAoXG4gICAgICAgIGRhdGFba2V5XSAmJlxuICAgICAgICB0aGlzW2tleV0gJiZcbiAgICAgICAgdHlwZW9mIGRhdGFba2V5XSA9PT0gJ29iamVjdCcgJiZcbiAgICAgICAgdHlwZW9mIHRoaXNba2V5XSA9PT0gJ29iamVjdCdcbiAgICAgICkge1xuICAgICAgICBPYmplY3QuYXNzaWduKHRoaXNba2V5XSwgZGF0YVtrZXldKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXNba2V5XSA9IGRhdGFba2V5XTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogU2V0dXAgb2JzZXJ2ZXJcbiAgICogQHJldHVybiB7T2JzZXJ2YWJsZTxUMT59XG4gICAqL1xuICBzZXR1cE9ic2VydmVyKCk6IE9ic2VydmFibGU8VDE+IHtcbiAgICByZXR1cm4gT2JzZXJ2YWJsZS5jcmVhdGUob2JzZXJ2ZXIgPT4ge1xuICAgICAgdGhpcy5vYnNlcnZlciA9IG9ic2VydmVyO1xuXG4gICAgICAvLyBjYWxsZWQgaWYgb2JzZXJ2YWJsZSBpcyB1bnN1YnNjcmliZWQgdG9cbiAgICAgIHJldHVybiAoKSA9PiB7XG4gICAgICAgIHRoaXMuY2xvc2UoKTtcbiAgICAgIH07XG4gICAgfSk7XG4gIH1cblxuICAvKipcbiAgICogRGVmaW5lcyB3aGF0IGhhcHBlbnMgd2hlbiBjbG9zZSBpcyBjYWxsZWQgLSBkZWZhdWx0IHRoaXNcbiAgICogd2lsbCBqdXN0IGNhbGwgdGhlIGRlZmF1bHQgcmVtb3ZlIG1vZGFsIHByb2Nlc3MuIElmIG92ZXJyaWRlblxuICAgKiBtdXN0IGluY2x1ZGVcbiAgICogQHBhcmFtIGNhbGxiYWNrXG4gICAqL1xuICBvbkNsb3NpbmcoY2FsbGJhY2s6IChjb21wb25lbnQ6IFNpbXBsZU1vZGFsQ29tcG9uZW50PGFueSwgYW55PikgPT4gUHJvbWlzZTxhbnk+KTogdm9pZCB7XG4gICAgdGhpcy5jbG9zZXJDYWxsYmFjayA9IGNhbGxiYWNrO1xuICB9XG5cbiAgLyoqXG4gICAqIENsb3NlcyBtb2RhbFxuICAgKi9cbiAgY2xvc2UoKTogUHJvbWlzZTxhbnk+IHtcbiAgICByZXR1cm4gdGhpcy5jbG9zZXJDYWxsYmFjayh0aGlzKS50aGVuKHYgPT4ge1xuICAgICAgaWYgKHRoaXMub2JzZXJ2ZXIpIHtcbiAgICAgICAgdGhpcy5vYnNlcnZlci5uZXh0KHRoaXMucmVzdWx0KTtcbiAgICAgICAgdGhpcy5vYnNlcnZlci5jb21wbGV0ZSgpO1xuICAgICAgfVxuICAgICAgcmV0dXJuIHY7XG4gICAgfSk7XG4gIH1cblxuICAvKipcbiAgICoga2V5cHJlc3MgYmluZGluZyBuZ3ggd2F5XG4gICAqIEBwYXJhbSBldnRcbiAgICovXG4gIEBIb3N0TGlzdGVuZXIoJ2RvY3VtZW50OmtleWRvd24uZXNjYXBlJywgWyckZXZlbnQnXSlcbiAgb25LZXlkb3duSGFuZGxlcihldnQ6IEtleWJvYXJkRXZlbnQpIHtcbiAgICBpZiAodGhpcy5vcHRpb25zICYmIHRoaXMub3B0aW9ucy5jbG9zZU9uRXNjYXBlKSB7XG4gICAgICB0aGlzLmNsb3NlKCk7XG4gICAgfVxuICB9XG5cbiAgZ2V0IHJlYWR5JCgpIHtcbiAgICByZXR1cm4gdGhpcy5fcmVhZHkkLmFzT2JzZXJ2YWJsZSgpO1xuICB9XG5cbiAgbWFya0FzUmVhZHkoKSB7XG4gICAgdGhpcy5fcmVhZHkkLm5leHQodHJ1ZSk7XG4gIH1cbn1cbiJdfQ==