diff options
Diffstat (limited to 'js/dist/tab.js')
| -rw-r--r-- | js/dist/tab.js | 201 |
1 files changed, 143 insertions, 58 deletions
diff --git a/js/dist/tab.js b/js/dist/tab.js index a5272e65de..2439d2dc97 100644 --- a/js/dist/tab.js +++ b/js/dist/tab.js @@ -4,13 +4,14 @@ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ (function (global, factory) { - typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) : - typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) : - (global = global || self, global.Tab = factory(global.jQuery, global.Util)); -}(this, function ($, Util) { 'use strict'; + typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('./dom/data.js'), require('./dom/eventHandler.js'), require('./dom/selectorEngine.js')) : + typeof define === 'function' && define.amd ? define(['./dom/data.js', './dom/eventHandler.js', './dom/selectorEngine.js'], factory) : + (global = global || self, global.Tab = factory(global.Data, global.EventHandler, global.SelectorEngine)); +}(this, function (Data, EventHandler, SelectorEngine) { 'use strict'; - $ = $ && $.hasOwnProperty('default') ? $['default'] : $; - Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util; + Data = Data && Data.hasOwnProperty('default') ? Data['default'] : Data; + EventHandler = EventHandler && EventHandler.hasOwnProperty('default') ? EventHandler['default'] : EventHandler; + SelectorEngine = SelectorEngine && SelectorEngine.hasOwnProperty('default') ? SelectorEngine['default'] : SelectorEngine; function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { @@ -29,6 +30,88 @@ } /** + * -------------------------------------------------------------------------- + * Bootstrap (v4.3.1): util/index.js + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * -------------------------------------------------------------------------- + */ + var MILLISECONDS_MULTIPLIER = 1000; + var TRANSITION_END = 'transitionend'; + var jQuery = window.jQuery; // Shoutout AngusCroll (https://goo.gl/pxwQGp) + + var getSelectorFromElement = function getSelectorFromElement(element) { + var selector = element.getAttribute('data-target'); + + if (!selector || selector === '#') { + var hrefAttr = element.getAttribute('href'); + selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : ''; + } + + try { + return document.querySelector(selector) ? selector : null; + } catch (err) { + return null; + } + }; + + var getTransitionDurationFromElement = function getTransitionDurationFromElement(element) { + if (!element) { + return 0; + } // Get transition-duration of the element + + + var _window$getComputedSt = window.getComputedStyle(element), + transitionDuration = _window$getComputedSt.transitionDuration, + transitionDelay = _window$getComputedSt.transitionDelay; + + var floatTransitionDuration = parseFloat(transitionDuration); + var floatTransitionDelay = parseFloat(transitionDelay); // Return 0 if element or transition duration is not found + + if (!floatTransitionDuration && !floatTransitionDelay) { + return 0; + } // If multiple durations are defined, take the first + + + transitionDuration = transitionDuration.split(',')[0]; + transitionDelay = transitionDelay.split(',')[0]; + return (parseFloat(transitionDuration) + parseFloat(transitionDelay)) * MILLISECONDS_MULTIPLIER; + }; + + var triggerTransitionEnd = function triggerTransitionEnd(element) { + element.dispatchEvent(new Event(TRANSITION_END)); + }; + + var emulateTransitionEnd = function emulateTransitionEnd(element, duration) { + var called = false; + var durationPadding = 5; + var emulatedDuration = duration + durationPadding; + + function listener() { + called = true; + element.removeEventListener(TRANSITION_END, listener); + } + + element.addEventListener(TRANSITION_END, listener); + setTimeout(function () { + if (!called) { + triggerTransitionEnd(element); + } + }, emulatedDuration); + }; + + var makeArray = function makeArray(nodeList) { + if (!nodeList) { + return []; + } + + return [].slice.call(nodeList); + }; + + var reflow = function reflow(element) { + return element.offsetHeight; + }; + + /** * ------------------------------------------------------------------------ * Constants * ------------------------------------------------------------------------ @@ -39,8 +122,7 @@ var DATA_KEY = 'bs.tab'; var EVENT_KEY = "." + DATA_KEY; var DATA_API_KEY = '.data-api'; - var JQUERY_NO_CONFLICT = $.fn[NAME]; - var Event = { + var Event$1 = { HIDE: "hide" + EVENT_KEY, HIDDEN: "hidden" + EVENT_KEY, SHOW: "show" + EVENT_KEY, @@ -58,10 +140,10 @@ DROPDOWN: '.dropdown', NAV_LIST_GROUP: '.nav, .list-group', ACTIVE: '.active', - ACTIVE_UL: '> li > .active', + ACTIVE_UL: ':scope > li > .active', DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]', DROPDOWN_TOGGLE: '.dropdown-toggle', - DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active' + DROPDOWN_ACTIVE_CHILD: ':scope > .dropdown-menu .active' /** * ------------------------------------------------------------------------ * Class Definition @@ -75,6 +157,7 @@ function () { function Tab(element) { this._element = element; + Data.setData(this._element, DATA_KEY, this); } // Getters @@ -84,53 +167,50 @@ _proto.show = function show() { var _this = this; - if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) { + if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && this._element.classList.contains(ClassName.ACTIVE) || this._element.classList.contains(ClassName.DISABLED)) { return; } var target; var previous; - var listElement = $(this._element).closest(Selector.NAV_LIST_GROUP)[0]; - var selector = Util.getSelectorFromElement(this._element); + var listElement = SelectorEngine.closest(this._element, Selector.NAV_LIST_GROUP); + var selector = getSelectorFromElement(this._element); if (listElement) { var itemSelector = listElement.nodeName === 'UL' || listElement.nodeName === 'OL' ? Selector.ACTIVE_UL : Selector.ACTIVE; - previous = $.makeArray($(listElement).find(itemSelector)); + previous = makeArray(SelectorEngine.find(itemSelector, listElement)); previous = previous[previous.length - 1]; } - var hideEvent = $.Event(Event.HIDE, { - relatedTarget: this._element - }); - var showEvent = $.Event(Event.SHOW, { - relatedTarget: previous - }); + var hideEvent = null; if (previous) { - $(previous).trigger(hideEvent); + hideEvent = EventHandler.trigger(previous, Event$1.HIDE, { + relatedTarget: this._element + }); } - $(this._element).trigger(showEvent); + var showEvent = EventHandler.trigger(this._element, Event$1.SHOW, { + relatedTarget: previous + }); - if (showEvent.isDefaultPrevented() || hideEvent.isDefaultPrevented()) { + if (showEvent.defaultPrevented || hideEvent !== null && hideEvent.defaultPrevented) { return; } if (selector) { - target = document.querySelector(selector); + target = SelectorEngine.findOne(selector); } this._activate(this._element, listElement); var complete = function complete() { - var hiddenEvent = $.Event(Event.HIDDEN, { + EventHandler.trigger(previous, Event$1.HIDDEN, { relatedTarget: _this._element }); - var shownEvent = $.Event(Event.SHOWN, { + EventHandler.trigger(_this._element, Event$1.SHOWN, { relatedTarget: previous }); - $(previous).trigger(hiddenEvent); - $(_this._element).trigger(shownEvent); }; if (target) { @@ -141,7 +221,7 @@ }; _proto.dispose = function dispose() { - $.removeData(this._element, DATA_KEY); + Data.removeData(this._element, DATA_KEY); this._element = null; } // Private ; @@ -149,17 +229,19 @@ _proto._activate = function _activate(element, container, callback) { var _this2 = this; - var activeElements = container && (container.nodeName === 'UL' || container.nodeName === 'OL') ? $(container).find(Selector.ACTIVE_UL) : $(container).children(Selector.ACTIVE); + var activeElements = container && (container.nodeName === 'UL' || container.nodeName === 'OL') ? SelectorEngine.find(Selector.ACTIVE_UL, container) : SelectorEngine.children(container, Selector.ACTIVE); var active = activeElements[0]; - var isTransitioning = callback && active && $(active).hasClass(ClassName.FADE); + var isTransitioning = callback && active && active.classList.contains(ClassName.FADE); var complete = function complete() { return _this2._transitionComplete(element, active, callback); }; if (active && isTransitioning) { - var transitionDuration = Util.getTransitionDurationFromElement(active); - $(active).removeClass(ClassName.SHOW).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration); + var transitionDuration = getTransitionDurationFromElement(active); + active.classList.remove(ClassName.SHOW); + EventHandler.one(active, TRANSITION_END, complete); + emulateTransitionEnd(active, transitionDuration); } else { complete(); } @@ -167,11 +249,11 @@ _proto._transitionComplete = function _transitionComplete(element, active, callback) { if (active) { - $(active).removeClass(ClassName.ACTIVE); - var dropdownChild = $(active.parentNode).find(Selector.DROPDOWN_ACTIVE_CHILD)[0]; + active.classList.remove(ClassName.ACTIVE); + var dropdownChild = SelectorEngine.findOne(Selector.DROPDOWN_ACTIVE_CHILD, active.parentNode); if (dropdownChild) { - $(dropdownChild).removeClass(ClassName.ACTIVE); + dropdownChild.classList.remove(ClassName.ACTIVE); } if (active.getAttribute('role') === 'tab') { @@ -179,24 +261,25 @@ } } - $(element).addClass(ClassName.ACTIVE); + element.classList.add(ClassName.ACTIVE); if (element.getAttribute('role') === 'tab') { element.setAttribute('aria-selected', true); } - Util.reflow(element); + reflow(element); if (element.classList.contains(ClassName.FADE)) { element.classList.add(ClassName.SHOW); } - if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) { - var dropdownElement = $(element).closest(Selector.DROPDOWN)[0]; + if (element.parentNode && element.parentNode.classList.contains(ClassName.DROPDOWN_MENU)) { + var dropdownElement = SelectorEngine.closest(element, Selector.DROPDOWN); if (dropdownElement) { - var dropdownToggleList = [].slice.call(dropdownElement.querySelectorAll(Selector.DROPDOWN_TOGGLE)); - $(dropdownToggleList).addClass(ClassName.ACTIVE); + makeArray(SelectorEngine.find(Selector.DROPDOWN_TOGGLE)).forEach(function (dropdown) { + return dropdown.classList.add(ClassName.ACTIVE); + }); } element.setAttribute('aria-expanded', true); @@ -210,13 +293,7 @@ Tab._jQueryInterface = function _jQueryInterface(config) { return this.each(function () { - var $this = $(this); - var data = $this.data(DATA_KEY); - - if (!data) { - data = new Tab(this); - $this.data(DATA_KEY, data); - } + var data = Data.getData(this, DATA_KEY) || new Tab(this); if (typeof config === 'string') { if (typeof data[config] === 'undefined') { @@ -228,6 +305,10 @@ }); }; + Tab._getInstance = function _getInstance(element) { + return Data.getData(element, DATA_KEY); + }; + _createClass(Tab, null, [{ key: "VERSION", get: function get() { @@ -244,24 +325,28 @@ */ - $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) { + EventHandler.on(document, Event$1.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) { event.preventDefault(); - - Tab._jQueryInterface.call($(this), 'show'); + var data = Data.getData(this, DATA_KEY) || new Tab(this); + data.show(); }); /** * ------------------------------------------------------------------------ * jQuery * ------------------------------------------------------------------------ + * add .tab to jQuery only if jQuery is present */ - $.fn[NAME] = Tab._jQueryInterface; - $.fn[NAME].Constructor = Tab; + if (typeof jQuery !== 'undefined') { + var JQUERY_NO_CONFLICT = jQuery.fn[NAME]; + jQuery.fn[NAME] = Tab._jQueryInterface; + jQuery.fn[NAME].Constructor = Tab; - $.fn[NAME].noConflict = function () { - $.fn[NAME] = JQUERY_NO_CONFLICT; - return Tab._jQueryInterface; - }; + jQuery.fn[NAME].noConflict = function () { + jQuery.fn[NAME] = JQUERY_NO_CONFLICT; + return Tab._jQueryInterface; + }; + } return Tab; |