Merge remote-tracking branch 'refs/remotes/twbs/v4-dev' into v4-dev

1 files changed, 20 insertions, 8 deletions

diff --git a/js/src/modal.js b/js/src/modal.js
index 02d463945..fb787208d 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -1,14 +1,15 @@
+import $ from 'jquery'
 import Util from './util'
 
 
 /**
  * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-alpha.6): modal.js
+ * Bootstrap (v4.0.0-beta): modal.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  * --------------------------------------------------------------------------
  */
 
-const Modal = (($) => {
+const Modal = (() => {
 
 
   /**
@@ -18,7 +19,7 @@ const Modal = (($) => {
    */
 
   const NAME                         = 'modal'
-  const VERSION                      = '4.0.0-alpha.6'
+  const VERSION                      = '4.0.0-beta'
   const DATA_KEY                     = 'bs.modal'
   const EVENT_KEY                    = `.${DATA_KEY}`
   const DATA_API_KEY                 = '.data-api'
@@ -68,6 +69,7 @@ const Modal = (($) => {
     DATA_TOGGLE        : '[data-toggle="modal"]',
     DATA_DISMISS       : '[data-dismiss="modal"]',
     FIXED_CONTENT      : '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top',
+    STICKY_CONTENT     : '.sticky-top',
     NAVBAR_TOGGLER     : '.navbar-toggler'
   }
 
@@ -134,6 +136,8 @@ const Modal = (($) => {
       this._checkScrollbar()
       this._setScrollbar()
 
+      this._adjustDialog()
+
       $(document.body).addClass(ClassName.OPEN)
 
       this._setEscapeEvent()
@@ -425,7 +429,8 @@ const Modal = (($) => {
     }
 
     _checkScrollbar() {
-      this._isBodyOverflowing = document.body.clientWidth < window.innerWidth
+      const rect = document.body.getBoundingClientRect()
+      this._isBodyOverflowing = rect.left + rect.right < window.innerWidth
       this._scrollbarWidth = this._getScrollbarWidth()
     }
 
@@ -441,6 +446,13 @@ const Modal = (($) => {
           $(element).data('padding-right', actualPadding).css('padding-right', `${parseFloat(calculatedPadding) + this._scrollbarWidth}px`)
         })
 
+        // Adjust sticky content margin
+        $(Selector.STICKY_CONTENT).each((index, element) => {
+          const actualMargin = $(element)[0].style.marginRight
+          const calculatedMargin = $(element).css('margin-right')
+          $(element).data('margin-right', actualMargin).css('margin-right', `${parseFloat(calculatedMargin) - this._scrollbarWidth}px`)
+        })
+
         // Adjust navbar-toggler margin
         $(Selector.NAVBAR_TOGGLER).each((index, element) => {
           const actualMargin = $(element)[0].style.marginRight
@@ -464,8 +476,8 @@ const Modal = (($) => {
         }
       })
 
-      // Restore navbar-toggler margin
-      $(Selector.NAVBAR_TOGGLER).each((index, element) => {
+      // Restore sticky content and navbar-toggler margin
+      $(`${Selector.STICKY_CONTENT}, ${Selector.NAVBAR_TOGGLER}`).each((index, element) => {
         const margin = $(element).data('margin-right')
         if (typeof margin !== 'undefined') {
           $(element).css('margin-right', margin).removeData('margin-right')
@@ -507,7 +519,7 @@ const Modal = (($) => {
         }
 
         if (typeof config === 'string') {
-          if (data[config] === undefined) {
+          if (typeof data[config] === 'undefined') {
             throw new Error(`No method named "${config}"`)
           }
           data[config](relatedTarget)
@@ -573,6 +585,6 @@ const Modal = (($) => {
 
   return Modal
 
-})(jQuery)
+})($)
 
 export default Modal