yk-smart-ui-test
Version:
A Component Library for Vue.js.
1,338 lines (1,182 loc) • 1.63 MB
JavaScript
module.exports =
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/dist/";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 14);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports) {
module.exports = require("vue");
/***/ }),
/* 1 */
/***/ (function(module, exports) {
module.exports = require("throttle-debounce/debounce");
/***/ }),
/* 2 */
/***/ (function(module, exports, __webpack_require__) {
var __WEBPACK_AMD_DEFINE_RESULT__;/* Modified from https://github.com/taylorhakes/fecha
*
* The MIT License (MIT)
*
* Copyright (c) 2015 Taylor Hakes
*
* 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.
*/
/*eslint-disable*/
// 把 YYYY-MM-DD 改成了 yyyy-MM-dd
(function (main) {
'use strict';
/**
* Parse or format dates
* @class fecha
*/
var fecha = {};
var token = /d{1,4}|M{1,4}|yy(?:yy)?|S{1,3}|Do|ZZ|([HhMsDm])\1?|[aA]|"[^"]*"|'[^']*'/g;
var twoDigits = '\\d\\d?';
var threeDigits = '\\d{3}';
var fourDigits = '\\d{4}';
var word = '[^\\s]+';
var literal = /\[([^]*?)\]/gm;
var noop = function noop() {};
function regexEscape(str) {
return str.replace(/[|\\{()[^$+*?.-]/g, '\\$&');
}
function shorten(arr, sLen) {
var newArr = [];
for (var i = 0, len = arr.length; i < len; i++) {
newArr.push(arr[i].substr(0, sLen));
}
return newArr;
}
function monthUpdate(arrName) {
return function (d, v, i18n) {
var index = i18n[arrName].indexOf(v.charAt(0).toUpperCase() + v.substr(1).toLowerCase());
if (~index) {
d.month = index;
}
};
}
function pad(val, len) {
val = String(val);
len = len || 2;
while (val.length < len) {
val = '0' + val;
}
return val;
}
var dayNames = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
var monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
var monthNamesShort = shorten(monthNames, 3);
var dayNamesShort = shorten(dayNames, 3);
fecha.i18n = {
dayNamesShort: dayNamesShort,
dayNames: dayNames,
monthNamesShort: monthNamesShort,
monthNames: monthNames,
amPm: ['am', 'pm'],
DoFn: function DoFn(D) {
return D + ['th', 'st', 'nd', 'rd'][D % 10 > 3 ? 0 : (D - D % 10 !== 10) * D % 10];
}
};
var formatFlags = {
D: function D(dateObj) {
return dateObj.getDay();
},
DD: function DD(dateObj) {
return pad(dateObj.getDay());
},
Do: function Do(dateObj, i18n) {
return i18n.DoFn(dateObj.getDate());
},
d: function d(dateObj) {
return dateObj.getDate();
},
dd: function dd(dateObj) {
return pad(dateObj.getDate());
},
ddd: function ddd(dateObj, i18n) {
return i18n.dayNamesShort[dateObj.getDay()];
},
dddd: function dddd(dateObj, i18n) {
return i18n.dayNames[dateObj.getDay()];
},
M: function M(dateObj) {
return dateObj.getMonth() + 1;
},
MM: function MM(dateObj) {
return pad(dateObj.getMonth() + 1);
},
MMM: function MMM(dateObj, i18n) {
return i18n.monthNamesShort[dateObj.getMonth()];
},
MMMM: function MMMM(dateObj, i18n) {
return i18n.monthNames[dateObj.getMonth()];
},
yy: function yy(dateObj) {
return pad(String(dateObj.getFullYear()), 4).substr(2);
},
yyyy: function yyyy(dateObj) {
return pad(dateObj.getFullYear(), 4);
},
h: function h(dateObj) {
return dateObj.getHours() % 12 || 12;
},
hh: function hh(dateObj) {
return pad(dateObj.getHours() % 12 || 12);
},
H: function H(dateObj) {
return dateObj.getHours();
},
HH: function HH(dateObj) {
return pad(dateObj.getHours());
},
m: function m(dateObj) {
return dateObj.getMinutes();
},
mm: function mm(dateObj) {
return pad(dateObj.getMinutes());
},
s: function s(dateObj) {
return dateObj.getSeconds();
},
ss: function ss(dateObj) {
return pad(dateObj.getSeconds());
},
S: function S(dateObj) {
return Math.round(dateObj.getMilliseconds() / 100);
},
SS: function SS(dateObj) {
return pad(Math.round(dateObj.getMilliseconds() / 10), 2);
},
SSS: function SSS(dateObj) {
return pad(dateObj.getMilliseconds(), 3);
},
a: function a(dateObj, i18n) {
return dateObj.getHours() < 12 ? i18n.amPm[0] : i18n.amPm[1];
},
A: function A(dateObj, i18n) {
return dateObj.getHours() < 12 ? i18n.amPm[0].toUpperCase() : i18n.amPm[1].toUpperCase();
},
ZZ: function ZZ(dateObj) {
var o = dateObj.getTimezoneOffset();
return (o > 0 ? '-' : '+') + pad(Math.floor(Math.abs(o) / 60) * 100 + Math.abs(o) % 60, 4);
}
};
var parseFlags = {
d: [twoDigits, function (d, v) {
d.day = v;
}],
Do: [twoDigits + word, function (d, v) {
d.day = parseInt(v, 10);
}],
M: [twoDigits, function (d, v) {
d.month = v - 1;
}],
yy: [twoDigits, function (d, v) {
var da = new Date(),
cent = +('' + da.getFullYear()).substr(0, 2);
d.year = '' + (v > 68 ? cent - 1 : cent) + v;
}],
h: [twoDigits, function (d, v) {
d.hour = v;
}],
m: [twoDigits, function (d, v) {
d.minute = v;
}],
s: [twoDigits, function (d, v) {
d.second = v;
}],
yyyy: [fourDigits, function (d, v) {
d.year = v;
}],
S: ['\\d', function (d, v) {
d.millisecond = v * 100;
}],
SS: ['\\d{2}', function (d, v) {
d.millisecond = v * 10;
}],
SSS: [threeDigits, function (d, v) {
d.millisecond = v;
}],
D: [twoDigits, noop],
ddd: [word, noop],
MMM: [word, monthUpdate('monthNamesShort')],
MMMM: [word, monthUpdate('monthNames')],
a: [word, function (d, v, i18n) {
var val = v.toLowerCase();
if (val === i18n.amPm[0]) {
d.isPm = false;
} else if (val === i18n.amPm[1]) {
d.isPm = true;
}
}],
ZZ: ['[^\\s]*?[\\+\\-]\\d\\d:?\\d\\d|[^\\s]*?Z', function (d, v) {
var parts = (v + '').match(/([+-]|\d\d)/gi),
minutes;
if (parts) {
minutes = +(parts[1] * 60) + parseInt(parts[2], 10);
d.timezoneOffset = parts[0] === '+' ? minutes : -minutes;
}
}]
};
parseFlags.dd = parseFlags.d;
parseFlags.dddd = parseFlags.ddd;
parseFlags.DD = parseFlags.D;
parseFlags.mm = parseFlags.m;
parseFlags.hh = parseFlags.H = parseFlags.HH = parseFlags.h;
parseFlags.MM = parseFlags.M;
parseFlags.ss = parseFlags.s;
parseFlags.A = parseFlags.a;
// Some common format strings
fecha.masks = {
default: 'ddd MMM dd yyyy HH:mm:ss',
shortDate: 'M/D/yy',
mediumDate: 'MMM d, yyyy',
longDate: 'MMMM d, yyyy',
fullDate: 'dddd, MMMM d, yyyy',
shortTime: 'HH:mm',
mediumTime: 'HH:mm:ss',
longTime: 'HH:mm:ss.SSS'
};
/***
* Format a date
* @method format
* @param {Date|number} dateObj
* @param {string} mask Format of the date, i.e. 'mm-dd-yy' or 'shortDate'
*/
fecha.format = function (dateObj, mask, i18nSettings) {
var i18n = i18nSettings || fecha.i18n;
if (typeof dateObj === 'number') {
dateObj = new Date(dateObj);
}
if (Object.prototype.toString.call(dateObj) !== '[object Date]' || isNaN(dateObj.getTime())) {
throw new Error('Invalid Date in fecha.format');
}
mask = fecha.masks[mask] || mask || fecha.masks['default'];
var literals = [];
// Make literals inactive by replacing them with ??
mask = mask.replace(literal, function ($0, $1) {
literals.push($1);
return '@@@';
});
// Apply formatting rules
mask = mask.replace(token, function ($0) {
return $0 in formatFlags ? formatFlags[$0](dateObj, i18n) : $0.slice(1, $0.length - 1);
});
// Inline literal values back into the formatted value
return mask.replace(/@@@/g, function () {
return literals.shift();
});
};
/**
* Parse a date string into an object, changes - into /
* @method parse
* @param {string} dateStr Date string
* @param {string} format Date parse format
* @returns {Date|boolean}
*/
fecha.parse = function (dateStr, format, i18nSettings) {
var i18n = i18nSettings || fecha.i18n;
if (typeof format !== 'string') {
throw new Error('Invalid format in fecha.parse');
}
format = fecha.masks[format] || format;
// Avoid regular expression denial of service, fail early for really long strings
// https://www.owasp.org/index.php/Regular_expression_Denial_of_Service_-_ReDoS
if (dateStr.length > 1000) {
return null;
}
var dateInfo = {};
var parseInfo = [];
var literals = [];
format = format.replace(literal, function ($0, $1) {
literals.push($1);
return '@@@';
});
var newFormat = regexEscape(format).replace(token, function ($0) {
if (parseFlags[$0]) {
var info = parseFlags[$0];
parseInfo.push(info[1]);
return '(' + info[0] + ')';
}
return $0;
});
newFormat = newFormat.replace(/@@@/g, function () {
return literals.shift();
});
var matches = dateStr.match(new RegExp(newFormat, 'i'));
if (!matches) {
return null;
}
for (var i = 1; i < matches.length; i++) {
parseInfo[i - 1](dateInfo, matches[i], i18n);
}
var today = new Date();
if (dateInfo.isPm === true && dateInfo.hour != null && +dateInfo.hour !== 12) {
dateInfo.hour = +dateInfo.hour + 12;
} else if (dateInfo.isPm === false && +dateInfo.hour === 12) {
dateInfo.hour = 0;
}
var date;
if (dateInfo.timezoneOffset != null) {
dateInfo.minute = +(dateInfo.minute || 0) - +dateInfo.timezoneOffset;
date = new Date(Date.UTC(dateInfo.year || today.getFullYear(), dateInfo.month || 0, dateInfo.day || 1, dateInfo.hour || 0, dateInfo.minute || 0, dateInfo.second || 0, dateInfo.millisecond || 0));
} else {
date = new Date(dateInfo.year || today.getFullYear(), dateInfo.month || 0, dateInfo.day || 1, dateInfo.hour || 0, dateInfo.minute || 0, dateInfo.second || 0, dateInfo.millisecond || 0);
}
return date;
};
/* istanbul ignore next */
if ( true && module.exports) {
module.exports = fecha;
} else if (true) {
!(__WEBPACK_AMD_DEFINE_RESULT__ = (function () {
return fecha;
}).call(exports, __webpack_require__, exports, module),
__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
} else {}
})(this);
/***/ }),
/* 3 */
/***/ (function(module, exports) {
module.exports = require("babel-helper-vue-jsx-merge-props");
/***/ }),
/* 4 */
/***/ (function(module, exports) {
module.exports = require("throttle-debounce/throttle");
/***/ }),
/* 5 */
/***/ (function(module, exports) {
module.exports = require("vue-slider-component");
/***/ }),
/* 6 */
/***/ (function(module, exports) {
module.exports = require("throttle-debounce");
/***/ }),
/* 7 */
/***/ (function(module, exports) {
module.exports = require("vue-slider-component/theme/default.css");
/***/ }),
/* 8 */
/***/ (function(module, exports) {
module.exports = require("deepmerge");
/***/ }),
/* 9 */
/***/ (function(module, exports) {
module.exports = require("resize-observer-polyfill");
/***/ }),
/* 10 */
/***/ (function(module, exports) {
module.exports = require("normalize-wheel");
/***/ }),
/* 11 */
/***/ (function(module, exports) {
module.exports = require("perfect-scrollbar");
/***/ }),
/* 12 */
/***/ (function(module, exports) {
module.exports = require("async-validator");
/***/ }),
/* 13 */
/***/ (function(module, exports) {
module.exports = require("vue-qr");
/***/ }),
/* 14 */
/***/ (function(module, exports, __webpack_require__) {
module.exports = __webpack_require__(48);
/***/ }),
/* 15 */
/***/ (function(module, exports, __webpack_require__) {
var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
/**
* @fileOverview Kickass library to create and place poppers near their reference elements.
* @version {{version}}
* @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.
*/
//
// Cross module loader
// Supported: Node, AMD, Browser globals
//
;(function (root, factory) {
if (true) {
// AMD. Register as an anonymous module.
!(__WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
(__WEBPACK_AMD_DEFINE_FACTORY__.call(exports, __webpack_require__, exports, module)) :
__WEBPACK_AMD_DEFINE_FACTORY__),
__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
} else {}
})(this, function () {
'use strict';
var root = window;
// default options
var DEFAULTS = {
// placement of the popper
placement: 'bottom',
gpuAcceleration: true,
// shift popper from its origin by the given amount of pixels (can be negative)
offset: 0,
// the element which will act as boundary of the popper
boundariesElement: 'viewport',
// amount of pixel used to define a minimum distance between the boundaries and the popper
boundariesPadding: 5,
// popper will try to prevent overflow following this order,
// by default, then, it could overflow on the left and on top of the boundariesElement
preventOverflowOrder: ['left', 'right', 'top', 'bottom'],
// the behavior used by flip to change the placement of the popper
flipBehavior: 'flip',
arrowElement: '[x-arrow]',
arrowOffset: 0,
// list of functions used to modify the offsets before they are applied to the popper
modifiers: ['shift', 'offset', 'preventOverflow', 'keepTogether', 'arrow', 'flip', 'applyStyle'],
modifiersIgnored: [],
forceAbsolute: false
};
/**
* Create a new Popper.js instance
* @constructor Popper
* @param {HTMLElement} reference - The reference element used to position the popper
* @param {HTMLElement|Object} popper
* The HTML element used as popper, or a configuration used to generate the popper.
* @param {String} [popper.tagName='div'] The tag name of the generated popper.
* @param {Array} [popper.classNames=['popper']] Array of classes to apply to the generated popper.
* @param {Array} [popper.attributes] Array of attributes to apply, specify `attr:value` to assign a value to it.
* @param {HTMLElement|String} [popper.parent=window.document.body] The parent element, given as HTMLElement or as query string.
* @param {String} [popper.content=''] The content of the popper, it can be text, html, or node; if it is not text, set `contentType` to `html` or `node`.
* @param {String} [popper.contentType='text'] If `html`, the `content` will be parsed as HTML. If `node`, it will be appended as-is.
* @param {String} [popper.arrowTagName='div'] Same as `popper.tagName` but for the arrow element.
* @param {Array} [popper.arrowClassNames='popper__arrow'] Same as `popper.classNames` but for the arrow element.
* @param {String} [popper.arrowAttributes=['x-arrow']] Same as `popper.attributes` but for the arrow element.
* @param {Object} options
* @param {String} [options.placement=bottom]
* Placement of the popper accepted values: `top(-start, -end), right(-start, -end), bottom(-start, -right),
* left(-start, -end)`
*
* @param {HTMLElement|String} [options.arrowElement='[x-arrow]']
* The DOM Node used as arrow for the popper, or a CSS selector used to get the DOM node. It must be child of
* its parent Popper. Popper.js will apply to the given element the style required to align the arrow with its
* reference element.
* By default, it will look for a child node of the popper with the `x-arrow` attribute.
*
* @param {Boolean} [options.gpuAcceleration=true]
* When this property is set to true, the popper position will be applied using CSS3 translate3d, allowing the
* browser to use the GPU to accelerate the rendering.
* If set to false, the popper will be placed using `top` and `left` properties, not using the GPU.
*
* @param {Number} [options.offset=0]
* Amount of pixels the popper will be shifted (can be negative).
*
* @param {String|Element} [options.boundariesElement='viewport']
* The element which will define the boundaries of the popper position, the popper will never be placed outside
* of the defined boundaries (except if `keepTogether` is enabled)
*
* @param {Number} [options.boundariesPadding=5]
* Additional padding for the boundaries
*
* @param {Array} [options.preventOverflowOrder=['left', 'right', 'top', 'bottom']]
* Order used when Popper.js tries to avoid overflows from the boundaries, they will be checked in order,
* this means that the last ones will never overflow
*
* @param {String|Array} [options.flipBehavior='flip']
* The behavior used by the `flip` modifier to change the placement of the popper when the latter is trying to
* overlap its reference element. Defining `flip` as value, the placement will be flipped on
* its axis (`right - left`, `top - bottom`).
* You can even pass an array of placements (eg: `['right', 'left', 'top']` ) to manually specify
* how alter the placement when a flip is needed. (eg. in the above example, it would first flip from right to left,
* then, if even in its new placement, the popper is overlapping its reference element, it will be moved to top)
*
* @param {Array} [options.modifiers=[ 'shift', 'offset', 'preventOverflow', 'keepTogether', 'arrow', 'flip', 'applyStyle']]
* List of functions used to modify the data before they are applied to the popper, add your custom functions
* to this array to edit the offsets and placement.
* The function should reflect the @params and @returns of preventOverflow
*
* @param {Array} [options.modifiersIgnored=[]]
* Put here any built-in modifier name you want to exclude from the modifiers list
* The function should reflect the @params and @returns of preventOverflow
*
* @param {Boolean} [options.removeOnDestroy=false]
* Set to true if you want to automatically remove the popper when you call the `destroy` method.
*/
function Popper(reference, popper, options) {
this._reference = reference.jquery ? reference[0] : reference;
this.state = {};
// if the popper variable is a configuration object, parse it to generate an HTMLElement
// generate a default popper if is not defined
var isNotDefined = typeof popper === 'undefined' || popper === null;
var isConfig = popper && Object.prototype.toString.call(popper) === '[object Object]';
if (isNotDefined || isConfig) {
this._popper = this.parse(isConfig ? popper : {});
}
// otherwise, use the given HTMLElement as popper
else {
this._popper = popper.jquery ? popper[0] : popper;
}
// with {} we create a new object with the options inside it
this._options = Object.assign({}, DEFAULTS, options);
// refactoring modifiers' list
this._options.modifiers = this._options.modifiers.map(function (modifier) {
// remove ignored modifiers
if (this._options.modifiersIgnored.indexOf(modifier) !== -1) return;
// set the x-placement attribute before everything else because it could be used to add margins to the popper
// margins needs to be calculated to get the correct popper offsets
if (modifier === 'applyStyle') {
this._popper.setAttribute('x-placement', this._options.placement);
}
// return predefined modifier identified by string or keep the custom one
return this.modifiers[modifier] || modifier;
}.bind(this));
// make sure to apply the popper position before any computation
this.state.position = this._getPosition(this._popper, this._reference);
setStyle(this._popper, { position: this.state.position, top: 0 });
// fire the first update to position the popper in the right place
this.update();
// setup event listeners, they will take care of update the position in specific situations
this._setupEventListeners();
return this;
}
//
// Methods
//
/**
* Destroy the popper
* @method
* @memberof Popper
*/
Popper.prototype.destroy = function () {
this._popper.removeAttribute('x-placement');
this._popper.style.left = '';
this._popper.style.position = '';
this._popper.style.top = '';
this._popper.style[getSupportedPropertyName('transform')] = '';
this._removeEventListeners();
// remove the popper if user explicity asked for the deletion on destroy
if (this._options.removeOnDestroy) {
this._popper.remove();
}
return this;
};
/**
* Updates the position of the popper, computing the new offsets and applying the new style
* @method
* @memberof Popper
*/
Popper.prototype.update = function () {
var data = { instance: this, styles: {} };
// store placement inside the data object, modifiers will be able to edit `placement` if needed
// and refer to _originalPlacement to know the original value
data.placement = this._options.placement;
data._originalPlacement = this._options.placement;
// compute the popper and reference offsets and put them inside data.offsets
data.offsets = this._getOffsets(this._popper, this._reference, data.placement);
// get boundaries
data.boundaries = this._getBoundaries(data, this._options.boundariesPadding, this._options.boundariesElement);
data = this.runModifiers(data, this._options.modifiers);
if (typeof this.state.updateCallback === 'function') {
this.state.updateCallback(data);
}
};
/**
* If a function is passed, it will be executed after the initialization of popper with as first argument the Popper instance.
* @method
* @memberof Popper
* @param {Function} callback
*/
Popper.prototype.onCreate = function (callback) {
// the createCallbacks return as first argument the popper instance
callback(this);
return this;
};
/**
* If a function is passed, it will be executed after each update of popper with as first argument the set of coordinates and informations
* used to style popper and its arrow.
* NOTE: it doesn't get fired on the first call of the `Popper.update()` method inside the `Popper` constructor!
* @method
* @memberof Popper
* @param {Function} callback
*/
Popper.prototype.onUpdate = function (callback) {
this.state.updateCallback = callback;
return this;
};
/**
* Helper used to generate poppers from a configuration file
* @method
* @memberof Popper
* @param config {Object} configuration
* @returns {HTMLElement} popper
*/
Popper.prototype.parse = function (config) {
var defaultConfig = {
tagName: 'div',
classNames: ['popper'],
attributes: [],
parent: root.document.body,
content: '',
contentType: 'text',
arrowTagName: 'div',
arrowClassNames: ['popper__arrow'],
arrowAttributes: ['x-arrow']
};
config = Object.assign({}, defaultConfig, config);
var d = root.document;
var popper = d.createElement(config.tagName);
addClassNames(popper, config.classNames);
addAttributes(popper, config.attributes);
if (config.contentType === 'node') {
popper.appendChild(config.content.jquery ? config.content[0] : config.content);
} else if (config.contentType === 'html') {
popper.innerHTML = config.content;
} else {
popper.textContent = config.content;
}
if (config.arrowTagName) {
var arrow = d.createElement(config.arrowTagName);
addClassNames(arrow, config.arrowClassNames);
addAttributes(arrow, config.arrowAttributes);
popper.appendChild(arrow);
}
var parent = config.parent.jquery ? config.parent[0] : config.parent;
// if the given parent is a string, use it to match an element
// if more than one element is matched, the first one will be used as parent
// if no elements are matched, the script will throw an error
if (typeof parent === 'string') {
parent = d.querySelectorAll(config.parent);
if (parent.length > 1) {
console.warn('WARNING: the given `parent` query(' + config.parent + ') matched more than one element, the first one will be used');
}
if (parent.length === 0) {
throw 'ERROR: the given `parent` doesn\'t exists!';
}
parent = parent[0];
}
// if the given parent is a DOM nodes list or an array of nodes with more than one element,
// the first one will be used as parent
if (parent.length > 1 && parent instanceof Element === false) {
console.warn('WARNING: you have passed as parent a list of elements, the first one will be used');
parent = parent[0];
}
// append the generated popper to its parent
parent.appendChild(popper);
return popper;
/**
* Adds class names to the given element
* @function
* @ignore
* @param {HTMLElement} target
* @param {Array} classes
*/
function addClassNames(element, classNames) {
classNames.forEach(function (className) {
element.classList.add(className);
});
}
/**
* Adds attributes to the given element
* @function
* @ignore
* @param {HTMLElement} target
* @param {Array} attributes
* @example
* addAttributes(element, [ 'data-info:foobar' ]);
*/
function addAttributes(element, attributes) {
attributes.forEach(function (attribute) {
element.setAttribute(attribute.split(':')[0], attribute.split(':')[1] || '');
});
}
};
/**
* Helper used to get the position which will be applied to the popper
* @method
* @memberof Popper
* @param config {HTMLElement} popper element
* @param reference {HTMLElement} reference element
* @returns {String} position
*/
Popper.prototype._getPosition = function (popper, reference) {
var container = getOffsetParent(reference);
if (this._options.forceAbsolute) {
return 'absolute';
}
// Decide if the popper will be fixed
// If the reference element is inside a fixed context, the popper will be fixed as well to allow them to scroll together
var isParentFixed = isFixed(reference, container);
return isParentFixed ? 'fixed' : 'absolute';
};
/**
* Get offsets to the popper
* @method
* @memberof Popper
* @access private
* @param {Element} popper - the popper element
* @param {Element} reference - the reference element (the popper will be relative to this)
* @returns {Object} An object containing the offsets which will be applied to the popper
*/
Popper.prototype._getOffsets = function (popper, reference, placement) {
placement = placement.split('-')[0];
var popperOffsets = {};
popperOffsets.position = this.state.position;
var isParentFixed = popperOffsets.position === 'fixed';
//
// Get reference element position
//
var referenceOffsets = getOffsetRectRelativeToCustomParent(reference, getOffsetParent(popper), isParentFixed);
//
// Get popper sizes
//
var popperRect = getOuterSizes(popper);
//
// Compute offsets of popper
//
// depending by the popper placement we have to compute its offsets slightly differently
if (['right', 'left'].indexOf(placement) !== -1) {
popperOffsets.top = referenceOffsets.top + referenceOffsets.height / 2 - popperRect.height / 2;
if (placement === 'left') {
popperOffsets.left = referenceOffsets.left - popperRect.width;
} else {
popperOffsets.left = referenceOffsets.right;
}
} else {
popperOffsets.left = referenceOffsets.left + referenceOffsets.width / 2 - popperRect.width / 2;
if (placement === 'top') {
popperOffsets.top = referenceOffsets.top - popperRect.height;
} else {
popperOffsets.top = referenceOffsets.bottom;
}
}
// Add width and height to our offsets object
popperOffsets.width = popperRect.width;
popperOffsets.height = popperRect.height;
return {
popper: popperOffsets,
reference: referenceOffsets
};
};
/**
* Setup needed event listeners used to update the popper position
* @method
* @memberof Popper
* @access private
*/
Popper.prototype._setupEventListeners = function () {
// NOTE: 1 DOM access here
this.state.updateBound = this.update.bind(this);
root.addEventListener('resize', this.state.updateBound);
// if the boundariesElement is window we don't need to listen for the scroll event
if (this._options.boundariesElement !== 'window') {
var target = getScrollParent(this._reference);
// here it could be both `body` or `documentElement` thanks to Firefox, we then check both
if (target === root.document.body || target === root.document.documentElement) {
target = root;
}
target.addEventListener('scroll', this.state.updateBound);
this.state.scrollTarget = target;
}
};
/**
* Remove event listeners used to update the popper position
* @method
* @memberof Popper
* @access private
*/
Popper.prototype._removeEventListeners = function () {
// NOTE: 1 DOM access here
root.removeEventListener('resize', this.state.updateBound);
if (this._options.boundariesElement !== 'window' && this.state.scrollTarget) {
this.state.scrollTarget.removeEventListener('scroll', this.state.updateBound);
this.state.scrollTarget = null;
}
this.state.updateBound = null;
};
/**
* Computed the boundaries limits and return them
* @method
* @memberof Popper
* @access private
* @param {Object} data - Object containing the property "offsets" generated by `_getOffsets`
* @param {Number} padding - Boundaries padding
* @param {Element} boundariesElement - Element used to define the boundaries
* @returns {Object} Coordinates of the boundaries
*/
Popper.prototype._getBoundaries = function (data, padding, boundariesElement) {
// NOTE: 1 DOM access here
var boundaries = {};
var width, height;
if (boundariesElement === 'window') {
var body = root.document.body,
html = root.document.documentElement;
height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
width = Math.max(body.scrollWidth, body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth);
boundaries = {
top: 0,
right: width,
bottom: height,
left: 0
};
} else if (boundariesElement === 'viewport') {
var offsetParent = getOffsetParent(this._popper);
var scrollParent = getScrollParent(this._popper);
var offsetParentRect = getOffsetRect(offsetParent);
// Thanks the fucking native API, `document.body.scrollTop` & `document.documentElement.scrollTop`
var getScrollTopValue = function getScrollTopValue(element) {
return element == document.body ? Math.max(document.documentElement.scrollTop, document.body.scrollTop) : element.scrollTop;
};
var getScrollLeftValue = function getScrollLeftValue(element) {
return element == document.body ? Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) : element.scrollLeft;
};
// if the popper is fixed we don't have to substract scrolling from the boundaries
var scrollTop = data.offsets.popper.position === 'fixed' ? 0 : getScrollTopValue(scrollParent);
var scrollLeft = data.offsets.popper.position === 'fixed' ? 0 : getScrollLeftValue(scrollParent);
boundaries = {
top: 0 - (offsetParentRect.top - scrollTop),
right: root.document.documentElement.clientWidth - (offsetParentRect.left - scrollLeft),
bottom: root.document.documentElement.clientHeight - (offsetParentRect.top - scrollTop),
left: 0 - (offsetParentRect.left - scrollLeft)
};
} else {
if (getOffsetParent(this._popper) === boundariesElement) {
boundaries = {
top: 0,
left: 0,
right: boundariesElement.clientWidth,
bottom: boundariesElement.clientHeight
};
} else {
boundaries = getOffsetRect(boundariesElement);
}
}
boundaries.left += padding;
boundaries.right -= padding;
boundaries.top = boundaries.top + padding;
boundaries.bottom = boundaries.bottom - padding;
return boundaries;
};
/**
* Loop trough the list of modifiers and run them in order, each of them will then edit the data object
* @method
* @memberof Popper
* @access public
* @param {Object} data
* @param {Array} modifiers
* @param {Function} ends
*/
Popper.prototype.runModifiers = function (data, modifiers, ends) {
var modifiersToRun = modifiers.slice();
if (ends !== undefined) {
modifiersToRun = this._options.modifiers.slice(0, getArrayKeyIndex(this._options.modifiers, ends));
}
modifiersToRun.forEach(function (modifier) {
if (isFunction(modifier)) {
data = modifier.call(this, data);
}
}.bind(this));
return data;
};
/**
* Helper used to know if the given modifier depends from another one.
* @method
* @memberof Popper
* @param {String} requesting - name of requesting modifier
* @param {String} requested - name of requested modifier
* @returns {Boolean}
*/
Popper.prototype.isModifierRequired = function (requesting, requested) {
var index = getArrayKeyIndex(this._options.modifiers, requesting);
return !!this._options.modifiers.slice(0, index).filter(function (modifier) {
return modifier === requested;
}).length;
};
//
// Modifiers
//
/**
* Modifiers list
* @namespace Popper.modifiers
* @memberof Popper
* @type {Object}
*/
Popper.prototype.modifiers = {};
/**
* Apply the computed styles to the popper element
* @method
* @memberof Popper.modifiers
* @argument {Object} data - The data object generated by `update` method
* @returns {Object} The same data object
*/
Popper.prototype.modifiers.applyStyle = function (data) {
// apply the final offsets to the popper
// NOTE: 1 DOM access here
var styles = {
position: data.offsets.popper.position
};
// round top and left to avoid blurry text
var left = Math.round(data.offsets.popper.left);
var top = Math.round(data.offsets.popper.top);
// if gpuAcceleration is set to true and transform is supported, we use `translate3d` to apply the position to the popper
// we automatically use the supported prefixed version if needed
var prefixedProperty;
if (this._options.gpuAcceleration && (prefixedProperty = getSupportedPropertyName('transform'))) {
styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';
styles.top = 0;
styles.left = 0;
}
// othwerise, we use the standard `left` and `top` properties
else {
styles.left = left;
styles.top = top;
}
// any property present in `data.styles` will be applied to the popper,
// in this way we can make the 3rd party modifiers add custom styles to it
// Be aware, modifiers could override the properties defined in the previous
// lines of this modifier!
Object.assign(styles, data.styles);
setStyle(this._popper, styles);
// set an attribute which will be useful to style the tooltip (use it to properly position its arrow)
// NOTE: 1 DOM access here
this._popper.setAttribute('x-placement', data.placement);
// if the arrow modifier is required and the arrow style has been computed, apply the arrow style
if (this.isModifierRequired(this.modifiers.applyStyle, this.modifiers.arrow) && data.offsets.arrow) {
setStyle(data.arrowElement, data.offsets.arrow);
}
return data;
};
/**
* Modifier used to shift the popper on the start or end of its reference element side
* @method
* @memberof Popper.modifiers
* @argument {Object} data - The data object generated by `update` method
* @returns {Object} The data object, properly modified
*/
Popper.prototype.modifiers.shift = function (data) {
var placement = data.placement;
var basePlacement = placement.split('-')[0];
var shiftVariation = placement.split('-')[1];
// if shift shiftVariation is specified, run the modifier
if (shiftVariation) {
var reference = data.offsets.reference;
var popper = getPopperClientRect(data.offsets.popper);
var shiftOffsets = {
y: {
start: { top: reference.top },
end: { top: reference.top + reference.height - popper.height }
},
x: {
start: { left: reference.left },
end: { left: reference.left + reference.width - popper.width }
}
};
var axis = ['bottom', 'top'].indexOf(basePlacement) !== -1 ? 'x' : 'y';
data.offsets.popper = Object.assign(popper, shiftOffsets[axis][shiftVariation]);
}
return data;
};
/**
* Modifier used to make sure the popper does not overflows from it's boundaries
* @method
* @memberof Popper.modifiers
* @argument {Object} data - The data object generated by `update` method
* @returns {Object} The data object, properly modified
*/
Popper.prototype.modifiers.preventOverflow = function (data) {
var order = this._options.preventOverflowOrder;
var popper = getPopperClientRect(data.offsets.popper);
var check = {
left: function left() {
var left = popper.left;
if (popper.left < data.boundaries.left) {
left = Math.max(popper.left, data.boundaries.left);
}
return { left: left };
},
right: function right() {
var left = popper.left;
if (popper.right > data.boundaries.right) {
left = Math.min(popper.left, data.boundaries.right - popper.width);
}
return { left: left };
},
top: function top() {
var top = popper.top;
if (popper.top < data.boundaries.top) {
top = Math.max(popper.top, data.boundaries.top);
}
return { top: top };
},
bottom: function bottom() {
var top = popper.top;
if (popper.bottom > data.boundaries.bottom) {
top = Math.min(popper.top, data.boundaries.bottom - popper.height);
}
return { top: top };
}
};
order.forEach(function (direction) {
data.offsets.popper = Object.assign(popper, check[direction]());
});
return data;
};
/**
* Modifier used to make sure the popper is always near its reference
* @method
* @memberof Popper.modifiers
* @argument {Object} data - The data object generated by _update method
* @returns {Object} The data object, properly modified
*/
Popper.prototype.modifiers.keepTogether = function (data) {
var popper = getPopperClientRect(data.offsets.popper);
var reference = data.offsets.reference;
var f = Math.floor;
if (popper.right < f(reference.left)) {
data.offsets.popper.left = f(reference.left) - popper.width;
}
if (popper.left > f(reference.right)) {
data.offsets.popper.left = f(reference.right);
}
if (popper.bottom < f(reference.top)) {
data.offsets.popper.top = f(reference.top) - popper.height;
}
if (popper.top > f(reference.bottom)) {
data.offsets.popper.top = f(reference.bottom);
}
return data;
};
/**
* Modifier used to flip the placement of the popper when the latter is starting overlapping its reference element.
* Requires the `preventOverflow` modifier before it in order to work.
* **NOTE:** This modifier will run all its previous modifiers everytime it tries to flip the popper!
* @method
* @memberof Popper.modifiers
* @argument {Object} data - The data object generated by _update method
* @returns {Object} The data object, properly modified
*/
Popper.prototype.modifiers.flip = function (data) {
// check if preventOverflow is in the list of modifiers before the flip modifier.
// otherwise flip would not work as expected.
if (!this.isModifierRequired(this.modifiers.flip, this.modifiers.preventOverflow)) {
console.warn('WARNING: preventOverflow modifier is required by flip modifier in order to work, be sure to include it before flip!');
return data;
}
if (data.flipped && data.placement === data._originalPlacement) {
// seems like flip is trying to loop, probably there's not enough space on any of the flippable sides
return data;
}
var placement = data.placement.split('-')[0];
var placementOpposite = getOppositePlacement(placement);
var variation = data.placement.split('-')[1] || '';