publish: fix: Forked dropdown.js to support animations and fix #1235

generated from commit 73887a4de4

css/bootstrap-material-design.css

@@ -7173,6 +7173,13 @@ button:focus {
   .btn-group-raised .custom-file-control:active::before {
     z-index: 1;
     box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36); }
+  .btn.bmd-btn-fab.focus, .bmd-btn-fab.focus.custom-file-control::before, .btn.bmd-btn-fab:focus, .bmd-btn-fab.custom-file-control:focus::before, .btn.btn-raised.focus, .btn-raised.focus.custom-file-control::before, .btn.btn-raised:focus, .btn-raised.custom-file-control:focus::before,
+  .btn-group-raised .btn.focus,
+  .btn-group-raised .focus.custom-file-control::before,
+  .btn-group-raised .btn:focus,
+  .btn-group-raised .custom-file-control:focus::before {
+    box-shadow: none;
+    outline: 0; }
   .btn.btn-raised, .btn-raised.custom-file-control::before,
   .btn-group-raised .btn,
   .btn-group-raised .custom-file-control::before {
@@ -8297,7 +8304,7 @@ label.radio-inline {
       background-color: #009688; }
     .radio label input[type=radio]:checked ~ .bmd-radio::before,
     label.radio-inline input[type=radio]:checked ~ .bmd-radio::before {
-      transform: scale3d(0.55, 0.55, 1); }
+      transform: scale3d(0.5, 0.5, 1); }
     .radio label input[type=radio][disabled] + .bmd-radio, .radio label input[type=radio]:disabled + .bmd-radio,
     fieldset[disabled] .radio label input[type=radio] + .bmd-radio,
     label.radio-inline input[type=radio][disabled] + .bmd-radio,
@@ -9597,24 +9604,6 @@ h6 {
 .tooltip-arrow {
   display: none; }
 
-.popover {
-  line-height: 1em;
-  color: #ececec;
-  background: rgba(101, 101, 101, 0.9);
-  border: 0;
-  border-radius: 0.125rem;
-  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
-
-.tooltip, .tooltip.in {
-  opacity: 1; }
-
-.popover .arrow {
-  display: none; }
-
-.popover-header {
-  border: 0;
-  background-color: transparent; }
-
 .card {
   border: 0;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
@@ -9656,44 +9645,38 @@ h6 {
       margin-left: 8px; }
 
 .dropdown-menu {
-  display: block;
+  display: none;
   padding: .25rem 0;
   border: 0;
   opacity: 0;
-  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
   transform: scale(0);
   transform-origin: 0 0;
-  will-change: transform;
+  will-change: transform, opacity;
-  right: 0;
+  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
-  left: auto;
-  transform-origin: 100% 0; }
   @media (min-width: 768px) {
     .dropdown-menu {
       padding: .5rem 0; } }
+  .dropdown-menu.showing {
+    animation-name: bmd-dropdown-animation;
+    animation-duration: 0.3s;
+    animation-fill-mode: forwards;
+    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
   .open > .dropdown-menu, .dropdown-menu.show {
+    display: block;
     opacity: 1;
     transform: scale(1); }
-  .dropdown-menu.dropdown-menu-left {
+  .dropdown-menu.hiding {
-    top: 100%;
+    display: block;
-    left: 0;
+    opacity: 0;
+    transform: scale(0); }
+  .dropdown-menu[x-placement="bottom-start"] {
     transform-origin: 0 0; }
-  .dropdown-menu.dropdown-menu-right {
+  .dropdown-menu[x-placement="bottom-end"] {
-    right: 0;
-    left: auto;
     transform-origin: 100% 0; }
-  .dropup > .dropdown-menu {
+  .dropdown-menu[x-placement="top-start"] {
-    right: 0;
+    transform-origin: 0 100%; }
-    left: auto;
+  .dropdown-menu[x-placement="top-end"] {
     transform-origin: 100% 100%; }
-    .dropup > .dropdown-menu.dropdown-menu-left {
-      top: auto;
-      left: 0;
-      bottom: 100%;
-      transform-origin: 0 100%; }
-    .dropup > .dropdown-menu.dropdown-menu-right {
-      right: 0;
-      left: auto;
-      transform-origin: 100% 100%; }
   .dropdown-menu .dropdown-item {
     position: relative;
     display: flex;
@@ -9724,6 +9707,14 @@ h6 {
 .dropdown-toggle.bmd-btn-icon ~ .dropdown-menu {
   margin: 0; }
 
+@keyframes bmd-dropdown-animation {
+  from {
+    opacity: 0;
+    transform: scale(0); }
+  to {
+    opacity: 1;
+    transform: scale(1); } }
+
 .bmd-layout-drawer {
   position: absolute;
   z-index: 5;

js/bootstrap-material-design.js

@@ -1525,449 +1525,6 @@ var Collapse = function ($) {
   return Collapse;
 }(jQuery);
 
-/* global Popper */
-
-/**
- * --------------------------------------------------------------------------
- * Bootstrap (v4.0.0-beta): dropdown.js
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * --------------------------------------------------------------------------
- */
-
-var Dropdown = function ($) {
-
-  /**
-   * Check for Popper dependency
-   * Popper - https://popper.js.org
-   */
-  if (typeof Popper === 'undefined') {
-    throw new Error('Bootstrap dropdown require Popper.js (https://popper.js.org)');
-  }
-
-  /**
-   * ------------------------------------------------------------------------
-   * Constants
-   * ------------------------------------------------------------------------
-   */
-
-  var NAME = 'dropdown';
-  var VERSION = '4.0.0-beta';
-  var DATA_KEY = 'bs.dropdown';
-  var EVENT_KEY = '.' + DATA_KEY;
-  var DATA_API_KEY = '.data-api';
-  var JQUERY_NO_CONFLICT = $.fn[NAME];
-  var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
-  var SPACE_KEYCODE = 32; // KeyboardEvent.which value for space key
-  var TAB_KEYCODE = 9; // KeyboardEvent.which value for tab key
-  var ARROW_UP_KEYCODE = 38; // KeyboardEvent.which value for up arrow key
-  var ARROW_DOWN_KEYCODE = 40; // KeyboardEvent.which value for down arrow key
-  var RIGHT_MOUSE_BUTTON_WHICH = 3; // MouseEvent.which value for the right button (assuming a right-handed mouse)
-  var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + '|' + ARROW_DOWN_KEYCODE + '|' + ESCAPE_KEYCODE);
-
-  var Event = {
-    HIDE: 'hide' + EVENT_KEY,
-    HIDDEN: 'hidden' + EVENT_KEY,
-    SHOW: 'show' + EVENT_KEY,
-    SHOWN: 'shown' + EVENT_KEY,
-    CLICK: 'click' + EVENT_KEY,
-    CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY,
-    KEYDOWN_DATA_API: 'keydown' + EVENT_KEY + DATA_API_KEY,
-    KEYUP_DATA_API: 'keyup' + EVENT_KEY + DATA_API_KEY
-  };
-
-  var ClassName = {
-    DISABLED: 'disabled',
-    SHOW: 'show',
-    DROPUP: 'dropup',
-    MENURIGHT: 'dropdown-menu-right',
-    MENULEFT: 'dropdown-menu-left'
-  };
-
-  var Selector = {
-    DATA_TOGGLE: '[data-toggle="dropdown"]',
-    FORM_CHILD: '.dropdown form',
-    MENU: '.dropdown-menu',
-    NAVBAR_NAV: '.navbar-nav',
-    VISIBLE_ITEMS: '.dropdown-menu .dropdown-item:not(.disabled)'
-  };
-
-  var AttachmentMap = {
-    TOP: 'top-start',
-    TOPEND: 'top-end',
-    BOTTOM: 'bottom-start',
-    BOTTOMEND: 'bottom-end'
-  };
-
-  var Default = {
-    placement: AttachmentMap.BOTTOM,
-    offset: 0,
-    flip: true
-  };
-
-  var DefaultType = {
-    placement: 'string',
-    offset: '(number|string)',
-    flip: 'boolean'
-
-    /**
-     * ------------------------------------------------------------------------
-     * Class Definition
-     * ------------------------------------------------------------------------
-     */
-
-  };
-  var Dropdown = function () {
-    function Dropdown(element, config) {
-      classCallCheck(this, Dropdown);
-
-      this._element = element;
-      this._popper = null;
-      this._config = this._getConfig(config);
-      this._menu = this._getMenuElement();
-      this._inNavbar = this._detectNavbar();
-
-      this._addEventListeners();
-    }
-
-    // getters
-
-    createClass(Dropdown, [{
-      key: 'toggle',
-
-
-      // public
-
-      value: function toggle() {
-        if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
-          return;
-        }
-
-        var parent = Dropdown._getParentFromElement(this._element);
-        var isActive = $(this._menu).hasClass(ClassName.SHOW);
-
-        Dropdown._clearMenus();
-
-        if (isActive) {
-          return;
-        }
-
-        var relatedTarget = {
-          relatedTarget: this._element
-        };
-        var showEvent = $.Event(Event.SHOW, relatedTarget);
-
-        $(parent).trigger(showEvent);
-
-        if (showEvent.isDefaultPrevented()) {
-          return;
-        }
-
-        var element = this._element;
-        // for dropup with alignment we use the parent as popper container
-        if ($(parent).hasClass(ClassName.DROPUP)) {
-          if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
-            element = parent;
-          }
-        }
-        this._popper = new Popper(element, this._menu, this._getPopperConfig());
-
-        // if this is a touch-enabled device we add extra
-        // empty mouseover listeners to the body's immediate children;
-        // only needed because of broken event delegation on iOS
-        // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
-        if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) {
-          $('body').children().on('mouseover', null, $.noop);
-        }
-
-        this._element.focus();
-        this._element.setAttribute('aria-expanded', true);
-
-        $(this._menu).toggleClass(ClassName.SHOW);
-        $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
-      }
-    }, {
-      key: 'dispose',
-      value: function dispose() {
-        $.removeData(this._element, DATA_KEY);
-        $(this._element).off(EVENT_KEY);
-        this._element = null;
-        this._menu = null;
-        if (this._popper !== null) {
-          this._popper.destroy();
-        }
-        this._popper = null;
-      }
-    }, {
-      key: 'update',
-      value: function update() {
-        this._inNavbar = this._detectNavbar();
-        if (this._popper !== null) {
-          this._popper.scheduleUpdate();
-        }
-      }
-
-      // private
-
-    }, {
-      key: '_addEventListeners',
-      value: function _addEventListeners() {
-        var _this = this;
-
-        $(this._element).on(Event.CLICK, function (event) {
-          event.preventDefault();
-          event.stopPropagation();
-          _this.toggle();
-        });
-      }
-    }, {
-      key: '_getConfig',
-      value: function _getConfig(config) {
-        var elementData = $(this._element).data();
-        if (elementData.placement !== undefined) {
-          elementData.placement = AttachmentMap[elementData.placement.toUpperCase()];
-        }
-
-        config = $.extend({}, this.constructor.Default, $(this._element).data(), config);
-
-        Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
-
-        return config;
-      }
-    }, {
-      key: '_getMenuElement',
-      value: function _getMenuElement() {
-        if (!this._menu) {
-          var parent = Dropdown._getParentFromElement(this._element);
-          this._menu = $(parent).find(Selector.MENU)[0];
-        }
-        return this._menu;
-      }
-    }, {
-      key: '_getPlacement',
-      value: function _getPlacement() {
-        var $parentDropdown = $(this._element).parent();
-        var placement = this._config.placement;
-
-        // Handle dropup
-        if ($parentDropdown.hasClass(ClassName.DROPUP) || this._config.placement === AttachmentMap.TOP) {
-          placement = AttachmentMap.TOP;
-          if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
-            placement = AttachmentMap.TOPEND;
-          }
-        } else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
-          placement = AttachmentMap.BOTTOMEND;
-        }
-        return placement;
-      }
-    }, {
-      key: '_detectNavbar',
-      value: function _detectNavbar() {
-        return $(this._element).closest('.navbar').length > 0;
-      }
-    }, {
-      key: '_getPopperConfig',
-      value: function _getPopperConfig() {
-        var popperConfig = {
-          placement: this._getPlacement(),
-          modifiers: {
-            offset: {
-              offset: this._config.offset
-            },
-            flip: {
-              enabled: this._config.flip
-            }
-          }
-
-          // Disable Popper.js for Dropdown in Navbar
-        };if (this._inNavbar) {
-          popperConfig.modifiers.applyStyle = {
-            enabled: !this._inNavbar
-          };
-        }
-        return popperConfig;
-      }
-
-      // static
-
-    }], [{
-      key: '_jQueryInterface',
-      value: function _jQueryInterface(config) {
-        return this.each(function () {
-          var data = $(this).data(DATA_KEY);
-          var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
-
-          if (!data) {
-            data = new Dropdown(this, _config);
-            $(this).data(DATA_KEY, data);
-          }
-
-          if (typeof config === 'string') {
-            if (data[config] === undefined) {
-              throw new Error('No method named "' + config + '"');
-            }
-            data[config]();
-          }
-        });
-      }
-    }, {
-      key: '_clearMenus',
-      value: function _clearMenus(event) {
-        if (event && (event.which === RIGHT_MOUSE_BUTTON_WHICH || event.type === 'keyup' && event.which !== TAB_KEYCODE)) {
-          return;
-        }
-
-        var toggles = $.makeArray($(Selector.DATA_TOGGLE));
-        for (var i = 0; i < toggles.length; i++) {
-          var parent = Dropdown._getParentFromElement(toggles[i]);
-          var context = $(toggles[i]).data(DATA_KEY);
-          var relatedTarget = {
-            relatedTarget: toggles[i]
-          };
-
-          if (!context) {
-            continue;
-          }
-
-          var dropdownMenu = context._menu;
-          if (!$(parent).hasClass(ClassName.SHOW)) {
-            continue;
-          }
-
-          if (event && (event.type === 'click' && /input|textarea/i.test(event.target.tagName) || event.type === 'keyup' && event.which === TAB_KEYCODE) && $.contains(parent, event.target)) {
-            continue;
-          }
-
-          var hideEvent = $.Event(Event.HIDE, relatedTarget);
-          $(parent).trigger(hideEvent);
-          if (hideEvent.isDefaultPrevented()) {
-            continue;
-          }
-
-          // if this is a touch-enabled device we remove the extra
-          // empty mouseover listeners we added for iOS support
-          if ('ontouchstart' in document.documentElement) {
-            $('body').children().off('mouseover', null, $.noop);
-          }
-
-          toggles[i].setAttribute('aria-expanded', 'false');
-
-          $(dropdownMenu).removeClass(ClassName.SHOW);
-          $(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
-        }
-      }
-    }, {
-      key: '_getParentFromElement',
-      value: function _getParentFromElement(element) {
-        var parent = void 0;
-        var selector = Util.getSelectorFromElement(element);
-
-        if (selector) {
-          parent = $(selector)[0];
-        }
-
-        return parent || element.parentNode;
-      }
-    }, {
-      key: '_dataApiKeydownHandler',
-      value: function _dataApiKeydownHandler(event) {
-        if (!REGEXP_KEYDOWN.test(event.which) || /button/i.test(event.target.tagName) && event.which === SPACE_KEYCODE || /input|textarea/i.test(event.target.tagName)) {
-          return;
-        }
-
-        event.preventDefault();
-        event.stopPropagation();
-
-        if (this.disabled || $(this).hasClass(ClassName.DISABLED)) {
-          return;
-        }
-
-        var parent = Dropdown._getParentFromElement(this);
-        var isActive = $(parent).hasClass(ClassName.SHOW);
-
-        if (!isActive && (event.which !== ESCAPE_KEYCODE || event.which !== SPACE_KEYCODE) || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
-
-          if (event.which === ESCAPE_KEYCODE) {
-            var toggle = $(parent).find(Selector.DATA_TOGGLE)[0];
-            $(toggle).trigger('focus');
-          }
-
-          $(this).trigger('click');
-          return;
-        }
-
-        var items = $(parent).find(Selector.VISIBLE_ITEMS).get();
-
-        if (!items.length) {
-          return;
-        }
-
-        var index = items.indexOf(event.target);
-
-        if (event.which === ARROW_UP_KEYCODE && index > 0) {
-          // up
-          index--;
-        }
-
-        if (event.which === ARROW_DOWN_KEYCODE && index < items.length - 1) {
-          // down
-          index++;
-        }
-
-        if (index < 0) {
-          index = 0;
-        }
-
-        items[index].focus();
-      }
-    }, {
-      key: 'VERSION',
-      get: function get$$1() {
-        return VERSION;
-      }
-    }, {
-      key: 'Default',
-      get: function get$$1() {
-        return Default;
-      }
-    }, {
-      key: 'DefaultType',
-      get: function get$$1() {
-        return DefaultType;
-      }
-    }]);
-    return Dropdown;
-  }();
-
-  /**
-   * ------------------------------------------------------------------------
-   * Data Api implementation
-   * ------------------------------------------------------------------------
-   */
-
-  $(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + ' ' + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
-    event.preventDefault();
-    event.stopPropagation();
-    Dropdown._jQueryInterface.call($(this), 'toggle');
-  }).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) {
-    e.stopPropagation();
-  });
-
-  /**
-   * ------------------------------------------------------------------------
-   * jQuery
-   * ------------------------------------------------------------------------
-   */
-
-  $.fn[NAME] = Dropdown._jQueryInterface;
-  $.fn[NAME].Constructor = Dropdown;
-  $.fn[NAME].noConflict = function () {
-    $.fn[NAME] = JQUERY_NO_CONFLICT;
-    return Dropdown._jQueryInterface;
-  };
-
-  return Dropdown;
-}(jQuery);
-
 /**
  * --------------------------------------------------------------------------
  * Bootstrap (v4.0.0-beta): modal.js
@@ -5889,6 +5446,476 @@ var Textarea = function ($) {
   return Textarea;
 }(jQuery);
 
+/* global Popper */
+
+/**
+ * This is a copy of the Bootstrap's original dropdown.js, with the only addition
+ * of two new classes: 'showing' and 'hiding', used to handle animaitons.
+ */
+
+/**
+ * --------------------------------------------------------------------------
+ * Bootstrap (v4.0.0-beta): dropdown.js
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ * --------------------------------------------------------------------------
+ */
+
+var Dropdown = function ($) {
+
+  /**
+   * Check for Popper dependency
+   * Popper - https://popper.js.org
+   */
+  if (typeof Popper === 'undefined') {
+    throw new Error('Bootstrap dropdown require Popper.js (https://popper.js.org)');
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'dropdown';
+  var VERSION = '4.0.0-beta';
+  var DATA_KEY = 'bs.dropdown';
+  var EVENT_KEY = '.' + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
+  var SPACE_KEYCODE = 32; // KeyboardEvent.which value for space key
+  var TAB_KEYCODE = 9; // KeyboardEvent.which value for tab key
+  var ARROW_UP_KEYCODE = 38; // KeyboardEvent.which value for up arrow key
+  var ARROW_DOWN_KEYCODE = 40; // KeyboardEvent.which value for down arrow key
+  var RIGHT_MOUSE_BUTTON_WHICH = 3; // MouseEvent.which value for the right button (assuming a right-handed mouse)
+  var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + '|' + ARROW_DOWN_KEYCODE + '|' + ESCAPE_KEYCODE);
+
+  var Event = {
+    HIDE: 'hide' + EVENT_KEY,
+    HIDDEN: 'hidden' + EVENT_KEY,
+    SHOW: 'show' + EVENT_KEY,
+    SHOWN: 'shown' + EVENT_KEY,
+    CLICK: 'click' + EVENT_KEY,
+    CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY,
+    KEYDOWN_DATA_API: 'keydown' + EVENT_KEY + DATA_API_KEY,
+    KEYUP_DATA_API: 'keyup' + EVENT_KEY + DATA_API_KEY,
+    TRANSITION_END: 'transitionend webkitTransitionEnd oTransitionEnd animationend webkitAnimationEnd oAnimationEnd'
+  };
+
+  var ClassName = {
+    DISABLED: 'disabled',
+    SHOW: 'show',
+    SHOWING: 'showing',
+    HIDING: 'hiding',
+    DROPUP: 'dropup',
+    MENURIGHT: 'dropdown-menu-right',
+    MENULEFT: 'dropdown-menu-left'
+  };
+
+  var Selector = {
+    DATA_TOGGLE: '[data-toggle="dropdown"]',
+    FORM_CHILD: '.dropdown form',
+    MENU: '.dropdown-menu',
+    NAVBAR_NAV: '.navbar-nav',
+    VISIBLE_ITEMS: '.dropdown-menu .dropdown-item:not(.disabled)'
+  };
+
+  var AttachmentMap = {
+    TOP: 'top-start',
+    TOPEND: 'top-end',
+    BOTTOM: 'bottom-start',
+    BOTTOMEND: 'bottom-end'
+  };
+
+  var Default = {
+    placement: AttachmentMap.BOTTOM,
+    offset: 0,
+    flip: true
+  };
+
+  var DefaultType = {
+    placement: 'string',
+    offset: '(number|string)',
+    flip: 'boolean'
+
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+  var Dropdown = function () {
+    function Dropdown(element, config) {
+      classCallCheck(this, Dropdown);
+
+      this._element = element;
+      this._popper = null;
+      this._config = this._getConfig(config);
+      this._menu = this._getMenuElement();
+      this._inNavbar = this._detectNavbar();
+
+      this._addEventListeners();
+    }
+
+    // getters
+
+    createClass(Dropdown, [{
+      key: 'toggle',
+
+
+      // public
+
+      value: function toggle() {
+        var _this = this;
+
+        if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
+          return;
+        }
+
+        var parent = Dropdown._getParentFromElement(this._element);
+        var isActive = $(this._menu).hasClass(ClassName.SHOW);
+
+        Dropdown._clearMenus();
+
+        if (isActive) {
+          return;
+        }
+
+        var relatedTarget = {
+          relatedTarget: this._element
+        };
+        var showEvent = $.Event(Event.SHOW, relatedTarget);
+
+        $(parent).trigger(showEvent);
+
+        if (showEvent.isDefaultPrevented()) {
+          return;
+        }
+
+        var element = this._element;
+        // for dropup with alignment we use the parent as popper container
+        if ($(parent).hasClass(ClassName.DROPUP)) {
+          if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
+            element = parent;
+          }
+        }
+        this._popper = new Popper(element, this._menu, this._getPopperConfig());
+
+        // if this is a touch-enabled device we add extra
+        // empty mouseover listeners to the body's immediate children;
+        // only needed because of broken event delegation on iOS
+        // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
+        if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) {
+          $('body').children().on('mouseover', null, $.noop);
+        }
+
+        this._element.focus();
+        this._element.setAttribute('aria-expanded', true);
+
+        $(this._menu).one(Event.TRANSITION_END, function () {
+          $(parent).trigger($.Event(Event.SHOWN, relatedTarget));
+          $(_this._menu).removeClass(ClassName.SHOWING);
+        });
+
+        $(this._menu).addClass(ClassName.SHOW + ' ' + ClassName.SHOWING);
+        $(parent).addClass(ClassName.SHOW);
+      }
+    }, {
+      key: 'dispose',
+      value: function dispose() {
+        $.removeData(this._element, DATA_KEY);
+        $(this._element).off(EVENT_KEY);
+        this._element = null;
+        this._menu = null;
+        if (this._popper !== null) {
+          this._popper.destroy();
+        }
+        this._popper = null;
+      }
+    }, {
+      key: 'update',
+      value: function update() {
+        this._inNavbar = this._detectNavbar();
+        if (this._popper !== null) {
+          this._popper.scheduleUpdate();
+        }
+      }
+
+      // private
+
+    }, {
+      key: '_addEventListeners',
+      value: function _addEventListeners() {
+        var _this2 = this;
+
+        $(this._element).on(Event.CLICK, function (event) {
+          event.preventDefault();
+          event.stopPropagation();
+          _this2.toggle();
+        });
+      }
+    }, {
+      key: '_getConfig',
+      value: function _getConfig(config) {
+        var elementData = $(this._element).data();
+        if (elementData.placement !== undefined) {
+          elementData.placement = AttachmentMap[elementData.placement.toUpperCase()];
+        }
+
+        config = $.extend({}, this.constructor.Default, $(this._element).data(), config);
+
+        Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
+
+        return config;
+      }
+    }, {
+      key: '_getMenuElement',
+      value: function _getMenuElement() {
+        if (!this._menu) {
+          var parent = Dropdown._getParentFromElement(this._element);
+          this._menu = $(parent).find(Selector.MENU)[0];
+        }
+        return this._menu;
+      }
+    }, {
+      key: '_getPlacement',
+      value: function _getPlacement() {
+        var $parentDropdown = $(this._element).parent();
+        var placement = this._config.placement;
+
+        // Handle dropup
+        if ($parentDropdown.hasClass(ClassName.DROPUP) || this._config.placement === AttachmentMap.TOP) {
+          placement = AttachmentMap.TOP;
+          if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
+            placement = AttachmentMap.TOPEND;
+          }
+        } else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
+          placement = AttachmentMap.BOTTOMEND;
+        }
+        return placement;
+      }
+    }, {
+      key: '_detectNavbar',
+      value: function _detectNavbar() {
+        return $(this._element).closest('.navbar').length > 0;
+      }
+    }, {
+      key: '_getPopperConfig',
+      value: function _getPopperConfig() {
+        var popperConfig = {
+          placement: this._getPlacement(),
+          modifiers: {
+            offset: {
+              offset: this._config.offset
+            },
+            flip: {
+              enabled: this._config.flip
+            }
+          }
+
+          // Disable Popper.js for Dropdown in Navbar
+        };if (this._inNavbar) {
+          popperConfig.modifiers.applyStyle = {
+            enabled: !this._inNavbar
+          };
+        }
+        return popperConfig;
+      }
+
+      // static
+
+    }], [{
+      key: '_jQueryInterface',
+      value: function _jQueryInterface(config) {
+        return this.each(function () {
+          var data = $(this).data(DATA_KEY);
+          var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
+
+          if (!data) {
+            data = new Dropdown(this, _config);
+            $(this).data(DATA_KEY, data);
+          }
+
+          if (typeof config === 'string') {
+            if (data[config] === undefined) {
+              throw new Error('No method named "' + config + '"');
+            }
+            data[config]();
+          }
+        });
+      }
+    }, {
+      key: '_clearMenus',
+      value: function _clearMenus(event) {
+        if (event && (event.which === RIGHT_MOUSE_BUTTON_WHICH || event.type === 'keyup' && event.which !== TAB_KEYCODE)) {
+          return;
+        }
+
+        var toggles = $.makeArray($(Selector.DATA_TOGGLE));
+
+        var _loop = function _loop(i) {
+          var parent = Dropdown._getParentFromElement(toggles[i]);
+          var context = $(toggles[i]).data(DATA_KEY);
+          var relatedTarget = {
+            relatedTarget: toggles[i]
+          };
+
+          if (!context) {
+            return 'continue';
+          }
+
+          var dropdownMenu = context._menu;
+          if (!$(parent).hasClass(ClassName.SHOW)) {
+            return 'continue';
+          }
+
+          if (event && (event.type === 'click' && /input|textarea/i.test(event.target.tagName) || event.type === 'keyup' && event.which === TAB_KEYCODE) && $.contains(parent, event.target)) {
+            return 'continue';
+          }
+
+          var hideEvent = $.Event(Event.HIDE, relatedTarget);
+          $(parent).trigger(hideEvent);
+          if (hideEvent.isDefaultPrevented()) {
+            return 'continue';
+          }
+
+          // if this is a touch-enabled device we remove the extra
+          // empty mouseover listeners we added for iOS support
+          if ('ontouchstart' in document.documentElement) {
+            $('body').children().off('mouseover', null, $.noop);
+          }
+
+          toggles[i].setAttribute('aria-expanded', 'false');
+
+          $(dropdownMenu).addClass(ClassName.HIDING).removeClass(ClassName.SHOW);
+          $(parent).removeClass(ClassName.SHOW);
+
+          $(dropdownMenu).one(Event.TRANSITION_END, function () {
+            $(parent).trigger($.Event(Event.HIDDEN, relatedTarget));
+            $(dropdownMenu).removeClass(ClassName.HIDING);
+          });
+        };
+
+        for (var i = 0; i < toggles.length; i++) {
+          var _ret = _loop(i);
+
+          if (_ret === 'continue') continue;
+        }
+      }
+    }, {
+      key: '_getParentFromElement',
+      value: function _getParentFromElement(element) {
+        var parent = void 0;
+        var selector = Util.getSelectorFromElement(element);
+
+        if (selector) {
+          parent = $(selector)[0];
+        }
+
+        return parent || element.parentNode;
+      }
+    }, {
+      key: '_dataApiKeydownHandler',
+      value: function _dataApiKeydownHandler(event) {
+        if (!REGEXP_KEYDOWN.test(event.which) || /button/i.test(event.target.tagName) && event.which === SPACE_KEYCODE || /input|textarea/i.test(event.target.tagName)) {
+          return;
+        }
+
+        event.preventDefault();
+        event.stopPropagation();
+
+        if (this.disabled || $(this).hasClass(ClassName.DISABLED)) {
+          return;
+        }
+
+        var parent = Dropdown._getParentFromElement(this);
+        var isActive = $(parent).hasClass(ClassName.SHOW);
+
+        if (!isActive && (event.which !== ESCAPE_KEYCODE || event.which !== SPACE_KEYCODE) || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
+
+          if (event.which === ESCAPE_KEYCODE) {
+            var toggle = $(parent).find(Selector.DATA_TOGGLE)[0];
+            $(toggle).trigger('focus');
+          }
+
+          $(this).trigger('click');
+          return;
+        }
+
+        var items = $(parent).find(Selector.VISIBLE_ITEMS).get();
+
+        if (!items.length) {
+          return;
+        }
+
+        var index = items.indexOf(event.target);
+
+        if (event.which === ARROW_UP_KEYCODE && index > 0) {
+          // up
+          index--;
+        }
+
+        if (event.which === ARROW_DOWN_KEYCODE && index < items.length - 1) {
+          // down
+          index++;
+        }
+
+        if (index < 0) {
+          index = 0;
+        }
+
+        items[index].focus();
+      }
+    }, {
+      key: 'VERSION',
+      get: function get$$1() {
+        return VERSION;
+      }
+    }, {
+      key: 'Default',
+      get: function get$$1() {
+        return Default;
+      }
+    }, {
+      key: 'DefaultType',
+      get: function get$$1() {
+        return DefaultType;
+      }
+    }]);
+    return Dropdown;
+  }();
+
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+  $(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + ' ' + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    event.preventDefault();
+    event.stopPropagation();
+    Dropdown._jQueryInterface.call($(this), 'toggle');
+  }).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) {
+    e.stopPropagation();
+  });
+
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Dropdown._jQueryInterface;
+  $.fn[NAME].Constructor = Dropdown;
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Dropdown._jQueryInterface;
+  };
+
+  return Dropdown;
+}(jQuery);
+
 var BaseLayout = function ($) {
   var ClassName = {
     CANVAS: "bmd-layout-canvas",
@@ -6696,6 +6723,9 @@ var Autofill = function ($) {
   return Autofill;
 }(jQuery);
 
+/* globals Popper */
+Popper.Defaults.modifiers.computeStyle.gpuAcceleration = false;
+
 /**
  * $.bootstrapMaterialDesign(config) is a macro class to configure the components generally
  *  used in Material Design for Bootstrap.  You may pass overrides to the configurations