ngx-bootstrap
Version:
Native Angular Bootstrap Components
103 lines • 4.33 kB
JavaScript
import { Component, ElementRef, HostListener, Renderer2 } from '@angular/core';
import { CLASS_NAME, DISMISS_REASONS, ModalOptions, TRANSITION_DURATIONS } from './modal-options.class';
import { isBs3 } from '../utils/theme-provider';
var ModalContainerComponent = /** @class */ (function () {
function ModalContainerComponent(options, _element, _renderer) {
this._element = _element;
this._renderer = _renderer;
this.isShown = false;
this.isModalHiding = false;
this.config = Object.assign({}, options);
}
ModalContainerComponent.prototype.ngOnInit = function () {
var _this = this;
if (this.isAnimated) {
this._renderer.addClass(this._element.nativeElement, CLASS_NAME.FADE);
}
this._renderer.setStyle(this._element.nativeElement, 'display', 'block');
setTimeout(function () {
_this.isShown = true;
_this._renderer.addClass(_this._element.nativeElement, isBs3() ? CLASS_NAME.IN : CLASS_NAME.SHOW);
}, this.isAnimated ? TRANSITION_DURATIONS.BACKDROP : 0);
if (document && document.body) {
if (this.bsModalService.getModalsCount() === 1) {
this.bsModalService.checkScrollbar();
this.bsModalService.setScrollbar();
}
this._renderer.addClass(document.body, CLASS_NAME.OPEN);
}
if (this._element.nativeElement) {
this._element.nativeElement.focus();
}
};
ModalContainerComponent.prototype.onClick = function (event) {
if (this.config.ignoreBackdropClick ||
this.config.backdrop === 'static' ||
event.target !== this._element.nativeElement) {
return;
}
this.bsModalService.setDismissReason(DISMISS_REASONS.BACKRDOP);
this.hide();
};
ModalContainerComponent.prototype.onEsc = function (event) {
if (!this.isShown) {
return;
}
if (event.keyCode === 27) {
event.preventDefault();
}
if (this.config.keyboard &&
this.level === this.bsModalService.getModalsCount()) {
this.bsModalService.setDismissReason(DISMISS_REASONS.ESC);
this.hide();
}
};
ModalContainerComponent.prototype.ngOnDestroy = function () {
if (this.isShown) {
this.hide();
}
};
ModalContainerComponent.prototype.hide = function () {
var _this = this;
if (this.isModalHiding || !this.isShown) {
return;
}
this.isModalHiding = true;
this._renderer.removeClass(this._element.nativeElement, isBs3() ? CLASS_NAME.IN : CLASS_NAME.SHOW);
setTimeout(function () {
_this.isShown = false;
if (document &&
document.body &&
_this.bsModalService.getModalsCount() === 1) {
_this._renderer.removeClass(document.body, CLASS_NAME.OPEN);
}
_this.bsModalService.hide(_this.level);
_this.isModalHiding = false;
}, this.isAnimated ? TRANSITION_DURATIONS.MODAL : 0);
};
ModalContainerComponent.decorators = [
{ type: Component, args: [{
selector: 'modal-container',
template: "\n <div [class]=\"'modal-dialog' + (config.class ? ' ' + config.class : '')\" role=\"document\">\n <div class=\"modal-content\">\n <ng-content></ng-content>\n </div>\n </div>\n ",
host: {
class: 'modal',
role: 'dialog',
tabindex: '-1',
'[attr.aria-modal]': 'true'
}
},] },
];
/** @nocollapse */
ModalContainerComponent.ctorParameters = function () { return [
{ type: ModalOptions, },
{ type: ElementRef, },
{ type: Renderer2, },
]; };
ModalContainerComponent.propDecorators = {
"onClick": [{ type: HostListener, args: ['click', ['$event'],] },],
"onEsc": [{ type: HostListener, args: ['window:keydown.esc', ['$event'],] },],
};
return ModalContainerComponent;
}());
export { ModalContainerComponent };
//# sourceMappingURL=modal-container.component.js.map