UNPKG

mekari-ui-toolkit

Version:
1,620 lines (1,336 loc) 212 kB
/*! * Mekari UI (https://bitbucket.org/mekariuitoolkit/mekari-ui-toolkit#readme) * Copyright 2011-2021 Mekari * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('jquery')) : typeof define === 'function' && define.amd ? define(['exports', 'jquery'], factory) : (global = global || self, factory(global['mekari-ui'] = {}, global.jQuery)); }(this, function (exports, $) { 'use strict'; $ = $ && $.hasOwnProperty('default') ? $['default'] : $; /** * -------------------------------------------------------------------------- * Bootstrap (v4.5.2): util.js * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) * -------------------------------------------------------------------------- */ /** * ------------------------------------------------------------------------ * Private TransitionEnd Helpers * ------------------------------------------------------------------------ */ const TRANSITION_END = 'transitionend'; const MAX_UID = 1000000; const MILLISECONDS_MULTIPLIER = 1000; // Shoutout AngusCroll (https://goo.gl/pxwQGp) function toType(obj) { if (obj === null || typeof obj === 'undefined') { return `${obj}` } return {}.toString.call(obj).match(/\s([a-z]+)/i)[1].toLowerCase() } function getSpecialTransitionEndEvent() { return { bindType: TRANSITION_END, delegateType: TRANSITION_END, handle(event) { if ($(event.target).is(this)) { return event.handleObj.handler.apply(this, arguments) // eslint-disable-line prefer-rest-params } return undefined } } } function transitionEndEmulator(duration) { let called = false; $(this).one(Util.TRANSITION_END, () => { called = true; }); setTimeout(() => { if (!called) { Util.triggerTransitionEnd(this); } }, duration); return this } function setTransitionEndSupport() { $.fn.emulateTransitionEnd = transitionEndEmulator; $.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent(); } /** * -------------------------------------------------------------------------- * Public Util Api * -------------------------------------------------------------------------- */ const Util = { TRANSITION_END: 'bsTransitionEnd', getUID(prefix) { do { // eslint-disable-next-line no-bitwise prefix += ~~(Math.random() * MAX_UID); // "~~" acts like a faster Math.floor() here } while (document.getElementById(prefix)) return prefix }, getSelectorFromElement(element) { let selector = element.getAttribute('data-target'); if (!selector || selector === '#') { const hrefAttr = element.getAttribute('href'); selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : ''; } try { return document.querySelector(selector) ? selector : null } catch (err) { return null } }, getTransitionDurationFromElement(element) { if (!element) { return 0 } // Get transition-duration of the element let transitionDuration = $(element).css('transition-duration'); let transitionDelay = $(element).css('transition-delay'); const floatTransitionDuration = parseFloat(transitionDuration); const 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 }, reflow(element) { return element.offsetHeight }, triggerTransitionEnd(element) { $(element).trigger(TRANSITION_END); }, // TODO: Remove in v5 supportsTransitionEnd() { return Boolean(TRANSITION_END) }, isElement(obj) { return (obj[0] || obj).nodeType }, typeCheckConfig(componentName, config, configTypes) { for (const property in configTypes) { if (Object.prototype.hasOwnProperty.call(configTypes, property)) { const expectedTypes = configTypes[property]; const value = config[property]; const valueType = value && Util.isElement(value) ? 'element' : toType(value); if (!new RegExp(expectedTypes).test(valueType)) { throw new Error( `${componentName.toUpperCase()}: ` + `Option "${property}" provided type "${valueType}" ` + `but expected type "${expectedTypes}".`) } } } }, findShadowRoot(element) { if (!document.documentElement.attachShadow) { return null } // Can find the shadow root otherwise it'll return the document if (typeof element.getRootNode === 'function') { const root = element.getRootNode(); return root instanceof ShadowRoot ? root : null } if (element instanceof ShadowRoot) { return element } // when we don't find a shadow root if (!element.parentNode) { return null } return Util.findShadowRoot(element.parentNode) }, jQueryDetection() { if (typeof $ === 'undefined') { throw new TypeError('Bootstrap\'s JavaScript requires jQuery. jQuery must be included before Bootstrap\'s JavaScript.') } const version = $.fn.jquery.split(' ')[0].split('.'); const minMajor = 1; const ltMajor = 2; const minMinor = 9; const minPatch = 1; const maxMajor = 4; if (version[0] < ltMajor && version[1] < minMinor || version[0] === minMajor && version[1] === minMinor && version[2] < minPatch || version[0] >= maxMajor) { throw new Error('Bootstrap\'s JavaScript requires at least jQuery v1.9.1 but less than v4.0.0') } } }; Util.jQueryDetection(); setTransitionEndSupport(); /** * -------------------------------------------------------------------------- * Bootstrap (v4.5.2): alert.js * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) * -------------------------------------------------------------------------- */ /** * ------------------------------------------------------------------------ * Constants * ------------------------------------------------------------------------ */ const NAME = 'alert'; const VERSION = '4.5.2'; const DATA_KEY = 'bs.alert'; const EVENT_KEY = `.${DATA_KEY}`; const DATA_API_KEY = '.data-api'; const JQUERY_NO_CONFLICT = $.fn[NAME]; const SELECTOR_DISMISS = '[data-dismiss="alert"]'; const EVENT_CLOSE = `close${EVENT_KEY}`; const EVENT_CLOSED = `closed${EVENT_KEY}`; const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`; const CLASS_NAME_ALERT = 'alert'; const CLASS_NAME_FADE = 'fade'; const CLASS_NAME_SHOW = 'show'; /** * ------------------------------------------------------------------------ * Class Definition * ------------------------------------------------------------------------ */ class Alert { constructor(element) { this._element = element; } // Getters static get VERSION() { return VERSION } // Public close(element) { let rootElement = this._element; if (element) { rootElement = this._getRootElement(element); } const customEvent = this._triggerCloseEvent(rootElement); if (customEvent.isDefaultPrevented()) { return } this._removeElement(rootElement); } dispose() { $.removeData(this._element, DATA_KEY); this._element = null; } // Private _getRootElement(element) { const selector = Util.getSelectorFromElement(element); let parent = false; if (selector) { parent = document.querySelector(selector); } if (!parent) { parent = $(element).closest(`.${CLASS_NAME_ALERT}`)[0]; } return parent } _triggerCloseEvent(element) { const closeEvent = $.Event(EVENT_CLOSE); $(element).trigger(closeEvent); return closeEvent } _removeElement(element) { $(element).removeClass(CLASS_NAME_SHOW); if (!$(element).hasClass(CLASS_NAME_FADE)) { this._destroyElement(element); return } const transitionDuration = Util.getTransitionDurationFromElement(element); $(element) .one(Util.TRANSITION_END, (event) => this._destroyElement(element, event)) .emulateTransitionEnd(transitionDuration); } _destroyElement(element) { $(element) .detach() .trigger(EVENT_CLOSED) .remove(); } // Static static _jQueryInterface(config) { return this.each(function () { const $element = $(this); let data = $element.data(DATA_KEY); if (!data) { data = new Alert(this); $element.data(DATA_KEY, data); } if (config === 'close') { data[config](this); } }) } static _handleDismiss(alertInstance) { return function (event) { if (event) { event.preventDefault(); } alertInstance.close(this); } } } /** * ------------------------------------------------------------------------ * Data Api implementation * ------------------------------------------------------------------------ */ $(document).on( EVENT_CLICK_DATA_API, SELECTOR_DISMISS, Alert._handleDismiss(new Alert()) ); /** * ------------------------------------------------------------------------ * jQuery * ------------------------------------------------------------------------ */ $.fn[NAME] = Alert._jQueryInterface; $.fn[NAME].Constructor = Alert; $.fn[NAME].noConflict = () => { $.fn[NAME] = JQUERY_NO_CONFLICT; return Alert._jQueryInterface }; /** * -------------------------------------------------------------------------- * Bootstrap (v4.5.2): button.js * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) * -------------------------------------------------------------------------- */ /** * ------------------------------------------------------------------------ * Constants * ------------------------------------------------------------------------ */ const NAME$1 = 'button'; const VERSION$1 = '4.5.2'; const DATA_KEY$1 = 'bs.button'; const EVENT_KEY$1 = `.${DATA_KEY$1}`; const DATA_API_KEY$1 = '.data-api'; const JQUERY_NO_CONFLICT$1 = $.fn[NAME$1]; const CLASS_NAME_ACTIVE = 'active'; const CLASS_NAME_BUTTON = 'btn'; const CLASS_NAME_FOCUS = 'focus'; const SELECTOR_DATA_TOGGLE_CARROT = '[data-toggle^="button"]'; const SELECTOR_DATA_TOGGLES = '[data-toggle="buttons"]'; const SELECTOR_DATA_TOGGLE = '[data-toggle="button"]'; const SELECTOR_DATA_TOGGLES_BUTTONS = '[data-toggle="buttons"] .btn'; const SELECTOR_INPUT = 'input:not([type="hidden"])'; const SELECTOR_ACTIVE = '.active'; const SELECTOR_BUTTON = '.btn'; const EVENT_CLICK_DATA_API$1 = `click${EVENT_KEY$1}${DATA_API_KEY$1}`; const EVENT_FOCUS_BLUR_DATA_API = `focus${EVENT_KEY$1}${DATA_API_KEY$1} ` + `blur${EVENT_KEY$1}${DATA_API_KEY$1}`; const EVENT_LOAD_DATA_API = `load${EVENT_KEY$1}${DATA_API_KEY$1}`; /** * ------------------------------------------------------------------------ * Class Definition * ------------------------------------------------------------------------ */ class Button { constructor(element) { this._element = element; } // Getters static get VERSION() { return VERSION$1 } // Public toggle() { let triggerChangeEvent = true; let addAriaPressed = true; const rootElement = $(this._element).closest( SELECTOR_DATA_TOGGLES )[0]; if (rootElement) { const input = this._element.querySelector(SELECTOR_INPUT); if (input) { if (input.type === 'radio') { if (input.checked && this._element.classList.contains(CLASS_NAME_ACTIVE)) { triggerChangeEvent = false; } else { const activeElement = rootElement.querySelector(SELECTOR_ACTIVE); if (activeElement) { $(activeElement).removeClass(CLASS_NAME_ACTIVE); } } } if (triggerChangeEvent) { // if it's not a radio button or checkbox don't add a pointless/invalid checked property to the input if (input.type === 'checkbox' || input.type === 'radio') { input.checked = !this._element.classList.contains(CLASS_NAME_ACTIVE); } $(input).trigger('change'); } input.focus(); addAriaPressed = false; } } if (!(this._element.hasAttribute('disabled') || this._element.classList.contains('disabled'))) { if (addAriaPressed) { this._element.setAttribute('aria-pressed', !this._element.classList.contains(CLASS_NAME_ACTIVE)); } if (triggerChangeEvent) { $(this._element).toggleClass(CLASS_NAME_ACTIVE); } } } dispose() { $.removeData(this._element, DATA_KEY$1); this._element = null; } // Static static _jQueryInterface(config) { return this.each(function () { let data = $(this).data(DATA_KEY$1); if (!data) { data = new Button(this); $(this).data(DATA_KEY$1, data); } if (config === 'toggle') { data[config](); } }) } } /** * ------------------------------------------------------------------------ * Data Api implementation * ------------------------------------------------------------------------ */ $(document) .on(EVENT_CLICK_DATA_API$1, SELECTOR_DATA_TOGGLE_CARROT, (event) => { let button = event.target; const initialButton = button; if (!$(button).hasClass(CLASS_NAME_BUTTON)) { button = $(button).closest(SELECTOR_BUTTON)[0]; } if (!button || button.hasAttribute('disabled') || button.classList.contains('disabled')) { event.preventDefault(); // work around Firefox bug #1540995 } else { const inputBtn = button.querySelector(SELECTOR_INPUT); if (inputBtn && (inputBtn.hasAttribute('disabled') || inputBtn.classList.contains('disabled'))) { event.preventDefault(); // work around Firefox bug #1540995 return } if (initialButton.tagName !== 'LABEL' || inputBtn && inputBtn.type !== 'checkbox') { Button._jQueryInterface.call($(button), 'toggle'); } } }) .on(EVENT_FOCUS_BLUR_DATA_API, SELECTOR_DATA_TOGGLE_CARROT, (event) => { const button = $(event.target).closest(SELECTOR_BUTTON)[0]; $(button).toggleClass(CLASS_NAME_FOCUS, /^focus(in)?$/.test(event.type)); }); $(window).on(EVENT_LOAD_DATA_API, () => { // ensure correct active class is set to match the controls' actual values/states // find all checkboxes/readio buttons inside data-toggle groups let buttons = [].slice.call(document.querySelectorAll(SELECTOR_DATA_TOGGLES_BUTTONS)); for (let i = 0, len = buttons.length; i < len; i++) { const button = buttons[i]; const input = button.querySelector(SELECTOR_INPUT); if (input.checked || input.hasAttribute('checked')) { button.classList.add(CLASS_NAME_ACTIVE); } else { button.classList.remove(CLASS_NAME_ACTIVE); } } // find all button toggles buttons = [].slice.call(document.querySelectorAll(SELECTOR_DATA_TOGGLE)); for (let i = 0, len = buttons.length; i < len; i++) { const button = buttons[i]; if (button.getAttribute('aria-pressed') === 'true') { button.classList.add(CLASS_NAME_ACTIVE); } else { button.classList.remove(CLASS_NAME_ACTIVE); } } }); /** * ------------------------------------------------------------------------ * jQuery * ------------------------------------------------------------------------ */ $.fn[NAME$1] = Button._jQueryInterface; $.fn[NAME$1].Constructor = Button; $.fn[NAME$1].noConflict = () => { $.fn[NAME$1] = JQUERY_NO_CONFLICT$1; return Button._jQueryInterface }; /** * -------------------------------------------------------------------------- * Bootstrap (v4.5.2): collapse.js * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) * -------------------------------------------------------------------------- */ /** * ------------------------------------------------------------------------ * Constants * ------------------------------------------------------------------------ */ const NAME$2 = 'collapse'; const VERSION$2 = '4.5.2'; const DATA_KEY$2 = 'bs.collapse'; const EVENT_KEY$2 = `.${DATA_KEY$2}`; const DATA_API_KEY$2 = '.data-api'; const JQUERY_NO_CONFLICT$2 = $.fn[NAME$2]; const Default = { toggle : true, parent : '' }; const DefaultType = { toggle : 'boolean', parent : '(string|element)' }; const EVENT_SHOW = `show${EVENT_KEY$2}`; const EVENT_SHOWN = `shown${EVENT_KEY$2}`; const EVENT_HIDE = `hide${EVENT_KEY$2}`; const EVENT_HIDDEN = `hidden${EVENT_KEY$2}`; const EVENT_CLICK_DATA_API$2 = `click${EVENT_KEY$2}${DATA_API_KEY$2}`; const CLASS_NAME_SHOW$1 = 'show'; const CLASS_NAME_COLLAPSE = 'collapse'; const CLASS_NAME_COLLAPSING = 'collapsing'; const CLASS_NAME_COLLAPSED = 'collapsed'; const DIMENSION_WIDTH = 'width'; const DIMENSION_HEIGHT = 'height'; const SELECTOR_ACTIVES = '.show, .collapsing'; const SELECTOR_DATA_TOGGLE$1 = '[data-toggle="collapse"]'; /** * ------------------------------------------------------------------------ * Class Definition * ------------------------------------------------------------------------ */ class Collapse { constructor(element, config) { this._isTransitioning = false; this._element = element; this._config = this._getConfig(config); this._triggerArray = [].slice.call(document.querySelectorAll( `[data-toggle="collapse"][href="#${element.id}"],` + `[data-toggle="collapse"][data-target="#${element.id}"]` )); const toggleList = [].slice.call(document.querySelectorAll(SELECTOR_DATA_TOGGLE$1)); for (let i = 0, len = toggleList.length; i < len; i++) { const elem = toggleList[i]; const selector = Util.getSelectorFromElement(elem); const filterElement = [].slice.call(document.querySelectorAll(selector)) .filter((foundElem) => foundElem === element); if (selector !== null && filterElement.length > 0) { this._selector = selector; this._triggerArray.push(elem); } } this._parent = this._config.parent ? this._getParent() : null; if (!this._config.parent) { this._addAriaAndCollapsedClass(this._element, this._triggerArray); } if (this._config.toggle) { this.toggle(); } } // Getters static get VERSION() { return VERSION$2 } static get Default() { return Default } // Public toggle() { if ($(this._element).hasClass(CLASS_NAME_SHOW$1)) { this.hide(); } else { this.show(); } } show() { if (this._isTransitioning || $(this._element).hasClass(CLASS_NAME_SHOW$1)) { return } let actives; let activesData; if (this._parent) { actives = [].slice.call(this._parent.querySelectorAll(SELECTOR_ACTIVES)) .filter((elem) => { if (typeof this._config.parent === 'string') { return elem.getAttribute('data-parent') === this._config.parent } return elem.classList.contains(CLASS_NAME_COLLAPSE) }); if (actives.length === 0) { actives = null; } } if (actives) { activesData = $(actives).not(this._selector).data(DATA_KEY$2); if (activesData && activesData._isTransitioning) { return } } const startEvent = $.Event(EVENT_SHOW); $(this._element).trigger(startEvent); if (startEvent.isDefaultPrevented()) { return } if (actives) { Collapse._jQueryInterface.call($(actives).not(this._selector), 'hide'); if (!activesData) { $(actives).data(DATA_KEY$2, null); } } const dimension = this._getDimension(); $(this._element) .removeClass(CLASS_NAME_COLLAPSE) .addClass(CLASS_NAME_COLLAPSING); this._element.style[dimension] = 0; if (this._triggerArray.length) { $(this._triggerArray) .removeClass(CLASS_NAME_COLLAPSED) .attr('aria-expanded', true); } this.setTransitioning(true); const complete = () => { $(this._element) .removeClass(CLASS_NAME_COLLAPSING) .addClass(`${CLASS_NAME_COLLAPSE} ${CLASS_NAME_SHOW$1}`); this._element.style[dimension] = ''; this.setTransitioning(false); $(this._element).trigger(EVENT_SHOWN); }; const capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1); const scrollSize = `scroll${capitalizedDimension}`; const transitionDuration = Util.getTransitionDurationFromElement(this._element); $(this._element) .one(Util.TRANSITION_END, complete) .emulateTransitionEnd(transitionDuration); this._element.style[dimension] = `${this._element[scrollSize]}px`; } hide() { if (this._isTransitioning || !$(this._element).hasClass(CLASS_NAME_SHOW$1)) { return } const startEvent = $.Event(EVENT_HIDE); $(this._element).trigger(startEvent); if (startEvent.isDefaultPrevented()) { return } const dimension = this._getDimension(); this._element.style[dimension] = `${this._element.getBoundingClientRect()[dimension]}px`; Util.reflow(this._element); $(this._element) .addClass(CLASS_NAME_COLLAPSING) .removeClass(`${CLASS_NAME_COLLAPSE} ${CLASS_NAME_SHOW$1}`); const triggerArrayLength = this._triggerArray.length; if (triggerArrayLength > 0) { for (let i = 0; i < triggerArrayLength; i++) { const trigger = this._triggerArray[i]; const selector = Util.getSelectorFromElement(trigger); if (selector !== null) { const $elem = $([].slice.call(document.querySelectorAll(selector))); if (!$elem.hasClass(CLASS_NAME_SHOW$1)) { $(trigger).addClass(CLASS_NAME_COLLAPSED) .attr('aria-expanded', false); } } } } this.setTransitioning(true); const complete = () => { this.setTransitioning(false); $(this._element) .removeClass(CLASS_NAME_COLLAPSING) .addClass(CLASS_NAME_COLLAPSE) .trigger(EVENT_HIDDEN); }; this._element.style[dimension] = ''; const transitionDuration = Util.getTransitionDurationFromElement(this._element); $(this._element) .one(Util.TRANSITION_END, complete) .emulateTransitionEnd(transitionDuration); } setTransitioning(isTransitioning) { this._isTransitioning = isTransitioning; } dispose() { $.removeData(this._element, DATA_KEY$2); this._config = null; this._parent = null; this._element = null; this._triggerArray = null; this._isTransitioning = null; } // Private _getConfig(config) { config = { ...Default, ...config }; config.toggle = Boolean(config.toggle); // Coerce string values Util.typeCheckConfig(NAME$2, config, DefaultType); return config } _getDimension() { const hasWidth = $(this._element).hasClass(DIMENSION_WIDTH); return hasWidth ? DIMENSION_WIDTH : DIMENSION_HEIGHT } _getParent() { let parent; if (Util.isElement(this._config.parent)) { parent = this._config.parent; // It's a jQuery object if (typeof this._config.parent.jquery !== 'undefined') { parent = this._config.parent[0]; } } else { parent = document.querySelector(this._config.parent); } const selector = `[data-toggle="collapse"][data-parent="${this._config.parent}"]`; const children = [].slice.call(parent.querySelectorAll(selector)); $(children).each((i, element) => { this._addAriaAndCollapsedClass( Collapse._getTargetFromElement(element), [element] ); }); return parent } _addAriaAndCollapsedClass(element, triggerArray) { const isOpen = $(element).hasClass(CLASS_NAME_SHOW$1); if (triggerArray.length) { $(triggerArray) .toggleClass(CLASS_NAME_COLLAPSED, !isOpen) .attr('aria-expanded', isOpen); } } // Static static _getTargetFromElement(element) { const selector = Util.getSelectorFromElement(element); return selector ? document.querySelector(selector) : null } static _jQueryInterface(config) { return this.each(function () { const $this = $(this); let data = $this.data(DATA_KEY$2); const _config = { ...Default, ...$this.data(), ...typeof config === 'object' && config ? config : {} }; if (!data && _config.toggle && typeof config === 'string' && /show|hide/.test(config)) { _config.toggle = false; } if (!data) { data = new Collapse(this, _config); $this.data(DATA_KEY$2, data); } if (typeof config === 'string') { if (typeof data[config] === 'undefined') { throw new TypeError(`No method named "${config}"`) } data[config](); } }) } } /** * ------------------------------------------------------------------------ * Data Api implementation * ------------------------------------------------------------------------ */ $(document).on(EVENT_CLICK_DATA_API$2, SELECTOR_DATA_TOGGLE$1, function (event) { // preventDefault only for <a> elements (which change the URL) not inside the collapsible element if (event.currentTarget.tagName === 'A') { event.preventDefault(); } const $trigger = $(this); const selector = Util.getSelectorFromElement(this); const selectors = [].slice.call(document.querySelectorAll(selector)); $(selectors).each(function () { const $target = $(this); const data = $target.data(DATA_KEY$2); const config = data ? 'toggle' : $trigger.data(); Collapse._jQueryInterface.call($target, config); }); }); /** * ------------------------------------------------------------------------ * jQuery * ------------------------------------------------------------------------ */ $.fn[NAME$2] = Collapse._jQueryInterface; $.fn[NAME$2].Constructor = Collapse; $.fn[NAME$2].noConflict = () => { $.fn[NAME$2] = JQUERY_NO_CONFLICT$2; return Collapse._jQueryInterface }; /**! * @fileOverview Kickass library to create and place poppers near their reference elements. * @version 1.15.0 * @license * Copyright (c) 2016 Federico Zivolo and contributors * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal * in the Software without restriction, including without limitation the rights * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the Software is * furnished to do so, subject to the following conditions: * * The above copyright notice and this permission notice shall be included in all * copies or substantial portions of the Software. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined'; var longerTimeoutBrowsers = ['Edge', 'Trident', 'Firefox']; var timeoutDuration = 0; for (var i = 0; i < longerTimeoutBrowsers.length; i += 1) { if (isBrowser && navigator.userAgent.indexOf(longerTimeoutBrowsers[i]) >= 0) { timeoutDuration = 1; break; } } function microtaskDebounce(fn) { var called = false; return function () { if (called) { return; } called = true; window.Promise.resolve().then(function () { called = false; fn(); }); }; } function taskDebounce(fn) { var scheduled = false; return function () { if (!scheduled) { scheduled = true; setTimeout(function () { scheduled = false; fn(); }, timeoutDuration); } }; } var supportsMicroTasks = isBrowser && window.Promise; /** * Create a debounced version of a method, that's asynchronously deferred * but called in the minimum time possible. * * @method * @memberof Popper.Utils * @argument {Function} fn * @returns {Function} */ var debounce = supportsMicroTasks ? microtaskDebounce : taskDebounce; /** * Check if the given variable is a function * @method * @memberof Popper.Utils * @argument {Any} functionToCheck - variable to check * @returns {Boolean} answer to: is a function? */ function isFunction(functionToCheck) { var getType = {}; return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]'; } /** * Get CSS computed property of the given element * @method * @memberof Popper.Utils * @argument {Eement} element * @argument {String} property */ function getStyleComputedProperty(element, property) { if (element.nodeType !== 1) { return []; } // NOTE: 1 DOM access here var window = element.ownerDocument.defaultView; var css = window.getComputedStyle(element, null); return property ? css[property] : css; } /** * Returns the parentNode or the host of the element * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} parent */ function getParentNode(element) { if (element.nodeName === 'HTML') { return element; } return element.parentNode || element.host; } /** * Returns the scrolling parent of the given element * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} scroll parent */ function getScrollParent(element) { // Return body, `getScroll` will take care to get the correct `scrollTop` from it if (!element) { return document.body; } switch (element.nodeName) { case 'HTML': case 'BODY': return element.ownerDocument.body; case '#document': return element.body; } // Firefox want us to check `-x` and `-y` variations as well var _getStyleComputedProp = getStyleComputedProperty(element), overflow = _getStyleComputedProp.overflow, overflowX = _getStyleComputedProp.overflowX, overflowY = _getStyleComputedProp.overflowY; if (/(auto|scroll|overlay)/.test(overflow + overflowY + overflowX)) { return element; } return getScrollParent(getParentNode(element)); } var isIE11 = isBrowser && !!(window.MSInputMethodContext && document.documentMode); var isIE10 = isBrowser && /MSIE 10/.test(navigator.userAgent); /** * Determines if the browser is Internet Explorer * @method * @memberof Popper.Utils * @param {Number} version to check * @returns {Boolean} isIE */ function isIE(version) { if (version === 11) { return isIE11; } if (version === 10) { return isIE10; } return isIE11 || isIE10; } /** * Returns the offset parent of the given element * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} offset parent */ function getOffsetParent(element) { if (!element) { return document.documentElement; } var noOffsetParent = isIE(10) ? document.body : null; // NOTE: 1 DOM access here var offsetParent = element.offsetParent || null; // Skip hidden elements which don't have an offsetParent while (offsetParent === noOffsetParent && element.nextElementSibling) { offsetParent = (element = element.nextElementSibling).offsetParent; } var nodeName = offsetParent && offsetParent.nodeName; if (!nodeName || nodeName === 'BODY' || nodeName === 'HTML') { return element ? element.ownerDocument.documentElement : document.documentElement; } // .offsetParent will return the closest TH, TD or TABLE in case // no offsetParent is present, I hate this job... if (['TH', 'TD', 'TABLE'].indexOf(offsetParent.nodeName) !== -1 && getStyleComputedProperty(offsetParent, 'position') === 'static') { return getOffsetParent(offsetParent); } return offsetParent; } function isOffsetContainer(element) { var nodeName = element.nodeName; if (nodeName === 'BODY') { return false; } return nodeName === 'HTML' || getOffsetParent(element.firstElementChild) === element; } /** * Finds the root node (document, shadowDOM root) of the given element * @method * @memberof Popper.Utils * @argument {Element} node * @returns {Element} root node */ function getRoot(node) { if (node.parentNode !== null) { return getRoot(node.parentNode); } return node; } /** * Finds the offset parent common to the two provided nodes * @method * @memberof Popper.Utils * @argument {Element} element1 * @argument {Element} element2 * @returns {Element} common offset parent */ function findCommonOffsetParent(element1, element2) { // This check is needed to avoid errors in case one of the elements isn't defined for any reason if (!element1 || !element1.nodeType || !element2 || !element2.nodeType) { return document.documentElement; } // Here we make sure to give as "start" the element that comes first in the DOM var order = element1.compareDocumentPosition(element2) & Node.DOCUMENT_POSITION_FOLLOWING; var start = order ? element1 : element2; var end = order ? element2 : element1; // Get common ancestor container var range = document.createRange(); range.setStart(start, 0); range.setEnd(end, 0); var commonAncestorContainer = range.commonAncestorContainer; // Both nodes are inside #document if (element1 !== commonAncestorContainer && element2 !== commonAncestorContainer || start.contains(end)) { if (isOffsetContainer(commonAncestorContainer)) { return commonAncestorContainer; } return getOffsetParent(commonAncestorContainer); } // one of the nodes is inside shadowDOM, find which one var element1root = getRoot(element1); if (element1root.host) { return findCommonOffsetParent(element1root.host, element2); } else { return findCommonOffsetParent(element1, getRoot(element2).host); } } /** * Gets the scroll value of the given element in the given side (top and left) * @method * @memberof Popper.Utils * @argument {Element} element * @argument {String} side `top` or `left` * @returns {number} amount of scrolled pixels */ function getScroll(element) { var side = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'top'; var upperSide = side === 'top' ? 'scrollTop' : 'scrollLeft'; var nodeName = element.nodeName; if (nodeName === 'BODY' || nodeName === 'HTML') { var html = element.ownerDocument.documentElement; var scrollingElement = element.ownerDocument.scrollingElement || html; return scrollingElement[upperSide]; } return element[upperSide]; } /* * Sum or subtract the element scroll values (left and top) from a given rect object * @method * @memberof Popper.Utils * @param {Object} rect - Rect object you want to change * @param {HTMLElement} element - The element from the function reads the scroll values * @param {Boolean} subtract - set to true if you want to subtract the scroll values * @return {Object} rect - The modifier rect object */ function includeScroll(rect, element) { var subtract = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; var scrollTop = getScroll(element, 'top'); var scrollLeft = getScroll(element, 'left'); var modifier = subtract ? -1 : 1; rect.top += scrollTop * modifier; rect.bottom += scrollTop * modifier; rect.left += scrollLeft * modifier; rect.right += scrollLeft * modifier; return rect; } /* * Helper to detect borders of a given element * @method * @memberof Popper.Utils * @param {CSSStyleDeclaration} styles * Result of `getStyleComputedProperty` on the given element * @param {String} axis - `x` or `y` * @return {number} borders - The borders size of the given axis */ function getBordersSize(styles, axis) { var sideA = axis === 'x' ? 'Left' : 'Top'; var sideB = sideA === 'Left' ? 'Right' : 'Bottom'; return parseFloat(styles['border' + sideA + 'Width'], 10) + parseFloat(styles['border' + sideB + 'Width'], 10); } function getSize(axis, body, html, computedStyle) { return Math.max(body['offset' + axis], body['scroll' + axis], html['client' + axis], html['offset' + axis], html['scroll' + axis], isIE(10) ? parseInt(html['offset' + axis]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Top' : 'Left')]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Bottom' : 'Right')]) : 0); } function getWindowSizes(document) { var body = document.body; var html = document.documentElement; var computedStyle = isIE(10) && getComputedStyle(html); return { height: getSize('Height', body, html, computedStyle), width: getSize('Width', body, html, computedStyle) }; } var classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }; var createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var defineProperty = function (obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /** * Given element offsets, generate an output similar to getBoundingClientRect * @method * @memberof Popper.Utils * @argument {Object} offsets * @returns {Object} ClientRect like output */ function getClientRect(offsets) { return _extends({}, offsets, { right: offsets.left + offsets.width, bottom: offsets.top + offsets.height }); } /** * Get bounding client rect of given element * @method * @memberof Popper.Utils * @param {HTMLElement} element * @return {Object} client rect */ function getBoundingClientRect(element) { var rect = {}; // IE10 10 FIX: Please, don't ask, the element isn't // considered in DOM in some circumstances... // This isn't reproducible in IE10 compatibility mode of IE11 try { if (isIE(10)) { rect = element.getBoundingClientRect(); var scrollTop = getScroll(element, 'top'); var scrollLeft = getScroll(element, 'left'); rect.top += scrollTop; rect.left += scrollLeft; rect.bottom += scrollTop; rect.right += scrollLeft; } else { rect = element.getBoundingClientRect(); } } catch (e) {} var result = { left: rect.left, top: rect.top, width: rect.right - rect.left, height: rect.bottom - rect.top }; // subtract scrollbar size from sizes var sizes = element.nodeName === 'HTML' ? getWindowSizes(element.ownerDocument) : {}; var width = sizes.width || element.clientWidth || result.right - result.left; var height = sizes.height || element.clientHeight || result.bottom - result.top; var horizScrollbar = element.offsetWidth - width; var vertScrollbar = element.offsetHeight - height; // if an hypothetical scrollbar is detected, we must be sure it's not a `border` // we make this check conditional for performance reasons if (horizScrollbar || vertScrollbar) { var styles = getStyleComputedProperty(element); horizScrollbar -= getBordersSize(styles, 'x'); vertScrollbar -= getBordersSize(styles, 'y'); result.width -= horizScrollbar; result.height -= vertScrollbar; } return getClientRect(result); } function getOffsetRectRelativeToArbitraryNode(children, parent) { var fixedPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; var isIE10 = isIE(10); var isHTML = parent.nodeName === 'HTML'; var childrenRect = getBoundingClientRect(children); var parentRect = getBoundingClientRect(parent); var scrollParent = getScrollParent(children); var styles = getStyleComputedProperty(parent); var borderTopWidth = parseFloat(styles.borderTopWidth, 10); var borderLeftWidth = parseFloat(styles.borderLeftWidth, 10); // In cases where the parent is fixed, we must ignore negative scroll in offset calc if (fixedPosition && isHTML) { parentRect.top = Math.max(parentRect.top, 0); parentRect.left = Math.max(parentRect.left, 0); } var offsets = getClientRect({ top: childrenRect.top - parentRect.top - borderTopWidth, left: childrenRect.left - parentRect.left - borderLeftWidth, width: childrenRect.width, height: childrenRect.height }); offsets.marginTop = 0; offsets.marginLeft = 0; // Subtract margins of documentElement in case it's being used as parent // we do this only on HTML because it's the only element that behaves // differently when margins are applied to it. The margins are included in // the box of the documentElement, in the other cases not. if (!isIE10 && isHTML) { var marginTop = parseFloat(styles.marginTop, 10); var marginLeft = parseFloat(styles.marginLeft, 10); offsets.top -= borderTopWidth - marginTop; offsets.bottom -= borderTopWidth - marginTop; offsets.left -= borderLeftWidth - marginLeft; offsets.right -= borderLeftWidth - marginLeft; // Attach marginTop and marginLeft because in some circumstances we may need them offsets.marginTop = marginTop; offsets.marginLeft = marginLeft; } if (isIE10 && !fixedPosition ? parent.contains(scrollParent) : parent === scrollParent && scrollParent.nodeName !== 'BODY') { offsets = includeScroll(offsets, parent); } return offsets; } function getViewportOffsetRectRelativeToArtbitraryNode(element) { var excludeScroll = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; var html = element.ownerDocument.documentElement; var relativeOffset = getOffsetRectRelativeToArbitraryNode(element, html); var width = Math.max(html.clientWidth, window.innerWidth || 0); var height = Math.max(html.clientHeight, window.innerHeight || 0); var scrollTop = !excludeScroll ? getScroll(html) : 0; var scrollLeft = !excludeScroll ? getScroll(html, 'left') : 0; var offset = { top: scrollTop - relativeOffset.top + relativeOffset.marginTop, left: scrollLeft - relativeOffset.left + relativeOffset.marginLeft, width: width, height: height }; return getClientRect(offset); } /** * Check if the given element is fixed or is inside a fixed parent * @method * @memberof Popper.Utils * @argument {Element} element * @argument {Element} customContainer * @returns {Boolean} answer to "isFixed?" */ function isFixed(element) { var nodeName = element.nodeName; if (nodeName === 'BODY' || nodeName === 'HTML') { return false; } if (getStyleComputedProperty(element, 'position') === 'fixed') { return true; } var parentNode = getParentNode(element); if (!parentNode) { return false; } return isFixed(parentNode); } /** * Finds the first parent of an element that has a transformed property defined * @method * @memberof Popper.Utils * @argument {Element} element * @returns {Element} first transformed parent or documentElement */ function getFixedPositionOffsetParent(element) { // This check is needed to avoid errors in case one of the elements isn't defined for any reason if (!element || !element.parentElement || isIE()) { return document.documentElement; } var el = element.parentElement; while (el && getStyleComputedProperty(el, 'transform') === 'none') { el = el.parentElement; } return el || document.documentElement; } /** * Computed the boundaries limits and return them * @method * @memberof Popper.Utils * @param {HTMLElement} popper * @param {HTMLElement} reference * @param {number} padding * @param {HTMLElement} boundariesElement - Element used to define the boundaries * @param {Boolean} fixedPosition - Is in fixed position mode * @returns {Object} Coordinates of the boundaries */ function getBoundaries(popper, reference, padding, boundariesElement) { var fixedPosition = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false; // NOTE: 1 DOM access here var boundaries = { top: 0, left: 0 }; var offsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, reference); // Handle viewport case if (boundariesElement === 'viewport') { boundaries = getViewportOffsetRectRelativeToArtbitraryNode(offsetParent, fixedPosition); } else { // Handle other cases based on DOM element used as boundaries var boundariesNode = void 0; if (boundariesElement === 'scrollParent') { boundariesNode = getScrollParent(getParentNode(reference)); if (boundariesNode.nodeName === 'BODY') { boundariesNode = popper.ownerDocument.documentElement; } } else if (boundariesElement === 'window') { boundariesNode = popper.ownerDocument.documentElement; } else { boundariesNode = boundariesElement; } var offsets = getOffsetRectRelativeToArbitraryNode(boundariesNode, offsetParent, fixedPosition); // In case of HTML, we need a different computation if (boundariesNode.nodeName === 'HTML' && !isFixed(offsetParent)) { var _getWindowSizes = getWindowSizes(popper.ownerDocument), height = _getWindowSizes.height, width = _getWindowSizes.width; boundaries.top += offsets.top - offsets.marginTop; boundaries.bottom = height + offsets.top; boundaries.left += offsets.left - offsets.marginLeft; boundaries.right = width + offsets.left; } else { // for all the other DOM elements, this one is good boundaries = offsets; } } // Add paddings paddin