ngx-bootstrap 10.2.1 → 10.3.0

package/modal/fesm2015/ngx-bootstrap-modal.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
 import { Injectable, InjectionToken, Component, HostListener, EventEmitter, Directive, Optional, Inject, Input, Output, NgModule } from '@angular/core';
+import { document, Utils, window as window$1 } from 'ngx-bootstrap/utils';
 import * as i2 from 'ngx-bootstrap/focus-trap';
 import { FocusTrapModule } from 'ngx-bootstrap/focus-trap';
-import { Utils, document as document$1, window as window$1 } from 'ngx-bootstrap/utils';
 import * as i1 from 'ngx-bootstrap/component-loader';
 import { ComponentLoaderFactory } from 'ngx-bootstrap/component-loader';
 import { PositioningService } from 'ngx-bootstrap/positioning';
@@ -84,11 +84,13 @@ class ModalContainerComponent {
         this._renderer = _renderer;
         this.isShown = false;
         this.isAnimated = false;
+        this._focusEl = null;
         this.isModalHiding = false;
         this.clickStartedInContent = false;
         this.config = Object.assign({}, options);
     }
     ngOnInit() {
+        this._focusEl = document.activeElement;
         if (this.isAnimated) {
             this._renderer.addClass(this._element.nativeElement, CLASS_NAME.FADE);
         }
@@ -172,6 +174,9 @@ class ModalContainerComponent {
             }
             (_b = this.bsModalService) === null || _b === void 0 ? void 0 : _b.hide(this.config.id);
             this.isModalHiding = false;
+            if (this._focusEl) {
+                this._focusEl.focus();
+            }
         }, this.isAnimated ? TRANSITION_DURATIONS.MODAL : 0);
     }
 }
@@ -298,6 +303,7 @@ class ModalDirective {
         this.timerRmBackDrop = 0;
         this.isNested = false;
         this.clickStartedInContent = false;
+        this._focusEl = null;
         this._backdrop = clf.createLoader(_element, _viewContainerRef, _renderer);
         this._config = modalDefaultOption || modalConfigDefaults;
     }
@@ -370,13 +376,13 @@ class ModalDirective {
         this._isShown = true;
         this.checkScrollbar();
         this.setScrollbar();
-        if (document$1 && document$1.body) {
-            if (document$1.body.classList.contains(CLASS_NAME.OPEN)) {
+        if (document && document.body) {
+            if (document.body.classList.contains(CLASS_NAME.OPEN)) {
                 this.isNested = true;
             }
             else {
-                this._renderer.addClass(document$1.body, CLASS_NAME.OPEN);
-                this._renderer.setStyle(document$1.body, 'overflow-y', 'hidden');
+                this._renderer.addClass(document.body, CLASS_NAME.OPEN);
+                this._renderer.setStyle(document.body, 'overflow-y', 'hidden');
             }
         }
         this.showBackdrop(() => {
@@ -414,6 +420,9 @@ class ModalDirective {
         else {
             this.hideModal();
         }
+        if (this._focusEl) {
+            this._focusEl.focus();
+        }
     }
     getConfig(config) {
         return Object.assign({}, this._config, config);
@@ -427,8 +436,8 @@ class ModalDirective {
         if (!this._element.nativeElement.parentNode ||
             this._element.nativeElement.parentNode.nodeType !== Node.ELEMENT_NODE) {
             // don't move modals dom position
-            if (document$1 && document$1.body) {
-                document$1.body.appendChild(this._element.nativeElement);
+            if (document && document.body) {
+                document.body.appendChild(this._element.nativeElement);
             }
         }
         this._renderer.setAttribute(this._element.nativeElement, 'aria-hidden', 'false');
@@ -458,9 +467,9 @@ class ModalDirective {
         this._renderer.setStyle(this._element.nativeElement, 'display', 'none');
         this.showBackdrop(() => {
             if (!this.isNested) {
-                if (document$1 && document$1.body) {
-                    this._renderer.removeClass(document$1.body, CLASS_NAME.OPEN);
-                    this._renderer.setStyle(document$1.body, 'overflow-y', '');
+                if (document && document.body) {
+                    this._renderer.removeClass(document.body, CLASS_NAME.OPEN);
+                    this._renderer.setStyle(document.body, 'overflow-y', '');
                 }
                 this.resetScrollbar();
             }
@@ -554,31 +563,31 @@ class ModalDirective {
     /** Scroll bar tricks */
     /** @internal */
     checkScrollbar() {
-        this.isBodyOverflowing = document$1.body.clientWidth < window$1.innerWidth;
+        this.isBodyOverflowing = document.body.clientWidth < window$1.innerWidth;
         this.scrollbarWidth = this.getScrollbarWidth();
     }
     setScrollbar() {
-        if (!document$1) {
+        if (!document) {
             return;
         }
         this.originalBodyPadding = parseInt(window$1
-            .getComputedStyle(document$1.body)
+            .getComputedStyle(document.body)
             .getPropertyValue('padding-right') || 0, 10);
         if (this.isBodyOverflowing) {
-            document$1.body.style.paddingRight = `${this.originalBodyPadding +
+            document.body.style.paddingRight = `${this.originalBodyPadding +
                 this.scrollbarWidth}px`;
         }
     }
     resetScrollbar() {
-        document$1.body.style.paddingRight = `${this.originalBodyPadding}px`;
+        document.body.style.paddingRight = `${this.originalBodyPadding}px`;
     }
     // thx d.walsh
     getScrollbarWidth() {
         const scrollDiv = this._renderer.createElement('div');
         this._renderer.addClass(scrollDiv, CLASS_NAME.SCROLLBAR_MEASURER);
-        this._renderer.appendChild(document$1.body, scrollDiv);
+        this._renderer.appendChild(document.body, scrollDiv);
         const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
-        this._renderer.removeChild(document$1.body, scrollDiv);
+        this._renderer.removeChild(document.body, scrollDiv);
         return scrollbarWidth;
     }
 }
@@ -634,6 +643,7 @@ class BsModalService {
         this.scrollbarWidth = 0;
         this.modalsCount = 0;
         this.loaders = [];
+        this._focusEl = null;
         this._backdropLoader = this.clf.createLoader();
         this._renderer = rendererFactory.createRenderer(null, null);
         this.config = modalDefaultOption ?
@@ -644,6 +654,7 @@ class BsModalService {
     show(
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     content, config) {
+        this._focusEl = document.activeElement;
         this.modalsCount++;
         this._createLoaders();
         // must be different per every show() call
@@ -666,6 +677,9 @@ class BsModalService {
             this._hideModal(id);
             this.removeLoaders(id);
         }, this.config.animated ? TRANSITION_DURATIONS.BACKDROP : 0);
+        if (this._focusEl) {
+            this._focusEl.focus();
+        }
     }
     _showBackdrop() {
         const isBackdropEnabled = this.config.backdrop === true || this.config.backdrop === 'static';