BOOBY React
\n \n\n To get started, edit src/App.js and save to reload.\n
\n * I'm a fade Transition!\n *
\n * )}\n * \n *
\n * );\n * }\n * ```\n *\n * When the button is clicked the component will shift to the `'entering'` state and\n * stay there for 500ms (the value of `timeout`) before it finally switches to `'entered'`.\n *\n * When `in` is `false` the same thing happens except the state moves from `'exiting'` to `'exited'`.\n *\n * ## Timing\n *\n * Timing is often the trickiest part of animation, mistakes can result in slight delays\n * that are hard to pin down. A common example is when you want to add an exit transition,\n * you should set the desired final styles when the state is `'exiting'`. That's when the\n * transition to those styles will start and, if you matched the `timeout` prop with the\n * CSS Transition duration, it will end exactly when the state changes to `'exited'`.\n *\n * > **Note**: For simpler transitions the `Transition` component might be enough, but\n * > take into account that it's platform-agnostic, while the `CSSTransition` component\n * > [forces reflows](https://github.com/reactjs/react-transition-group/blob/5007303e729a74be66a21c3e2205e4916821524b/src/CSSTransition.js#L208-L215)\n * > in order to make more complex transitions more predictable. For example, even though\n * > classes `example-enter` and `example-enter-active` are applied immediately one after\n * > another, you can still transition from one to the other because of the forced reflow\n * > (read [this issue](https://github.com/reactjs/react-transition-group/issues/159#issuecomment-322761171)\n * > for more info). Take this into account when choosing between `Transition` and\n * > `CSSTransition`.\n *\n * ## Example\n *\n * \n *\n */\n\n var Transition = function (_React$Component) {\n _inherits(Transition, _React$Component);\n\n function Transition(props, context) {\n _classCallCheck(this, Transition);\n\n var _this = _possibleConstructorReturn(this, _React$Component.call(this, props, context));\n\n var parentGroup = context.transitionGroup;\n // In the context of a TransitionGroup all enters are really appears\n var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;\n\n var initialStatus = void 0;\n _this.nextStatus = null;\n\n if (props.in) {\n if (appear) {\n initialStatus = EXITED;\n _this.nextStatus = ENTERING;\n } else {\n initialStatus = ENTERED;\n }\n } else {\n if (props.unmountOnExit || props.mountOnEnter) {\n initialStatus = UNMOUNTED;\n } else {\n initialStatus = EXITED;\n }\n }\n\n _this.state = { status: initialStatus };\n\n _this.nextCallback = null;\n return _this;\n }\n\n Transition.prototype.getChildContext = function getChildContext() {\n return { transitionGroup: null }; // allows for nested Transitions\n };\n\n Transition.prototype.componentDidMount = function componentDidMount() {\n this.updateStatus(true);\n };\n\n Transition.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {\n var _ref = this.pendingState || this.state,\n status = _ref.status;\n\n if (nextProps.in) {\n if (status === UNMOUNTED) {\n this.setState({ status: EXITED });\n }\n if (status !== ENTERING && status !== ENTERED) {\n this.nextStatus = ENTERING;\n }\n } else {\n if (status === ENTERING || status === ENTERED) {\n this.nextStatus = EXITING;\n }\n }\n };\n\n Transition.prototype.componentDidUpdate = function componentDidUpdate() {\n this.updateStatus();\n };\n\n Transition.prototype.componentWillUnmount = function componentWillUnmount() {\n this.cancelNextCallback();\n };\n\n Transition.prototype.getTimeouts = function getTimeouts() {\n var timeout = this.props.timeout;\n\n var exit = void 0,\n enter = void 0,\n appear = void 0;\n\n exit = enter = appear = timeout;\n\n if (timeout != null && typeof timeout !== 'number') {\n exit = timeout.exit;\n enter = timeout.enter;\n appear = timeout.appear;\n }\n return { exit: exit, enter: enter, appear: appear };\n };\n\n Transition.prototype.updateStatus = function updateStatus() {\n var mounting = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n\n var nextStatus = this.nextStatus;\n\n if (nextStatus !== null) {\n this.nextStatus = null;\n // nextStatus will always be ENTERING or EXITING.\n this.cancelNextCallback();\n var node = _reactDom2.default.findDOMNode(this);\n\n if (nextStatus === ENTERING) {\n this.performEnter(node, mounting);\n } else {\n this.performExit(node);\n }\n } else if (this.props.unmountOnExit && this.state.status === EXITED) {\n this.setState({ status: UNMOUNTED });\n }\n };\n\n Transition.prototype.performEnter = function performEnter(node, mounting) {\n var _this2 = this;\n\n var enter = this.props.enter;\n\n var appearing = this.context.transitionGroup ? this.context.transitionGroup.isMounting : mounting;\n\n var timeouts = this.getTimeouts();\n\n // no enter animation skip right to ENTERED\n // if we are mounting and running this it means appear _must_ be set\n if (!mounting && !enter) {\n this.safeSetState({ status: ENTERED }, function () {\n _this2.props.onEntered(node);\n });\n return;\n }\n\n this.props.onEnter(node, appearing);\n\n this.safeSetState({ status: ENTERING }, function () {\n _this2.props.onEntering(node, appearing);\n\n // FIXME: appear timeout?\n _this2.onTransitionEnd(node, timeouts.enter, function () {\n _this2.safeSetState({ status: ENTERED }, function () {\n _this2.props.onEntered(node, appearing);\n });\n });\n });\n };\n\n Transition.prototype.performExit = function performExit(node) {\n var _this3 = this;\n\n var exit = this.props.exit;\n\n var timeouts = this.getTimeouts();\n\n // no exit animation skip right to EXITED\n if (!exit) {\n this.safeSetState({ status: EXITED }, function () {\n _this3.props.onExited(node);\n });\n return;\n }\n this.props.onExit(node);\n\n this.safeSetState({ status: EXITING }, function () {\n _this3.props.onExiting(node);\n\n _this3.onTransitionEnd(node, timeouts.exit, function () {\n _this3.safeSetState({ status: EXITED }, function () {\n _this3.props.onExited(node);\n });\n });\n });\n };\n\n Transition.prototype.cancelNextCallback = function cancelNextCallback() {\n if (this.nextCallback !== null) {\n this.nextCallback.cancel();\n this.nextCallback = null;\n }\n };\n\n Transition.prototype.safeSetState = function safeSetState(nextState, callback) {\n var _this4 = this;\n\n // We need to track pending updates for instances where a cWRP fires quickly\n // after cDM and before the state flushes, which would double trigger a\n // transition\n this.pendingState = nextState;\n\n // This shouldn't be necessary, but there are weird race conditions with\n // setState callbacks and unmounting in testing, so always make sure that\n // we can cancel any pending setState callbacks after we unmount.\n callback = this.setNextCallback(callback);\n this.setState(nextState, function () {\n _this4.pendingState = null;\n callback();\n });\n };\n\n Transition.prototype.setNextCallback = function setNextCallback(callback) {\n var _this5 = this;\n\n var active = true;\n\n this.nextCallback = function (event) {\n if (active) {\n active = false;\n _this5.nextCallback = null;\n\n callback(event);\n }\n };\n\n this.nextCallback.cancel = function () {\n active = false;\n };\n\n return this.nextCallback;\n };\n\n Transition.prototype.onTransitionEnd = function onTransitionEnd(node, timeout, handler) {\n this.setNextCallback(handler);\n\n if (node) {\n if (this.props.addEndListener) {\n this.props.addEndListener(node, this.nextCallback);\n }\n if (timeout != null) {\n setTimeout(this.nextCallback, timeout);\n }\n } else {\n setTimeout(this.nextCallback, 0);\n }\n };\n\n Transition.prototype.render = function render() {\n var status = this.state.status;\n if (status === UNMOUNTED) {\n return null;\n }\n\n var _props = this.props,\n children = _props.children,\n childProps = _objectWithoutProperties(_props, ['children']);\n // filter props for Transtition\n\n\n delete childProps.in;\n delete childProps.mountOnEnter;\n delete childProps.unmountOnExit;\n delete childProps.appear;\n delete childProps.enter;\n delete childProps.exit;\n delete childProps.timeout;\n delete childProps.addEndListener;\n delete childProps.onEnter;\n delete childProps.onEntering;\n delete childProps.onEntered;\n delete childProps.onExit;\n delete childProps.onExiting;\n delete childProps.onExited;\n\n if (typeof children === 'function') {\n return children(status, childProps);\n }\n\n var child = _react2.default.Children.only(children);\n return _react2.default.cloneElement(child, childProps);\n };\n\n return Transition;\n }(_react2.default.Component);\n\n Transition.contextTypes = {\n transitionGroup: PropTypes$$1.object\n };\n Transition.childContextTypes = {\n transitionGroup: function transitionGroup() {}\n };\n\n Transition.propTypes = false ? {\n /**\n * A `function` child can be used instead of a React element.\n * This function is called with the current transition status\n * ('entering', 'entered', 'exiting', 'exited', 'unmounted'), which can be used\n * to apply context specific props to a component.\n *\n * ```jsx\n * \n * Prefer `scheduleUpdate` over `update` because of performance reasons.\n * @method\n * @memberof Popper\n */\nfunction update() {\n // if popper is destroyed, don't perform any further update\n if (this.state.isDestroyed) {\n return;\n }\n\n var data = {\n instance: this,\n styles: {},\n arrowStyles: {},\n attributes: {},\n flipped: false,\n offsets: {}\n };\n\n // compute reference element offsets\n data.offsets.reference = getReferenceOffsets(this.state, this.popper, this.reference, this.options.positionFixed);\n\n // compute auto placement, store placement inside the data object,\n // modifiers will be able to edit `placement` if needed\n // and refer to originalPlacement to know the original value\n data.placement = computeAutoPlacement(this.options.placement, data.offsets.reference, this.popper, this.reference, this.options.modifiers.flip.boundariesElement, this.options.modifiers.flip.padding);\n\n // store the computed placement inside `originalPlacement`\n data.originalPlacement = data.placement;\n\n data.positionFixed = this.options.positionFixed;\n\n // compute the popper offsets\n data.offsets.popper = getPopperOffsets(this.popper, data.offsets.reference, data.placement);\n\n data.offsets.popper.position = this.options.positionFixed ? 'fixed' : 'absolute';\n\n // run the modifiers\n data = runModifiers(this.modifiers, data);\n\n // the first `update` will call `onCreate` callback\n // the other ones will call `onUpdate` callback\n if (!this.state.isCreated) {\n this.state.isCreated = true;\n this.options.onCreate(data);\n } else {\n this.options.onUpdate(data);\n }\n}\n\n/**\n * Helper used to know if the given modifier is enabled.\n * @method\n * @memberof Popper.Utils\n * @returns {Boolean}\n */\nfunction isModifierEnabled(modifiers, modifierName) {\n return modifiers.some(function (_ref) {\n var name = _ref.name,\n enabled = _ref.enabled;\n return enabled && name === modifierName;\n });\n}\n\n/**\n * Get the prefixed supported property name\n * @method\n * @memberof Popper.Utils\n * @argument {String} property (camelCase)\n * @returns {String} prefixed property (camelCase or PascalCase, depending on the vendor prefix)\n */\nfunction getSupportedPropertyName(property) {\n var prefixes = [false, 'ms', 'Webkit', 'Moz', 'O'];\n var upperProp = property.charAt(0).toUpperCase() + property.slice(1);\n\n for (var i = 0; i < prefixes.length; i++) {\n var prefix = prefixes[i];\n var toCheck = prefix ? '' + prefix + upperProp : property;\n if (typeof document.body.style[toCheck] !== 'undefined') {\n return toCheck;\n }\n }\n return null;\n}\n\n/**\n * Destroy the popper\n * @method\n * @memberof Popper\n */\nfunction destroy() {\n this.state.isDestroyed = true;\n\n // touch DOM only if `applyStyle` modifier is enabled\n if (isModifierEnabled(this.modifiers, 'applyStyle')) {\n this.popper.removeAttribute('x-placement');\n this.popper.style.position = '';\n this.popper.style.top = '';\n this.popper.style.left = '';\n this.popper.style.right = '';\n this.popper.style.bottom = '';\n this.popper.style.willChange = '';\n this.popper.style[getSupportedPropertyName('transform')] = '';\n }\n\n this.disableEventListeners();\n\n // remove the popper if user explicity asked for the deletion on destroy\n // do not use `remove` because IE11 doesn't support it\n if (this.options.removeOnDestroy) {\n this.popper.parentNode.removeChild(this.popper);\n }\n return this;\n}\n\n/**\n * Get the window associated with the element\n * @argument {Element} element\n * @returns {Window}\n */\nfunction getWindow(element) {\n var ownerDocument = element.ownerDocument;\n return ownerDocument ? ownerDocument.defaultView : window;\n}\n\nfunction attachToScrollParents(scrollParent, event, callback, scrollParents) {\n var isBody = scrollParent.nodeName === 'BODY';\n var target = isBody ? scrollParent.ownerDocument.defaultView : scrollParent;\n target.addEventListener(event, callback, { passive: true });\n\n if (!isBody) {\n attachToScrollParents(getScrollParent(target.parentNode), event, callback, scrollParents);\n }\n scrollParents.push(target);\n}\n\n/**\n * Setup needed event listeners used to update the popper position\n * @method\n * @memberof Popper.Utils\n * @private\n */\nfunction setupEventListeners(reference, options, state, updateBound) {\n // Resize event listener on window\n state.updateBound = updateBound;\n getWindow(reference).addEventListener('resize', state.updateBound, { passive: true });\n\n // Scroll event listener on scroll parents\n var scrollElement = getScrollParent(reference);\n attachToScrollParents(scrollElement, 'scroll', state.updateBound, state.scrollParents);\n state.scrollElement = scrollElement;\n state.eventsEnabled = true;\n\n return state;\n}\n\n/**\n * It will add resize/scroll events and start recalculating\n * position of the popper element when they are triggered.\n * @method\n * @memberof Popper\n */\nfunction enableEventListeners() {\n if (!this.state.eventsEnabled) {\n this.state = setupEventListeners(this.reference, this.options, this.state, this.scheduleUpdate);\n }\n}\n\n/**\n * Remove event listeners used to update the popper position\n * @method\n * @memberof Popper.Utils\n * @private\n */\nfunction removeEventListeners(reference, state) {\n // Remove resize event listener on window\n getWindow(reference).removeEventListener('resize', state.updateBound);\n\n // Remove scroll event listener on scroll parents\n state.scrollParents.forEach(function (target) {\n target.removeEventListener('scroll', state.updateBound);\n });\n\n // Reset state\n state.updateBound = null;\n state.scrollParents = [];\n state.scrollElement = null;\n state.eventsEnabled = false;\n return state;\n}\n\n/**\n * It will remove resize/scroll events and won't recalculate popper position\n * when they are triggered. It also won't trigger onUpdate callback anymore,\n * unless you call `update` method manually.\n * @method\n * @memberof Popper\n */\nfunction disableEventListeners() {\n if (this.state.eventsEnabled) {\n cancelAnimationFrame(this.scheduleUpdate);\n this.state = removeEventListeners(this.reference, this.state);\n }\n}\n\n/**\n * Tells if a given input is a number\n * @method\n * @memberof Popper.Utils\n * @param {*} input to check\n * @return {Boolean}\n */\nfunction isNumeric(n) {\n return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);\n}\n\n/**\n * Set the style to the given popper\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element - Element to apply the style to\n * @argument {Object} styles\n * Object with a list of properties and values which will be applied to the element\n */\nfunction setStyles(element, styles) {\n Object.keys(styles).forEach(function (prop) {\n var unit = '';\n // add unit if the value is numeric and is one of the following\n if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && isNumeric(styles[prop])) {\n unit = 'px';\n }\n element.style[prop] = styles[prop] + unit;\n });\n}\n\n/**\n * Set the attributes to the given popper\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element - Element to apply the attributes to\n * @argument {Object} styles\n * Object with a list of properties and values which will be applied to the element\n */\nfunction setAttributes(element, attributes) {\n Object.keys(attributes).forEach(function (prop) {\n var value = attributes[prop];\n if (value !== false) {\n element.setAttribute(prop, attributes[prop]);\n } else {\n element.removeAttribute(prop);\n }\n });\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} data.styles - List of style properties - values to apply to popper element\n * @argument {Object} data.attributes - List of attribute properties - values to apply to popper element\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The same data object\n */\nfunction applyStyle(data) {\n // any property present in `data.styles` will be applied to the popper,\n // in this way we can make the 3rd party modifiers add custom styles to it\n // Be aware, modifiers could override the properties defined in the previous\n // lines of this modifier!\n setStyles(data.instance.popper, data.styles);\n\n // any property present in `data.attributes` will be applied to the popper,\n // they will be set as HTML attributes of the element\n setAttributes(data.instance.popper, data.attributes);\n\n // if arrowElement is defined and arrowStyles has some properties\n if (data.arrowElement && Object.keys(data.arrowStyles).length) {\n setStyles(data.arrowElement, data.arrowStyles);\n }\n\n return data;\n}\n\n/**\n * Set the x-placement attribute before everything else because it could be used\n * to add margins to the popper margins needs to be calculated to get the\n * correct popper offsets.\n * @method\n * @memberof Popper.modifiers\n * @param {HTMLElement} reference - The reference element used to position the popper\n * @param {HTMLElement} popper - The HTML element used as popper\n * @param {Object} options - Popper.js options\n */\nfunction applyStyleOnLoad(reference, popper, options, modifierOptions, state) {\n // compute reference element offsets\n var referenceOffsets = getReferenceOffsets(state, popper, reference, options.positionFixed);\n\n // compute auto placement, store placement inside the data object,\n // modifiers will be able to edit `placement` if needed\n // and refer to originalPlacement to know the original value\n var placement = computeAutoPlacement(options.placement, referenceOffsets, popper, reference, options.modifiers.flip.boundariesElement, options.modifiers.flip.padding);\n\n popper.setAttribute('x-placement', placement);\n\n // Apply `position` to popper before anything else because\n // without the position applied we can't guarantee correct computations\n setStyles(popper, { position: options.positionFixed ? 'fixed' : 'absolute' });\n\n return options;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction computeStyle(data, options) {\n var x = options.x,\n y = options.y;\n var popper = data.offsets.popper;\n\n // Remove this legacy support in Popper.js v2\n\n var legacyGpuAccelerationOption = find(data.instance.modifiers, function (modifier) {\n return modifier.name === 'applyStyle';\n }).gpuAcceleration;\n if (legacyGpuAccelerationOption !== undefined) {\n console.warn('WARNING: `gpuAcceleration` option moved to `computeStyle` modifier and will not be supported in future versions of Popper.js!');\n }\n var gpuAcceleration = legacyGpuAccelerationOption !== undefined ? legacyGpuAccelerationOption : options.gpuAcceleration;\n\n var offsetParent = getOffsetParent(data.instance.popper);\n var offsetParentRect = getBoundingClientRect(offsetParent);\n\n // Styles\n var styles = {\n position: popper.position\n };\n\n // Avoid blurry text by using full pixel integers.\n // For pixel-perfect positioning, top/bottom prefers rounded\n // values, while left/right prefers floored values.\n var offsets = {\n left: Math.floor(popper.left),\n top: Math.round(popper.top),\n bottom: Math.round(popper.bottom),\n right: Math.floor(popper.right)\n };\n\n var sideA = x === 'bottom' ? 'top' : 'bottom';\n var sideB = y === 'right' ? 'left' : 'right';\n\n // if gpuAcceleration is set to `true` and transform is supported,\n // we use `translate3d` to apply the position to the popper we\n // automatically use the supported prefixed version if needed\n var prefixedProperty = getSupportedPropertyName('transform');\n\n // now, let's make a step back and look at this code closely (wtf?)\n // If the content of the popper grows once it's been positioned, it\n // may happen that the popper gets misplaced because of the new content\n // overflowing its reference element\n // To avoid this problem, we provide two options (x and y), which allow\n // the consumer to define the offset origin.\n // If we position a popper on top of a reference element, we can set\n // `x` to `top` to make the popper grow towards its top instead of\n // its bottom.\n var left = void 0,\n top = void 0;\n if (sideA === 'bottom') {\n top = -offsetParentRect.height + offsets.bottom;\n } else {\n top = offsets.top;\n }\n if (sideB === 'right') {\n left = -offsetParentRect.width + offsets.right;\n } else {\n left = offsets.left;\n }\n if (gpuAcceleration && prefixedProperty) {\n styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';\n styles[sideA] = 0;\n styles[sideB] = 0;\n styles.willChange = 'transform';\n } else {\n // othwerise, we use the standard `top`, `left`, `bottom` and `right` properties\n var invertTop = sideA === 'bottom' ? -1 : 1;\n var invertLeft = sideB === 'right' ? -1 : 1;\n styles[sideA] = top * invertTop;\n styles[sideB] = left * invertLeft;\n styles.willChange = sideA + ', ' + sideB;\n }\n\n // Attributes\n var attributes = {\n 'x-placement': data.placement\n };\n\n // Update `data` attributes, styles and arrowStyles\n data.attributes = _extends({}, attributes, data.attributes);\n data.styles = _extends({}, styles, data.styles);\n data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles);\n\n return data;\n}\n\n/**\n * Helper used to know if the given modifier depends from another one.
\n * It checks if the needed modifier is listed and enabled.\n * @method\n * @memberof Popper.Utils\n * @param {Array} modifiers - list of modifiers\n * @param {String} requestingName - name of requesting modifier\n * @param {String} requestedName - name of requested modifier\n * @returns {Boolean}\n */\nfunction isModifierRequired(modifiers, requestingName, requestedName) {\n var requesting = find(modifiers, function (_ref) {\n var name = _ref.name;\n return name === requestingName;\n });\n\n var isRequired = !!requesting && modifiers.some(function (modifier) {\n return modifier.name === requestedName && modifier.enabled && modifier.order < requesting.order;\n });\n\n if (!isRequired) {\n var _requesting = '`' + requestingName + '`';\n var requested = '`' + requestedName + '`';\n console.warn(requested + ' modifier is required by ' + _requesting + ' modifier in order to work, be sure to include it before ' + _requesting + '!');\n }\n return isRequired;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction arrow(data, options) {\n var _data$offsets$arrow;\n\n // arrow depends on keepTogether in order to work\n if (!isModifierRequired(data.instance.modifiers, 'arrow', 'keepTogether')) {\n return data;\n }\n\n var arrowElement = options.element;\n\n // if arrowElement is a string, suppose it's a CSS selector\n if (typeof arrowElement === 'string') {\n arrowElement = data.instance.popper.querySelector(arrowElement);\n\n // if arrowElement is not found, don't run the modifier\n if (!arrowElement) {\n return data;\n }\n } else {\n // if the arrowElement isn't a query selector we must check that the\n // provided DOM node is child of its popper node\n if (!data.instance.popper.contains(arrowElement)) {\n console.warn('WARNING: `arrow.element` must be child of its popper element!');\n return data;\n }\n }\n\n var placement = data.placement.split('-')[0];\n var _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var isVertical = ['left', 'right'].indexOf(placement) !== -1;\n\n var len = isVertical ? 'height' : 'width';\n var sideCapitalized = isVertical ? 'Top' : 'Left';\n var side = sideCapitalized.toLowerCase();\n var altSide = isVertical ? 'left' : 'top';\n var opSide = isVertical ? 'bottom' : 'right';\n var arrowElementSize = getOuterSizes(arrowElement)[len];\n\n //\n // extends keepTogether behavior making sure the popper and its\n // reference have enough pixels in conjuction\n //\n\n // top/left side\n if (reference[opSide] - arrowElementSize < popper[side]) {\n data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowElementSize);\n }\n // bottom/right side\n if (reference[side] + arrowElementSize > popper[opSide]) {\n data.offsets.popper[side] += reference[side] + arrowElementSize - popper[opSide];\n }\n data.offsets.popper = getClientRect(data.offsets.popper);\n\n // compute center of the popper\n var center = reference[side] + reference[len] / 2 - arrowElementSize / 2;\n\n // Compute the sideValue using the updated popper offsets\n // take popper margin in account because we don't have this info available\n var css = getStyleComputedProperty(data.instance.popper);\n var popperMarginSide = parseFloat(css['margin' + sideCapitalized], 10);\n var popperBorderSide = parseFloat(css['border' + sideCapitalized + 'Width'], 10);\n var sideValue = center - data.offsets.popper[side] - popperMarginSide - popperBorderSide;\n\n // prevent arrowElement from being placed not contiguously to its popper\n sideValue = Math.max(Math.min(popper[len] - arrowElementSize, sideValue), 0);\n\n data.arrowElement = arrowElement;\n data.offsets.arrow = (_data$offsets$arrow = {}, defineProperty(_data$offsets$arrow, side, Math.round(sideValue)), defineProperty(_data$offsets$arrow, altSide, ''), _data$offsets$arrow);\n\n return data;\n}\n\n/**\n * Get the opposite placement variation of the given one\n * @method\n * @memberof Popper.Utils\n * @argument {String} placement variation\n * @returns {String} flipped placement variation\n */\nfunction getOppositeVariation(variation) {\n if (variation === 'end') {\n return 'start';\n } else if (variation === 'start') {\n return 'end';\n }\n return variation;\n}\n\n/**\n * List of accepted placements to use as values of the `placement` option.
\n * Valid placements are:\n * - `auto`\n * - `top`\n * - `right`\n * - `bottom`\n * - `left`\n *\n * Each placement can have a variation from this list:\n * - `-start`\n * - `-end`\n *\n * Variations are interpreted easily if you think of them as the left to right\n * written languages. Horizontally (`top` and `bottom`), `start` is left and `end`\n * is right.
\n * Vertically (`left` and `right`), `start` is top and `end` is bottom.\n *\n * Some valid examples are:\n * - `top-end` (on top of reference, right aligned)\n * - `right-start` (on right of reference, top aligned)\n * - `bottom` (on bottom, centered)\n * - `auto-right` (on the side with more space available, alignment depends by placement)\n *\n * @static\n * @type {Array}\n * @enum {String}\n * @readonly\n * @method placements\n * @memberof Popper\n */\nvar placements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'];\n\n// Get rid of `auto` `auto-start` and `auto-end`\nvar validPlacements = placements.slice(3);\n\n/**\n * Given an initial placement, returns all the subsequent placements\n * clockwise (or counter-clockwise).\n *\n * @method\n * @memberof Popper.Utils\n * @argument {String} placement - A valid placement (it accepts variations)\n * @argument {Boolean} counter - Set to true to walk the placements counterclockwise\n * @returns {Array} placements including their variations\n */\nfunction clockwise(placement) {\n var counter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;\n\n var index = validPlacements.indexOf(placement);\n var arr = validPlacements.slice(index + 1).concat(validPlacements.slice(0, index));\n return counter ? arr.reverse() : arr;\n}\n\nvar BEHAVIORS = {\n FLIP: 'flip',\n CLOCKWISE: 'clockwise',\n COUNTERCLOCKWISE: 'counterclockwise'\n};\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction flip(data, options) {\n // if `inner` modifier is enabled, we can't use the `flip` modifier\n if (isModifierEnabled(data.instance.modifiers, 'inner')) {\n return data;\n }\n\n if (data.flipped && data.placement === data.originalPlacement) {\n // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides\n return data;\n }\n\n var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, options.boundariesElement, data.positionFixed);\n\n var placement = data.placement.split('-')[0];\n var placementOpposite = getOppositePlacement(placement);\n var variation = data.placement.split('-')[1] || '';\n\n var flipOrder = [];\n\n switch (options.behavior) {\n case BEHAVIORS.FLIP:\n flipOrder = [placement, placementOpposite];\n break;\n case BEHAVIORS.CLOCKWISE:\n flipOrder = clockwise(placement);\n break;\n case BEHAVIORS.COUNTERCLOCKWISE:\n flipOrder = clockwise(placement, true);\n break;\n default:\n flipOrder = options.behavior;\n }\n\n flipOrder.forEach(function (step, index) {\n if (placement !== step || flipOrder.length === index + 1) {\n return data;\n }\n\n placement = data.placement.split('-')[0];\n placementOpposite = getOppositePlacement(placement);\n\n var popperOffsets = data.offsets.popper;\n var refOffsets = data.offsets.reference;\n\n // using floor because the reference offsets may contain decimals we are not going to consider here\n var floor = Math.floor;\n var overlapsRef = placement === 'left' && floor(popperOffsets.right) > floor(refOffsets.left) || placement === 'right' && floor(popperOffsets.left) < floor(refOffsets.right) || placement === 'top' && floor(popperOffsets.bottom) > floor(refOffsets.top) || placement === 'bottom' && floor(popperOffsets.top) < floor(refOffsets.bottom);\n\n var overflowsLeft = floor(popperOffsets.left) < floor(boundaries.left);\n var overflowsRight = floor(popperOffsets.right) > floor(boundaries.right);\n var overflowsTop = floor(popperOffsets.top) < floor(boundaries.top);\n var overflowsBottom = floor(popperOffsets.bottom) > floor(boundaries.bottom);\n\n var overflowsBoundaries = placement === 'left' && overflowsLeft || placement === 'right' && overflowsRight || placement === 'top' && overflowsTop || placement === 'bottom' && overflowsBottom;\n\n // flip the variation if required\n var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;\n var flippedVariation = !!options.flipVariations && (isVertical && variation === 'start' && overflowsLeft || isVertical && variation === 'end' && overflowsRight || !isVertical && variation === 'start' && overflowsTop || !isVertical && variation === 'end' && overflowsBottom);\n\n if (overlapsRef || overflowsBoundaries || flippedVariation) {\n // this boolean to detect any flip loop\n data.flipped = true;\n\n if (overlapsRef || overflowsBoundaries) {\n placement = flipOrder[index + 1];\n }\n\n if (flippedVariation) {\n variation = getOppositeVariation(variation);\n }\n\n data.placement = placement + (variation ? '-' + variation : '');\n\n // this object contains `position`, we want to preserve it along with\n // any additional property we may add in the future\n data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));\n\n data = runModifiers(data.instance.modifiers, data, 'flip');\n }\n });\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction keepTogether(data) {\n var _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var placement = data.placement.split('-')[0];\n var floor = Math.floor;\n var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;\n var side = isVertical ? 'right' : 'bottom';\n var opSide = isVertical ? 'left' : 'top';\n var measurement = isVertical ? 'width' : 'height';\n\n if (popper[side] < floor(reference[opSide])) {\n data.offsets.popper[opSide] = floor(reference[opSide]) - popper[measurement];\n }\n if (popper[opSide] > floor(reference[side])) {\n data.offsets.popper[opSide] = floor(reference[side]);\n }\n\n return data;\n}\n\n/**\n * Converts a string containing value + unit into a px value number\n * @function\n * @memberof {modifiers~offset}\n * @private\n * @argument {String} str - Value + unit string\n * @argument {String} measurement - `height` or `width`\n * @argument {Object} popperOffsets\n * @argument {Object} referenceOffsets\n * @returns {Number|String}\n * Value in pixels, or original string if no values were extracted\n */\nfunction toValue(str, measurement, popperOffsets, referenceOffsets) {\n // separate value from unit\n var split = str.match(/((?:\\-|\\+)?\\d*\\.?\\d*)(.*)/);\n var value = +split[1];\n var unit = split[2];\n\n // If it's not a number it's an operator, I guess\n if (!value) {\n return str;\n }\n\n if (unit.indexOf('%') === 0) {\n var element = void 0;\n switch (unit) {\n case '%p':\n element = popperOffsets;\n break;\n case '%':\n case '%r':\n default:\n element = referenceOffsets;\n }\n\n var rect = getClientRect(element);\n return rect[measurement] / 100 * value;\n } else if (unit === 'vh' || unit === 'vw') {\n // if is a vh or vw, we calculate the size based on the viewport\n var size = void 0;\n if (unit === 'vh') {\n size = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);\n } else {\n size = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);\n }\n return size / 100 * value;\n } else {\n // if is an explicit pixel unit, we get rid of the unit and keep the value\n // if is an implicit unit, it's px, and we return just the value\n return value;\n }\n}\n\n/**\n * Parse an `offset` string to extrapolate `x` and `y` numeric offsets.\n * @function\n * @memberof {modifiers~offset}\n * @private\n * @argument {String} offset\n * @argument {Object} popperOffsets\n * @argument {Object} referenceOffsets\n * @argument {String} basePlacement\n * @returns {Array} a two cells array with x and y offsets in numbers\n */\nfunction parseOffset(offset, popperOffsets, referenceOffsets, basePlacement) {\n var offsets = [0, 0];\n\n // Use height if placement is left or right and index is 0 otherwise use width\n // in this way the first offset will use an axis and the second one\n // will use the other one\n var useHeight = ['right', 'left'].indexOf(basePlacement) !== -1;\n\n // Split the offset string to obtain a list of values and operands\n // The regex addresses values with the plus or minus sign in front (+10, -20, etc)\n var fragments = offset.split(/(\\+|\\-)/).map(function (frag) {\n return frag.trim();\n });\n\n // Detect if the offset string contains a pair of values or a single one\n // they could be separated by comma or space\n var divider = fragments.indexOf(find(fragments, function (frag) {\n return frag.search(/,|\\s/) !== -1;\n }));\n\n if (fragments[divider] && fragments[divider].indexOf(',') === -1) {\n console.warn('Offsets separated by white space(s) are deprecated, use a comma (,) instead.');\n }\n\n // If divider is found, we divide the list of values and operands to divide\n // them by ofset X and Y.\n var splitRegex = /\\s*,\\s*|\\s+/;\n var ops = divider !== -1 ? [fragments.slice(0, divider).concat([fragments[divider].split(splitRegex)[0]]), [fragments[divider].split(splitRegex)[1]].concat(fragments.slice(divider + 1))] : [fragments];\n\n // Convert the values with units to absolute pixels to allow our computations\n ops = ops.map(function (op, index) {\n // Most of the units rely on the orientation of the popper\n var measurement = (index === 1 ? !useHeight : useHeight) ? 'height' : 'width';\n var mergeWithPrevious = false;\n return op\n // This aggregates any `+` or `-` sign that aren't considered operators\n // e.g.: 10 + +5 => [10, +, +5]\n .reduce(function (a, b) {\n if (a[a.length - 1] === '' && ['+', '-'].indexOf(b) !== -1) {\n a[a.length - 1] = b;\n mergeWithPrevious = true;\n return a;\n } else if (mergeWithPrevious) {\n a[a.length - 1] += b;\n mergeWithPrevious = false;\n return a;\n } else {\n return a.concat(b);\n }\n }, [])\n // Here we convert the string values into number values (in px)\n .map(function (str) {\n return toValue(str, measurement, popperOffsets, referenceOffsets);\n });\n });\n\n // Loop trough the offsets arrays and execute the operations\n ops.forEach(function (op, index) {\n op.forEach(function (frag, index2) {\n if (isNumeric(frag)) {\n offsets[index] += frag * (op[index2 - 1] === '-' ? -1 : 1);\n }\n });\n });\n return offsets;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @argument {Number|String} options.offset=0\n * The offset value as described in the modifier description\n * @returns {Object} The data object, properly modified\n */\nfunction offset(data, _ref) {\n var offset = _ref.offset;\n var placement = data.placement,\n _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var basePlacement = placement.split('-')[0];\n\n var offsets = void 0;\n if (isNumeric(+offset)) {\n offsets = [+offset, 0];\n } else {\n offsets = parseOffset(offset, popper, reference, basePlacement);\n }\n\n if (basePlacement === 'left') {\n popper.top += offsets[0];\n popper.left -= offsets[1];\n } else if (basePlacement === 'right') {\n popper.top += offsets[0];\n popper.left += offsets[1];\n } else if (basePlacement === 'top') {\n popper.left += offsets[0];\n popper.top -= offsets[1];\n } else if (basePlacement === 'bottom') {\n popper.left += offsets[0];\n popper.top += offsets[1];\n }\n\n data.popper = popper;\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction preventOverflow(data, options) {\n var boundariesElement = options.boundariesElement || getOffsetParent(data.instance.popper);\n\n // If offsetParent is the reference element, we really want to\n // go one step up and use the next offsetParent as reference to\n // avoid to make this modifier completely useless and look like broken\n if (data.instance.reference === boundariesElement) {\n boundariesElement = getOffsetParent(boundariesElement);\n }\n\n // NOTE: DOM access here\n // resets the popper's position so that the document size can be calculated excluding\n // the size of the popper element itself\n var transformProp = getSupportedPropertyName('transform');\n var popperStyles = data.instance.popper.style; // assignment to help minification\n var top = popperStyles.top,\n left = popperStyles.left,\n transform = popperStyles[transformProp];\n\n popperStyles.top = '';\n popperStyles.left = '';\n popperStyles[transformProp] = '';\n\n var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, boundariesElement, data.positionFixed);\n\n // NOTE: DOM access here\n // restores the original style properties after the offsets have been computed\n popperStyles.top = top;\n popperStyles.left = left;\n popperStyles[transformProp] = transform;\n\n options.boundaries = boundaries;\n\n var order = options.priority;\n var popper = data.offsets.popper;\n\n var check = {\n primary: function primary(placement) {\n var value = popper[placement];\n if (popper[placement] < boundaries[placement] && !options.escapeWithReference) {\n value = Math.max(popper[placement], boundaries[placement]);\n }\n return defineProperty({}, placement, value);\n },\n secondary: function secondary(placement) {\n var mainSide = placement === 'right' ? 'left' : 'top';\n var value = popper[mainSide];\n if (popper[placement] > boundaries[placement] && !options.escapeWithReference) {\n value = Math.min(popper[mainSide], boundaries[placement] - (placement === 'right' ? popper.width : popper.height));\n }\n return defineProperty({}, mainSide, value);\n }\n };\n\n order.forEach(function (placement) {\n var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary';\n popper = _extends({}, popper, check[side](placement));\n });\n\n data.offsets.popper = popper;\n\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction shift(data) {\n var placement = data.placement;\n var basePlacement = placement.split('-')[0];\n var shiftvariation = placement.split('-')[1];\n\n // if shift shiftvariation is specified, run the modifier\n if (shiftvariation) {\n var _data$offsets = data.offsets,\n reference = _data$offsets.reference,\n popper = _data$offsets.popper;\n\n var isVertical = ['bottom', 'top'].indexOf(basePlacement) !== -1;\n var side = isVertical ? 'left' : 'top';\n var measurement = isVertical ? 'width' : 'height';\n\n var shiftOffsets = {\n start: defineProperty({}, side, reference[side]),\n end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement])\n };\n\n data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]);\n }\n\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction hide(data) {\n if (!isModifierRequired(data.instance.modifiers, 'hide', 'preventOverflow')) {\n return data;\n }\n\n var refRect = data.offsets.reference;\n var bound = find(data.instance.modifiers, function (modifier) {\n return modifier.name === 'preventOverflow';\n }).boundaries;\n\n if (refRect.bottom < bound.top || refRect.left > bound.right || refRect.top > bound.bottom || refRect.right < bound.left) {\n // Avoid unnecessary DOM access if visibility hasn't changed\n if (data.hide === true) {\n return data;\n }\n\n data.hide = true;\n data.attributes['x-out-of-boundaries'] = '';\n } else {\n // Avoid unnecessary DOM access if visibility hasn't changed\n if (data.hide === false) {\n return data;\n }\n\n data.hide = false;\n data.attributes['x-out-of-boundaries'] = false;\n }\n\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction inner(data) {\n var placement = data.placement;\n var basePlacement = placement.split('-')[0];\n var _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var isHoriz = ['left', 'right'].indexOf(basePlacement) !== -1;\n\n var subtractLength = ['top', 'left'].indexOf(basePlacement) === -1;\n\n popper[isHoriz ? 'left' : 'top'] = reference[basePlacement] - (subtractLength ? popper[isHoriz ? 'width' : 'height'] : 0);\n\n data.placement = getOppositePlacement(placement);\n data.offsets.popper = getClientRect(popper);\n\n return data;\n}\n\n/**\n * Modifier function, each modifier can have a function of this type assigned\n * to its `fn` property.
\n * These functions will be called on each update, this means that you must\n * make sure they are performant enough to avoid performance bottlenecks.\n *\n * @function ModifierFn\n * @argument {dataObject} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {dataObject} The data object, properly modified\n */\n\n/**\n * Modifiers are plugins used to alter the behavior of your poppers.
\n * Popper.js uses a set of 9 modifiers to provide all the basic functionalities\n * needed by the library.\n *\n * Usually you don't want to override the `order`, `fn` and `onLoad` props.\n * All the other properties are configurations that could be tweaked.\n * @namespace modifiers\n */\nvar modifiers = {\n /**\n * Modifier used to shift the popper on the start or end of its reference\n * element.
\n * It will read the variation of the `placement` property.
\n * It can be one either `-end` or `-start`.\n * @memberof modifiers\n * @inner\n */\n shift: {\n /** @prop {number} order=100 - Index used to define the order of execution */\n order: 100,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: shift\n },\n\n /**\n * The `offset` modifier can shift your popper on both its axis.\n *\n * It accepts the following units:\n * - `px` or unitless, interpreted as pixels\n * - `%` or `%r`, percentage relative to the length of the reference element\n * - `%p`, percentage relative to the length of the popper element\n * - `vw`, CSS viewport width unit\n * - `vh`, CSS viewport height unit\n *\n * For length is intended the main axis relative to the placement of the popper.
\n * This means that if the placement is `top` or `bottom`, the length will be the\n * `width`. In case of `left` or `right`, it will be the height.\n *\n * You can provide a single value (as `Number` or `String`), or a pair of values\n * as `String` divided by a comma or one (or more) white spaces.
\n * The latter is a deprecated method because it leads to confusion and will be\n * removed in v2.
\n * Additionally, it accepts additions and subtractions between different units.\n * Note that multiplications and divisions aren't supported.\n *\n * Valid examples are:\n * ```\n * 10\n * '10%'\n * '10, 10'\n * '10%, 10'\n * '10 + 10%'\n * '10 - 5vh + 3%'\n * '-10px + 5vh, 5px - 6%'\n * ```\n * > **NB**: If you desire to apply offsets to your poppers in a way that may make them overlap\n * > with their reference element, unfortunately, you will have to disable the `flip` modifier.\n * > More on this [reading this issue](https://github.com/FezVrasta/popper.js/issues/373)\n *\n * @memberof modifiers\n * @inner\n */\n offset: {\n /** @prop {number} order=200 - Index used to define the order of execution */\n order: 200,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: offset,\n /** @prop {Number|String} offset=0\n * The offset value as described in the modifier description\n */\n offset: 0\n },\n\n /**\n * Modifier used to prevent the popper from being positioned outside the boundary.\n *\n * An scenario exists where the reference itself is not within the boundaries.
\n * We can say it has \"escaped the boundaries\" — or just \"escaped\".
\n * In this case we need to decide whether the popper should either:\n *\n * - detach from the reference and remain \"trapped\" in the boundaries, or\n * - if it should ignore the boundary and \"escape with its reference\"\n *\n * When `escapeWithReference` is set to`true` and reference is completely\n * outside its boundaries, the popper will overflow (or completely leave)\n * the boundaries in order to remain attached to the edge of the reference.\n *\n * @memberof modifiers\n * @inner\n */\n preventOverflow: {\n /** @prop {number} order=300 - Index used to define the order of execution */\n order: 300,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: preventOverflow,\n /**\n * @prop {Array} [priority=['left','right','top','bottom']]\n * Popper will try to prevent overflow following these priorities by default,\n * then, it could overflow on the left and on top of the `boundariesElement`\n */\n priority: ['left', 'right', 'top', 'bottom'],\n /**\n * @prop {number} padding=5\n * Amount of pixel used to define a minimum distance between the boundaries\n * and the popper this makes sure the popper has always a little padding\n * between the edges of its container\n */\n padding: 5,\n /**\n * @prop {String|HTMLElement} boundariesElement='scrollParent'\n * Boundaries used by the modifier, can be `scrollParent`, `window`,\n * `viewport` or any DOM element.\n */\n boundariesElement: 'scrollParent'\n },\n\n /**\n * Modifier used to make sure the reference and its popper stay near eachothers\n * without leaving any gap between the two. Expecially useful when the arrow is\n * enabled and you want to assure it to point to its reference element.\n * It cares only about the first axis, you can still have poppers with margin\n * between the popper and its reference element.\n * @memberof modifiers\n * @inner\n */\n keepTogether: {\n /** @prop {number} order=400 - Index used to define the order of execution */\n order: 400,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: keepTogether\n },\n\n /**\n * This modifier is used to move the `arrowElement` of the popper to make\n * sure it is positioned between the reference element and its popper element.\n * It will read the outer size of the `arrowElement` node to detect how many\n * pixels of conjuction are needed.\n *\n * It has no effect if no `arrowElement` is provided.\n * @memberof modifiers\n * @inner\n */\n arrow: {\n /** @prop {number} order=500 - Index used to define the order of execution */\n order: 500,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: arrow,\n /** @prop {String|HTMLElement} element='[x-arrow]' - Selector or node used as arrow */\n element: '[x-arrow]'\n },\n\n /**\n * Modifier used to flip the popper's placement when it starts to overlap its\n * reference element.\n *\n * Requires the `preventOverflow` modifier before it in order to work.\n *\n * **NOTE:** this modifier will interrupt the current update cycle and will\n * restart it if it detects the need to flip the placement.\n * @memberof modifiers\n * @inner\n */\n flip: {\n /** @prop {number} order=600 - Index used to define the order of execution */\n order: 600,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: flip,\n /**\n * @prop {String|Array} behavior='flip'\n * The behavior used to change the popper's placement. It can be one of\n * `flip`, `clockwise`, `counterclockwise` or an array with a list of valid\n * placements (with optional variations).\n */\n behavior: 'flip',\n /**\n * @prop {number} padding=5\n * The popper will flip if it hits the edges of the `boundariesElement`\n */\n padding: 5,\n /**\n * @prop {String|HTMLElement} boundariesElement='viewport'\n * The element which will define the boundaries of the popper position,\n * the popper will never be placed outside of the defined boundaries\n * (except if keepTogether is enabled)\n */\n boundariesElement: 'viewport'\n },\n\n /**\n * Modifier used to make the popper flow toward the inner of the reference element.\n * By default, when this modifier is disabled, the popper will be placed outside\n * the reference element.\n * @memberof modifiers\n * @inner\n */\n inner: {\n /** @prop {number} order=700 - Index used to define the order of execution */\n order: 700,\n /** @prop {Boolean} enabled=false - Whether the modifier is enabled or not */\n enabled: false,\n /** @prop {ModifierFn} */\n fn: inner\n },\n\n /**\n * Modifier used to hide the popper when its reference element is outside of the\n * popper boundaries. It will set a `x-out-of-boundaries` attribute which can\n * be used to hide with a CSS selector the popper when its reference is\n * out of boundaries.\n *\n * Requires the `preventOverflow` modifier before it in order to work.\n * @memberof modifiers\n * @inner\n */\n hide: {\n /** @prop {number} order=800 - Index used to define the order of execution */\n order: 800,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: hide\n },\n\n /**\n * Computes the style that will be applied to the popper element to gets\n * properly positioned.\n *\n * Note that this modifier will not touch the DOM, it just prepares the styles\n * so that `applyStyle` modifier can apply it. This separation is useful\n * in case you need to replace `applyStyle` with a custom implementation.\n *\n * This modifier has `850` as `order` value to maintain backward compatibility\n * with previous versions of Popper.js. Expect the modifiers ordering method\n * to change in future major versions of the library.\n *\n * @memberof modifiers\n * @inner\n */\n computeStyle: {\n /** @prop {number} order=850 - Index used to define the order of execution */\n order: 850,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: computeStyle,\n /**\n * @prop {Boolean} gpuAcceleration=true\n * If true, it uses the CSS 3d transformation to position the popper.\n * Otherwise, it will use the `top` and `left` properties.\n */\n gpuAcceleration: true,\n /**\n * @prop {string} [x='bottom']\n * Where to anchor the X axis (`bottom` or `top`). AKA X offset origin.\n * Change this if your popper should grow in a direction different from `bottom`\n */\n x: 'bottom',\n /**\n * @prop {string} [x='left']\n * Where to anchor the Y axis (`left` or `right`). AKA Y offset origin.\n * Change this if your popper should grow in a direction different from `right`\n */\n y: 'right'\n },\n\n /**\n * Applies the computed styles to the popper element.\n *\n * All the DOM manipulations are limited to this modifier. This is useful in case\n * you want to integrate Popper.js inside a framework or view library and you\n * want to delegate all the DOM manipulations to it.\n *\n * Note that if you disable this modifier, you must make sure the popper element\n * has its position set to `absolute` before Popper.js can do its work!\n *\n * Just disable this modifier and define you own to achieve the desired effect.\n *\n * @memberof modifiers\n * @inner\n */\n applyStyle: {\n /** @prop {number} order=900 - Index used to define the order of execution */\n order: 900,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: applyStyle,\n /** @prop {Function} */\n onLoad: applyStyleOnLoad,\n /**\n * @deprecated since version 1.10.0, the property moved to `computeStyle` modifier\n * @prop {Boolean} gpuAcceleration=true\n * If true, it uses the CSS 3d transformation to position the popper.\n * Otherwise, it will use the `top` and `left` properties.\n */\n gpuAcceleration: undefined\n }\n};\n\n/**\n * The `dataObject` is an object containing all the informations used by Popper.js\n * this object get passed to modifiers and to the `onCreate` and `onUpdate` callbacks.\n * @name dataObject\n * @property {Object} data.instance The Popper.js instance\n * @property {String} data.placement Placement applied to popper\n * @property {String} data.originalPlacement Placement originally defined on init\n * @property {Boolean} data.flipped True if popper has been flipped by flip modifier\n * @property {Boolean} data.hide True if the reference element is out of boundaries, useful to know when to hide the popper.\n * @property {HTMLElement} data.arrowElement Node used as arrow by arrow modifier\n * @property {Object} data.styles Any CSS property defined here will be applied to the popper, it expects the JavaScript nomenclature (eg. `marginBottom`)\n * @property {Object} data.arrowStyles Any CSS property defined here will be applied to the popper arrow, it expects the JavaScript nomenclature (eg. `marginBottom`)\n * @property {Object} data.boundaries Offsets of the popper boundaries\n * @property {Object} data.offsets The measurements of popper, reference and arrow elements.\n * @property {Object} data.offsets.popper `top`, `left`, `width`, `height` values\n * @property {Object} data.offsets.reference `top`, `left`, `width`, `height` values\n * @property {Object} data.offsets.arrow] `top` and `left` offsets, only one of them will be different from 0\n */\n\n/**\n * Default options provided to Popper.js constructor.
\n * These can be overriden using the `options` argument of Popper.js.
\n * To override an option, simply pass as 3rd argument an object with the same\n * structure of this object, example:\n * ```\n * new Popper(ref, pop, {\n * modifiers: {\n * preventOverflow: { enabled: false }\n * }\n * })\n * ```\n * @type {Object}\n * @static\n * @memberof Popper\n */\nvar Defaults = {\n /**\n * Popper's placement\n * @prop {Popper.placements} placement='bottom'\n */\n placement: 'bottom',\n\n /**\n * Set this to true if you want popper to position it self in 'fixed' mode\n * @prop {Boolean} positionFixed=false\n */\n positionFixed: false,\n\n /**\n * Whether events (resize, scroll) are initially enabled\n * @prop {Boolean} eventsEnabled=true\n */\n eventsEnabled: true,\n\n /**\n * Set to true if you want to automatically remove the popper when\n * you call the `destroy` method.\n * @prop {Boolean} removeOnDestroy=false\n */\n removeOnDestroy: false,\n\n /**\n * Callback called when the popper is created.
\n * By default, is set to no-op.
\n * Access Popper.js instance with `data.instance`.\n * @prop {onCreate}\n */\n onCreate: function onCreate() {},\n\n /**\n * Callback called when the popper is updated, this callback is not called\n * on the initialization/creation of the popper, but only on subsequent\n * updates.
\n * By default, is set to no-op.
\n * Access Popper.js instance with `data.instance`.\n * @prop {onUpdate}\n */\n onUpdate: function onUpdate() {},\n\n /**\n * List of modifiers used to modify the offsets before they are applied to the popper.\n * They provide most of the functionalities of Popper.js\n * @prop {modifiers}\n */\n modifiers: modifiers\n};\n\n/**\n * @callback onCreate\n * @param {dataObject} data\n */\n\n/**\n * @callback onUpdate\n * @param {dataObject} data\n */\n\n// Utils\n// Methods\nvar Popper = function () {\n /**\n * Create a new Popper.js instance\n * @class Popper\n * @param {HTMLElement|referenceObject} reference - The reference element used to position the popper\n * @param {HTMLElement} popper - The HTML element used as popper.\n * @param {Object} options - Your custom options to override the ones defined in [Defaults](#defaults)\n * @return {Object} instance - The generated Popper.js instance\n */\n function Popper(reference, popper) {\n var _this = this;\n\n var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n classCallCheck(this, Popper);\n\n this.scheduleUpdate = function () {\n return requestAnimationFrame(_this.update);\n };\n\n // make update() debounced, so that it only runs at most once-per-tick\n this.update = debounce(this.update.bind(this));\n\n // with {} we create a new object with the options inside it\n this.options = _extends({}, Popper.Defaults, options);\n\n // init state\n this.state = {\n isDestroyed: false,\n isCreated: false,\n scrollParents: []\n };\n\n // get reference and popper elements (allow jQuery wrappers)\n this.reference = reference && reference.jquery ? reference[0] : reference;\n this.popper = popper && popper.jquery ? popper[0] : popper;\n\n // Deep merge modifiers options\n this.options.modifiers = {};\n Object.keys(_extends({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {\n _this.options.modifiers[name] = _extends({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});\n });\n\n // Refactoring modifiers' list (Object => Array)\n this.modifiers = Object.keys(this.options.modifiers).map(function (name) {\n return _extends({\n name: name\n }, _this.options.modifiers[name]);\n })\n // sort the modifiers by order\n .sort(function (a, b) {\n return a.order - b.order;\n });\n\n // modifiers have the ability to execute arbitrary code when Popper.js get inited\n // such code is executed in the same order of its modifier\n // they could add new properties to their options configuration\n // BE AWARE: don't add options to `options.modifiers.name` but to `modifierOptions`!\n this.modifiers.forEach(function (modifierOptions) {\n if (modifierOptions.enabled && isFunction(modifierOptions.onLoad)) {\n modifierOptions.onLoad(_this.reference, _this.popper, _this.options, modifierOptions, _this.state);\n }\n });\n\n // fire the first update to position the popper in the right place\n this.update();\n\n var eventsEnabled = this.options.eventsEnabled;\n if (eventsEnabled) {\n // setup event listeners, they will take care of update the position in specific situations\n this.enableEventListeners();\n }\n\n this.state.eventsEnabled = eventsEnabled;\n }\n\n // We can't use class properties because they don't get listed in the\n // class prototype and break stuff like Sinon stubs\n\n\n createClass(Popper, [{\n key: 'update',\n value: function update$$1() {\n return update.call(this);\n }\n }, {\n key: 'destroy',\n value: function destroy$$1() {\n return destroy.call(this);\n }\n }, {\n key: 'enableEventListeners',\n value: function enableEventListeners$$1() {\n return enableEventListeners.call(this);\n }\n }, {\n key: 'disableEventListeners',\n value: function disableEventListeners$$1() {\n return disableEventListeners.call(this);\n }\n\n /**\n * Schedule an update, it will run on the next UI update available\n * @method scheduleUpdate\n * @memberof Popper\n */\n\n\n /**\n * Collection of utilities useful when writing custom modifiers.\n * Starting from version 1.7, this method is available only if you\n * include `popper-utils.js` before `popper.js`.\n *\n * **DEPRECATION**: This way to access PopperUtils is deprecated\n * and will be removed in v2! Use the PopperUtils module directly instead.\n * Due to the high instability of the methods contained in Utils, we can't\n * guarantee them to follow semver. Use them at your own risk!\n * @static\n * @private\n * @type {Object}\n * @deprecated since version 1.8\n * @member Utils\n * @memberof Popper\n */\n\n }]);\n return Popper;\n}();\n\n/**\n * The `referenceObject` is an object that provides an interface compatible with Popper.js\n * and lets you use it as replacement of a real DOM node.
\n * You can use this method to position a popper relatively to a set of coordinates\n * in case you don't have a DOM node to use as reference.\n *\n * ```\n * new Popper(referenceObject, popperNode);\n * ```\n *\n * NB: This feature isn't supported in Internet Explorer 10\n * @name referenceObject\n * @property {Function} data.getBoundingClientRect\n * A function that returns a set of coordinates compatible with the native `getBoundingClientRect` method.\n * @property {number} data.clientWidth\n * An ES6 getter that will return the width of the virtual reference element.\n * @property {number} data.clientHeight\n * An ES6 getter that will return the height of the virtual reference element.\n */\n\n\nPopper.Utils = (typeof window !== 'undefined' ? window : global).PopperUtils;\nPopper.placements = placements;\nPopper.Defaults = Defaults;\n\n/* harmony default export */ __webpack_exports__[\"a\"] = (Popper);\n//# sourceMappingURL=popper.js.map\n\n/* WEBPACK VAR INJECTION */}.call(__webpack_exports__, __webpack_require__(2)))\n\n/***/ }),\n/* 40 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react__ = __webpack_require__(0);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_react__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_prop_types__ = __webpack_require__(1);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_prop_types___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_prop_types__);\nvar _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; };\n\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\n\n\n\n\nvar Arrow = function Arrow(props, context) {\n var _props$component = props.component,\n component = _props$component === undefined ? 'span' : _props$component,\n innerRef = props.innerRef,\n children = props.children,\n restProps = _objectWithoutProperties(props, ['component', 'innerRef', 'children']);\n\n var popper = context.popper;\n\n var arrowRef = function arrowRef(node) {\n popper.setArrowNode(node);\n if (typeof innerRef === 'function') {\n innerRef(node);\n }\n };\n var arrowStyle = popper.getArrowStyle();\n\n if (typeof children === 'function') {\n var arrowProps = {\n ref: arrowRef,\n style: arrowStyle\n };\n return children({ arrowProps: arrowProps, restProps: restProps });\n }\n\n var componentProps = _extends({}, restProps, {\n style: _extends({}, arrowStyle, restProps.style)\n });\n\n if (typeof component === 'string') {\n componentProps.ref = arrowRef;\n } else {\n componentProps.innerRef = arrowRef;\n }\n\n return Object(__WEBPACK_IMPORTED_MODULE_0_react__[\"createElement\"])(component, componentProps, children);\n};\n\nArrow.contextTypes = {\n popper: __WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.object.isRequired\n};\n\nArrow.propTypes = {\n component: __WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.oneOfType([__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.node, __WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.func]),\n innerRef: __WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.func,\n children: __WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.oneOfType([__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.node, __WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.func])\n};\n\n/* harmony default export */ __webpack_exports__[\"a\"] = (Arrow);\n\n/***/ }),\n/* 41 */\n/***/ (function(module, exports) {\n\n/**\n * lodash (Custom Build)
BOOBY React
\n\n To get started, edit src/App.js and save to reload.\n
\n \n \n 
\n \n \n \n \n \n
\n );\n }\n}\n\n\n// WEBPACK FOOTER //\n// ./src/components/Navbar.js","import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport isFunction from 'lodash.isfunction';\nimport isobject from 'lodash.isobject';\nimport ReactDOM from 'react-dom';\nimport { Arrow, Manager, Popper, Target } from 'react-popper';\nimport toNumber from 'lodash.tonumber';\n\n// https://github.com/twbs/bootstrap/blob/v4.0.0-alpha.4/js/src/modal.js#L436-L443\nfunction getScrollbarWidth() {\n var scrollDiv = document.createElement('div');\n // .modal-scrollbar-measure styles // https://github.com/twbs/bootstrap/blob/v4.0.0-alpha.4/scss/_modal.scss#L106-L113\n scrollDiv.style.position = 'absolute';\n scrollDiv.style.top = '-9999px';\n scrollDiv.style.width = '50px';\n scrollDiv.style.height = '50px';\n scrollDiv.style.overflow = 'scroll';\n document.body.appendChild(scrollDiv);\n var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;\n document.body.removeChild(scrollDiv);\n return scrollbarWidth;\n}\n\nfunction setScrollbarWidth(padding) {\n document.body.style.paddingRight = padding > 0 ? padding + 'px' : null;\n}\n\nfunction isBodyOverflowing() {\n return document.body.clientWidth < window.innerWidth;\n}\n\nfunction getOriginalBodyPadding() {\n var style = window.getComputedStyle(document.body, null);\n\n return parseInt(style && style.getPropertyValue('padding-right') || 0, 10);\n}\n\nfunction conditionallyUpdateScrollbar() {\n var scrollbarWidth = getScrollbarWidth();\n // https://github.com/twbs/bootstrap/blob/v4.0.0-alpha.6/js/src/modal.js#L433\n var fixedContent = document.querySelectorAll('.fixed-top, .fixed-bottom, .is-fixed, .sticky-top')[0];\n var bodyPadding = fixedContent ? parseInt(fixedContent.style.paddingRight || 0, 10) : 0;\n\n if (isBodyOverflowing()) {\n setScrollbarWidth(bodyPadding + scrollbarWidth);\n }\n}\n\nvar globalCssModule = void 0;\n\nfunction setGlobalCssModule(cssModule) {\n globalCssModule = cssModule;\n}\n\nfunction mapToCssModules() {\n var className = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';\n var cssModule = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : globalCssModule;\n\n if (!cssModule) return className;\n return className.split(' ').map(function (c) {\n return cssModule[c] || c;\n }).join(' ');\n}\n\n/**\n * Returns a new object with the key/value pairs from `obj` that are not in the array `omitKeys`.\n */\nfunction omit(obj, omitKeys) {\n var result = {};\n Object.keys(obj).forEach(function (key) {\n if (omitKeys.indexOf(key) === -1) {\n result[key] = obj[key];\n }\n });\n return result;\n}\n\n/**\n * Returns a filtered copy of an object with only the specified keys.\n */\nfunction pick(obj, keys) {\n var pickKeys = Array.isArray(keys) ? keys : [keys];\n var length = pickKeys.length;\n var key = void 0;\n var result = {};\n\n while (length > 0) {\n length -= 1;\n key = pickKeys[length];\n result[key] = obj[key];\n }\n return result;\n}\n\nvar warned = {};\n\nfunction warnOnce(message) {\n if (!warned[message]) {\n /* istanbul ignore else */\n if (typeof console !== 'undefined') {\n console.error(message); // eslint-disable-line no-console\n }\n warned[message] = true;\n }\n}\n\nfunction deprecated(propType, explanation) {\n return function validate(props, propName, componentName) {\n if (props[propName] !== null && typeof props[propName] !== 'undefined') {\n warnOnce('\"' + propName + '\" property of \"' + componentName + '\" has been deprecated.\\n' + explanation);\n }\n\n for (var _len = arguments.length, rest = Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {\n rest[_key - 3] = arguments[_key];\n }\n\n return propType.apply(undefined, [props, propName, componentName].concat(rest));\n };\n}\n\nfunction DOMElement(props, propName, componentName) {\n if (!(props[propName] instanceof Element)) {\n return new Error('Invalid prop `' + propName + '` supplied to `' + componentName + '`. Expected prop to be an instance of Element. Validation failed.');\n }\n}\n\n/* eslint key-spacing: [\"error\", { afterColon: true, align: \"value\" }] */\n// These are all setup to match what is in the bootstrap _variables.scss\n// https://github.com/twbs/bootstrap/blob/v4-dev/scss/_variables.scss\nvar TransitionTimeouts = {\n Fade: 150, // $transition-fade\n Collapse: 350, // $transition-collapse\n Modal: 300, // $modal-transition\n Carousel: 600 // $carousel-transition\n};\n\n// Duplicated Transition.propType keys to ensure that Reactstrap builds\n// for distribution properly exclude these keys for nested child HTML attributes\n// since `react-transition-group` removes propTypes in production builds.\nvar TransitionPropTypeKeys = ['in', 'mountOnEnter', 'unmountOnExit', 'appear', 'enter', 'exit', 'timeout', 'onEnter', 'onEntering', 'onEntered', 'onExit', 'onExiting', 'onExited'];\n\nvar TransitionStatuses = {\n ENTERING: 'entering',\n ENTERED: 'entered',\n EXITING: 'exiting',\n EXITED: 'exited'\n};\n\nvar keyCodes = {\n esc: 27,\n space: 32,\n tab: 9,\n up: 38,\n down: 40\n};\n\nvar PopperPlacements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'];\n\nvar canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);\n\nfunction findDOMElements(target) {\n if (isFunction(target)) {\n return target();\n }\n if (typeof target === 'string' && canUseDOM) {\n var selection = document.querySelectorAll(target);\n if (!selection.length) {\n selection = document.querySelectorAll('#' + target);\n }\n if (!selection.length) {\n throw new Error('The target \\'' + target + '\\' could not be identified in the dom, tip: check spelling');\n }\n return selection;\n }\n return target;\n}\n\nfunction isArrayOrNodeList(els) {\n return Array.isArray(els) || canUseDOM && typeof els.length === 'number';\n}\n\nfunction getTarget(target) {\n var els = findDOMElements(target);\n if (isArrayOrNodeList(els)) {\n return els[0];\n }\n return els;\n}\n\nvar defaultToggleEvents = ['touchstart', 'click'];\n\nfunction addMultipleEventListeners(_els, handler, _events) {\n var els = _els;\n if (!isArrayOrNodeList(els)) {\n els = [els];\n }\n\n var events = _events;\n if (typeof events === 'string') {\n events = events.split(/\\s+/);\n }\n\n if (!isArrayOrNodeList(els) || typeof handler !== 'function' || !Array.isArray(events)) {\n throw new Error('\\n The first argument of this function must be DOM node or an array on DOM nodes or NodeList.\\n The second must be a function.\\n The third is a string or an array of strings that represents DOM events\\n ');\n }\n events.forEach(function (event) {\n els.forEach(function (el) {\n el.addEventListener(event, handler);\n });\n });\n return function removeEvents() {\n events.forEach(function (event) {\n els.forEach(function (el) {\n el.removeEventListener(event, handler);\n });\n });\n };\n}\n\nvar utils = Object.freeze({\n\tgetScrollbarWidth: getScrollbarWidth,\n\tsetScrollbarWidth: setScrollbarWidth,\n\tisBodyOverflowing: isBodyOverflowing,\n\tgetOriginalBodyPadding: getOriginalBodyPadding,\n\tconditionallyUpdateScrollbar: conditionallyUpdateScrollbar,\n\tsetGlobalCssModule: setGlobalCssModule,\n\tmapToCssModules: mapToCssModules,\n\tomit: omit,\n\tpick: pick,\n\twarnOnce: warnOnce,\n\tdeprecated: deprecated,\n\tDOMElement: DOMElement,\n\tTransitionTimeouts: TransitionTimeouts,\n\tTransitionPropTypeKeys: TransitionPropTypeKeys,\n\tTransitionStatuses: TransitionStatuses,\n\tkeyCodes: keyCodes,\n\tPopperPlacements: PopperPlacements,\n\tcanUseDOM: canUseDOM,\n\tfindDOMElements: findDOMElements,\n\tisArrayOrNodeList: isArrayOrNodeList,\n\tgetTarget: getTarget,\n\tdefaultToggleEvents: defaultToggleEvents,\n\taddMultipleEventListeners: addMultipleEventListeners\n});\n\nvar _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) {\n return typeof obj;\n} : function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n};\n\n\n\n\n\n\n\n\n\n\n\nvar classCallCheck = function (instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n};\n\nvar createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n}();\n\n\n\n\n\nvar defineProperty = function (obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n};\n\nvar _extends = Object.assign || function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n};\n\n\n\nvar inherits = function (subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass);\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n enumerable: false,\n writable: true,\n configurable: true\n }\n });\n if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;\n};\n\n\n\n\n\n\n\n\n\nvar objectWithoutProperties = function (obj, keys) {\n var target = {};\n\n for (var i in obj) {\n if (keys.indexOf(i) >= 0) continue;\n if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;\n target[i] = obj[i];\n }\n\n return target;\n};\n\nvar possibleConstructorReturn = function (self, call) {\n if (!self) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self;\n};\n\nvar propTypes = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n fluid: PropTypes.bool,\n className: PropTypes.string,\n cssModule: PropTypes.object\n};\n\nvar defaultProps = {\n tag: 'div'\n};\n\nvar Container = function Container(props) {\n var className = props.className,\n cssModule = props.cssModule,\n fluid = props.fluid,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'fluid', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, fluid ? 'container-fluid' : 'container'), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nContainer.propTypes = propTypes;\nContainer.defaultProps = defaultProps;\n\nvar propTypes$1 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n noGutters: PropTypes.bool,\n className: PropTypes.string,\n cssModule: PropTypes.object\n};\n\nvar defaultProps$1 = {\n tag: 'div'\n};\n\nvar Row = function Row(props) {\n var className = props.className,\n cssModule = props.cssModule,\n noGutters = props.noGutters,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'noGutters', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, noGutters ? 'no-gutters' : null, 'row'), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nRow.propTypes = propTypes$1;\nRow.defaultProps = defaultProps$1;\n\nvar colWidths = ['xs', 'sm', 'md', 'lg', 'xl'];\nvar stringOrNumberProp = PropTypes.oneOfType([PropTypes.number, PropTypes.string]);\n\nvar columnProps = PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string, PropTypes.shape({\n size: PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string]),\n push: deprecated(stringOrNumberProp, 'Please use the prop \"order\"'),\n pull: deprecated(stringOrNumberProp, 'Please use the prop \"order\"'),\n order: stringOrNumberProp,\n offset: stringOrNumberProp\n})]);\n\nvar propTypes$2 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n xs: columnProps,\n sm: columnProps,\n md: columnProps,\n lg: columnProps,\n xl: columnProps,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n widths: PropTypes.array\n};\n\nvar defaultProps$2 = {\n tag: 'div',\n widths: colWidths\n};\n\nvar getColumnSizeClass = function getColumnSizeClass(isXs, colWidth, colSize) {\n if (colSize === true || colSize === '') {\n return isXs ? 'col' : 'col-' + colWidth;\n } else if (colSize === 'auto') {\n return isXs ? 'col-auto' : 'col-' + colWidth + '-auto';\n }\n\n return isXs ? 'col-' + colSize : 'col-' + colWidth + '-' + colSize;\n};\n\nvar Col = function Col(props) {\n var className = props.className,\n cssModule = props.cssModule,\n widths = props.widths,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'widths', 'tag']);\n\n var colClasses = [];\n\n widths.forEach(function (colWidth, i) {\n var columnProp = props[colWidth];\n\n delete attributes[colWidth];\n\n if (!columnProp && columnProp !== '') {\n return;\n }\n\n var isXs = !i;\n\n if (isobject(columnProp)) {\n var _classNames;\n\n var colSizeInterfix = isXs ? '-' : '-' + colWidth + '-';\n var colClass = getColumnSizeClass(isXs, colWidth, columnProp.size);\n\n colClasses.push(mapToCssModules(classNames((_classNames = {}, defineProperty(_classNames, colClass, columnProp.size || columnProp.size === ''), defineProperty(_classNames, 'order' + colSizeInterfix + columnProp.order, columnProp.order || columnProp.order === 0), defineProperty(_classNames, 'offset' + colSizeInterfix + columnProp.offset, columnProp.offset || columnProp.offset === 0), _classNames)), cssModule));\n } else {\n var _colClass = getColumnSizeClass(isXs, colWidth, columnProp);\n colClasses.push(_colClass);\n }\n });\n\n if (!colClasses.length) {\n colClasses.push('col');\n }\n\n var classes = mapToCssModules(classNames(className, colClasses), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nCol.propTypes = propTypes$2;\nCol.defaultProps = defaultProps$2;\n\nvar propTypes$3 = {\n light: PropTypes.bool,\n dark: PropTypes.bool,\n inverse: deprecated(PropTypes.bool, 'Please use the prop \"dark\"'),\n full: PropTypes.bool,\n fixed: PropTypes.string,\n sticky: PropTypes.string,\n color: PropTypes.string,\n role: PropTypes.string,\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n className: PropTypes.string,\n cssModule: PropTypes.object,\n toggleable: deprecated(PropTypes.oneOfType([PropTypes.bool, PropTypes.string]), 'Please use the prop \"expand\"'),\n expand: PropTypes.oneOfType([PropTypes.bool, PropTypes.string])\n};\n\nvar defaultProps$3 = {\n tag: 'nav',\n expand: false\n};\n\nvar getExpandClass = function getExpandClass(expand) {\n if (expand === false) {\n return false;\n } else if (expand === true || expand === 'xs') {\n return 'navbar-expand';\n }\n\n return 'navbar-expand-' + expand;\n};\n\n// To better maintain backwards compatibility while toggleable is deprecated.\n// We must map breakpoints to the next breakpoint so that toggleable and expand do the same things at the same breakpoint.\nvar toggleableToExpand = {\n xs: 'sm',\n sm: 'md',\n md: 'lg',\n lg: 'xl'\n};\n\nvar getToggleableClass = function getToggleableClass(toggleable) {\n if (toggleable === undefined || toggleable === 'xl') {\n return false;\n } else if (toggleable === false) {\n return 'navbar-expand';\n }\n\n return 'navbar-expand-' + (toggleable === true ? 'sm' : toggleableToExpand[toggleable] || toggleable);\n};\n\nvar Navbar = function Navbar(props) {\n var _classNames;\n\n var toggleable = props.toggleable,\n expand = props.expand,\n className = props.className,\n cssModule = props.cssModule,\n light = props.light,\n dark = props.dark,\n inverse = props.inverse,\n fixed = props.fixed,\n sticky = props.sticky,\n color = props.color,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['toggleable', 'expand', 'className', 'cssModule', 'light', 'dark', 'inverse', 'fixed', 'sticky', 'color', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, 'navbar', getExpandClass(expand) || getToggleableClass(toggleable), (_classNames = {\n 'navbar-light': light,\n 'navbar-dark': inverse || dark\n }, defineProperty(_classNames, 'bg-' + color, color), defineProperty(_classNames, 'fixed-' + fixed, fixed), defineProperty(_classNames, 'sticky-' + sticky, sticky), _classNames)), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nNavbar.propTypes = propTypes$3;\nNavbar.defaultProps = defaultProps$3;\n\nvar propTypes$4 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n className: PropTypes.string,\n cssModule: PropTypes.object\n};\n\nvar defaultProps$4 = {\n tag: 'a'\n};\n\nvar NavbarBrand = function NavbarBrand(props) {\n var className = props.className,\n cssModule = props.cssModule,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, 'navbar-brand'), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nNavbarBrand.propTypes = propTypes$4;\nNavbarBrand.defaultProps = defaultProps$4;\n\nvar propTypes$5 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n type: PropTypes.string,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n children: PropTypes.node\n};\n\nvar defaultProps$5 = {\n tag: 'button',\n type: 'button'\n};\n\nvar NavbarToggler = function NavbarToggler(props) {\n var className = props.className,\n cssModule = props.cssModule,\n children = props.children,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'children', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, 'navbar-toggler'), cssModule);\n\n return React.createElement(\n Tag,\n _extends({}, attributes, { className: classes }),\n children || React.createElement('span', { className: mapToCssModules('navbar-toggler-icon', cssModule) })\n );\n};\n\nNavbarToggler.propTypes = propTypes$5;\nNavbarToggler.defaultProps = defaultProps$5;\n\nvar propTypes$6 = {\n tabs: PropTypes.bool,\n pills: PropTypes.bool,\n vertical: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n horizontal: PropTypes.string,\n justified: PropTypes.bool,\n fill: PropTypes.bool,\n navbar: PropTypes.bool,\n card: PropTypes.bool,\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n className: PropTypes.string,\n cssModule: PropTypes.object\n};\n\nvar defaultProps$6 = {\n tag: 'ul',\n vertical: false\n};\n\nvar getVerticalClass = function getVerticalClass(vertical) {\n if (vertical === false) {\n return false;\n } else if (vertical === true || vertical === 'xs') {\n return 'flex-column';\n }\n\n return 'flex-' + vertical + '-column';\n};\n\nvar Nav = function Nav(props) {\n var className = props.className,\n cssModule = props.cssModule,\n tabs = props.tabs,\n pills = props.pills,\n vertical = props.vertical,\n horizontal = props.horizontal,\n justified = props.justified,\n fill = props.fill,\n navbar = props.navbar,\n card = props.card,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'tabs', 'pills', 'vertical', 'horizontal', 'justified', 'fill', 'navbar', 'card', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, navbar ? 'navbar-nav' : 'nav', horizontal ? 'justify-content-' + horizontal : false, getVerticalClass(vertical), {\n 'nav-tabs': tabs,\n 'card-header-tabs': card && tabs,\n 'nav-pills': pills,\n 'card-header-pills': card && pills,\n 'nav-justified': justified,\n 'nav-fill': fill\n }), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nNav.propTypes = propTypes$6;\nNav.defaultProps = defaultProps$6;\n\nvar propTypes$7 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n active: PropTypes.bool,\n className: PropTypes.string,\n cssModule: PropTypes.object\n};\n\nvar defaultProps$7 = {\n tag: 'li'\n};\n\nvar NavItem = function NavItem(props) {\n var className = props.className,\n cssModule = props.cssModule,\n active = props.active,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'active', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, 'nav-item', active ? 'active' : false), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nNavItem.propTypes = propTypes$7;\nNavItem.defaultProps = defaultProps$7;\n\n/* eslint react/no-find-dom-node: 0 */\n// https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/no-find-dom-node.md\n\nvar propTypes$8 = {\n disabled: PropTypes.bool,\n dropup: deprecated(PropTypes.bool, 'Please use the prop \"direction\" with the value \"up\".'),\n direction: PropTypes.oneOf(['up', 'down', 'left', 'right']),\n group: PropTypes.bool,\n isOpen: PropTypes.bool,\n nav: PropTypes.bool,\n active: PropTypes.bool,\n addonType: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['prepend', 'append'])]),\n size: PropTypes.string,\n tag: PropTypes.string,\n toggle: PropTypes.func,\n children: PropTypes.node,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n inNavbar: PropTypes.bool,\n setActiveFromChild: PropTypes.bool\n};\n\nvar defaultProps$8 = {\n isOpen: false,\n direction: 'down',\n nav: false,\n active: false,\n addonType: false,\n inNavbar: false,\n setActiveFromChild: false\n};\n\nvar childContextTypes = {\n toggle: PropTypes.func.isRequired,\n isOpen: PropTypes.bool.isRequired,\n direction: PropTypes.oneOf(['up', 'down', 'left', 'right']).isRequired,\n inNavbar: PropTypes.bool.isRequired\n};\n\nvar Dropdown = function (_React$Component) {\n inherits(Dropdown, _React$Component);\n\n function Dropdown(props) {\n classCallCheck(this, Dropdown);\n\n var _this = possibleConstructorReturn(this, (Dropdown.__proto__ || Object.getPrototypeOf(Dropdown)).call(this, props));\n\n _this.addEvents = _this.addEvents.bind(_this);\n _this.handleDocumentClick = _this.handleDocumentClick.bind(_this);\n _this.handleKeyDown = _this.handleKeyDown.bind(_this);\n _this.removeEvents = _this.removeEvents.bind(_this);\n _this.toggle = _this.toggle.bind(_this);\n return _this;\n }\n\n createClass(Dropdown, [{\n key: 'getChildContext',\n value: function getChildContext() {\n return {\n toggle: this.props.toggle,\n isOpen: this.props.isOpen,\n direction: this.props.direction === 'down' && this.props.dropup ? 'up' : this.props.direction,\n inNavbar: this.props.inNavbar\n };\n }\n }, {\n key: 'componentDidMount',\n value: function componentDidMount() {\n this.handleProps();\n }\n }, {\n key: 'componentDidUpdate',\n value: function componentDidUpdate(prevProps) {\n if (this.props.isOpen !== prevProps.isOpen) {\n this.handleProps();\n }\n }\n }, {\n key: 'componentWillUnmount',\n value: function componentWillUnmount() {\n this.removeEvents();\n }\n }, {\n key: 'getContainer',\n value: function getContainer() {\n return ReactDOM.findDOMNode(this);\n }\n }, {\n key: 'addEvents',\n value: function addEvents() {\n var _this2 = this;\n\n ['click', 'touchstart', 'keyup'].forEach(function (event) {\n return document.addEventListener(event, _this2.handleDocumentClick, true);\n });\n }\n }, {\n key: 'removeEvents',\n value: function removeEvents() {\n var _this3 = this;\n\n ['click', 'touchstart', 'keyup'].forEach(function (event) {\n return document.removeEventListener(event, _this3.handleDocumentClick, true);\n });\n }\n }, {\n key: 'handleDocumentClick',\n value: function handleDocumentClick(e) {\n if (e && (e.which === 3 || e.type === 'keyup' && e.which !== keyCodes.tab)) return;\n var container = this.getContainer();\n\n if (container.contains(e.target) && container !== e.target && (e.type !== 'keyup' || e.which === keyCodes.tab)) {\n return;\n }\n\n this.toggle(e);\n }\n }, {\n key: 'handleKeyDown',\n value: function handleKeyDown(e) {\n if ([keyCodes.esc, keyCodes.up, keyCodes.down, keyCodes.space].indexOf(e.which) === -1 || /button/i.test(e.target.tagName) && e.which === keyCodes.space || /input|textarea/i.test(e.target.tagName)) {\n return;\n }\n\n e.preventDefault();\n if (this.props.disabled) return;\n\n var container = this.getContainer();\n\n if (e.which === keyCodes.space && this.props.isOpen && container !== e.target) {\n e.target.click();\n }\n\n if (e.which === keyCodes.esc || !this.props.isOpen) {\n this.toggle(e);\n container.querySelector('[aria-expanded]').focus();\n return;\n }\n\n var menuClass = mapToCssModules('dropdown-menu', this.props.cssModule);\n var itemClass = mapToCssModules('dropdown-item', this.props.cssModule);\n var disabledClass = mapToCssModules('disabled', this.props.cssModule);\n\n var items = container.querySelectorAll('.' + menuClass + ' .' + itemClass + ':not(.' + disabledClass + ')');\n\n if (!items.length) return;\n\n var index = -1;\n for (var i = 0; i < items.length; i += 1) {\n if (items[i] === e.target) {\n index = i;\n break;\n }\n }\n\n if (e.which === keyCodes.up && index > 0) {\n index -= 1;\n }\n\n if (e.which === keyCodes.down && index < items.length - 1) {\n index += 1;\n }\n\n if (index < 0) {\n index = 0;\n }\n\n items[index].focus();\n }\n }, {\n key: 'handleProps',\n value: function handleProps() {\n if (this.props.isOpen) {\n this.addEvents();\n } else {\n this.removeEvents();\n }\n }\n }, {\n key: 'toggle',\n value: function toggle(e) {\n if (this.props.disabled) {\n return e && e.preventDefault();\n }\n\n return this.props.toggle(e);\n }\n }, {\n key: 'render',\n value: function render() {\n var _classNames;\n\n var _omit = omit(this.props, ['toggle', 'disabled', 'inNavbar', 'direction']),\n className = _omit.className,\n cssModule = _omit.cssModule,\n dropup = _omit.dropup,\n isOpen = _omit.isOpen,\n group = _omit.group,\n size = _omit.size,\n nav = _omit.nav,\n setActiveFromChild = _omit.setActiveFromChild,\n active = _omit.active,\n addonType = _omit.addonType,\n attrs = objectWithoutProperties(_omit, ['className', 'cssModule', 'dropup', 'isOpen', 'group', 'size', 'nav', 'setActiveFromChild', 'active', 'addonType']);\n\n var direction = this.props.direction === 'down' && dropup ? 'up' : this.props.direction;\n\n attrs.tag = attrs.tag || (nav ? 'li' : 'div');\n\n var subItemIsActive = false;\n if (setActiveFromChild) {\n React.Children.map(this.props.children[1].props.children, function (dropdownItem) {\n if (dropdownItem.props.active) subItemIsActive = true;\n });\n }\n\n var classes = mapToCssModules(classNames(className, direction !== 'down' && 'drop' + direction, nav && active ? 'active' : false, setActiveFromChild && subItemIsActive ? 'active' : false, (_classNames = {}, defineProperty(_classNames, 'input-group-' + addonType, addonType), defineProperty(_classNames, 'btn-group', group), defineProperty(_classNames, 'btn-group-' + size, !!size), defineProperty(_classNames, 'dropdown', !group && !addonType), defineProperty(_classNames, 'show', isOpen), defineProperty(_classNames, 'nav-item', nav), _classNames)), cssModule);\n\n return React.createElement(Manager, _extends({}, attrs, { className: classes, onKeyDown: this.handleKeyDown }));\n }\n }]);\n return Dropdown;\n}(React.Component);\n\nDropdown.propTypes = propTypes$8;\nDropdown.defaultProps = defaultProps$8;\nDropdown.childContextTypes = childContextTypes;\n\nfunction NavDropdown(props) {\n warnOnce('The \"NavDropdown\" component has been deprecated.\\nPlease use component \"Dropdown\" with nav prop.');\n return React.createElement(Dropdown, _extends({ nav: true }, props));\n}\n\nvar propTypes$9 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\n disabled: PropTypes.bool,\n active: PropTypes.bool,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n onClick: PropTypes.func,\n href: PropTypes.any\n};\n\nvar defaultProps$9 = {\n tag: 'a'\n};\n\nvar NavLink = function (_React$Component) {\n inherits(NavLink, _React$Component);\n\n function NavLink(props) {\n classCallCheck(this, NavLink);\n\n var _this = possibleConstructorReturn(this, (NavLink.__proto__ || Object.getPrototypeOf(NavLink)).call(this, props));\n\n _this.onClick = _this.onClick.bind(_this);\n return _this;\n }\n\n createClass(NavLink, [{\n key: 'onClick',\n value: function onClick(e) {\n if (this.props.disabled) {\n e.preventDefault();\n return;\n }\n\n if (this.props.href === '#') {\n e.preventDefault();\n }\n\n if (this.props.onClick) {\n this.props.onClick(e);\n }\n }\n }, {\n key: 'render',\n value: function render() {\n var _props = this.props,\n className = _props.className,\n cssModule = _props.cssModule,\n active = _props.active,\n Tag = _props.tag,\n innerRef = _props.innerRef,\n attributes = objectWithoutProperties(_props, ['className', 'cssModule', 'active', 'tag', 'innerRef']);\n\n\n var classes = mapToCssModules(classNames(className, 'nav-link', {\n disabled: attributes.disabled,\n active: active\n }), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { ref: innerRef, onClick: this.onClick, className: classes }));\n }\n }]);\n return NavLink;\n}(React.Component);\n\nNavLink.propTypes = propTypes$9;\nNavLink.defaultProps = defaultProps$9;\n\nvar propTypes$10 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n listTag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n className: PropTypes.string,\n listClassName: PropTypes.string,\n cssModule: PropTypes.object,\n children: PropTypes.node,\n 'aria-label': PropTypes.string\n};\n\nvar defaultProps$10 = {\n tag: 'nav',\n listTag: 'ol',\n 'aria-label': 'breadcrumb'\n};\n\nvar Breadcrumb = function Breadcrumb(props) {\n var className = props.className,\n listClassName = props.listClassName,\n cssModule = props.cssModule,\n children = props.children,\n Tag = props.tag,\n ListTag = props.listTag,\n label = props['aria-label'],\n attributes = objectWithoutProperties(props, ['className', 'listClassName', 'cssModule', 'children', 'tag', 'listTag', 'aria-label']);\n\n\n var classes = mapToCssModules(classNames(className), cssModule);\n\n var listClasses = mapToCssModules(classNames('breadcrumb', listClassName), cssModule);\n\n return React.createElement(\n Tag,\n _extends({}, attributes, { className: classes, 'aria-label': label }),\n React.createElement(\n ListTag,\n { className: listClasses },\n children\n )\n );\n};\n\nBreadcrumb.propTypes = propTypes$10;\nBreadcrumb.defaultProps = defaultProps$10;\n\nvar propTypes$11 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n active: PropTypes.bool,\n className: PropTypes.string,\n cssModule: PropTypes.object\n};\n\nvar defaultProps$11 = {\n tag: 'li'\n};\n\nvar BreadcrumbItem = function BreadcrumbItem(props) {\n var className = props.className,\n cssModule = props.cssModule,\n active = props.active,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'active', 'tag']);\n\n var classes = mapToCssModules(classNames(className, active ? 'active' : false, 'breadcrumb-item'), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes, 'aria-current': active ? 'page' : undefined }));\n};\n\nBreadcrumbItem.propTypes = propTypes$11;\nBreadcrumbItem.defaultProps = defaultProps$11;\n\nvar propTypes$12 = {\n active: PropTypes.bool,\n block: PropTypes.bool,\n color: PropTypes.string,\n disabled: PropTypes.bool,\n outline: PropTypes.bool,\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\n onClick: PropTypes.func,\n size: PropTypes.string,\n children: PropTypes.node,\n className: PropTypes.string,\n cssModule: PropTypes.object\n};\n\nvar defaultProps$12 = {\n color: 'secondary',\n tag: 'button'\n};\n\nvar Button = function (_React$Component) {\n inherits(Button, _React$Component);\n\n function Button(props) {\n classCallCheck(this, Button);\n\n var _this = possibleConstructorReturn(this, (Button.__proto__ || Object.getPrototypeOf(Button)).call(this, props));\n\n _this.onClick = _this.onClick.bind(_this);\n return _this;\n }\n\n createClass(Button, [{\n key: 'onClick',\n value: function onClick(e) {\n if (this.props.disabled) {\n e.preventDefault();\n return;\n }\n\n if (this.props.onClick) {\n this.props.onClick(e);\n }\n }\n }, {\n key: 'render',\n value: function render() {\n var _props = this.props,\n active = _props.active,\n block = _props.block,\n className = _props.className,\n cssModule = _props.cssModule,\n color = _props.color,\n outline = _props.outline,\n size = _props.size,\n Tag = _props.tag,\n innerRef = _props.innerRef,\n attributes = objectWithoutProperties(_props, ['active', 'block', 'className', 'cssModule', 'color', 'outline', 'size', 'tag', 'innerRef']);\n\n\n var classes = mapToCssModules(classNames(className, 'btn', 'btn' + (outline ? '-outline' : '') + '-' + color, size ? 'btn-' + size : false, block ? 'btn-block' : false, { active: active, disabled: this.props.disabled }), cssModule);\n\n if (attributes.href && Tag === 'button') {\n Tag = 'a';\n }\n\n return React.createElement(Tag, _extends({\n type: Tag === 'button' && attributes.onClick ? 'button' : undefined\n }, attributes, {\n className: classes,\n ref: innerRef,\n onClick: this.onClick\n }));\n }\n }]);\n return Button;\n}(React.Component);\n\nButton.propTypes = propTypes$12;\nButton.defaultProps = defaultProps$12;\n\nvar propTypes$13 = {\n children: PropTypes.node\n};\n\nvar ButtonDropdown = function ButtonDropdown(props) {\n return React.createElement(Dropdown, _extends({ group: true }, props));\n};\n\nButtonDropdown.propTypes = propTypes$13;\n\nvar propTypes$14 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n 'aria-label': PropTypes.string,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n role: PropTypes.string,\n size: PropTypes.string,\n vertical: PropTypes.bool\n};\n\nvar defaultProps$13 = {\n tag: 'div',\n role: 'group'\n};\n\nvar ButtonGroup = function ButtonGroup(props) {\n var className = props.className,\n cssModule = props.cssModule,\n size = props.size,\n vertical = props.vertical,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'size', 'vertical', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, size ? 'btn-group-' + size : false, vertical ? 'btn-group-vertical' : 'btn-group'), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nButtonGroup.propTypes = propTypes$14;\nButtonGroup.defaultProps = defaultProps$13;\n\nvar propTypes$15 = {\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n 'aria-label': PropTypes.string,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n role: PropTypes.string\n};\n\nvar defaultProps$14 = {\n tag: 'div',\n role: 'toolbar'\n};\n\nvar ButtonToolbar = function ButtonToolbar(props) {\n var className = props.className,\n cssModule = props.cssModule,\n Tag = props.tag,\n attributes = objectWithoutProperties(props, ['className', 'cssModule', 'tag']);\n\n\n var classes = mapToCssModules(classNames(className, 'btn-toolbar'), cssModule);\n\n return React.createElement(Tag, _extends({}, attributes, { className: classes }));\n};\n\nButtonToolbar.propTypes = propTypes$15;\nButtonToolbar.defaultProps = defaultProps$14;\n\nvar propTypes$16 = {\n children: PropTypes.node,\n active: PropTypes.bool,\n disabled: PropTypes.bool,\n divider: PropTypes.bool,\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n header: PropTypes.bool,\n onClick: PropTypes.func,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n toggle: PropTypes.bool\n};\n\nvar contextTypes = {\n toggle: PropTypes.func\n};\n\nvar defaultProps$15 = {\n tag: 'button',\n toggle: true\n};\n\nvar DropdownItem = function (_React$Component) {\n inherits(DropdownItem, _React$Component);\n\n function DropdownItem(props) {\n classCallCheck(this, DropdownItem);\n\n var _this = possibleConstructorReturn(this, (DropdownItem.__proto__ || Object.getPrototypeOf(DropdownItem)).call(this, props));\n\n _this.onClick = _this.onClick.bind(_this);\n _this.getTabIndex = _this.getTabIndex.bind(_this);\n return _this;\n }\n\n createClass(DropdownItem, [{\n key: 'onClick',\n value: function onClick(e) {\n if (this.props.disabled || this.props.header || this.props.divider) {\n e.preventDefault();\n return;\n }\n\n if (this.props.onClick) {\n this.props.onClick(e);\n }\n\n if (this.props.toggle) {\n this.context.toggle(e);\n }\n }\n }, {\n key: 'getTabIndex',\n value: function getTabIndex() {\n if (this.props.disabled || this.props.header || this.props.divider) {\n return '-1';\n }\n\n return '0';\n }\n }, {\n key: 'render',\n value: function render() {\n var tabIndex = this.getTabIndex();\n\n var _omit = omit(this.props, ['toggle']),\n className = _omit.className,\n cssModule = _omit.cssModule,\n divider = _omit.divider,\n Tag = _omit.tag,\n header = _omit.header,\n active = _omit.active,\n props = objectWithoutProperties(_omit, ['className', 'cssModule', 'divider', 'tag', 'header', 'active']);\n\n var classes = mapToCssModules(classNames(className, {\n disabled: props.disabled,\n 'dropdown-item': !divider && !header,\n active: active,\n 'dropdown-header': header,\n 'dropdown-divider': divider\n }), cssModule);\n\n if (Tag === 'button') {\n if (header) {\n Tag = 'h6';\n } else if (divider) {\n Tag = 'div';\n } else if (props.href) {\n Tag = 'a';\n }\n }\n\n return React.createElement(Tag, _extends({\n type: Tag === 'button' && (props.onClick || this.props.toggle) ? 'button' : undefined\n }, props, {\n tabIndex: tabIndex,\n className: classes,\n onClick: this.onClick\n }));\n }\n }]);\n return DropdownItem;\n}(React.Component);\n\nDropdownItem.propTypes = propTypes$16;\nDropdownItem.defaultProps = defaultProps$15;\nDropdownItem.contextTypes = contextTypes;\n\nvar propTypes$17 = {\n tag: PropTypes.string,\n children: PropTypes.node.isRequired,\n right: PropTypes.bool,\n flip: PropTypes.bool,\n modifiers: PropTypes.object,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n persist: PropTypes.bool\n};\n\nvar defaultProps$16 = {\n tag: 'div',\n flip: true\n};\n\nvar contextTypes$1 = {\n isOpen: PropTypes.bool.isRequired,\n direction: PropTypes.oneOf(['up', 'down', 'left', 'right']).isRequired,\n inNavbar: PropTypes.bool.isRequired\n};\n\nvar noFlipModifier = { flip: { enabled: false } };\n\nvar directionPositionMap = {\n up: 'top',\n left: 'left',\n right: 'right',\n down: 'bottom'\n};\n\nvar DropdownMenu = function DropdownMenu(props, context) {\n var className = props.className,\n cssModule = props.cssModule,\n right = props.right,\n tag = props.tag,\n flip = props.flip,\n modifiers = props.modifiers,\n persist = props.persist,\n attrs = objectWithoutProperties(props, ['className', 'cssModule', 'right', 'tag', 'flip', 'modifiers', 'persist']);\n\n var classes = mapToCssModules(classNames(className, 'dropdown-menu', {\n 'dropdown-menu-right': right,\n show: context.isOpen\n }), cssModule);\n\n var Tag = tag;\n\n if (persist || context.isOpen && !context.inNavbar) {\n Tag = Popper;\n\n var position1 = directionPositionMap[context.direction] || 'bottom';\n var position2 = right ? 'end' : 'start';\n attrs.placement = position1 + '-' + position2;\n attrs.component = tag;\n attrs.modifiers = !flip ? _extends({}, modifiers, noFlipModifier) : modifiers;\n }\n\n return React.createElement(Tag, _extends({\n tabIndex: '-1',\n role: 'menu'\n }, attrs, {\n 'aria-hidden': !context.isOpen,\n className: classes,\n 'x-placement': attrs.placement\n }));\n};\n\nDropdownMenu.propTypes = propTypes$17;\nDropdownMenu.defaultProps = defaultProps$16;\nDropdownMenu.contextTypes = contextTypes$1;\n\nvar propTypes$18 = {\n caret: PropTypes.bool,\n color: PropTypes.string,\n children: PropTypes.node,\n className: PropTypes.string,\n cssModule: PropTypes.object,\n disabled: PropTypes.bool,\n onClick: PropTypes.func,\n 'aria-haspopup': PropTypes.bool,\n split: PropTypes.bool,\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n nav: PropTypes.bool\n};\n\nvar defaultProps$17 = {\n 'aria-haspopup': true,\n color: 'secondary'\n};\n\nvar contextTypes$2 = {\n isOpen: PropTypes.bool.isRequired,\n toggle: PropTypes.func.isRequired,\n inNavbar: PropTypes.bool.isRequired\n};\n\nvar DropdownToggle = function (_React$Component) {\n inherits(DropdownToggle, _React$Component);\n\n function DropdownToggle(props) {\n classCallCheck(this, DropdownToggle);\n\n var _this = possibleConstructorReturn(this, (DropdownToggle.__proto__ || Object.getPrototypeOf(DropdownToggle)).call(this, props));\n\n _this.onClick = _this.onClick.bind(_this);\n return _this;\n }\n\n createClass(DropdownToggle, [{\n key: 'onClick',\n value: function onClick(e) {\n if (this.props.disabled) {\n e.preventDefault();\n return;\n }\n\n if (this.props.nav && !this.props.tag) {\n e.preventDefault();\n }\n\n if (this.props.onClick) {\n this.props.onClick(e);\n }\n\n this.context.toggle(e);\n }\n }, {\n key: 'render',\n value: function render() {\n var _props = this.props,\n className = _props.className,\n color = _props.color,\n cssModule = _props.cssModule,\n caret = _props.caret,\n split = _props.split,\n nav = _props.nav,\n tag = _props.tag,\n props = objectWithoutProperties(_props, ['className', 'color', 'cssModule', 'caret', 'split', 'nav', 'tag']);\n\n var ariaLabel = props['aria-label'] || 'Toggle Dropdown';\n var classes = mapToCssModules(classNames(className, {\n 'dropdown-toggle': caret || split,\n 'dropdown-toggle-split': split,\n 'nav-link': nav\n }), cssModule);\n var children = props.children || React.createElement(\n 'span',\n { className: 'sr-only' },\n ariaLabel\n );\n\n var Tag = void 0;\n\n if (nav && !tag) {\n Tag = 'a';\n props.href = '#';\n } else if (!tag) {\n Tag = Button;\n props.color = color;\n props.cssModule = cssModule;\n } else {\n Tag = tag;\n }\n\n if (this.context.inNavbar) {\n return React.createElement(Tag, _extends({}, props, {\n className: classes,\n onClick: this.onClick,\n 'aria-expanded': this.context.isOpen,\n children: children\n }));\n }\n\n return React.createElement(Target, _extends({}, props, {\n className: classes,\n component: Tag,\n onClick: this.onClick,\n 'aria-expanded': this.context.isOpen,\n children: children\n }));\n }\n }]);\n return DropdownToggle;\n}(React.Component);\n\nDropdownToggle.propTypes = propTypes$18;\nDropdownToggle.defaultProps = defaultProps$17;\nDropdownToggle.contextTypes = contextTypes$2;\n\nfunction unwrapExports (x) {\n\treturn x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;\n}\n\nfunction createCommonjsModule(fn, module) {\n\treturn module = { exports: {} }, fn(module, module.exports), module.exports;\n}\n\nvar PropTypes$1 = createCommonjsModule(function (module, exports) {\n 'use strict';\n\n exports.__esModule = true;\n exports.classNamesShape = exports.timeoutsShape = undefined;\n exports.transitionTimeout = transitionTimeout;\n\n var _propTypes2 = _interopRequireDefault(PropTypes);\n\n function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : { default: obj };\n }\n\n function transitionTimeout(transitionType) {\n var timeoutPropName = 'transition' + transitionType + 'Timeout';\n var enabledPropName = 'transition' + transitionType;\n\n return function (props) {\n // If the transition is enabled\n if (props[enabledPropName]) {\n // If no timeout duration is provided\n if (props[timeoutPropName] == null) {\n return new Error(timeoutPropName + ' wasn\\'t supplied to CSSTransitionGroup: ' + 'this can cause unreliable animations and won\\'t be supported in ' + 'a future version of React. See ' + 'https://fb.me/react-animation-transition-group-timeout for more ' + 'information.');\n\n // If the duration isn't a number\n } else if (typeof props[timeoutPropName] !== 'number') {\n return new Error(timeoutPropName + ' must be a number (in milliseconds)');\n }\n }\n\n return null;\n };\n }\n\n var timeoutsShape = exports.timeoutsShape = _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.shape({\n enter: _propTypes2.default.number,\n exit: _propTypes2.default.number\n }).isRequired]);\n\n var classNamesShape = exports.classNamesShape = _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.shape({\n enter: _propTypes2.default.string,\n exit: _propTypes2.default.string,\n active: _propTypes2.default.string\n }), _propTypes2.default.shape({\n enter: _propTypes2.default.string,\n enterDone: _propTypes2.default.string,\n enterActive: _propTypes2.default.string,\n exit: _propTypes2.default.string,\n exitDone: _propTypes2.default.string,\n exitActive: _propTypes2.default.string\n })]);\n});\n\nunwrapExports(PropTypes$1);\n\nvar Transition_1 = createCommonjsModule(function (module, exports) {\n 'use strict';\n\n exports.__esModule = true;\n exports.EXITING = exports.ENTERED = exports.ENTERING = exports.EXITED = exports.UNMOUNTED = undefined;\n\n var PropTypes$$1 = _interopRequireWildcard(PropTypes);\n\n var _react2 = _interopRequireDefault(React);\n\n var _reactDom2 = _interopRequireDefault(ReactDOM);\n\n function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : { default: obj };\n }\n\n function _interopRequireWildcard(obj) {\n if (obj && obj.__esModule) {\n return obj;\n } else {\n var newObj = {};if (obj != null) {\n for (var key in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key];\n }\n }newObj.default = obj;return newObj;\n }\n }\n\n function _objectWithoutProperties(obj, keys) {\n var target = {};for (var i in obj) {\n if (keys.indexOf(i) >= 0) continue;if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;target[i] = obj[i];\n }return target;\n }\n\n function _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n }\n\n function _possibleConstructorReturn(self, call) {\n if (!self) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }return call && ((typeof call === 'undefined' ? 'undefined' : _typeof(call)) === \"object\" || typeof call === \"function\") ? call : self;\n }\n\n function _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function, not \" + (typeof superClass === 'undefined' ? 'undefined' : _typeof(superClass)));\n }subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;\n }\n\n var UNMOUNTED = exports.UNMOUNTED = 'unmounted';\n var EXITED = exports.EXITED = 'exited';\n var ENTERING = exports.ENTERING = 'entering';\n var ENTERED = exports.ENTERED = 'entered';\n var EXITING = exports.EXITING = 'exiting';\n\n /**\n * The Transition component lets you describe a transition from one component\n * state to another _over time_ with a simple declarative API. Most commonly\n * it's used to animate the mounting and unmounting of a component, but can also\n * be used to describe in-place transition states as well.\n *\n * By default the `Transition` component does not alter the behavior of the\n * component it renders, it only tracks \"enter\" and \"exit\" states for the components.\n * It's up to you to give meaning and effect to those states. For example we can\n * add styles to a component when it enters or exits:\n *\n * ```jsx\n * import Transition from 'react-transition-group/Transition';\n *\n * const duration = 300;\n *\n * const defaultStyle = {\n * transition: `opacity ${duration}ms ease-in-out`,\n * opacity: 0,\n * }\n *\n * const transitionStyles = {\n * entering: { opacity: 0 },\n * entered: { opacity: 1 },\n * };\n *\n * const Fade = ({ in: inProp }) => (\n * \n * I'm a fade Transition!\n *
\n * )}\n * \n *
\n * );\n * }\n * ```\n *\n * When the button is clicked the component will shift to the `'entering'` state and\n * stay there for 500ms (the value of `timeout`) before it finally switches to `'entered'`.\n *\n * When `in` is `false` the same thing happens except the state moves from `'exiting'` to `'exited'`.\n *\n * ## Timing\n *\n * Timing is often the trickiest part of animation, mistakes can result in slight delays\n * that are hard to pin down. A common example is when you want to add an exit transition,\n * you should set the desired final styles when the state is `'exiting'`. That's when the\n * transition to those styles will start and, if you matched the `timeout` prop with the\n * CSS Transition duration, it will end exactly when the state changes to `'exited'`.\n *\n * > **Note**: For simpler transitions the `Transition` component might be enough, but\n * > take into account that it's platform-agnostic, while the `CSSTransition` component\n * > [forces reflows](https://github.com/reactjs/react-transition-group/blob/5007303e729a74be66a21c3e2205e4916821524b/src/CSSTransition.js#L208-L215)\n * > in order to make more complex transitions more predictable. For example, even though\n * > classes `example-enter` and `example-enter-active` are applied immediately one after\n * > another, you can still transition from one to the other because of the forced reflow\n * > (read [this issue](https://github.com/reactjs/react-transition-group/issues/159#issuecomment-322761171)\n * > for more info). Take this into account when choosing between `Transition` and\n * > `CSSTransition`.\n *\n * ## Example\n *\n * \n *\n */\n\n var Transition = function (_React$Component) {\n _inherits(Transition, _React$Component);\n\n function Transition(props, context) {\n _classCallCheck(this, Transition);\n\n var _this = _possibleConstructorReturn(this, _React$Component.call(this, props, context));\n\n var parentGroup = context.transitionGroup;\n // In the context of a TransitionGroup all enters are really appears\n var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;\n\n var initialStatus = void 0;\n _this.nextStatus = null;\n\n if (props.in) {\n if (appear) {\n initialStatus = EXITED;\n _this.nextStatus = ENTERING;\n } else {\n initialStatus = ENTERED;\n }\n } else {\n if (props.unmountOnExit || props.mountOnEnter) {\n initialStatus = UNMOUNTED;\n } else {\n initialStatus = EXITED;\n }\n }\n\n _this.state = { status: initialStatus };\n\n _this.nextCallback = null;\n return _this;\n }\n\n Transition.prototype.getChildContext = function getChildContext() {\n return { transitionGroup: null }; // allows for nested Transitions\n };\n\n Transition.prototype.componentDidMount = function componentDidMount() {\n this.updateStatus(true);\n };\n\n Transition.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {\n var _ref = this.pendingState || this.state,\n status = _ref.status;\n\n if (nextProps.in) {\n if (status === UNMOUNTED) {\n this.setState({ status: EXITED });\n }\n if (status !== ENTERING && status !== ENTERED) {\n this.nextStatus = ENTERING;\n }\n } else {\n if (status === ENTERING || status === ENTERED) {\n this.nextStatus = EXITING;\n }\n }\n };\n\n Transition.prototype.componentDidUpdate = function componentDidUpdate() {\n this.updateStatus();\n };\n\n Transition.prototype.componentWillUnmount = function componentWillUnmount() {\n this.cancelNextCallback();\n };\n\n Transition.prototype.getTimeouts = function getTimeouts() {\n var timeout = this.props.timeout;\n\n var exit = void 0,\n enter = void 0,\n appear = void 0;\n\n exit = enter = appear = timeout;\n\n if (timeout != null && typeof timeout !== 'number') {\n exit = timeout.exit;\n enter = timeout.enter;\n appear = timeout.appear;\n }\n return { exit: exit, enter: enter, appear: appear };\n };\n\n Transition.prototype.updateStatus = function updateStatus() {\n var mounting = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n\n var nextStatus = this.nextStatus;\n\n if (nextStatus !== null) {\n this.nextStatus = null;\n // nextStatus will always be ENTERING or EXITING.\n this.cancelNextCallback();\n var node = _reactDom2.default.findDOMNode(this);\n\n if (nextStatus === ENTERING) {\n this.performEnter(node, mounting);\n } else {\n this.performExit(node);\n }\n } else if (this.props.unmountOnExit && this.state.status === EXITED) {\n this.setState({ status: UNMOUNTED });\n }\n };\n\n Transition.prototype.performEnter = function performEnter(node, mounting) {\n var _this2 = this;\n\n var enter = this.props.enter;\n\n var appearing = this.context.transitionGroup ? this.context.transitionGroup.isMounting : mounting;\n\n var timeouts = this.getTimeouts();\n\n // no enter animation skip right to ENTERED\n // if we are mounting and running this it means appear _must_ be set\n if (!mounting && !enter) {\n this.safeSetState({ status: ENTERED }, function () {\n _this2.props.onEntered(node);\n });\n return;\n }\n\n this.props.onEnter(node, appearing);\n\n this.safeSetState({ status: ENTERING }, function () {\n _this2.props.onEntering(node, appearing);\n\n // FIXME: appear timeout?\n _this2.onTransitionEnd(node, timeouts.enter, function () {\n _this2.safeSetState({ status: ENTERED }, function () {\n _this2.props.onEntered(node, appearing);\n });\n });\n });\n };\n\n Transition.prototype.performExit = function performExit(node) {\n var _this3 = this;\n\n var exit = this.props.exit;\n\n var timeouts = this.getTimeouts();\n\n // no exit animation skip right to EXITED\n if (!exit) {\n this.safeSetState({ status: EXITED }, function () {\n _this3.props.onExited(node);\n });\n return;\n }\n this.props.onExit(node);\n\n this.safeSetState({ status: EXITING }, function () {\n _this3.props.onExiting(node);\n\n _this3.onTransitionEnd(node, timeouts.exit, function () {\n _this3.safeSetState({ status: EXITED }, function () {\n _this3.props.onExited(node);\n });\n });\n });\n };\n\n Transition.prototype.cancelNextCallback = function cancelNextCallback() {\n if (this.nextCallback !== null) {\n this.nextCallback.cancel();\n this.nextCallback = null;\n }\n };\n\n Transition.prototype.safeSetState = function safeSetState(nextState, callback) {\n var _this4 = this;\n\n // We need to track pending updates for instances where a cWRP fires quickly\n // after cDM and before the state flushes, which would double trigger a\n // transition\n this.pendingState = nextState;\n\n // This shouldn't be necessary, but there are weird race conditions with\n // setState callbacks and unmounting in testing, so always make sure that\n // we can cancel any pending setState callbacks after we unmount.\n callback = this.setNextCallback(callback);\n this.setState(nextState, function () {\n _this4.pendingState = null;\n callback();\n });\n };\n\n Transition.prototype.setNextCallback = function setNextCallback(callback) {\n var _this5 = this;\n\n var active = true;\n\n this.nextCallback = function (event) {\n if (active) {\n active = false;\n _this5.nextCallback = null;\n\n callback(event);\n }\n };\n\n this.nextCallback.cancel = function () {\n active = false;\n };\n\n return this.nextCallback;\n };\n\n Transition.prototype.onTransitionEnd = function onTransitionEnd(node, timeout, handler) {\n this.setNextCallback(handler);\n\n if (node) {\n if (this.props.addEndListener) {\n this.props.addEndListener(node, this.nextCallback);\n }\n if (timeout != null) {\n setTimeout(this.nextCallback, timeout);\n }\n } else {\n setTimeout(this.nextCallback, 0);\n }\n };\n\n Transition.prototype.render = function render() {\n var status = this.state.status;\n if (status === UNMOUNTED) {\n return null;\n }\n\n var _props = this.props,\n children = _props.children,\n childProps = _objectWithoutProperties(_props, ['children']);\n // filter props for Transtition\n\n\n delete childProps.in;\n delete childProps.mountOnEnter;\n delete childProps.unmountOnExit;\n delete childProps.appear;\n delete childProps.enter;\n delete childProps.exit;\n delete childProps.timeout;\n delete childProps.addEndListener;\n delete childProps.onEnter;\n delete childProps.onEntering;\n delete childProps.onEntered;\n delete childProps.onExit;\n delete childProps.onExiting;\n delete childProps.onExited;\n\n if (typeof children === 'function') {\n return children(status, childProps);\n }\n\n var child = _react2.default.Children.only(children);\n return _react2.default.cloneElement(child, childProps);\n };\n\n return Transition;\n }(_react2.default.Component);\n\n Transition.contextTypes = {\n transitionGroup: PropTypes$$1.object\n };\n Transition.childContextTypes = {\n transitionGroup: function transitionGroup() {}\n };\n\n Transition.propTypes = process.env.NODE_ENV !== \"production\" ? {\n /**\n * A `function` child can be used instead of a React element.\n * This function is called with the current transition status\n * ('entering', 'entered', 'exiting', 'exited', 'unmounted'), which can be used\n * to apply context specific props to a component.\n *\n * ```jsx\n * \n * Prefer `scheduleUpdate` over `update` because of performance reasons.\n * @method\n * @memberof Popper\n */\nfunction update() {\n // if popper is destroyed, don't perform any further update\n if (this.state.isDestroyed) {\n return;\n }\n\n var data = {\n instance: this,\n styles: {},\n arrowStyles: {},\n attributes: {},\n flipped: false,\n offsets: {}\n };\n\n // compute reference element offsets\n data.offsets.reference = getReferenceOffsets(this.state, this.popper, this.reference, this.options.positionFixed);\n\n // compute auto placement, store placement inside the data object,\n // modifiers will be able to edit `placement` if needed\n // and refer to originalPlacement to know the original value\n data.placement = computeAutoPlacement(this.options.placement, data.offsets.reference, this.popper, this.reference, this.options.modifiers.flip.boundariesElement, this.options.modifiers.flip.padding);\n\n // store the computed placement inside `originalPlacement`\n data.originalPlacement = data.placement;\n\n data.positionFixed = this.options.positionFixed;\n\n // compute the popper offsets\n data.offsets.popper = getPopperOffsets(this.popper, data.offsets.reference, data.placement);\n\n data.offsets.popper.position = this.options.positionFixed ? 'fixed' : 'absolute';\n\n // run the modifiers\n data = runModifiers(this.modifiers, data);\n\n // the first `update` will call `onCreate` callback\n // the other ones will call `onUpdate` callback\n if (!this.state.isCreated) {\n this.state.isCreated = true;\n this.options.onCreate(data);\n } else {\n this.options.onUpdate(data);\n }\n}\n\n/**\n * Helper used to know if the given modifier is enabled.\n * @method\n * @memberof Popper.Utils\n * @returns {Boolean}\n */\nfunction isModifierEnabled(modifiers, modifierName) {\n return modifiers.some(function (_ref) {\n var name = _ref.name,\n enabled = _ref.enabled;\n return enabled && name === modifierName;\n });\n}\n\n/**\n * Get the prefixed supported property name\n * @method\n * @memberof Popper.Utils\n * @argument {String} property (camelCase)\n * @returns {String} prefixed property (camelCase or PascalCase, depending on the vendor prefix)\n */\nfunction getSupportedPropertyName(property) {\n var prefixes = [false, 'ms', 'Webkit', 'Moz', 'O'];\n var upperProp = property.charAt(0).toUpperCase() + property.slice(1);\n\n for (var i = 0; i < prefixes.length; i++) {\n var prefix = prefixes[i];\n var toCheck = prefix ? '' + prefix + upperProp : property;\n if (typeof document.body.style[toCheck] !== 'undefined') {\n return toCheck;\n }\n }\n return null;\n}\n\n/**\n * Destroy the popper\n * @method\n * @memberof Popper\n */\nfunction destroy() {\n this.state.isDestroyed = true;\n\n // touch DOM only if `applyStyle` modifier is enabled\n if (isModifierEnabled(this.modifiers, 'applyStyle')) {\n this.popper.removeAttribute('x-placement');\n this.popper.style.position = '';\n this.popper.style.top = '';\n this.popper.style.left = '';\n this.popper.style.right = '';\n this.popper.style.bottom = '';\n this.popper.style.willChange = '';\n this.popper.style[getSupportedPropertyName('transform')] = '';\n }\n\n this.disableEventListeners();\n\n // remove the popper if user explicity asked for the deletion on destroy\n // do not use `remove` because IE11 doesn't support it\n if (this.options.removeOnDestroy) {\n this.popper.parentNode.removeChild(this.popper);\n }\n return this;\n}\n\n/**\n * Get the window associated with the element\n * @argument {Element} element\n * @returns {Window}\n */\nfunction getWindow(element) {\n var ownerDocument = element.ownerDocument;\n return ownerDocument ? ownerDocument.defaultView : window;\n}\n\nfunction attachToScrollParents(scrollParent, event, callback, scrollParents) {\n var isBody = scrollParent.nodeName === 'BODY';\n var target = isBody ? scrollParent.ownerDocument.defaultView : scrollParent;\n target.addEventListener(event, callback, { passive: true });\n\n if (!isBody) {\n attachToScrollParents(getScrollParent(target.parentNode), event, callback, scrollParents);\n }\n scrollParents.push(target);\n}\n\n/**\n * Setup needed event listeners used to update the popper position\n * @method\n * @memberof Popper.Utils\n * @private\n */\nfunction setupEventListeners(reference, options, state, updateBound) {\n // Resize event listener on window\n state.updateBound = updateBound;\n getWindow(reference).addEventListener('resize', state.updateBound, { passive: true });\n\n // Scroll event listener on scroll parents\n var scrollElement = getScrollParent(reference);\n attachToScrollParents(scrollElement, 'scroll', state.updateBound, state.scrollParents);\n state.scrollElement = scrollElement;\n state.eventsEnabled = true;\n\n return state;\n}\n\n/**\n * It will add resize/scroll events and start recalculating\n * position of the popper element when they are triggered.\n * @method\n * @memberof Popper\n */\nfunction enableEventListeners() {\n if (!this.state.eventsEnabled) {\n this.state = setupEventListeners(this.reference, this.options, this.state, this.scheduleUpdate);\n }\n}\n\n/**\n * Remove event listeners used to update the popper position\n * @method\n * @memberof Popper.Utils\n * @private\n */\nfunction removeEventListeners(reference, state) {\n // Remove resize event listener on window\n getWindow(reference).removeEventListener('resize', state.updateBound);\n\n // Remove scroll event listener on scroll parents\n state.scrollParents.forEach(function (target) {\n target.removeEventListener('scroll', state.updateBound);\n });\n\n // Reset state\n state.updateBound = null;\n state.scrollParents = [];\n state.scrollElement = null;\n state.eventsEnabled = false;\n return state;\n}\n\n/**\n * It will remove resize/scroll events and won't recalculate popper position\n * when they are triggered. It also won't trigger onUpdate callback anymore,\n * unless you call `update` method manually.\n * @method\n * @memberof Popper\n */\nfunction disableEventListeners() {\n if (this.state.eventsEnabled) {\n cancelAnimationFrame(this.scheduleUpdate);\n this.state = removeEventListeners(this.reference, this.state);\n }\n}\n\n/**\n * Tells if a given input is a number\n * @method\n * @memberof Popper.Utils\n * @param {*} input to check\n * @return {Boolean}\n */\nfunction isNumeric(n) {\n return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);\n}\n\n/**\n * Set the style to the given popper\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element - Element to apply the style to\n * @argument {Object} styles\n * Object with a list of properties and values which will be applied to the element\n */\nfunction setStyles(element, styles) {\n Object.keys(styles).forEach(function (prop) {\n var unit = '';\n // add unit if the value is numeric and is one of the following\n if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && isNumeric(styles[prop])) {\n unit = 'px';\n }\n element.style[prop] = styles[prop] + unit;\n });\n}\n\n/**\n * Set the attributes to the given popper\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element - Element to apply the attributes to\n * @argument {Object} styles\n * Object with a list of properties and values which will be applied to the element\n */\nfunction setAttributes(element, attributes) {\n Object.keys(attributes).forEach(function (prop) {\n var value = attributes[prop];\n if (value !== false) {\n element.setAttribute(prop, attributes[prop]);\n } else {\n element.removeAttribute(prop);\n }\n });\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} data.styles - List of style properties - values to apply to popper element\n * @argument {Object} data.attributes - List of attribute properties - values to apply to popper element\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The same data object\n */\nfunction applyStyle(data) {\n // any property present in `data.styles` will be applied to the popper,\n // in this way we can make the 3rd party modifiers add custom styles to it\n // Be aware, modifiers could override the properties defined in the previous\n // lines of this modifier!\n setStyles(data.instance.popper, data.styles);\n\n // any property present in `data.attributes` will be applied to the popper,\n // they will be set as HTML attributes of the element\n setAttributes(data.instance.popper, data.attributes);\n\n // if arrowElement is defined and arrowStyles has some properties\n if (data.arrowElement && Object.keys(data.arrowStyles).length) {\n setStyles(data.arrowElement, data.arrowStyles);\n }\n\n return data;\n}\n\n/**\n * Set the x-placement attribute before everything else because it could be used\n * to add margins to the popper margins needs to be calculated to get the\n * correct popper offsets.\n * @method\n * @memberof Popper.modifiers\n * @param {HTMLElement} reference - The reference element used to position the popper\n * @param {HTMLElement} popper - The HTML element used as popper\n * @param {Object} options - Popper.js options\n */\nfunction applyStyleOnLoad(reference, popper, options, modifierOptions, state) {\n // compute reference element offsets\n var referenceOffsets = getReferenceOffsets(state, popper, reference, options.positionFixed);\n\n // compute auto placement, store placement inside the data object,\n // modifiers will be able to edit `placement` if needed\n // and refer to originalPlacement to know the original value\n var placement = computeAutoPlacement(options.placement, referenceOffsets, popper, reference, options.modifiers.flip.boundariesElement, options.modifiers.flip.padding);\n\n popper.setAttribute('x-placement', placement);\n\n // Apply `position` to popper before anything else because\n // without the position applied we can't guarantee correct computations\n setStyles(popper, { position: options.positionFixed ? 'fixed' : 'absolute' });\n\n return options;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction computeStyle(data, options) {\n var x = options.x,\n y = options.y;\n var popper = data.offsets.popper;\n\n // Remove this legacy support in Popper.js v2\n\n var legacyGpuAccelerationOption = find(data.instance.modifiers, function (modifier) {\n return modifier.name === 'applyStyle';\n }).gpuAcceleration;\n if (legacyGpuAccelerationOption !== undefined) {\n console.warn('WARNING: `gpuAcceleration` option moved to `computeStyle` modifier and will not be supported in future versions of Popper.js!');\n }\n var gpuAcceleration = legacyGpuAccelerationOption !== undefined ? legacyGpuAccelerationOption : options.gpuAcceleration;\n\n var offsetParent = getOffsetParent(data.instance.popper);\n var offsetParentRect = getBoundingClientRect(offsetParent);\n\n // Styles\n var styles = {\n position: popper.position\n };\n\n // Avoid blurry text by using full pixel integers.\n // For pixel-perfect positioning, top/bottom prefers rounded\n // values, while left/right prefers floored values.\n var offsets = {\n left: Math.floor(popper.left),\n top: Math.round(popper.top),\n bottom: Math.round(popper.bottom),\n right: Math.floor(popper.right)\n };\n\n var sideA = x === 'bottom' ? 'top' : 'bottom';\n var sideB = y === 'right' ? 'left' : 'right';\n\n // if gpuAcceleration is set to `true` and transform is supported,\n // we use `translate3d` to apply the position to the popper we\n // automatically use the supported prefixed version if needed\n var prefixedProperty = getSupportedPropertyName('transform');\n\n // now, let's make a step back and look at this code closely (wtf?)\n // If the content of the popper grows once it's been positioned, it\n // may happen that the popper gets misplaced because of the new content\n // overflowing its reference element\n // To avoid this problem, we provide two options (x and y), which allow\n // the consumer to define the offset origin.\n // If we position a popper on top of a reference element, we can set\n // `x` to `top` to make the popper grow towards its top instead of\n // its bottom.\n var left = void 0,\n top = void 0;\n if (sideA === 'bottom') {\n top = -offsetParentRect.height + offsets.bottom;\n } else {\n top = offsets.top;\n }\n if (sideB === 'right') {\n left = -offsetParentRect.width + offsets.right;\n } else {\n left = offsets.left;\n }\n if (gpuAcceleration && prefixedProperty) {\n styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';\n styles[sideA] = 0;\n styles[sideB] = 0;\n styles.willChange = 'transform';\n } else {\n // othwerise, we use the standard `top`, `left`, `bottom` and `right` properties\n var invertTop = sideA === 'bottom' ? -1 : 1;\n var invertLeft = sideB === 'right' ? -1 : 1;\n styles[sideA] = top * invertTop;\n styles[sideB] = left * invertLeft;\n styles.willChange = sideA + ', ' + sideB;\n }\n\n // Attributes\n var attributes = {\n 'x-placement': data.placement\n };\n\n // Update `data` attributes, styles and arrowStyles\n data.attributes = _extends({}, attributes, data.attributes);\n data.styles = _extends({}, styles, data.styles);\n data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles);\n\n return data;\n}\n\n/**\n * Helper used to know if the given modifier depends from another one.
\n * It checks if the needed modifier is listed and enabled.\n * @method\n * @memberof Popper.Utils\n * @param {Array} modifiers - list of modifiers\n * @param {String} requestingName - name of requesting modifier\n * @param {String} requestedName - name of requested modifier\n * @returns {Boolean}\n */\nfunction isModifierRequired(modifiers, requestingName, requestedName) {\n var requesting = find(modifiers, function (_ref) {\n var name = _ref.name;\n return name === requestingName;\n });\n\n var isRequired = !!requesting && modifiers.some(function (modifier) {\n return modifier.name === requestedName && modifier.enabled && modifier.order < requesting.order;\n });\n\n if (!isRequired) {\n var _requesting = '`' + requestingName + '`';\n var requested = '`' + requestedName + '`';\n console.warn(requested + ' modifier is required by ' + _requesting + ' modifier in order to work, be sure to include it before ' + _requesting + '!');\n }\n return isRequired;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction arrow(data, options) {\n var _data$offsets$arrow;\n\n // arrow depends on keepTogether in order to work\n if (!isModifierRequired(data.instance.modifiers, 'arrow', 'keepTogether')) {\n return data;\n }\n\n var arrowElement = options.element;\n\n // if arrowElement is a string, suppose it's a CSS selector\n if (typeof arrowElement === 'string') {\n arrowElement = data.instance.popper.querySelector(arrowElement);\n\n // if arrowElement is not found, don't run the modifier\n if (!arrowElement) {\n return data;\n }\n } else {\n // if the arrowElement isn't a query selector we must check that the\n // provided DOM node is child of its popper node\n if (!data.instance.popper.contains(arrowElement)) {\n console.warn('WARNING: `arrow.element` must be child of its popper element!');\n return data;\n }\n }\n\n var placement = data.placement.split('-')[0];\n var _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var isVertical = ['left', 'right'].indexOf(placement) !== -1;\n\n var len = isVertical ? 'height' : 'width';\n var sideCapitalized = isVertical ? 'Top' : 'Left';\n var side = sideCapitalized.toLowerCase();\n var altSide = isVertical ? 'left' : 'top';\n var opSide = isVertical ? 'bottom' : 'right';\n var arrowElementSize = getOuterSizes(arrowElement)[len];\n\n //\n // extends keepTogether behavior making sure the popper and its\n // reference have enough pixels in conjuction\n //\n\n // top/left side\n if (reference[opSide] - arrowElementSize < popper[side]) {\n data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowElementSize);\n }\n // bottom/right side\n if (reference[side] + arrowElementSize > popper[opSide]) {\n data.offsets.popper[side] += reference[side] + arrowElementSize - popper[opSide];\n }\n data.offsets.popper = getClientRect(data.offsets.popper);\n\n // compute center of the popper\n var center = reference[side] + reference[len] / 2 - arrowElementSize / 2;\n\n // Compute the sideValue using the updated popper offsets\n // take popper margin in account because we don't have this info available\n var css = getStyleComputedProperty(data.instance.popper);\n var popperMarginSide = parseFloat(css['margin' + sideCapitalized], 10);\n var popperBorderSide = parseFloat(css['border' + sideCapitalized + 'Width'], 10);\n var sideValue = center - data.offsets.popper[side] - popperMarginSide - popperBorderSide;\n\n // prevent arrowElement from being placed not contiguously to its popper\n sideValue = Math.max(Math.min(popper[len] - arrowElementSize, sideValue), 0);\n\n data.arrowElement = arrowElement;\n data.offsets.arrow = (_data$offsets$arrow = {}, defineProperty(_data$offsets$arrow, side, Math.round(sideValue)), defineProperty(_data$offsets$arrow, altSide, ''), _data$offsets$arrow);\n\n return data;\n}\n\n/**\n * Get the opposite placement variation of the given one\n * @method\n * @memberof Popper.Utils\n * @argument {String} placement variation\n * @returns {String} flipped placement variation\n */\nfunction getOppositeVariation(variation) {\n if (variation === 'end') {\n return 'start';\n } else if (variation === 'start') {\n return 'end';\n }\n return variation;\n}\n\n/**\n * List of accepted placements to use as values of the `placement` option.
\n * Valid placements are:\n * - `auto`\n * - `top`\n * - `right`\n * - `bottom`\n * - `left`\n *\n * Each placement can have a variation from this list:\n * - `-start`\n * - `-end`\n *\n * Variations are interpreted easily if you think of them as the left to right\n * written languages. Horizontally (`top` and `bottom`), `start` is left and `end`\n * is right.
\n * Vertically (`left` and `right`), `start` is top and `end` is bottom.\n *\n * Some valid examples are:\n * - `top-end` (on top of reference, right aligned)\n * - `right-start` (on right of reference, top aligned)\n * - `bottom` (on bottom, centered)\n * - `auto-right` (on the side with more space available, alignment depends by placement)\n *\n * @static\n * @type {Array}\n * @enum {String}\n * @readonly\n * @method placements\n * @memberof Popper\n */\nvar placements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'];\n\n// Get rid of `auto` `auto-start` and `auto-end`\nvar validPlacements = placements.slice(3);\n\n/**\n * Given an initial placement, returns all the subsequent placements\n * clockwise (or counter-clockwise).\n *\n * @method\n * @memberof Popper.Utils\n * @argument {String} placement - A valid placement (it accepts variations)\n * @argument {Boolean} counter - Set to true to walk the placements counterclockwise\n * @returns {Array} placements including their variations\n */\nfunction clockwise(placement) {\n var counter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;\n\n var index = validPlacements.indexOf(placement);\n var arr = validPlacements.slice(index + 1).concat(validPlacements.slice(0, index));\n return counter ? arr.reverse() : arr;\n}\n\nvar BEHAVIORS = {\n FLIP: 'flip',\n CLOCKWISE: 'clockwise',\n COUNTERCLOCKWISE: 'counterclockwise'\n};\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction flip(data, options) {\n // if `inner` modifier is enabled, we can't use the `flip` modifier\n if (isModifierEnabled(data.instance.modifiers, 'inner')) {\n return data;\n }\n\n if (data.flipped && data.placement === data.originalPlacement) {\n // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides\n return data;\n }\n\n var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, options.boundariesElement, data.positionFixed);\n\n var placement = data.placement.split('-')[0];\n var placementOpposite = getOppositePlacement(placement);\n var variation = data.placement.split('-')[1] || '';\n\n var flipOrder = [];\n\n switch (options.behavior) {\n case BEHAVIORS.FLIP:\n flipOrder = [placement, placementOpposite];\n break;\n case BEHAVIORS.CLOCKWISE:\n flipOrder = clockwise(placement);\n break;\n case BEHAVIORS.COUNTERCLOCKWISE:\n flipOrder = clockwise(placement, true);\n break;\n default:\n flipOrder = options.behavior;\n }\n\n flipOrder.forEach(function (step, index) {\n if (placement !== step || flipOrder.length === index + 1) {\n return data;\n }\n\n placement = data.placement.split('-')[0];\n placementOpposite = getOppositePlacement(placement);\n\n var popperOffsets = data.offsets.popper;\n var refOffsets = data.offsets.reference;\n\n // using floor because the reference offsets may contain decimals we are not going to consider here\n var floor = Math.floor;\n var overlapsRef = placement === 'left' && floor(popperOffsets.right) > floor(refOffsets.left) || placement === 'right' && floor(popperOffsets.left) < floor(refOffsets.right) || placement === 'top' && floor(popperOffsets.bottom) > floor(refOffsets.top) || placement === 'bottom' && floor(popperOffsets.top) < floor(refOffsets.bottom);\n\n var overflowsLeft = floor(popperOffsets.left) < floor(boundaries.left);\n var overflowsRight = floor(popperOffsets.right) > floor(boundaries.right);\n var overflowsTop = floor(popperOffsets.top) < floor(boundaries.top);\n var overflowsBottom = floor(popperOffsets.bottom) > floor(boundaries.bottom);\n\n var overflowsBoundaries = placement === 'left' && overflowsLeft || placement === 'right' && overflowsRight || placement === 'top' && overflowsTop || placement === 'bottom' && overflowsBottom;\n\n // flip the variation if required\n var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;\n var flippedVariation = !!options.flipVariations && (isVertical && variation === 'start' && overflowsLeft || isVertical && variation === 'end' && overflowsRight || !isVertical && variation === 'start' && overflowsTop || !isVertical && variation === 'end' && overflowsBottom);\n\n if (overlapsRef || overflowsBoundaries || flippedVariation) {\n // this boolean to detect any flip loop\n data.flipped = true;\n\n if (overlapsRef || overflowsBoundaries) {\n placement = flipOrder[index + 1];\n }\n\n if (flippedVariation) {\n variation = getOppositeVariation(variation);\n }\n\n data.placement = placement + (variation ? '-' + variation : '');\n\n // this object contains `position`, we want to preserve it along with\n // any additional property we may add in the future\n data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));\n\n data = runModifiers(data.instance.modifiers, data, 'flip');\n }\n });\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction keepTogether(data) {\n var _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var placement = data.placement.split('-')[0];\n var floor = Math.floor;\n var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;\n var side = isVertical ? 'right' : 'bottom';\n var opSide = isVertical ? 'left' : 'top';\n var measurement = isVertical ? 'width' : 'height';\n\n if (popper[side] < floor(reference[opSide])) {\n data.offsets.popper[opSide] = floor(reference[opSide]) - popper[measurement];\n }\n if (popper[opSide] > floor(reference[side])) {\n data.offsets.popper[opSide] = floor(reference[side]);\n }\n\n return data;\n}\n\n/**\n * Converts a string containing value + unit into a px value number\n * @function\n * @memberof {modifiers~offset}\n * @private\n * @argument {String} str - Value + unit string\n * @argument {String} measurement - `height` or `width`\n * @argument {Object} popperOffsets\n * @argument {Object} referenceOffsets\n * @returns {Number|String}\n * Value in pixels, or original string if no values were extracted\n */\nfunction toValue(str, measurement, popperOffsets, referenceOffsets) {\n // separate value from unit\n var split = str.match(/((?:\\-|\\+)?\\d*\\.?\\d*)(.*)/);\n var value = +split[1];\n var unit = split[2];\n\n // If it's not a number it's an operator, I guess\n if (!value) {\n return str;\n }\n\n if (unit.indexOf('%') === 0) {\n var element = void 0;\n switch (unit) {\n case '%p':\n element = popperOffsets;\n break;\n case '%':\n case '%r':\n default:\n element = referenceOffsets;\n }\n\n var rect = getClientRect(element);\n return rect[measurement] / 100 * value;\n } else if (unit === 'vh' || unit === 'vw') {\n // if is a vh or vw, we calculate the size based on the viewport\n var size = void 0;\n if (unit === 'vh') {\n size = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);\n } else {\n size = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);\n }\n return size / 100 * value;\n } else {\n // if is an explicit pixel unit, we get rid of the unit and keep the value\n // if is an implicit unit, it's px, and we return just the value\n return value;\n }\n}\n\n/**\n * Parse an `offset` string to extrapolate `x` and `y` numeric offsets.\n * @function\n * @memberof {modifiers~offset}\n * @private\n * @argument {String} offset\n * @argument {Object} popperOffsets\n * @argument {Object} referenceOffsets\n * @argument {String} basePlacement\n * @returns {Array} a two cells array with x and y offsets in numbers\n */\nfunction parseOffset(offset, popperOffsets, referenceOffsets, basePlacement) {\n var offsets = [0, 0];\n\n // Use height if placement is left or right and index is 0 otherwise use width\n // in this way the first offset will use an axis and the second one\n // will use the other one\n var useHeight = ['right', 'left'].indexOf(basePlacement) !== -1;\n\n // Split the offset string to obtain a list of values and operands\n // The regex addresses values with the plus or minus sign in front (+10, -20, etc)\n var fragments = offset.split(/(\\+|\\-)/).map(function (frag) {\n return frag.trim();\n });\n\n // Detect if the offset string contains a pair of values or a single one\n // they could be separated by comma or space\n var divider = fragments.indexOf(find(fragments, function (frag) {\n return frag.search(/,|\\s/) !== -1;\n }));\n\n if (fragments[divider] && fragments[divider].indexOf(',') === -1) {\n console.warn('Offsets separated by white space(s) are deprecated, use a comma (,) instead.');\n }\n\n // If divider is found, we divide the list of values and operands to divide\n // them by ofset X and Y.\n var splitRegex = /\\s*,\\s*|\\s+/;\n var ops = divider !== -1 ? [fragments.slice(0, divider).concat([fragments[divider].split(splitRegex)[0]]), [fragments[divider].split(splitRegex)[1]].concat(fragments.slice(divider + 1))] : [fragments];\n\n // Convert the values with units to absolute pixels to allow our computations\n ops = ops.map(function (op, index) {\n // Most of the units rely on the orientation of the popper\n var measurement = (index === 1 ? !useHeight : useHeight) ? 'height' : 'width';\n var mergeWithPrevious = false;\n return op\n // This aggregates any `+` or `-` sign that aren't considered operators\n // e.g.: 10 + +5 => [10, +, +5]\n .reduce(function (a, b) {\n if (a[a.length - 1] === '' && ['+', '-'].indexOf(b) !== -1) {\n a[a.length - 1] = b;\n mergeWithPrevious = true;\n return a;\n } else if (mergeWithPrevious) {\n a[a.length - 1] += b;\n mergeWithPrevious = false;\n return a;\n } else {\n return a.concat(b);\n }\n }, [])\n // Here we convert the string values into number values (in px)\n .map(function (str) {\n return toValue(str, measurement, popperOffsets, referenceOffsets);\n });\n });\n\n // Loop trough the offsets arrays and execute the operations\n ops.forEach(function (op, index) {\n op.forEach(function (frag, index2) {\n if (isNumeric(frag)) {\n offsets[index] += frag * (op[index2 - 1] === '-' ? -1 : 1);\n }\n });\n });\n return offsets;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @argument {Number|String} options.offset=0\n * The offset value as described in the modifier description\n * @returns {Object} The data object, properly modified\n */\nfunction offset(data, _ref) {\n var offset = _ref.offset;\n var placement = data.placement,\n _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var basePlacement = placement.split('-')[0];\n\n var offsets = void 0;\n if (isNumeric(+offset)) {\n offsets = [+offset, 0];\n } else {\n offsets = parseOffset(offset, popper, reference, basePlacement);\n }\n\n if (basePlacement === 'left') {\n popper.top += offsets[0];\n popper.left -= offsets[1];\n } else if (basePlacement === 'right') {\n popper.top += offsets[0];\n popper.left += offsets[1];\n } else if (basePlacement === 'top') {\n popper.left += offsets[0];\n popper.top -= offsets[1];\n } else if (basePlacement === 'bottom') {\n popper.left += offsets[0];\n popper.top += offsets[1];\n }\n\n data.popper = popper;\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction preventOverflow(data, options) {\n var boundariesElement = options.boundariesElement || getOffsetParent(data.instance.popper);\n\n // If offsetParent is the reference element, we really want to\n // go one step up and use the next offsetParent as reference to\n // avoid to make this modifier completely useless and look like broken\n if (data.instance.reference === boundariesElement) {\n boundariesElement = getOffsetParent(boundariesElement);\n }\n\n // NOTE: DOM access here\n // resets the popper's position so that the document size can be calculated excluding\n // the size of the popper element itself\n var transformProp = getSupportedPropertyName('transform');\n var popperStyles = data.instance.popper.style; // assignment to help minification\n var top = popperStyles.top,\n left = popperStyles.left,\n transform = popperStyles[transformProp];\n\n popperStyles.top = '';\n popperStyles.left = '';\n popperStyles[transformProp] = '';\n\n var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, boundariesElement, data.positionFixed);\n\n // NOTE: DOM access here\n // restores the original style properties after the offsets have been computed\n popperStyles.top = top;\n popperStyles.left = left;\n popperStyles[transformProp] = transform;\n\n options.boundaries = boundaries;\n\n var order = options.priority;\n var popper = data.offsets.popper;\n\n var check = {\n primary: function primary(placement) {\n var value = popper[placement];\n if (popper[placement] < boundaries[placement] && !options.escapeWithReference) {\n value = Math.max(popper[placement], boundaries[placement]);\n }\n return defineProperty({}, placement, value);\n },\n secondary: function secondary(placement) {\n var mainSide = placement === 'right' ? 'left' : 'top';\n var value = popper[mainSide];\n if (popper[placement] > boundaries[placement] && !options.escapeWithReference) {\n value = Math.min(popper[mainSide], boundaries[placement] - (placement === 'right' ? popper.width : popper.height));\n }\n return defineProperty({}, mainSide, value);\n }\n };\n\n order.forEach(function (placement) {\n var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary';\n popper = _extends({}, popper, check[side](placement));\n });\n\n data.offsets.popper = popper;\n\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction shift(data) {\n var placement = data.placement;\n var basePlacement = placement.split('-')[0];\n var shiftvariation = placement.split('-')[1];\n\n // if shift shiftvariation is specified, run the modifier\n if (shiftvariation) {\n var _data$offsets = data.offsets,\n reference = _data$offsets.reference,\n popper = _data$offsets.popper;\n\n var isVertical = ['bottom', 'top'].indexOf(basePlacement) !== -1;\n var side = isVertical ? 'left' : 'top';\n var measurement = isVertical ? 'width' : 'height';\n\n var shiftOffsets = {\n start: defineProperty({}, side, reference[side]),\n end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement])\n };\n\n data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]);\n }\n\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction hide(data) {\n if (!isModifierRequired(data.instance.modifiers, 'hide', 'preventOverflow')) {\n return data;\n }\n\n var refRect = data.offsets.reference;\n var bound = find(data.instance.modifiers, function (modifier) {\n return modifier.name === 'preventOverflow';\n }).boundaries;\n\n if (refRect.bottom < bound.top || refRect.left > bound.right || refRect.top > bound.bottom || refRect.right < bound.left) {\n // Avoid unnecessary DOM access if visibility hasn't changed\n if (data.hide === true) {\n return data;\n }\n\n data.hide = true;\n data.attributes['x-out-of-boundaries'] = '';\n } else {\n // Avoid unnecessary DOM access if visibility hasn't changed\n if (data.hide === false) {\n return data;\n }\n\n data.hide = false;\n data.attributes['x-out-of-boundaries'] = false;\n }\n\n return data;\n}\n\n/**\n * @function\n * @memberof Modifiers\n * @argument {Object} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nfunction inner(data) {\n var placement = data.placement;\n var basePlacement = placement.split('-')[0];\n var _data$offsets = data.offsets,\n popper = _data$offsets.popper,\n reference = _data$offsets.reference;\n\n var isHoriz = ['left', 'right'].indexOf(basePlacement) !== -1;\n\n var subtractLength = ['top', 'left'].indexOf(basePlacement) === -1;\n\n popper[isHoriz ? 'left' : 'top'] = reference[basePlacement] - (subtractLength ? popper[isHoriz ? 'width' : 'height'] : 0);\n\n data.placement = getOppositePlacement(placement);\n data.offsets.popper = getClientRect(popper);\n\n return data;\n}\n\n/**\n * Modifier function, each modifier can have a function of this type assigned\n * to its `fn` property.
\n * These functions will be called on each update, this means that you must\n * make sure they are performant enough to avoid performance bottlenecks.\n *\n * @function ModifierFn\n * @argument {dataObject} data - The data object generated by `update` method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {dataObject} The data object, properly modified\n */\n\n/**\n * Modifiers are plugins used to alter the behavior of your poppers.
\n * Popper.js uses a set of 9 modifiers to provide all the basic functionalities\n * needed by the library.\n *\n * Usually you don't want to override the `order`, `fn` and `onLoad` props.\n * All the other properties are configurations that could be tweaked.\n * @namespace modifiers\n */\nvar modifiers = {\n /**\n * Modifier used to shift the popper on the start or end of its reference\n * element.
\n * It will read the variation of the `placement` property.
\n * It can be one either `-end` or `-start`.\n * @memberof modifiers\n * @inner\n */\n shift: {\n /** @prop {number} order=100 - Index used to define the order of execution */\n order: 100,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: shift\n },\n\n /**\n * The `offset` modifier can shift your popper on both its axis.\n *\n * It accepts the following units:\n * - `px` or unitless, interpreted as pixels\n * - `%` or `%r`, percentage relative to the length of the reference element\n * - `%p`, percentage relative to the length of the popper element\n * - `vw`, CSS viewport width unit\n * - `vh`, CSS viewport height unit\n *\n * For length is intended the main axis relative to the placement of the popper.
\n * This means that if the placement is `top` or `bottom`, the length will be the\n * `width`. In case of `left` or `right`, it will be the height.\n *\n * You can provide a single value (as `Number` or `String`), or a pair of values\n * as `String` divided by a comma or one (or more) white spaces.
\n * The latter is a deprecated method because it leads to confusion and will be\n * removed in v2.
\n * Additionally, it accepts additions and subtractions between different units.\n * Note that multiplications and divisions aren't supported.\n *\n * Valid examples are:\n * ```\n * 10\n * '10%'\n * '10, 10'\n * '10%, 10'\n * '10 + 10%'\n * '10 - 5vh + 3%'\n * '-10px + 5vh, 5px - 6%'\n * ```\n * > **NB**: If you desire to apply offsets to your poppers in a way that may make them overlap\n * > with their reference element, unfortunately, you will have to disable the `flip` modifier.\n * > More on this [reading this issue](https://github.com/FezVrasta/popper.js/issues/373)\n *\n * @memberof modifiers\n * @inner\n */\n offset: {\n /** @prop {number} order=200 - Index used to define the order of execution */\n order: 200,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: offset,\n /** @prop {Number|String} offset=0\n * The offset value as described in the modifier description\n */\n offset: 0\n },\n\n /**\n * Modifier used to prevent the popper from being positioned outside the boundary.\n *\n * An scenario exists where the reference itself is not within the boundaries.
\n * We can say it has \"escaped the boundaries\" — or just \"escaped\".
\n * In this case we need to decide whether the popper should either:\n *\n * - detach from the reference and remain \"trapped\" in the boundaries, or\n * - if it should ignore the boundary and \"escape with its reference\"\n *\n * When `escapeWithReference` is set to`true` and reference is completely\n * outside its boundaries, the popper will overflow (or completely leave)\n * the boundaries in order to remain attached to the edge of the reference.\n *\n * @memberof modifiers\n * @inner\n */\n preventOverflow: {\n /** @prop {number} order=300 - Index used to define the order of execution */\n order: 300,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: preventOverflow,\n /**\n * @prop {Array} [priority=['left','right','top','bottom']]\n * Popper will try to prevent overflow following these priorities by default,\n * then, it could overflow on the left and on top of the `boundariesElement`\n */\n priority: ['left', 'right', 'top', 'bottom'],\n /**\n * @prop {number} padding=5\n * Amount of pixel used to define a minimum distance between the boundaries\n * and the popper this makes sure the popper has always a little padding\n * between the edges of its container\n */\n padding: 5,\n /**\n * @prop {String|HTMLElement} boundariesElement='scrollParent'\n * Boundaries used by the modifier, can be `scrollParent`, `window`,\n * `viewport` or any DOM element.\n */\n boundariesElement: 'scrollParent'\n },\n\n /**\n * Modifier used to make sure the reference and its popper stay near eachothers\n * without leaving any gap between the two. Expecially useful when the arrow is\n * enabled and you want to assure it to point to its reference element.\n * It cares only about the first axis, you can still have poppers with margin\n * between the popper and its reference element.\n * @memberof modifiers\n * @inner\n */\n keepTogether: {\n /** @prop {number} order=400 - Index used to define the order of execution */\n order: 400,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: keepTogether\n },\n\n /**\n * This modifier is used to move the `arrowElement` of the popper to make\n * sure it is positioned between the reference element and its popper element.\n * It will read the outer size of the `arrowElement` node to detect how many\n * pixels of conjuction are needed.\n *\n * It has no effect if no `arrowElement` is provided.\n * @memberof modifiers\n * @inner\n */\n arrow: {\n /** @prop {number} order=500 - Index used to define the order of execution */\n order: 500,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: arrow,\n /** @prop {String|HTMLElement} element='[x-arrow]' - Selector or node used as arrow */\n element: '[x-arrow]'\n },\n\n /**\n * Modifier used to flip the popper's placement when it starts to overlap its\n * reference element.\n *\n * Requires the `preventOverflow` modifier before it in order to work.\n *\n * **NOTE:** this modifier will interrupt the current update cycle and will\n * restart it if it detects the need to flip the placement.\n * @memberof modifiers\n * @inner\n */\n flip: {\n /** @prop {number} order=600 - Index used to define the order of execution */\n order: 600,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: flip,\n /**\n * @prop {String|Array} behavior='flip'\n * The behavior used to change the popper's placement. It can be one of\n * `flip`, `clockwise`, `counterclockwise` or an array with a list of valid\n * placements (with optional variations).\n */\n behavior: 'flip',\n /**\n * @prop {number} padding=5\n * The popper will flip if it hits the edges of the `boundariesElement`\n */\n padding: 5,\n /**\n * @prop {String|HTMLElement} boundariesElement='viewport'\n * The element which will define the boundaries of the popper position,\n * the popper will never be placed outside of the defined boundaries\n * (except if keepTogether is enabled)\n */\n boundariesElement: 'viewport'\n },\n\n /**\n * Modifier used to make the popper flow toward the inner of the reference element.\n * By default, when this modifier is disabled, the popper will be placed outside\n * the reference element.\n * @memberof modifiers\n * @inner\n */\n inner: {\n /** @prop {number} order=700 - Index used to define the order of execution */\n order: 700,\n /** @prop {Boolean} enabled=false - Whether the modifier is enabled or not */\n enabled: false,\n /** @prop {ModifierFn} */\n fn: inner\n },\n\n /**\n * Modifier used to hide the popper when its reference element is outside of the\n * popper boundaries. It will set a `x-out-of-boundaries` attribute which can\n * be used to hide with a CSS selector the popper when its reference is\n * out of boundaries.\n *\n * Requires the `preventOverflow` modifier before it in order to work.\n * @memberof modifiers\n * @inner\n */\n hide: {\n /** @prop {number} order=800 - Index used to define the order of execution */\n order: 800,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: hide\n },\n\n /**\n * Computes the style that will be applied to the popper element to gets\n * properly positioned.\n *\n * Note that this modifier will not touch the DOM, it just prepares the styles\n * so that `applyStyle` modifier can apply it. This separation is useful\n * in case you need to replace `applyStyle` with a custom implementation.\n *\n * This modifier has `850` as `order` value to maintain backward compatibility\n * with previous versions of Popper.js. Expect the modifiers ordering method\n * to change in future major versions of the library.\n *\n * @memberof modifiers\n * @inner\n */\n computeStyle: {\n /** @prop {number} order=850 - Index used to define the order of execution */\n order: 850,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: computeStyle,\n /**\n * @prop {Boolean} gpuAcceleration=true\n * If true, it uses the CSS 3d transformation to position the popper.\n * Otherwise, it will use the `top` and `left` properties.\n */\n gpuAcceleration: true,\n /**\n * @prop {string} [x='bottom']\n * Where to anchor the X axis (`bottom` or `top`). AKA X offset origin.\n * Change this if your popper should grow in a direction different from `bottom`\n */\n x: 'bottom',\n /**\n * @prop {string} [x='left']\n * Where to anchor the Y axis (`left` or `right`). AKA Y offset origin.\n * Change this if your popper should grow in a direction different from `right`\n */\n y: 'right'\n },\n\n /**\n * Applies the computed styles to the popper element.\n *\n * All the DOM manipulations are limited to this modifier. This is useful in case\n * you want to integrate Popper.js inside a framework or view library and you\n * want to delegate all the DOM manipulations to it.\n *\n * Note that if you disable this modifier, you must make sure the popper element\n * has its position set to `absolute` before Popper.js can do its work!\n *\n * Just disable this modifier and define you own to achieve the desired effect.\n *\n * @memberof modifiers\n * @inner\n */\n applyStyle: {\n /** @prop {number} order=900 - Index used to define the order of execution */\n order: 900,\n /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */\n enabled: true,\n /** @prop {ModifierFn} */\n fn: applyStyle,\n /** @prop {Function} */\n onLoad: applyStyleOnLoad,\n /**\n * @deprecated since version 1.10.0, the property moved to `computeStyle` modifier\n * @prop {Boolean} gpuAcceleration=true\n * If true, it uses the CSS 3d transformation to position the popper.\n * Otherwise, it will use the `top` and `left` properties.\n */\n gpuAcceleration: undefined\n }\n};\n\n/**\n * The `dataObject` is an object containing all the informations used by Popper.js\n * this object get passed to modifiers and to the `onCreate` and `onUpdate` callbacks.\n * @name dataObject\n * @property {Object} data.instance The Popper.js instance\n * @property {String} data.placement Placement applied to popper\n * @property {String} data.originalPlacement Placement originally defined on init\n * @property {Boolean} data.flipped True if popper has been flipped by flip modifier\n * @property {Boolean} data.hide True if the reference element is out of boundaries, useful to know when to hide the popper.\n * @property {HTMLElement} data.arrowElement Node used as arrow by arrow modifier\n * @property {Object} data.styles Any CSS property defined here will be applied to the popper, it expects the JavaScript nomenclature (eg. `marginBottom`)\n * @property {Object} data.arrowStyles Any CSS property defined here will be applied to the popper arrow, it expects the JavaScript nomenclature (eg. `marginBottom`)\n * @property {Object} data.boundaries Offsets of the popper boundaries\n * @property {Object} data.offsets The measurements of popper, reference and arrow elements.\n * @property {Object} data.offsets.popper `top`, `left`, `width`, `height` values\n * @property {Object} data.offsets.reference `top`, `left`, `width`, `height` values\n * @property {Object} data.offsets.arrow] `top` and `left` offsets, only one of them will be different from 0\n */\n\n/**\n * Default options provided to Popper.js constructor.
\n * These can be overriden using the `options` argument of Popper.js.
\n * To override an option, simply pass as 3rd argument an object with the same\n * structure of this object, example:\n * ```\n * new Popper(ref, pop, {\n * modifiers: {\n * preventOverflow: { enabled: false }\n * }\n * })\n * ```\n * @type {Object}\n * @static\n * @memberof Popper\n */\nvar Defaults = {\n /**\n * Popper's placement\n * @prop {Popper.placements} placement='bottom'\n */\n placement: 'bottom',\n\n /**\n * Set this to true if you want popper to position it self in 'fixed' mode\n * @prop {Boolean} positionFixed=false\n */\n positionFixed: false,\n\n /**\n * Whether events (resize, scroll) are initially enabled\n * @prop {Boolean} eventsEnabled=true\n */\n eventsEnabled: true,\n\n /**\n * Set to true if you want to automatically remove the popper when\n * you call the `destroy` method.\n * @prop {Boolean} removeOnDestroy=false\n */\n removeOnDestroy: false,\n\n /**\n * Callback called when the popper is created.
\n * By default, is set to no-op.
\n * Access Popper.js instance with `data.instance`.\n * @prop {onCreate}\n */\n onCreate: function onCreate() {},\n\n /**\n * Callback called when the popper is updated, this callback is not called\n * on the initialization/creation of the popper, but only on subsequent\n * updates.
\n * By default, is set to no-op.
\n * Access Popper.js instance with `data.instance`.\n * @prop {onUpdate}\n */\n onUpdate: function onUpdate() {},\n\n /**\n * List of modifiers used to modify the offsets before they are applied to the popper.\n * They provide most of the functionalities of Popper.js\n * @prop {modifiers}\n */\n modifiers: modifiers\n};\n\n/**\n * @callback onCreate\n * @param {dataObject} data\n */\n\n/**\n * @callback onUpdate\n * @param {dataObject} data\n */\n\n// Utils\n// Methods\nvar Popper = function () {\n /**\n * Create a new Popper.js instance\n * @class Popper\n * @param {HTMLElement|referenceObject} reference - The reference element used to position the popper\n * @param {HTMLElement} popper - The HTML element used as popper.\n * @param {Object} options - Your custom options to override the ones defined in [Defaults](#defaults)\n * @return {Object} instance - The generated Popper.js instance\n */\n function Popper(reference, popper) {\n var _this = this;\n\n var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};\n classCallCheck(this, Popper);\n\n this.scheduleUpdate = function () {\n return requestAnimationFrame(_this.update);\n };\n\n // make update() debounced, so that it only runs at most once-per-tick\n this.update = debounce(this.update.bind(this));\n\n // with {} we create a new object with the options inside it\n this.options = _extends({}, Popper.Defaults, options);\n\n // init state\n this.state = {\n isDestroyed: false,\n isCreated: false,\n scrollParents: []\n };\n\n // get reference and popper elements (allow jQuery wrappers)\n this.reference = reference && reference.jquery ? reference[0] : reference;\n this.popper = popper && popper.jquery ? popper[0] : popper;\n\n // Deep merge modifiers options\n this.options.modifiers = {};\n Object.keys(_extends({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {\n _this.options.modifiers[name] = _extends({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});\n });\n\n // Refactoring modifiers' list (Object => Array)\n this.modifiers = Object.keys(this.options.modifiers).map(function (name) {\n return _extends({\n name: name\n }, _this.options.modifiers[name]);\n })\n // sort the modifiers by order\n .sort(function (a, b) {\n return a.order - b.order;\n });\n\n // modifiers have the ability to execute arbitrary code when Popper.js get inited\n // such code is executed in the same order of its modifier\n // they could add new properties to their options configuration\n // BE AWARE: don't add options to `options.modifiers.name` but to `modifierOptions`!\n this.modifiers.forEach(function (modifierOptions) {\n if (modifierOptions.enabled && isFunction(modifierOptions.onLoad)) {\n modifierOptions.onLoad(_this.reference, _this.popper, _this.options, modifierOptions, _this.state);\n }\n });\n\n // fire the first update to position the popper in the right place\n this.update();\n\n var eventsEnabled = this.options.eventsEnabled;\n if (eventsEnabled) {\n // setup event listeners, they will take care of update the position in specific situations\n this.enableEventListeners();\n }\n\n this.state.eventsEnabled = eventsEnabled;\n }\n\n // We can't use class properties because they don't get listed in the\n // class prototype and break stuff like Sinon stubs\n\n\n createClass(Popper, [{\n key: 'update',\n value: function update$$1() {\n return update.call(this);\n }\n }, {\n key: 'destroy',\n value: function destroy$$1() {\n return destroy.call(this);\n }\n }, {\n key: 'enableEventListeners',\n value: function enableEventListeners$$1() {\n return enableEventListeners.call(this);\n }\n }, {\n key: 'disableEventListeners',\n value: function disableEventListeners$$1() {\n return disableEventListeners.call(this);\n }\n\n /**\n * Schedule an update, it will run on the next UI update available\n * @method scheduleUpdate\n * @memberof Popper\n */\n\n\n /**\n * Collection of utilities useful when writing custom modifiers.\n * Starting from version 1.7, this method is available only if you\n * include `popper-utils.js` before `popper.js`.\n *\n * **DEPRECATION**: This way to access PopperUtils is deprecated\n * and will be removed in v2! Use the PopperUtils module directly instead.\n * Due to the high instability of the methods contained in Utils, we can't\n * guarantee them to follow semver. Use them at your own risk!\n * @static\n * @private\n * @type {Object}\n * @deprecated since version 1.8\n * @member Utils\n * @memberof Popper\n */\n\n }]);\n return Popper;\n}();\n\n/**\n * The `referenceObject` is an object that provides an interface compatible with Popper.js\n * and lets you use it as replacement of a real DOM node.
\n * You can use this method to position a popper relatively to a set of coordinates\n * in case you don't have a DOM node to use as reference.\n *\n * ```\n * new Popper(referenceObject, popperNode);\n * ```\n *\n * NB: This feature isn't supported in Internet Explorer 10\n * @name referenceObject\n * @property {Function} data.getBoundingClientRect\n * A function that returns a set of coordinates compatible with the native `getBoundingClientRect` method.\n * @property {number} data.clientWidth\n * An ES6 getter that will return the width of the virtual reference element.\n * @property {number} data.clientHeight\n * An ES6 getter that will return the height of the virtual reference element.\n */\n\n\nPopper.Utils = (typeof window !== 'undefined' ? window : global).PopperUtils;\nPopper.placements = placements;\nPopper.Defaults = Defaults;\n\nexport default Popper;\n//# sourceMappingURL=popper.js.map\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/popper.js/dist/esm/popper.js\n// module id = 39\n// module chunks = 0","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; };\n\nfunction _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }\n\nimport { createElement } from 'react';\nimport PropTypes from 'prop-types';\n\nvar Arrow = function Arrow(props, context) {\n var _props$component = props.component,\n component = _props$component === undefined ? 'span' : _props$component,\n innerRef = props.innerRef,\n children = props.children,\n restProps = _objectWithoutProperties(props, ['component', 'innerRef', 'children']);\n\n var popper = context.popper;\n\n var arrowRef = function arrowRef(node) {\n popper.setArrowNode(node);\n if (typeof innerRef === 'function') {\n innerRef(node);\n }\n };\n var arrowStyle = popper.getArrowStyle();\n\n if (typeof children === 'function') {\n var arrowProps = {\n ref: arrowRef,\n style: arrowStyle\n };\n return children({ arrowProps: arrowProps, restProps: restProps });\n }\n\n var componentProps = _extends({}, restProps, {\n style: _extends({}, arrowStyle, restProps.style)\n });\n\n if (typeof component === 'string') {\n componentProps.ref = arrowRef;\n } else {\n componentProps.innerRef = arrowRef;\n }\n\n return createElement(component, componentProps, children);\n};\n\nArrow.contextTypes = {\n popper: PropTypes.object.isRequired\n};\n\nArrow.propTypes = {\n component: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n innerRef: PropTypes.func,\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.func])\n};\n\nexport default Arrow;\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/react-popper/lib/Arrow.js\n// module id = 40\n// module chunks = 0","/**\n * lodash (Custom Build)
- < HeadNavbar />
-
-
+
);
}
@@ -16,10 +21,12 @@ class App extends Component {
export default App;
-{/* BOOBY React
To get started, edit src/App.js and save to reload.
-
+ onClick
+
+ );
+ }
+ }
+
+//
+//
+//
\ No newline at end of file
diff --git a/src/components/Form.js b/src/components/Form.js
new file mode 100644
index 0000000..338a1ae
--- /dev/null
+++ b/src/components/Form.js
@@ -0,0 +1,32 @@
+import React, { Component } from "react";
+import ThankYouAlert from "./ThankYouAlert";
+
+export default class Form extends React.Component {
+render() {
+ return (
+
+
+
+
+
+
+ );
+ }
+}
+
+// the logic is sign up to recieve free video consultation and invention workbook
+// First name, last name
+// then email text area with validation
+// tell us a little about your idea...
+// Once it goes through trigger thank you alert or just change CTA text/colour
\ No newline at end of file
diff --git a/src/components/Navbar.js b/src/components/Navbar.js
index 41532d6..c2af35a 100644
--- a/src/components/Navbar.js
+++ b/src/components/Navbar.js
@@ -1,4 +1,4 @@
-import React, { Component }from 'react';
+import React, { Component } from 'react';
import {
Collapse,
Navbar,
@@ -11,7 +11,7 @@ import {
DropdownToggle,
DropdownMenu,
DropdownItem } from 'reactstrap';
- import logo from "../logo.png";
+ import logo from '../logo.png';
export default class HeadNavbar extends React.Component {
constructor(props) {
@@ -30,14 +30,15 @@ export default class HeadNavbar extends React.Component {
render() {
return (
-
+
diff --git a/src/components/ThankYouAlert.js b/src/components/ThankYouAlert.js
new file mode 100644
index 0000000..2d1e639
--- /dev/null
+++ b/src/components/ThankYouAlert.js
@@ -0,0 +1,37 @@
+import React, { Component } from 'react';
+import { Alert } from 'reactstrap';
+
+// export default class ThankYouAlert extends React.Component {
+// render() {
+// return (
+//
+ I am an alert and I can be dismissed!
+
+ );
+ }
+ }
+
diff --git a/src/index.css b/src/index.css
index b4cc725..74b590f 100644
--- a/src/index.css
+++ b/src/index.css
@@ -2,4 +2,6 @@ body {
margin: 0;
padding: 0;
font-family: sans-serif;
+ background-image: url("./kidRocket.jpg");
+ background-size: ;
}
diff --git a/src/kidRocket.jpg b/src/kidRocket.jpg
new file mode 100644
index 0000000..0fd43b2
Binary files /dev/null and b/src/kidRocket.jpg differ
diff --git a/src/layouts/AboveTheFold.js b/src/layouts/AboveTheFold.js
new file mode 100644
index 0000000..b49b2eb
--- /dev/null
+++ b/src/layouts/AboveTheFold.js
@@ -0,0 +1,15 @@
+import React, { Component } from "react";
+import Form from '../components/Form.js';
+import HeadNavbar from '../components/Navbar.js'
+
+export default class AboveTheFold extends Component {
+ render() {
+ return (
+
+
+//
+// );
+// }
+// }
+
+ export default class ThankYouAlert extends Component {
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ visible: true
+ };
+
+ this.onDismiss = this.onDismiss.bind(this);
+ }
+
+ onDismiss() {
+ this.setState({ visible: false });
+ }
+
+ render() {
+ return (
+
+
+ );
+ }
+}
\ No newline at end of file