(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-popper'), require('react-dom')) : typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-popper', 'react-dom'], factory) : (global = global || self, factory(global.Reactstrap = {}, global.React, global.ReactPopper, global.ReactDOM)); }(this, (function (exports, React, reactPopper, ReactDOM) { 'use strict'; var React__default = 'default' in React ? React['default'] : React; ReactDOM = ReactDOM && Object.prototype.hasOwnProperty.call(ReactDOM, 'default') ? ReactDOM['default'] : ReactDOM; function _extends() { _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; }; return _extends.apply(this, arguments); } function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function unwrapExports (x) { return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x; } function createCommonjsModule(fn, module) { return module = { exports: {} }, fn(module, module.exports), module.exports; } function getCjsExportFromNamespace (n) { return n && n['default'] || n; } /** @license React v16.13.1 * react-is.production.min.js * * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var b = "function" === typeof Symbol && Symbol.for, c = b ? Symbol.for("react.element") : 60103, d = b ? Symbol.for("react.portal") : 60106, e = b ? Symbol.for("react.fragment") : 60107, f = b ? Symbol.for("react.strict_mode") : 60108, g = b ? Symbol.for("react.profiler") : 60114, h = b ? Symbol.for("react.provider") : 60109, k = b ? Symbol.for("react.context") : 60110, l = b ? Symbol.for("react.async_mode") : 60111, m = b ? Symbol.for("react.concurrent_mode") : 60111, n = b ? Symbol.for("react.forward_ref") : 60112, p = b ? Symbol.for("react.suspense") : 60113, q = b ? Symbol.for("react.suspense_list") : 60120, r = b ? Symbol.for("react.memo") : 60115, t = b ? Symbol.for("react.lazy") : 60116, v = b ? Symbol.for("react.block") : 60121, w = b ? Symbol.for("react.fundamental") : 60117, x = b ? Symbol.for("react.responder") : 60118, y = b ? Symbol.for("react.scope") : 60119; function z(a) { if ("object" === typeof a && null !== a) { var u = a.$$typeof; switch (u) { case c: switch (a = a.type, a) { case l: case m: case e: case g: case f: case p: return a; default: switch (a = a && a.$$typeof, a) { case k: case n: case t: case r: case h: return a; default: return u; } } case d: return u; } } } function A(a) { return z(a) === m; } var AsyncMode = l; var ConcurrentMode = m; var ContextConsumer = k; var ContextProvider = h; var Element = c; var ForwardRef = n; var Fragment = e; var Lazy = t; var Memo = r; var Portal = d; var Profiler = g; var StrictMode = f; var Suspense = p; var isAsyncMode = function isAsyncMode(a) { return A(a) || z(a) === l; }; var isConcurrentMode = A; var isContextConsumer = function isContextConsumer(a) { return z(a) === k; }; var isContextProvider = function isContextProvider(a) { return z(a) === h; }; var isElement = function isElement(a) { return "object" === typeof a && null !== a && a.$$typeof === c; }; var isForwardRef = function isForwardRef(a) { return z(a) === n; }; var isFragment = function isFragment(a) { return z(a) === e; }; var isLazy = function isLazy(a) { return z(a) === t; }; var isMemo = function isMemo(a) { return z(a) === r; }; var isPortal = function isPortal(a) { return z(a) === d; }; var isProfiler = function isProfiler(a) { return z(a) === g; }; var isStrictMode = function isStrictMode(a) { return z(a) === f; }; var isSuspense = function isSuspense(a) { return z(a) === p; }; var isValidElementType = function isValidElementType(a) { return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v); }; var typeOf = z; var reactIs_production_min = { AsyncMode: AsyncMode, ConcurrentMode: ConcurrentMode, ContextConsumer: ContextConsumer, ContextProvider: ContextProvider, Element: Element, ForwardRef: ForwardRef, Fragment: Fragment, Lazy: Lazy, Memo: Memo, Portal: Portal, Profiler: Profiler, StrictMode: StrictMode, Suspense: Suspense, isAsyncMode: isAsyncMode, isConcurrentMode: isConcurrentMode, isContextConsumer: isContextConsumer, isContextProvider: isContextProvider, isElement: isElement, isForwardRef: isForwardRef, isFragment: isFragment, isLazy: isLazy, isMemo: isMemo, isPortal: isPortal, isProfiler: isProfiler, isStrictMode: isStrictMode, isSuspense: isSuspense, isValidElementType: isValidElementType, typeOf: typeOf }; var reactIs_development = createCommonjsModule(function (module, exports) { }); var reactIs_development_1 = reactIs_development.AsyncMode; var reactIs_development_2 = reactIs_development.ConcurrentMode; var reactIs_development_3 = reactIs_development.ContextConsumer; var reactIs_development_4 = reactIs_development.ContextProvider; var reactIs_development_5 = reactIs_development.Element; var reactIs_development_6 = reactIs_development.ForwardRef; var reactIs_development_7 = reactIs_development.Fragment; var reactIs_development_8 = reactIs_development.Lazy; var reactIs_development_9 = reactIs_development.Memo; var reactIs_development_10 = reactIs_development.Portal; var reactIs_development_11 = reactIs_development.Profiler; var reactIs_development_12 = reactIs_development.StrictMode; var reactIs_development_13 = reactIs_development.Suspense; var reactIs_development_14 = reactIs_development.isAsyncMode; var reactIs_development_15 = reactIs_development.isConcurrentMode; var reactIs_development_16 = reactIs_development.isContextConsumer; var reactIs_development_17 = reactIs_development.isContextProvider; var reactIs_development_18 = reactIs_development.isElement; var reactIs_development_19 = reactIs_development.isForwardRef; var reactIs_development_20 = reactIs_development.isFragment; var reactIs_development_21 = reactIs_development.isLazy; var reactIs_development_22 = reactIs_development.isMemo; var reactIs_development_23 = reactIs_development.isPortal; var reactIs_development_24 = reactIs_development.isProfiler; var reactIs_development_25 = reactIs_development.isStrictMode; var reactIs_development_26 = reactIs_development.isSuspense; var reactIs_development_27 = reactIs_development.isValidElementType; var reactIs_development_28 = reactIs_development.typeOf; var reactIs = createCommonjsModule(function (module) { { module.exports = reactIs_production_min; } }); /* object-assign (c) Sindre Sorhus @license MIT */ /* eslint-disable no-unused-vars */ var getOwnPropertySymbols = Object.getOwnPropertySymbols; var hasOwnProperty = Object.prototype.hasOwnProperty; var propIsEnumerable = Object.prototype.propertyIsEnumerable; function toObject(val) { if (val === null || val === undefined) { throw new TypeError('Object.assign cannot be called with null or undefined'); } return Object(val); } function shouldUseNative() { try { if (!Object.assign) { return false; } // Detect buggy property enumeration order in older V8 versions. // https://bugs.chromium.org/p/v8/issues/detail?id=4118 var test1 = new String('abc'); // eslint-disable-line no-new-wrappers test1[5] = 'de'; if (Object.getOwnPropertyNames(test1)[0] === '5') { return false; } // https://bugs.chromium.org/p/v8/issues/detail?id=3056 var test2 = {}; for (var i = 0; i < 10; i++) { test2['_' + String.fromCharCode(i)] = i; } var order2 = Object.getOwnPropertyNames(test2).map(function (n) { return test2[n]; }); if (order2.join('') !== '0123456789') { return false; } // https://bugs.chromium.org/p/v8/issues/detail?id=3056 var test3 = {}; 'abcdefghijklmnopqrst'.split('').forEach(function (letter) { test3[letter] = letter; }); if (Object.keys(Object.assign({}, test3)).join('') !== 'abcdefghijklmnopqrst') { return false; } return true; } catch (err) { // We don't expect any of the above to throw, but better to be safe. return false; } } var objectAssign = shouldUseNative() ? Object.assign : function (target, source) { var from; var to = toObject(target); var symbols; for (var s = 1; s < arguments.length; s++) { from = Object(arguments[s]); for (var key in from) { if (hasOwnProperty.call(from, key)) { to[key] = from[key]; } } if (getOwnPropertySymbols) { symbols = getOwnPropertySymbols(from); for (var i = 0; i < symbols.length; i++) { if (propIsEnumerable.call(from, symbols[i])) { to[symbols[i]] = from[symbols[i]]; } } } } return to; }; /** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'; var ReactPropTypesSecret_1 = ReactPropTypesSecret; var has = Function.call.bind(Object.prototype.hasOwnProperty); function emptyFunction() {} function emptyFunctionWithReset() {} emptyFunctionWithReset.resetWarningCache = emptyFunction; var factoryWithThrowingShims = function factoryWithThrowingShims() { function shim(props, propName, componentName, location, propFullName, secret) { if (secret === ReactPropTypesSecret_1) { // It is still safe when called from React. return; } var err = new Error('Calling PropTypes validators directly is not supported by the `prop-types` package. ' + 'Use PropTypes.checkPropTypes() to call them. ' + 'Read more at http://fb.me/use-check-prop-types'); err.name = 'Invariant Violation'; throw err; } shim.isRequired = shim; function getShim() { return shim; } // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`. var ReactPropTypes = { array: shim, bool: shim, func: shim, number: shim, object: shim, string: shim, symbol: shim, any: shim, arrayOf: getShim, element: shim, elementType: shim, instanceOf: getShim, node: shim, objectOf: getShim, oneOf: getShim, oneOfType: getShim, shape: getShim, exact: getShim, checkPropTypes: emptyFunctionWithReset, resetWarningCache: emptyFunction }; ReactPropTypes.PropTypes = ReactPropTypes; return ReactPropTypes; }; var propTypes = createCommonjsModule(function (module) { /** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ { // By explicitly using `prop-types` you are opting into new production behavior. // http://fb.me/prop-types-in-prod module.exports = factoryWithThrowingShims(); } }); var classnames = createCommonjsModule(function (module) { /*! Copyright (c) 2017 Jed Watson. Licensed under the MIT License (MIT), see http://jedwatson.github.io/classnames */ /* global define */ (function () { var hasOwn = {}.hasOwnProperty; function classNames() { var classes = []; for (var i = 0; i < arguments.length; i++) { var arg = arguments[i]; if (!arg) continue; var argType = typeof arg; if (argType === 'string' || argType === 'number') { classes.push(arg); } else if (Array.isArray(arg) && arg.length) { var inner = classNames.apply(null, arg); if (inner) { classes.push(inner); } } else if (argType === 'object') { for (var key in arg) { if (hasOwn.call(arg, key) && arg[key]) { classes.push(key); } } } } return classes.join(' '); } if ( module.exports) { classNames.default = classNames; module.exports = classNames; } else { window.classNames = classNames; } })(); }); function getScrollbarWidth() { var scrollDiv = document.createElement('div'); // .modal-scrollbar-measure styles // https://github.com/twbs/bootstrap/blob/v4.0.0-alpha.4/scss/_modal.scss#L106-L113 scrollDiv.style.position = 'absolute'; scrollDiv.style.top = '-9999px'; scrollDiv.style.width = '50px'; scrollDiv.style.height = '50px'; scrollDiv.style.overflow = 'scroll'; document.body.appendChild(scrollDiv); var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth; document.body.removeChild(scrollDiv); return scrollbarWidth; } function setScrollbarWidth(padding) { document.body.style.paddingRight = padding > 0 ? padding + "px" : null; } function isBodyOverflowing() { return document.body.clientWidth < window.innerWidth; } function getOriginalBodyPadding() { var style = window.getComputedStyle(document.body, null); return parseInt(style && style.getPropertyValue('padding-right') || 0, 10); } function conditionallyUpdateScrollbar() { var scrollbarWidth = getScrollbarWidth(); // https://github.com/twbs/bootstrap/blob/v4.0.0-alpha.6/js/src/modal.js#L433 var fixedContent = document.querySelectorAll('.fixed-top, .fixed-bottom, .is-fixed, .sticky-top')[0]; var bodyPadding = fixedContent ? parseInt(fixedContent.style.paddingRight || 0, 10) : 0; if (isBodyOverflowing()) { setScrollbarWidth(bodyPadding + scrollbarWidth); } } var globalCssModule; function setGlobalCssModule(cssModule) { globalCssModule = cssModule; } function mapToCssModules(className, cssModule) { if (className === void 0) { className = ''; } if (cssModule === void 0) { cssModule = globalCssModule; } if (!cssModule) return className; return className.split(' ').map(function (c) { return cssModule[c] || c; }).join(' '); } /** * Returns a new object with the key/value pairs from `obj` that are not in the array `omitKeys`. */ function omit(obj, omitKeys) { var result = {}; Object.keys(obj).forEach(function (key) { if (omitKeys.indexOf(key) === -1) { result[key] = obj[key]; } }); return result; } /** * Returns a filtered copy of an object with only the specified keys. */ function pick(obj, keys) { var pickKeys = Array.isArray(keys) ? keys : [keys]; var length = pickKeys.length; var key; var result = {}; while (length > 0) { length -= 1; key = pickKeys[length]; result[key] = obj[key]; } return result; } var warned = {}; function warnOnce(message) { if (!warned[message]) { /* istanbul ignore else */ if (typeof console !== 'undefined') { console.error(message); // eslint-disable-line no-console } warned[message] = true; } } function deprecated(propType, explanation) { return function validate(props, propName, componentName) { if (props[propName] !== null && typeof props[propName] !== 'undefined') { warnOnce("\"" + propName + "\" property of \"" + componentName + "\" has been deprecated.\n" + explanation); } for (var _len = arguments.length, rest = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) { rest[_key - 3] = arguments[_key]; } return propType.apply(void 0, [props, propName, componentName].concat(rest)); }; } // Shim Element if needed (e.g. in Node environment) var Element$1 = typeof window === 'object' && window.Element || function () {}; function DOMElement(props, propName, componentName) { if (!(props[propName] instanceof Element$1)) { return new Error('Invalid prop `' + propName + '` supplied to `' + componentName + '`. Expected prop to be an instance of Element. Validation failed.'); } } var targetPropType = propTypes.oneOfType([propTypes.string, propTypes.func, DOMElement, propTypes.shape({ current: propTypes.any })]); var tagPropType = propTypes.oneOfType([propTypes.func, propTypes.string, propTypes.shape({ $$typeof: propTypes.symbol, render: propTypes.func }), propTypes.arrayOf(propTypes.oneOfType([propTypes.func, propTypes.string, propTypes.shape({ $$typeof: propTypes.symbol, render: propTypes.func })]))]); /* eslint key-spacing: ["error", { afterColon: true, align: "value" }] */ // These are all setup to match what is in the bootstrap _variables.scss // https://github.com/twbs/bootstrap/blob/v4-dev/scss/_variables.scss var TransitionTimeouts = { Fade: 150, // $transition-fade Collapse: 350, // $transition-collapse Modal: 300, // $modal-transition Carousel: 600 // $carousel-transition }; // Duplicated Transition.propType keys to ensure that Reactstrap builds // for distribution properly exclude these keys for nested child HTML attributes // since `react-transition-group` removes propTypes in production builds. var TransitionPropTypeKeys = ['in', 'mountOnEnter', 'unmountOnExit', 'appear', 'enter', 'exit', 'timeout', 'onEnter', 'onEntering', 'onEntered', 'onExit', 'onExiting', 'onExited']; var TransitionStatuses = { ENTERING: 'entering', ENTERED: 'entered', EXITING: 'exiting', EXITED: 'exited' }; var keyCodes = { esc: 27, space: 32, enter: 13, tab: 9, up: 38, down: 40, home: 36, end: 35, n: 78, p: 80 }; var 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']; var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement); function isReactRefObj(target) { if (target && typeof target === 'object') { return 'current' in target; } return false; } function getTag(value) { if (value == null) { return value === undefined ? '[object Undefined]' : '[object Null]'; } return Object.prototype.toString.call(value); } function toNumber(value) { var type = typeof value; var NAN = 0 / 0; if (type === 'number') { return value; } if (type === 'symbol' || type === 'object' && getTag(value) === '[object Symbol]') { return NAN; } if (isObject(value)) { var other = typeof value.valueOf === 'function' ? value.valueOf() : value; value = isObject(other) ? "" + other : other; } if (type !== 'string') { return value === 0 ? value : +value; } value = value.replace(/^\s+|\s+$/g, ''); var isBinary = /^0b[01]+$/i.test(value); return isBinary || /^0o[0-7]+$/i.test(value) ? parseInt(value.slice(2), isBinary ? 2 : 8) : /^[-+]0x[0-9a-f]+$/i.test(value) ? NAN : +value; } function isObject(value) { var type = typeof value; return value != null && (type === 'object' || type === 'function'); } function isFunction(value) { if (!isObject(value)) { return false; } var tag = getTag(value); return tag === '[object Function]' || tag === '[object AsyncFunction]' || tag === '[object GeneratorFunction]' || tag === '[object Proxy]'; } function findDOMElements(target) { if (isReactRefObj(target)) { return target.current; } if (isFunction(target)) { return target(); } if (typeof target === 'string' && canUseDOM) { var selection = document.querySelectorAll(target); if (!selection.length) { selection = document.querySelectorAll("#" + target); } if (!selection.length) { throw new Error("The target '" + target + "' could not be identified in the dom, tip: check spelling"); } return selection; } return target; } function isArrayOrNodeList(els) { if (els === null) { return false; } return Array.isArray(els) || canUseDOM && typeof els.length === 'number'; } function getTarget(target, allElements) { var els = findDOMElements(target); if (allElements) { if (isArrayOrNodeList(els)) { return els; } if (els === null) { return []; } return [els]; } else { if (isArrayOrNodeList(els)) { return els[0]; } return els; } } var defaultToggleEvents = ['touchstart', 'click']; function addMultipleEventListeners(_els, handler, _events, useCapture) { var els = _els; if (!isArrayOrNodeList(els)) { els = [els]; } var events = _events; if (typeof events === 'string') { events = events.split(/\s+/); } if (!isArrayOrNodeList(els) || typeof handler !== 'function' || !Array.isArray(events)) { 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 "); } Array.prototype.forEach.call(events, function (event) { Array.prototype.forEach.call(els, function (el) { el.addEventListener(event, handler, useCapture); }); }); return function removeEvents() { Array.prototype.forEach.call(events, function (event) { Array.prototype.forEach.call(els, function (el) { el.removeEventListener(event, handler, useCapture); }); }); }; } var focusableElements = ['a[href]', 'area[href]', 'input:not([disabled]):not([type=hidden])', 'select:not([disabled])', 'textarea:not([disabled])', 'button:not([disabled])', 'object', 'embed', '[tabindex]:not(.modal)', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable="false"])']; var utils = /*#__PURE__*/Object.freeze({ __proto__: null, getScrollbarWidth: getScrollbarWidth, setScrollbarWidth: setScrollbarWidth, isBodyOverflowing: isBodyOverflowing, getOriginalBodyPadding: getOriginalBodyPadding, conditionallyUpdateScrollbar: conditionallyUpdateScrollbar, setGlobalCssModule: setGlobalCssModule, mapToCssModules: mapToCssModules, omit: omit, pick: pick, warnOnce: warnOnce, deprecated: deprecated, DOMElement: DOMElement, targetPropType: targetPropType, tagPropType: tagPropType, TransitionTimeouts: TransitionTimeouts, TransitionPropTypeKeys: TransitionPropTypeKeys, TransitionStatuses: TransitionStatuses, keyCodes: keyCodes, PopperPlacements: PopperPlacements, canUseDOM: canUseDOM, isReactRefObj: isReactRefObj, toNumber: toNumber, isObject: isObject, isFunction: isFunction, findDOMElements: findDOMElements, isArrayOrNodeList: isArrayOrNodeList, getTarget: getTarget, defaultToggleEvents: defaultToggleEvents, addMultipleEventListeners: addMultipleEventListeners, focusableElements: focusableElements }); var propTypes$1 = { tag: tagPropType, fluid: propTypes.oneOfType([propTypes.bool, propTypes.string]), className: propTypes.string, cssModule: propTypes.object }; var defaultProps = { tag: 'div' }; var Container = function Container(props) { var className = props.className, cssModule = props.cssModule, fluid = props.fluid, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "fluid", "tag"]); var containerClass = 'container'; if (fluid === true) { containerClass = 'container-fluid'; } else if (fluid) { containerClass = "container-" + fluid; } var classes = mapToCssModules(classnames(className, containerClass), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; Container.propTypes = propTypes$1; Container.defaultProps = defaultProps; var rowColWidths = ['xs', 'sm', 'md', 'lg', 'xl']; var rowColsPropType = propTypes.oneOfType([propTypes.number, propTypes.string]); var propTypes$2 = { tag: tagPropType, noGutters: propTypes.bool, className: propTypes.string, cssModule: propTypes.object, form: propTypes.bool, xs: rowColsPropType, sm: rowColsPropType, md: rowColsPropType, lg: rowColsPropType, xl: rowColsPropType }; var defaultProps$1 = { tag: 'div', widths: rowColWidths }; var Row = function Row(props) { var className = props.className, cssModule = props.cssModule, noGutters = props.noGutters, Tag = props.tag, form = props.form, widths = props.widths, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "noGutters", "tag", "form", "widths"]); var colClasses = []; widths.forEach(function (colWidth, i) { var colSize = props[colWidth]; delete attributes[colWidth]; if (!colSize) { return; } var isXs = !i; colClasses.push(isXs ? "row-cols-" + colSize : "row-cols-" + colWidth + "-" + colSize); }); var classes = mapToCssModules(classnames(className, noGutters ? 'no-gutters' : null, form ? 'form-row' : 'row', colClasses), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; Row.propTypes = propTypes$2; Row.defaultProps = defaultProps$1; var colWidths = ['xs', 'sm', 'md', 'lg', 'xl']; var stringOrNumberProp = propTypes.oneOfType([propTypes.number, propTypes.string]); var columnProps = propTypes.oneOfType([propTypes.bool, propTypes.number, propTypes.string, propTypes.shape({ size: propTypes.oneOfType([propTypes.bool, propTypes.number, propTypes.string]), order: stringOrNumberProp, offset: stringOrNumberProp })]); var propTypes$3 = { tag: tagPropType, xs: columnProps, sm: columnProps, md: columnProps, lg: columnProps, xl: columnProps, className: propTypes.string, cssModule: propTypes.object, widths: propTypes.array }; var defaultProps$2 = { tag: 'div', widths: colWidths }; var getColumnSizeClass = function getColumnSizeClass(isXs, colWidth, colSize) { if (colSize === true || colSize === '') { return isXs ? 'col' : "col-" + colWidth; } else if (colSize === 'auto') { return isXs ? 'col-auto' : "col-" + colWidth + "-auto"; } return isXs ? "col-" + colSize : "col-" + colWidth + "-" + colSize; }; var Col = function Col(props) { var className = props.className, cssModule = props.cssModule, widths = props.widths, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "widths", "tag"]); var colClasses = []; widths.forEach(function (colWidth, i) { var columnProp = props[colWidth]; delete attributes[colWidth]; if (!columnProp && columnProp !== '') { return; } var isXs = !i; if (isObject(columnProp)) { var _classNames; var colSizeInterfix = isXs ? '-' : "-" + colWidth + "-"; var colClass = getColumnSizeClass(isXs, colWidth, columnProp.size); colClasses.push(mapToCssModules(classnames((_classNames = {}, _classNames[colClass] = columnProp.size || columnProp.size === '', _classNames["order" + colSizeInterfix + columnProp.order] = columnProp.order || columnProp.order === 0, _classNames["offset" + colSizeInterfix + columnProp.offset] = columnProp.offset || columnProp.offset === 0, _classNames)), cssModule)); } else { var _colClass = getColumnSizeClass(isXs, colWidth, columnProp); colClasses.push(_colClass); } }); if (!colClasses.length) { colClasses.push('col'); } var classes = mapToCssModules(classnames(className, colClasses), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; Col.propTypes = propTypes$3; Col.defaultProps = defaultProps$2; var propTypes$4 = { light: propTypes.bool, dark: propTypes.bool, full: propTypes.bool, fixed: propTypes.string, sticky: propTypes.string, color: propTypes.string, role: propTypes.string, tag: tagPropType, className: propTypes.string, cssModule: propTypes.object, expand: propTypes.oneOfType([propTypes.bool, propTypes.string]) }; var defaultProps$3 = { tag: 'nav', expand: false }; var getExpandClass = function getExpandClass(expand) { if (expand === false) { return false; } else if (expand === true || expand === 'xs') { return 'navbar-expand'; } return "navbar-expand-" + expand; }; var Navbar = function Navbar(props) { var _classNames; var expand = props.expand, className = props.className, cssModule = props.cssModule, light = props.light, dark = props.dark, fixed = props.fixed, sticky = props.sticky, color = props.color, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["expand", "className", "cssModule", "light", "dark", "fixed", "sticky", "color", "tag"]); var classes = mapToCssModules(classnames(className, 'navbar', getExpandClass(expand), (_classNames = { 'navbar-light': light, 'navbar-dark': dark }, _classNames["bg-" + color] = color, _classNames["fixed-" + fixed] = fixed, _classNames["sticky-" + sticky] = sticky, _classNames)), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; Navbar.propTypes = propTypes$4; Navbar.defaultProps = defaultProps$3; var propTypes$5 = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$4 = { tag: 'a' }; var NavbarBrand = function NavbarBrand(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'navbar-brand'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; NavbarBrand.propTypes = propTypes$5; NavbarBrand.defaultProps = defaultProps$4; var propTypes$6 = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$5 = { tag: 'span' }; var NavbarText = function NavbarText(props) { var className = props.className, cssModule = props.cssModule, active = props.active, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "active", "tag"]); var classes = mapToCssModules(classnames(className, 'navbar-text'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; NavbarText.propTypes = propTypes$6; NavbarText.defaultProps = defaultProps$5; var propTypes$7 = { tag: tagPropType, type: propTypes.string, className: propTypes.string, cssModule: propTypes.object, children: propTypes.node }; var defaultProps$6 = { tag: 'button', type: 'button' }; var NavbarToggler = function NavbarToggler(props) { var className = props.className, cssModule = props.cssModule, children = props.children, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "children", "tag"]); var classes = mapToCssModules(classnames(className, 'navbar-toggler'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({ "aria-label": "Toggle navigation" }, attributes, { className: classes }), children || /*#__PURE__*/React__default.createElement("span", { className: mapToCssModules('navbar-toggler-icon', cssModule) })); }; NavbarToggler.propTypes = propTypes$7; NavbarToggler.defaultProps = defaultProps$6; var propTypes$8 = { tabs: propTypes.bool, pills: propTypes.bool, vertical: propTypes.oneOfType([propTypes.bool, propTypes.string]), horizontal: propTypes.string, justified: propTypes.bool, fill: propTypes.bool, navbar: propTypes.bool, card: propTypes.bool, tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$7 = { tag: 'ul', vertical: false }; var getVerticalClass = function getVerticalClass(vertical) { if (vertical === false) { return false; } else if (vertical === true || vertical === 'xs') { return 'flex-column'; } return "flex-" + vertical + "-column"; }; var Nav = function Nav(props) { var className = props.className, cssModule = props.cssModule, tabs = props.tabs, pills = props.pills, vertical = props.vertical, horizontal = props.horizontal, justified = props.justified, fill = props.fill, navbar = props.navbar, card = props.card, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tabs", "pills", "vertical", "horizontal", "justified", "fill", "navbar", "card", "tag"]); var classes = mapToCssModules(classnames(className, navbar ? 'navbar-nav' : 'nav', horizontal ? "justify-content-" + horizontal : false, getVerticalClass(vertical), { 'nav-tabs': tabs, 'card-header-tabs': card && tabs, 'nav-pills': pills, 'card-header-pills': card && pills, 'nav-justified': justified, 'nav-fill': fill }), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; Nav.propTypes = propTypes$8; Nav.defaultProps = defaultProps$7; var propTypes$9 = { tag: tagPropType, active: propTypes.bool, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$8 = { tag: 'li' }; var NavItem = function NavItem(props) { var className = props.className, cssModule = props.cssModule, active = props.active, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "active", "tag"]); var classes = mapToCssModules(classnames(className, 'nav-item', active ? 'active' : false), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; NavItem.propTypes = propTypes$9; NavItem.defaultProps = defaultProps$8; var propTypes$a = { tag: tagPropType, innerRef: propTypes.oneOfType([propTypes.object, propTypes.func, propTypes.string]), disabled: propTypes.bool, active: propTypes.bool, className: propTypes.string, cssModule: propTypes.object, onClick: propTypes.func, href: propTypes.any }; var defaultProps$9 = { tag: 'a' }; var NavLink = /*#__PURE__*/function (_React$Component) { _inheritsLoose(NavLink, _React$Component); function NavLink(props) { var _this; _this = _React$Component.call(this, props) || this; _this.onClick = _this.onClick.bind(_assertThisInitialized(_this)); return _this; } var _proto = NavLink.prototype; _proto.onClick = function onClick(e) { if (this.props.disabled) { e.preventDefault(); return; } if (this.props.href === '#') { e.preventDefault(); } if (this.props.onClick) { this.props.onClick(e); } }; _proto.render = function render() { var _this$props = this.props, className = _this$props.className, cssModule = _this$props.cssModule, active = _this$props.active, Tag = _this$props.tag, innerRef = _this$props.innerRef, attributes = _objectWithoutPropertiesLoose(_this$props, ["className", "cssModule", "active", "tag", "innerRef"]); var classes = mapToCssModules(classnames(className, 'nav-link', { disabled: attributes.disabled, active: active }), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { ref: innerRef, onClick: this.onClick, className: classes })); }; return NavLink; }(React__default.Component); NavLink.propTypes = propTypes$a; NavLink.defaultProps = defaultProps$9; var propTypes$b = { tag: tagPropType, listTag: tagPropType, className: propTypes.string, listClassName: propTypes.string, cssModule: propTypes.object, children: propTypes.node, 'aria-label': propTypes.string }; var defaultProps$a = { tag: 'nav', listTag: 'ol', 'aria-label': 'breadcrumb' }; var Breadcrumb = function Breadcrumb(props) { var className = props.className, listClassName = props.listClassName, cssModule = props.cssModule, children = props.children, Tag = props.tag, ListTag = props.listTag, label = props['aria-label'], attributes = _objectWithoutPropertiesLoose(props, ["className", "listClassName", "cssModule", "children", "tag", "listTag", "aria-label"]); var classes = mapToCssModules(classnames(className), cssModule); var listClasses = mapToCssModules(classnames('breadcrumb', listClassName), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes, "aria-label": label }), /*#__PURE__*/React__default.createElement(ListTag, { className: listClasses }, children)); }; Breadcrumb.propTypes = propTypes$b; Breadcrumb.defaultProps = defaultProps$a; var propTypes$c = { tag: tagPropType, active: propTypes.bool, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$b = { tag: 'li' }; var BreadcrumbItem = function BreadcrumbItem(props) { var className = props.className, cssModule = props.cssModule, active = props.active, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "active", "tag"]); var classes = mapToCssModules(classnames(className, active ? 'active' : false, 'breadcrumb-item'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes, "aria-current": active ? 'page' : undefined })); }; BreadcrumbItem.propTypes = propTypes$c; BreadcrumbItem.defaultProps = defaultProps$b; var propTypes$d = { active: propTypes.bool, 'aria-label': propTypes.string, block: propTypes.bool, color: propTypes.string, disabled: propTypes.bool, outline: propTypes.bool, tag: tagPropType, innerRef: propTypes.oneOfType([propTypes.object, propTypes.func, propTypes.string]), onClick: propTypes.func, size: propTypes.string, children: propTypes.node, className: propTypes.string, cssModule: propTypes.object, close: propTypes.bool }; var defaultProps$c = { color: 'secondary', tag: 'button' }; var Button = /*#__PURE__*/function (_React$Component) { _inheritsLoose(Button, _React$Component); function Button(props) { var _this; _this = _React$Component.call(this, props) || this; _this.onClick = _this.onClick.bind(_assertThisInitialized(_this)); return _this; } var _proto = Button.prototype; _proto.onClick = function onClick(e) { if (this.props.disabled) { e.preventDefault(); return; } if (this.props.onClick) { return this.props.onClick(e); } }; _proto.render = function render() { var _this$props = this.props, active = _this$props.active, ariaLabel = _this$props['aria-label'], block = _this$props.block, className = _this$props.className, close = _this$props.close, cssModule = _this$props.cssModule, color = _this$props.color, outline = _this$props.outline, size = _this$props.size, Tag = _this$props.tag, innerRef = _this$props.innerRef, attributes = _objectWithoutPropertiesLoose(_this$props, ["active", "aria-label", "block", "className", "close", "cssModule", "color", "outline", "size", "tag", "innerRef"]); if (close && typeof attributes.children === 'undefined') { attributes.children = /*#__PURE__*/React__default.createElement("span", { "aria-hidden": true }, "\xD7"); } var btnOutlineColor = "btn" + (outline ? '-outline' : '') + "-" + color; var classes = mapToCssModules(classnames(className, { close: close }, close || 'btn', close || btnOutlineColor, size ? "btn-" + size : false, block ? 'btn-block' : false, { active: active, disabled: this.props.disabled }), cssModule); if (attributes.href && Tag === 'button') { Tag = 'a'; } var defaultAriaLabel = close ? 'Close' : null; return /*#__PURE__*/React__default.createElement(Tag, _extends({ type: Tag === 'button' && attributes.onClick ? 'button' : undefined }, attributes, { className: classes, ref: innerRef, onClick: this.onClick, "aria-label": ariaLabel || defaultAriaLabel })); }; return Button; }(React__default.Component); Button.propTypes = propTypes$d; Button.defaultProps = defaultProps$c; var propTypes$e = { onClick: propTypes.func, onBlur: propTypes.func, onFocus: propTypes.func, defaultValue: propTypes.bool }; var defaultProps$d = { defaultValue: false }; var ButtonToggle = /*#__PURE__*/function (_React$Component) { _inheritsLoose(ButtonToggle, _React$Component); function ButtonToggle(props) { var _this; _this = _React$Component.call(this, props) || this; _this.state = { toggled: props.defaultValue, focus: false }; _this.onBlur = _this.onBlur.bind(_assertThisInitialized(_this)); _this.onFocus = _this.onFocus.bind(_assertThisInitialized(_this)); _this.onClick = _this.onClick.bind(_assertThisInitialized(_this)); return _this; } var _proto = ButtonToggle.prototype; _proto.onBlur = function onBlur(e) { if (this.props.onBlur) { this.props.onBlur(e); } this.setState({ focus: false }); }; _proto.onFocus = function onFocus(e) { if (this.props.onFocus) { this.props.onFocus(e); } this.setState({ focus: true }); }; _proto.onClick = function onClick(e) { if (this.props.onClick) { this.props.onClick(e); } this.setState(function (_ref) { var toggled = _ref.toggled; return { toggled: !toggled }; }); }; _proto.render = function render() { var _this$props = this.props, className = _this$props.className, attributes = _objectWithoutPropertiesLoose(_this$props, ["className"]); var classes = mapToCssModules(classnames(className, { focus: this.state.focus }), this.props.cssModule); return /*#__PURE__*/React__default.createElement(Button, _extends({ active: this.state.toggled, onBlur: this.onBlur, onFocus: this.onFocus, onClick: this.onClick, className: classes }, attributes)); }; return ButtonToggle; }(React__default.Component); ButtonToggle.propTypes = propTypes$e; ButtonToggle.defaultProps = defaultProps$d; /** * DropdownContext * { * toggle: PropTypes.func.isRequired, * isOpen: PropTypes.bool.isRequired, * direction: PropTypes.oneOf(['up', 'down', 'left', 'right']).isRequired, * inNavbar: PropTypes.bool.isRequired, * disabled: PropTypes.bool * } */ var DropdownContext = /*#__PURE__*/React__default.createContext({}); var propTypes$f = { a11y: propTypes.bool, disabled: propTypes.bool, direction: propTypes.oneOf(['up', 'down', 'left', 'right']), group: propTypes.bool, isOpen: propTypes.bool, nav: propTypes.bool, active: propTypes.bool, addonType: propTypes.oneOfType([propTypes.bool, propTypes.oneOf(['prepend', 'append'])]), size: propTypes.string, tag: tagPropType, toggle: propTypes.func, children: propTypes.node, className: propTypes.string, cssModule: propTypes.object, inNavbar: propTypes.bool, setActiveFromChild: propTypes.bool }; var defaultProps$e = { a11y: true, isOpen: false, direction: 'down', nav: false, active: false, addonType: false, inNavbar: false, setActiveFromChild: false }; var preventDefaultKeys = [keyCodes.space, keyCodes.enter, keyCodes.up, keyCodes.down, keyCodes.end, keyCodes.home]; var Dropdown = /*#__PURE__*/function (_React$Component) { _inheritsLoose(Dropdown, _React$Component); function Dropdown(props) { var _this; _this = _React$Component.call(this, props) || this; _this.addEvents = _this.addEvents.bind(_assertThisInitialized(_this)); _this.handleDocumentClick = _this.handleDocumentClick.bind(_assertThisInitialized(_this)); _this.handleKeyDown = _this.handleKeyDown.bind(_assertThisInitialized(_this)); _this.removeEvents = _this.removeEvents.bind(_assertThisInitialized(_this)); _this.toggle = _this.toggle.bind(_assertThisInitialized(_this)); _this.handleMenuRef = _this.handleMenuRef.bind(_assertThisInitialized(_this)); _this.containerRef = /*#__PURE__*/React__default.createRef(); _this.menuRef = /*#__PURE__*/React__default.createRef(); return _this; } var _proto = Dropdown.prototype; _proto.handleMenuRef = function handleMenuRef(menuRef) { this.menuRef.current = menuRef; }; _proto.getContextValue = function getContextValue() { return { toggle: this.toggle, isOpen: this.props.isOpen, direction: this.props.direction === 'down' && this.props.dropup ? 'up' : this.props.direction, inNavbar: this.props.inNavbar, disabled: this.props.disabled, // Callback that should be called by DropdownMenu to provide a ref to // a HTML tag that's used for the DropdownMenu onMenuRef: this.handleMenuRef }; }; _proto.componentDidMount = function componentDidMount() { this.handleProps(); }; _proto.componentDidUpdate = function componentDidUpdate(prevProps) { if (this.props.isOpen !== prevProps.isOpen) { this.handleProps(); } }; _proto.componentWillUnmount = function componentWillUnmount() { this.removeEvents(); }; _proto.getContainer = function getContainer() { return this.containerRef.current; }; _proto.getMenu = function getMenu() { return this.menuRef.current; }; _proto.getMenuCtrl = function getMenuCtrl() { if (this._$menuCtrl) return this._$menuCtrl; this._$menuCtrl = this.getContainer().querySelector('[aria-expanded]'); return this._$menuCtrl; }; _proto.getMenuItems = function getMenuItems() { // In a real menu with a child DropdownMenu, `this.getMenu()` should never // be null, but it is sometimes null in tests. To mitigate that, we just // use `this.getContainer()` as the fallback `menuContainer`. var menuContainer = this.getMenu() || this.getContainer(); return [].slice.call(menuContainer.querySelectorAll('[role="menuitem"]')); }; _proto.addEvents = function addEvents() { var _this2 = this; ['click', 'touchstart', 'keyup'].forEach(function (event) { return document.addEventListener(event, _this2.handleDocumentClick, true); }); }; _proto.removeEvents = function removeEvents() { var _this3 = this; ['click', 'touchstart', 'keyup'].forEach(function (event) { return document.removeEventListener(event, _this3.handleDocumentClick, true); }); }; _proto.handleDocumentClick = function handleDocumentClick(e) { if (e && (e.which === 3 || e.type === 'keyup' && e.which !== keyCodes.tab)) return; var container = this.getContainer(); var menu = this.getMenu(); var clickIsInContainer = container.contains(e.target) && container !== e.target; var clickIsInMenu = menu && menu.contains(e.target) && menu !== e.target; if ((clickIsInContainer || clickIsInMenu) && (e.type !== 'keyup' || e.which === keyCodes.tab)) { return; } this.toggle(e); }; _proto.handleKeyDown = function handleKeyDown(e) { var _this4 = this; var isTargetMenuItem = e.target.getAttribute('role') === 'menuitem'; var isTargetMenuCtrl = this.getMenuCtrl() === e.target; var isTab = keyCodes.tab === e.which; if (/input|textarea/i.test(e.target.tagName) || isTab && !this.props.a11y || isTab && !(isTargetMenuItem || isTargetMenuCtrl)) { return; } if (preventDefaultKeys.indexOf(e.which) !== -1 || e.which >= 48 && e.which <= 90) { e.preventDefault(); } if (this.props.disabled) return; if (isTargetMenuCtrl) { if ([keyCodes.space, keyCodes.enter, keyCodes.up, keyCodes.down].indexOf(e.which) > -1) { // Open the menu (if not open) and focus the first menu item if (!this.props.isOpen) { this.toggle(e); } setTimeout(function () { return _this4.getMenuItems()[0].focus(); }); } else if (this.props.isOpen && isTab) { // Focus the first menu item if tabbing from an open menu. We need this // for cases where the DropdownMenu sets a custom container, which may // not be the natural next item to tab to from the DropdownToggle. e.preventDefault(); this.getMenuItems()[0].focus(); } else if (this.props.isOpen && e.which === keyCodes.esc) { this.toggle(e); } } if (this.props.isOpen && e.target.getAttribute('role') === 'menuitem') { if ([keyCodes.tab, keyCodes.esc].indexOf(e.which) > -1) { this.toggle(e); this.getMenuCtrl().focus(); } else if ([keyCodes.space, keyCodes.enter].indexOf(e.which) > -1) { e.target.click(); this.getMenuCtrl().focus(); } else if ([keyCodes.down, keyCodes.up].indexOf(e.which) > -1 || [keyCodes.n, keyCodes.p].indexOf(e.which) > -1 && e.ctrlKey) { var $menuitems = this.getMenuItems(); var index = $menuitems.indexOf(e.target); if (keyCodes.up === e.which || keyCodes.p === e.which && e.ctrlKey) { index = index !== 0 ? index - 1 : $menuitems.length - 1; } else if (keyCodes.down === e.which || keyCodes.n === e.which && e.ctrlKey) { index = index === $menuitems.length - 1 ? 0 : index + 1; } $menuitems[index].focus(); } else if (keyCodes.end === e.which) { var _$menuitems = this.getMenuItems(); _$menuitems[_$menuitems.length - 1].focus(); } else if (keyCodes.home === e.which) { var _$menuitems2 = this.getMenuItems(); _$menuitems2[0].focus(); } else if (e.which >= 48 && e.which <= 90) { var _$menuitems3 = this.getMenuItems(); var charPressed = String.fromCharCode(e.which).toLowerCase(); for (var i = 0; i < _$menuitems3.length; i += 1) { var firstLetter = _$menuitems3[i].textContent && _$menuitems3[i].textContent[0].toLowerCase(); if (firstLetter === charPressed) { _$menuitems3[i].focus(); break; } } } } }; _proto.handleProps = function handleProps() { if (this.props.isOpen) { this.addEvents(); } else { this.removeEvents(); } }; _proto.toggle = function toggle(e) { if (this.props.disabled) { return e && e.preventDefault(); } return this.props.toggle(e); }; _proto.render = function render() { var _classNames, _ref; var _omit = omit(this.props, ['toggle', 'disabled', 'inNavbar', 'a11y']), className = _omit.className, cssModule = _omit.cssModule, direction = _omit.direction, isOpen = _omit.isOpen, group = _omit.group, size = _omit.size, nav = _omit.nav, setActiveFromChild = _omit.setActiveFromChild, active = _omit.active, addonType = _omit.addonType, tag = _omit.tag, attrs = _objectWithoutPropertiesLoose(_omit, ["className", "cssModule", "direction", "isOpen", "group", "size", "nav", "setActiveFromChild", "active", "addonType", "tag"]); var Tag = tag || (nav ? 'li' : 'div'); var subItemIsActive = false; if (setActiveFromChild) { React__default.Children.map(this.props.children[1].props.children, function (dropdownItem) { if (dropdownItem && dropdownItem.props.active) subItemIsActive = true; }); } var classes = mapToCssModules(classnames(className, direction !== 'down' && "drop" + direction, nav && active ? 'active' : false, setActiveFromChild && subItemIsActive ? 'active' : false, (_classNames = {}, _classNames["input-group-" + addonType] = addonType, _classNames['btn-group'] = group, _classNames["btn-group-" + size] = !!size, _classNames.dropdown = !group && !addonType, _classNames.show = isOpen, _classNames['nav-item'] = nav, _classNames)), cssModule); return /*#__PURE__*/React__default.createElement(DropdownContext.Provider, { value: this.getContextValue() }, /*#__PURE__*/React__default.createElement(reactPopper.Manager, null, /*#__PURE__*/React__default.createElement(Tag, _extends({}, attrs, (_ref = {}, _ref[typeof Tag === 'string' ? 'ref' : 'innerRef'] = this.containerRef, _ref), { onKeyDown: this.handleKeyDown, className: classes })))); }; return Dropdown; }(React__default.Component); Dropdown.propTypes = propTypes$f; Dropdown.defaultProps = defaultProps$e; var propTypes$g = { children: propTypes.node }; var ButtonDropdown = function ButtonDropdown(props) { return /*#__PURE__*/React__default.createElement(Dropdown, _extends({ group: true }, props)); }; ButtonDropdown.propTypes = propTypes$g; var propTypes$h = { tag: tagPropType, 'aria-label': propTypes.string, className: propTypes.string, cssModule: propTypes.object, role: propTypes.string, size: propTypes.string, vertical: propTypes.bool }; var defaultProps$f = { tag: 'div', role: 'group' }; var ButtonGroup = function ButtonGroup(props) { var className = props.className, cssModule = props.cssModule, size = props.size, vertical = props.vertical, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "size", "vertical", "tag"]); var classes = mapToCssModules(classnames(className, size ? 'btn-group-' + size : false, vertical ? 'btn-group-vertical' : 'btn-group'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; ButtonGroup.propTypes = propTypes$h; ButtonGroup.defaultProps = defaultProps$f; var propTypes$i = { tag: tagPropType, 'aria-label': propTypes.string, className: propTypes.string, cssModule: propTypes.object, role: propTypes.string }; var defaultProps$g = { tag: 'div', role: 'toolbar' }; var ButtonToolbar = function ButtonToolbar(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'btn-toolbar'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; ButtonToolbar.propTypes = propTypes$i; ButtonToolbar.defaultProps = defaultProps$g; var propTypes$j = { children: propTypes.node, active: propTypes.bool, disabled: propTypes.bool, divider: propTypes.bool, tag: tagPropType, header: propTypes.bool, onClick: propTypes.func, className: propTypes.string, cssModule: propTypes.object, toggle: propTypes.bool, text: propTypes.bool }; var defaultProps$h = { tag: 'button', toggle: true }; var DropdownItem = /*#__PURE__*/function (_React$Component) { _inheritsLoose(DropdownItem, _React$Component); function DropdownItem(props) { var _this; _this = _React$Component.call(this, props) || this; _this.onClick = _this.onClick.bind(_assertThisInitialized(_this)); _this.getTabIndex = _this.getTabIndex.bind(_assertThisInitialized(_this)); return _this; } var _proto = DropdownItem.prototype; _proto.onClick = function onClick(e) { var _this$props = this.props, disabled = _this$props.disabled, header = _this$props.header, divider = _this$props.divider, text = _this$props.text; if (disabled || header || divider || text) { e.preventDefault(); return; } if (this.props.onClick) { this.props.onClick(e); } if (this.props.toggle) { this.context.toggle(e); } }; _proto.getTabIndex = function getTabIndex() { var _this$props2 = this.props, disabled = _this$props2.disabled, header = _this$props2.header, divider = _this$props2.divider, text = _this$props2.text; if (disabled || header || divider || text) { return '-1'; } return '0'; }; _proto.render = function render() { var tabIndex = this.getTabIndex(); var role = tabIndex > -1 ? 'menuitem' : undefined; var _omit = omit(this.props, ['toggle']), className = _omit.className, cssModule = _omit.cssModule, divider = _omit.divider, Tag = _omit.tag, header = _omit.header, active = _omit.active, text = _omit.text, props = _objectWithoutPropertiesLoose(_omit, ["className", "cssModule", "divider", "tag", "header", "active", "text"]); var classes = mapToCssModules(classnames(className, { disabled: props.disabled, 'dropdown-item': !divider && !header && !text, active: active, 'dropdown-header': header, 'dropdown-divider': divider, 'dropdown-item-text': text }), cssModule); if (Tag === 'button') { if (header) { Tag = 'h6'; } else if (divider) { Tag = 'div'; } else if (props.href) { Tag = 'a'; } else if (text) { Tag = 'span'; } } return /*#__PURE__*/React__default.createElement(Tag, _extends({ type: Tag === 'button' && (props.onClick || this.props.toggle) ? 'button' : undefined }, props, { tabIndex: tabIndex, role: role, className: classes, onClick: this.onClick })); }; return DropdownItem; }(React__default.Component); DropdownItem.propTypes = propTypes$j; DropdownItem.defaultProps = defaultProps$h; DropdownItem.contextType = DropdownContext; var propTypes$k = { tag: tagPropType, children: propTypes.node.isRequired, right: propTypes.bool, flip: propTypes.bool, modifiers: propTypes.object, className: propTypes.string, cssModule: propTypes.object, persist: propTypes.bool, positionFixed: propTypes.bool, container: targetPropType }; var defaultProps$i = { tag: 'div', flip: true }; var noFlipModifier = { flip: { enabled: false } }; var directionPositionMap = { up: 'top', left: 'left', right: 'right', down: 'bottom' }; var DropdownMenu = /*#__PURE__*/function (_React$Component) { _inheritsLoose(DropdownMenu, _React$Component); function DropdownMenu() { return _React$Component.apply(this, arguments) || this; } var _proto = DropdownMenu.prototype; _proto.render = function render() { var _this = this; var _this$props = this.props, className = _this$props.className, cssModule = _this$props.cssModule, right = _this$props.right, tag = _this$props.tag, flip = _this$props.flip, modifiers = _this$props.modifiers, persist = _this$props.persist, positionFixed = _this$props.positionFixed, container = _this$props.container, attrs = _objectWithoutPropertiesLoose(_this$props, ["className", "cssModule", "right", "tag", "flip", "modifiers", "persist", "positionFixed", "container"]); var classes = mapToCssModules(classnames(className, 'dropdown-menu', { 'dropdown-menu-right': right, show: this.context.isOpen }), cssModule); var Tag = tag; if (persist || this.context.isOpen && !this.context.inNavbar) { var position1 = directionPositionMap[this.context.direction] || 'bottom'; var position2 = right ? 'end' : 'start'; var poperPlacement = position1 + "-" + position2; var poperModifiers = !flip ? _extends({}, modifiers, noFlipModifier) : modifiers; var popperPositionFixed = !!positionFixed; var popper = /*#__PURE__*/React__default.createElement(reactPopper.Popper, { placement: poperPlacement, modifiers: poperModifiers, positionFixed: popperPositionFixed }, function (_ref) { var ref = _ref.ref, style = _ref.style, placement = _ref.placement; var combinedStyle = _extends({}, _this.props.style, style); var handleRef = function handleRef(tagRef) { // Send the ref to `react-popper` ref(tagRef); // Send the ref to the parent Dropdown so that clicks outside // it will cause it to close var onMenuRef = _this.context.onMenuRef; if (onMenuRef) onMenuRef(tagRef); }; return /*#__PURE__*/React__default.createElement(Tag, _extends({ tabIndex: "-1", role: "menu", ref: handleRef }, attrs, { style: combinedStyle, "aria-hidden": !_this.context.isOpen, className: classes, "x-placement": placement })); }); if (container) { return /*#__PURE__*/ReactDOM.createPortal(popper, getTarget(container)); } else { return popper; } } return /*#__PURE__*/React__default.createElement(Tag, _extends({ tabIndex: "-1", role: "menu" }, attrs, { "aria-hidden": !this.context.isOpen, className: classes, "x-placement": attrs.placement })); }; return DropdownMenu; }(React__default.Component); DropdownMenu.propTypes = propTypes$k; DropdownMenu.defaultProps = defaultProps$i; DropdownMenu.contextType = DropdownContext; var propTypes$l = { caret: propTypes.bool, color: propTypes.string, children: propTypes.node, className: propTypes.string, cssModule: propTypes.object, disabled: propTypes.bool, onClick: propTypes.func, 'aria-haspopup': propTypes.bool, split: propTypes.bool, tag: tagPropType, nav: propTypes.bool }; var defaultProps$j = { 'aria-haspopup': true, color: 'secondary' }; var DropdownToggle = /*#__PURE__*/function (_React$Component) { _inheritsLoose(DropdownToggle, _React$Component); function DropdownToggle(props) { var _this; _this = _React$Component.call(this, props) || this; _this.onClick = _this.onClick.bind(_assertThisInitialized(_this)); return _this; } var _proto = DropdownToggle.prototype; _proto.onClick = function onClick(e) { if (this.props.disabled || this.context.disabled) { e.preventDefault(); return; } if (this.props.nav && !this.props.tag) { e.preventDefault(); } if (this.props.onClick) { this.props.onClick(e); } this.context.toggle(e); }; _proto.render = function render() { var _this2 = this; var _this$props = this.props, className = _this$props.className, color = _this$props.color, cssModule = _this$props.cssModule, caret = _this$props.caret, split = _this$props.split, nav = _this$props.nav, tag = _this$props.tag, innerRef = _this$props.innerRef, props = _objectWithoutPropertiesLoose(_this$props, ["className", "color", "cssModule", "caret", "split", "nav", "tag", "innerRef"]); var ariaLabel = props['aria-label'] || 'Toggle Dropdown'; var classes = mapToCssModules(classnames(className, { 'dropdown-toggle': caret || split, 'dropdown-toggle-split': split, 'nav-link': nav }), cssModule); var children = typeof props.children !== 'undefined' ? props.children : /*#__PURE__*/React__default.createElement("span", { className: "sr-only" }, ariaLabel); var Tag; if (nav && !tag) { Tag = 'a'; props.href = '#'; } else if (!tag) { Tag = Button; props.color = color; props.cssModule = cssModule; } else { Tag = tag; } if (this.context.inNavbar) { return /*#__PURE__*/React__default.createElement(Tag, _extends({}, props, { className: classes, onClick: this.onClick, "aria-expanded": this.context.isOpen, children: children })); } return /*#__PURE__*/React__default.createElement(reactPopper.Reference, { innerRef: innerRef }, function (_ref) { var _ref2; var ref = _ref.ref; return /*#__PURE__*/React__default.createElement(Tag, _extends({}, props, (_ref2 = {}, _ref2[typeof Tag === 'string' ? 'ref' : 'innerRef'] = ref, _ref2), { className: classes, onClick: _this2.onClick, "aria-expanded": _this2.context.isOpen, children: children })); }); }; return DropdownToggle; }(React__default.Component); DropdownToggle.propTypes = propTypes$l; DropdownToggle.defaultProps = defaultProps$j; DropdownToggle.contextType = DropdownContext; var interopRequireDefault = createCommonjsModule(function (module) { function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } module.exports = _interopRequireDefault; }); unwrapExports(interopRequireDefault); var hasClass_1 = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.default = hasClass; function hasClass(element, className) { if (element.classList) return !!className && element.classList.contains(className);else return (" " + (element.className.baseVal || element.className) + " ").indexOf(" " + className + " ") !== -1; } module.exports = exports["default"]; }); unwrapExports(hasClass_1); var addClass_1 = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.default = addClass; var _hasClass = interopRequireDefault(hasClass_1); function addClass(element, className) { if (element.classList) element.classList.add(className);else if (!(0, _hasClass.default)(element, className)) if (typeof element.className === 'string') element.className = element.className + ' ' + className;else element.setAttribute('class', (element.className && element.className.baseVal || '') + ' ' + className); } module.exports = exports["default"]; }); unwrapExports(addClass_1); function replaceClassName(origClass, classToRemove) { return origClass.replace(new RegExp('(^|\\s)' + classToRemove + '(?:\\s|$)', 'g'), '$1').replace(/\s+/g, ' ').replace(/^\s*|\s*$/g, ''); } var removeClass = function removeClass(element, className) { if (element.classList) element.classList.remove(className);else if (typeof element.className === 'string') element.className = replaceClassName(element.className, className);else element.setAttribute('class', replaceClassName(element.className && element.className.baseVal || '', className)); }; /** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ function componentWillMount() { // Call this.constructor.gDSFP to support sub-classes. var state = this.constructor.getDerivedStateFromProps(this.props, this.state); if (state !== null && state !== undefined) { this.setState(state); } } function componentWillReceiveProps(nextProps) { // Call this.constructor.gDSFP to support sub-classes. // Use the setState() updater to ensure state isn't stale in certain edge cases. function updater(prevState) { var state = this.constructor.getDerivedStateFromProps(nextProps, prevState); return state !== null && state !== undefined ? state : null; } // Binding "this" is important for shallow renderer support. this.setState(updater.bind(this)); } function componentWillUpdate(nextProps, nextState) { try { var prevProps = this.props; var prevState = this.state; this.props = nextProps; this.state = nextState; this.__reactInternalSnapshotFlag = true; this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(prevProps, prevState); } finally { this.props = prevProps; this.state = prevState; } } // React may warn about cWM/cWRP/cWU methods being deprecated. // Add a flag to suppress these warnings for this special case. componentWillMount.__suppressDeprecationWarning = true; componentWillReceiveProps.__suppressDeprecationWarning = true; componentWillUpdate.__suppressDeprecationWarning = true; function polyfill(Component) { var prototype = Component.prototype; if (!prototype || !prototype.isReactComponent) { throw new Error('Can only polyfill class components'); } if (typeof Component.getDerivedStateFromProps !== 'function' && typeof prototype.getSnapshotBeforeUpdate !== 'function') { return Component; } // If new component APIs are defined, "unsafe" lifecycles won't be called. // Error if any of these lifecycles are present, // Because they would work differently between older and newer (16.3+) versions of React. var foundWillMountName = null; var foundWillReceivePropsName = null; var foundWillUpdateName = null; if (typeof prototype.componentWillMount === 'function') { foundWillMountName = 'componentWillMount'; } else if (typeof prototype.UNSAFE_componentWillMount === 'function') { foundWillMountName = 'UNSAFE_componentWillMount'; } if (typeof prototype.componentWillReceiveProps === 'function') { foundWillReceivePropsName = 'componentWillReceiveProps'; } else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') { foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps'; } if (typeof prototype.componentWillUpdate === 'function') { foundWillUpdateName = 'componentWillUpdate'; } else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') { foundWillUpdateName = 'UNSAFE_componentWillUpdate'; } if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) { var componentName = Component.displayName || Component.name; var newApiName = typeof Component.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()'; throw Error('Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' + componentName + ' uses ' + newApiName + ' but also contains the following legacy lifecycles:' + (foundWillMountName !== null ? '\n ' + foundWillMountName : '') + (foundWillReceivePropsName !== null ? '\n ' + foundWillReceivePropsName : '') + (foundWillUpdateName !== null ? '\n ' + foundWillUpdateName : '') + '\n\nThe above lifecycles should be removed. Learn more about this warning here:\n' + 'https://fb.me/react-async-component-lifecycle-hooks'); } // React <= 16.2 does not support static getDerivedStateFromProps. // As a workaround, use cWM and cWRP to invoke the new static lifecycle. // Newer versions of React will ignore these lifecycles if gDSFP exists. if (typeof Component.getDerivedStateFromProps === 'function') { prototype.componentWillMount = componentWillMount; prototype.componentWillReceiveProps = componentWillReceiveProps; } // React <= 16.2 does not support getSnapshotBeforeUpdate. // As a workaround, use cWU to invoke the new lifecycle. // Newer versions of React will ignore that lifecycle if gSBU exists. if (typeof prototype.getSnapshotBeforeUpdate === 'function') { if (typeof prototype.componentDidUpdate !== 'function') { throw new Error('Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype'); } prototype.componentWillUpdate = componentWillUpdate; var componentDidUpdate = prototype.componentDidUpdate; prototype.componentDidUpdate = function componentDidUpdatePolyfill(prevProps, prevState, maybeSnapshot) { // 16.3+ will not execute our will-update method; // It will pass a snapshot value to did-update though. // Older versions will require our polyfilled will-update value. // We need to handle both cases, but can't just check for the presence of "maybeSnapshot", // Because for <= 15.x versions this might be a "prevContext" object. // We also can't just check "__reactInternalSnapshot", // Because get-snapshot might return a falsy value. // So check for the explicit __reactInternalSnapshotFlag flag to determine behavior. var snapshot = this.__reactInternalSnapshotFlag ? this.__reactInternalSnapshot : maybeSnapshot; componentDidUpdate.call(this, prevProps, prevState, snapshot); }; } return Component; } var reactLifecyclesCompat_es = /*#__PURE__*/Object.freeze({ __proto__: null, polyfill: polyfill }); var PropTypes = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.classNamesShape = exports.timeoutsShape = void 0; var _propTypes = _interopRequireDefault(propTypes); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var timeoutsShape = null; exports.timeoutsShape = timeoutsShape; var classNamesShape = null; exports.classNamesShape = classNamesShape; }); unwrapExports(PropTypes); var PropTypes_1 = PropTypes.classNamesShape; var PropTypes_2 = PropTypes.timeoutsShape; var _reactLifecyclesCompat = getCjsExportFromNamespace(reactLifecyclesCompat_es); var Transition_1 = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.default = exports.EXITING = exports.ENTERED = exports.ENTERING = exports.EXITED = exports.UNMOUNTED = void 0; var PropTypes = _interopRequireWildcard(propTypes); var _react = _interopRequireDefault(React__default); var _reactDom = _interopRequireDefault(ReactDOM); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } var UNMOUNTED = 'unmounted'; exports.UNMOUNTED = UNMOUNTED; var EXITED = 'exited'; exports.EXITED = EXITED; var ENTERING = 'entering'; exports.ENTERING = ENTERING; var ENTERED = 'entered'; exports.ENTERED = ENTERED; var EXITING = 'exiting'; /** * The Transition component lets you describe a transition from one component * state to another _over time_ with a simple declarative API. Most commonly * it's used to animate the mounting and unmounting of a component, but can also * be used to describe in-place transition states as well. * * --- * * **Note**: `Transition` is a platform-agnostic base component. If you're using * transitions in CSS, you'll probably want to use * [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition) * instead. It inherits all the features of `Transition`, but contains * additional features necessary to play nice with CSS transitions (hence the * name of the component). * * --- * * By default the `Transition` component does not alter the behavior of the * component it renders, it only tracks "enter" and "exit" states for the * components. It's up to you to give meaning and effect to those states. For * example we can add styles to a component when it enters or exits: * * ```jsx * import { Transition } from 'react-transition-group'; * * const duration = 300; * * const defaultStyle = { * transition: `opacity ${duration}ms ease-in-out`, * opacity: 0, * } * * const transitionStyles = { * entering: { opacity: 0 }, * entered: { opacity: 1 }, * }; * * const Fade = ({ in: inProp }) => ( * * {state => ( *
* I'm a fade Transition! *
* )} *
* ); * ``` * * There are 4 main states a Transition can be in: * - `'entering'` * - `'entered'` * - `'exiting'` * - `'exited'` * * Transition state is toggled via the `in` prop. When `true` the component * begins the "Enter" stage. During this stage, the component will shift from * its current transition state, to `'entering'` for the duration of the * transition and then to the `'entered'` stage once it's complete. Let's take * the following example (we'll use the * [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook): * * ```jsx * function App() { * const [inProp, setInProp] = useState(false); * return ( *
* * {state => ( * // ... * )} * * *
* ); * } * ``` * * When the button is clicked the component will shift to the `'entering'` state * and stay there for 500ms (the value of `timeout`) before it finally switches * to `'entered'`. * * When `in` is `false` the same thing happens except the state moves from * `'exiting'` to `'exited'`. */ exports.EXITING = EXITING; var Transition = /*#__PURE__*/function (_React$Component) { _inheritsLoose(Transition, _React$Component); function Transition(props, context) { var _this; _this = _React$Component.call(this, props, context) || this; var parentGroup = context.transitionGroup; // In the context of a TransitionGroup all enters are really appears var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear; var initialStatus; _this.appearStatus = null; if (props.in) { if (appear) { initialStatus = EXITED; _this.appearStatus = ENTERING; } else { initialStatus = ENTERED; } } else { if (props.unmountOnExit || props.mountOnEnter) { initialStatus = UNMOUNTED; } else { initialStatus = EXITED; } } _this.state = { status: initialStatus }; _this.nextCallback = null; return _this; } var _proto = Transition.prototype; _proto.getChildContext = function getChildContext() { return { transitionGroup: null // allows for nested Transitions }; }; Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) { var nextIn = _ref.in; if (nextIn && prevState.status === UNMOUNTED) { return { status: EXITED }; } return null; }; // getSnapshotBeforeUpdate(prevProps) { // let nextStatus = null // if (prevProps !== this.props) { // const { status } = this.state // if (this.props.in) { // if (status !== ENTERING && status !== ENTERED) { // nextStatus = ENTERING // } // } else { // if (status === ENTERING || status === ENTERED) { // nextStatus = EXITING // } // } // } // return { nextStatus } // } _proto.componentDidMount = function componentDidMount() { this.updateStatus(true, this.appearStatus); }; _proto.componentDidUpdate = function componentDidUpdate(prevProps) { var nextStatus = null; if (prevProps !== this.props) { var status = this.state.status; if (this.props.in) { if (status !== ENTERING && status !== ENTERED) { nextStatus = ENTERING; } } else { if (status === ENTERING || status === ENTERED) { nextStatus = EXITING; } } } this.updateStatus(false, nextStatus); }; _proto.componentWillUnmount = function componentWillUnmount() { this.cancelNextCallback(); }; _proto.getTimeouts = function getTimeouts() { var timeout = this.props.timeout; var exit, enter, appear; exit = enter = appear = timeout; if (timeout != null && typeof timeout !== 'number') { exit = timeout.exit; enter = timeout.enter; // TODO: remove fallback for next major appear = timeout.appear !== undefined ? timeout.appear : enter; } return { exit: exit, enter: enter, appear: appear }; }; _proto.updateStatus = function updateStatus(mounting, nextStatus) { if (mounting === void 0) { mounting = false; } if (nextStatus !== null) { // nextStatus will always be ENTERING or EXITING. this.cancelNextCallback(); var node = _reactDom.default.findDOMNode(this); if (nextStatus === ENTERING) { this.performEnter(node, mounting); } else { this.performExit(node); } } else if (this.props.unmountOnExit && this.state.status === EXITED) { this.setState({ status: UNMOUNTED }); } }; _proto.performEnter = function performEnter(node, mounting) { var _this2 = this; var enter = this.props.enter; var appearing = this.context.transitionGroup ? this.context.transitionGroup.isMounting : mounting; var timeouts = this.getTimeouts(); var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED // if we are mounting and running this it means appear _must_ be set if (!mounting && !enter) { this.safeSetState({ status: ENTERED }, function () { _this2.props.onEntered(node); }); return; } this.props.onEnter(node, appearing); this.safeSetState({ status: ENTERING }, function () { _this2.props.onEntering(node, appearing); _this2.onTransitionEnd(node, enterTimeout, function () { _this2.safeSetState({ status: ENTERED }, function () { _this2.props.onEntered(node, appearing); }); }); }); }; _proto.performExit = function performExit(node) { var _this3 = this; var exit = this.props.exit; var timeouts = this.getTimeouts(); // no exit animation skip right to EXITED if (!exit) { this.safeSetState({ status: EXITED }, function () { _this3.props.onExited(node); }); return; } this.props.onExit(node); this.safeSetState({ status: EXITING }, function () { _this3.props.onExiting(node); _this3.onTransitionEnd(node, timeouts.exit, function () { _this3.safeSetState({ status: EXITED }, function () { _this3.props.onExited(node); }); }); }); }; _proto.cancelNextCallback = function cancelNextCallback() { if (this.nextCallback !== null) { this.nextCallback.cancel(); this.nextCallback = null; } }; _proto.safeSetState = function safeSetState(nextState, callback) { // This shouldn't be necessary, but there are weird race conditions with // setState callbacks and unmounting in testing, so always make sure that // we can cancel any pending setState callbacks after we unmount. callback = this.setNextCallback(callback); this.setState(nextState, callback); }; _proto.setNextCallback = function setNextCallback(callback) { var _this4 = this; var active = true; this.nextCallback = function (event) { if (active) { active = false; _this4.nextCallback = null; callback(event); } }; this.nextCallback.cancel = function () { active = false; }; return this.nextCallback; }; _proto.onTransitionEnd = function onTransitionEnd(node, timeout, handler) { this.setNextCallback(handler); var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener; if (!node || doesNotHaveTimeoutOrListener) { setTimeout(this.nextCallback, 0); return; } if (this.props.addEndListener) { this.props.addEndListener(node, this.nextCallback); } if (timeout != null) { setTimeout(this.nextCallback, timeout); } }; _proto.render = function render() { var status = this.state.status; if (status === UNMOUNTED) { return null; } var _this$props = this.props, children = _this$props.children, childProps = _objectWithoutPropertiesLoose(_this$props, ["children"]); // filter props for Transtition delete childProps.in; delete childProps.mountOnEnter; delete childProps.unmountOnExit; delete childProps.appear; delete childProps.enter; delete childProps.exit; delete childProps.timeout; delete childProps.addEndListener; delete childProps.onEnter; delete childProps.onEntering; delete childProps.onEntered; delete childProps.onExit; delete childProps.onExiting; delete childProps.onExited; if (typeof children === 'function') { return children(status, childProps); } var child = _react.default.Children.only(children); return _react.default.cloneElement(child, childProps); }; return Transition; }(_react.default.Component); Transition.contextTypes = { transitionGroup: PropTypes.object }; Transition.childContextTypes = { transitionGroup: function transitionGroup() {} }; Transition.propTypes = {}; function noop() {} Transition.defaultProps = { in: false, mountOnEnter: false, unmountOnExit: false, appear: false, enter: true, exit: true, onEnter: noop, onEntering: noop, onEntered: noop, onExit: noop, onExiting: noop, onExited: noop }; Transition.UNMOUNTED = 0; Transition.EXITED = 1; Transition.ENTERING = 2; Transition.ENTERED = 3; Transition.EXITING = 4; var _default = (0, _reactLifecyclesCompat.polyfill)(Transition); exports.default = _default; }); unwrapExports(Transition_1); var Transition_2 = Transition_1.EXITING; var Transition_3 = Transition_1.ENTERED; var Transition_4 = Transition_1.ENTERING; var Transition_5 = Transition_1.EXITED; var Transition_6 = Transition_1.UNMOUNTED; var CSSTransition_1 = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.default = void 0; var PropTypes = _interopRequireWildcard(propTypes); var _addClass = _interopRequireDefault(addClass_1); var _removeClass = _interopRequireDefault(removeClass); var _react = _interopRequireDefault(React__default); var _Transition = _interopRequireDefault(Transition_1); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } } function _extends() { _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; }; return _extends.apply(this, arguments); } function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } var addClass = function addClass(node, classes) { return node && classes && classes.split(' ').forEach(function (c) { return (0, _addClass.default)(node, c); }); }; var removeClass$1 = function removeClass(node, classes) { return node && classes && classes.split(' ').forEach(function (c) { return (0, _removeClass.default)(node, c); }); }; /** * A transition component inspired by the excellent * [ng-animate](http://www.nganimate.org/) library, you should use it if you're * using CSS transitions or animations. It's built upon the * [`Transition`](https://reactcommunity.org/react-transition-group/transition) * component, so it inherits all of its props. * * `CSSTransition` applies a pair of class names during the `appear`, `enter`, * and `exit` states of the transition. The first class is applied and then a * second `*-active` class in order to activate the CSSS transition. After the * transition, matching `*-done` class names are applied to persist the * transition state. * * ```jsx * function App() { * const [inProp, setInProp] = useState(false); * return ( *
* *
* {"I'll receive my-node-* classes"} *
*
* *
* ); * } * ``` * * When the `in` prop is set to `true`, the child component will first receive * the class `example-enter`, then the `example-enter-active` will be added in * the next tick. `CSSTransition` [forces a * reflow](https://github.com/reactjs/react-transition-group/blob/5007303e729a74be66a21c3e2205e4916821524b/src/CSSTransition.js#L208-L215) * between before adding the `example-enter-active`. This is an important trick * because it allows us to transition between `example-enter` and * `example-enter-active` even though they were added immediately one after * another. Most notably, this is what makes it possible for us to animate * _appearance_. * * ```css * .my-node-enter { * opacity: 0; * } * .my-node-enter-active { * opacity: 1; * transition: opacity 200ms; * } * .my-node-exit { * opacity: 1; * } * .my-node-exit-active { * opacity: 0; * transition: opacity: 200ms; * } * ``` * * `*-active` classes represent which styles you want to animate **to**. */ var CSSTransition = /*#__PURE__*/function (_React$Component) { _inheritsLoose(CSSTransition, _React$Component); function CSSTransition() { var _this; for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this; _this.onEnter = function (node, appearing) { var _this$getClassNames = _this.getClassNames(appearing ? 'appear' : 'enter'), className = _this$getClassNames.className; _this.removeClasses(node, 'exit'); addClass(node, className); if (_this.props.onEnter) { _this.props.onEnter(node, appearing); } }; _this.onEntering = function (node, appearing) { var _this$getClassNames2 = _this.getClassNames(appearing ? 'appear' : 'enter'), activeClassName = _this$getClassNames2.activeClassName; _this.reflowAndAddClass(node, activeClassName); if (_this.props.onEntering) { _this.props.onEntering(node, appearing); } }; _this.onEntered = function (node, appearing) { var appearClassName = _this.getClassNames('appear').doneClassName; var enterClassName = _this.getClassNames('enter').doneClassName; var doneClassName = appearing ? appearClassName + " " + enterClassName : enterClassName; _this.removeClasses(node, appearing ? 'appear' : 'enter'); addClass(node, doneClassName); if (_this.props.onEntered) { _this.props.onEntered(node, appearing); } }; _this.onExit = function (node) { var _this$getClassNames3 = _this.getClassNames('exit'), className = _this$getClassNames3.className; _this.removeClasses(node, 'appear'); _this.removeClasses(node, 'enter'); addClass(node, className); if (_this.props.onExit) { _this.props.onExit(node); } }; _this.onExiting = function (node) { var _this$getClassNames4 = _this.getClassNames('exit'), activeClassName = _this$getClassNames4.activeClassName; _this.reflowAndAddClass(node, activeClassName); if (_this.props.onExiting) { _this.props.onExiting(node); } }; _this.onExited = function (node) { var _this$getClassNames5 = _this.getClassNames('exit'), doneClassName = _this$getClassNames5.doneClassName; _this.removeClasses(node, 'exit'); addClass(node, doneClassName); if (_this.props.onExited) { _this.props.onExited(node); } }; _this.getClassNames = function (type) { var classNames = _this.props.classNames; var isStringClassNames = typeof classNames === 'string'; var prefix = isStringClassNames && classNames ? classNames + '-' : ''; var className = isStringClassNames ? prefix + type : classNames[type]; var activeClassName = isStringClassNames ? className + '-active' : classNames[type + 'Active']; var doneClassName = isStringClassNames ? className + '-done' : classNames[type + 'Done']; return { className: className, activeClassName: activeClassName, doneClassName: doneClassName }; }; return _this; } var _proto = CSSTransition.prototype; _proto.removeClasses = function removeClasses(node, type) { var _this$getClassNames6 = this.getClassNames(type), className = _this$getClassNames6.className, activeClassName = _this$getClassNames6.activeClassName, doneClassName = _this$getClassNames6.doneClassName; className && removeClass$1(node, className); activeClassName && removeClass$1(node, activeClassName); doneClassName && removeClass$1(node, doneClassName); }; _proto.reflowAndAddClass = function reflowAndAddClass(node, className) { // This is for to force a repaint, // which is necessary in order to transition styles when adding a class name. if (className) { /* eslint-disable no-unused-expressions */ node && node.scrollTop; /* eslint-enable no-unused-expressions */ addClass(node, className); } }; _proto.render = function render() { var props = _extends({}, this.props); delete props.classNames; return _react.default.createElement(_Transition.default, _extends({}, props, { onEnter: this.onEnter, onEntered: this.onEntered, onEntering: this.onEntering, onExit: this.onExit, onExiting: this.onExiting, onExited: this.onExited })); }; return CSSTransition; }(_react.default.Component); CSSTransition.defaultProps = { classNames: '' }; CSSTransition.propTypes = {}; var _default = CSSTransition; exports.default = _default; module.exports = exports["default"]; }); unwrapExports(CSSTransition_1); var ChildMapping = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.getChildMapping = getChildMapping; exports.mergeChildMappings = mergeChildMappings; exports.getInitialChildMapping = getInitialChildMapping; exports.getNextChildMapping = getNextChildMapping; /** * Given `this.props.children`, return an object mapping key to child. * * @param {*} children `this.props.children` * @return {object} Mapping of key to child */ function getChildMapping(children, mapFn) { var mapper = function mapper(child) { return mapFn && (0, React__default.isValidElement)(child) ? mapFn(child) : child; }; var result = Object.create(null); if (children) React__default.Children.map(children, function (c) { return c; }).forEach(function (child) { // run the map function here instead so that the key is the computed one result[child.key] = mapper(child); }); return result; } /** * When you're adding or removing children some may be added or removed in the * same render pass. We want to show *both* since we want to simultaneously * animate elements in and out. This function takes a previous set of keys * and a new set of keys and merges them with its best guess of the correct * ordering. In the future we may expose some of the utilities in * ReactMultiChild to make this easy, but for now React itself does not * directly have this concept of the union of prevChildren and nextChildren * so we implement it here. * * @param {object} prev prev children as returned from * `ReactTransitionChildMapping.getChildMapping()`. * @param {object} next next children as returned from * `ReactTransitionChildMapping.getChildMapping()`. * @return {object} a key set that contains all keys in `prev` and all keys * in `next` in a reasonable order. */ function mergeChildMappings(prev, next) { prev = prev || {}; next = next || {}; function getValueForKey(key) { return key in next ? next[key] : prev[key]; } // For each key of `next`, the list of keys to insert before that key in // the combined list var nextKeysPending = Object.create(null); var pendingKeys = []; for (var prevKey in prev) { if (prevKey in next) { if (pendingKeys.length) { nextKeysPending[prevKey] = pendingKeys; pendingKeys = []; } } else { pendingKeys.push(prevKey); } } var i; var childMapping = {}; for (var nextKey in next) { if (nextKeysPending[nextKey]) { for (i = 0; i < nextKeysPending[nextKey].length; i++) { var pendingNextKey = nextKeysPending[nextKey][i]; childMapping[nextKeysPending[nextKey][i]] = getValueForKey(pendingNextKey); } } childMapping[nextKey] = getValueForKey(nextKey); } // Finally, add the keys which didn't appear before any key in `next` for (i = 0; i < pendingKeys.length; i++) { childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]); } return childMapping; } function getProp(child, prop, props) { return props[prop] != null ? props[prop] : child.props[prop]; } function getInitialChildMapping(props, onExited) { return getChildMapping(props.children, function (child) { return (0, React__default.cloneElement)(child, { onExited: onExited.bind(null, child), in: true, appear: getProp(child, 'appear', props), enter: getProp(child, 'enter', props), exit: getProp(child, 'exit', props) }); }); } function getNextChildMapping(nextProps, prevChildMapping, onExited) { var nextChildMapping = getChildMapping(nextProps.children); var children = mergeChildMappings(prevChildMapping, nextChildMapping); Object.keys(children).forEach(function (key) { var child = children[key]; if (!(0, React__default.isValidElement)(child)) return; var hasPrev = (key in prevChildMapping); var hasNext = (key in nextChildMapping); var prevChild = prevChildMapping[key]; var isLeaving = (0, React__default.isValidElement)(prevChild) && !prevChild.props.in; // item is new (entering) if (hasNext && (!hasPrev || isLeaving)) { // console.log('entering', key) children[key] = (0, React__default.cloneElement)(child, { onExited: onExited.bind(null, child), in: true, exit: getProp(child, 'exit', nextProps), enter: getProp(child, 'enter', nextProps) }); } else if (!hasNext && hasPrev && !isLeaving) { // item is old (exiting) // console.log('leaving', key) children[key] = (0, React__default.cloneElement)(child, { in: false }); } else if (hasNext && hasPrev && (0, React__default.isValidElement)(prevChild)) { // item hasn't changed transition states // copy over the last transition props; // console.log('unchanged', key) children[key] = (0, React__default.cloneElement)(child, { onExited: onExited.bind(null, child), in: prevChild.props.in, exit: getProp(child, 'exit', nextProps), enter: getProp(child, 'enter', nextProps) }); } }); return children; } }); unwrapExports(ChildMapping); var ChildMapping_1 = ChildMapping.getChildMapping; var ChildMapping_2 = ChildMapping.mergeChildMappings; var ChildMapping_3 = ChildMapping.getInitialChildMapping; var ChildMapping_4 = ChildMapping.getNextChildMapping; var TransitionGroup_1 = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.default = void 0; var _propTypes = _interopRequireDefault(propTypes); var _react = _interopRequireDefault(React__default); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } function _extends() { _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; }; return _extends.apply(this, arguments); } function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } var values = Object.values || function (obj) { return Object.keys(obj).map(function (k) { return obj[k]; }); }; var defaultProps = { component: 'div', childFactory: function childFactory(child) { return child; } /** * The `` component manages a set of transition components * (`` and ``) in a list. Like with the transition * components, `` is a state machine for managing the mounting * and unmounting of components over time. * * Consider the example below. As items are removed or added to the TodoList the * `in` prop is toggled automatically by the ``. * * Note that `` does not define any animation behavior! * Exactly _how_ a list item animates is up to the individual transition * component. This means you can mix and match animations across different list * items. */ }; var TransitionGroup = /*#__PURE__*/function (_React$Component) { _inheritsLoose(TransitionGroup, _React$Component); function TransitionGroup(props, context) { var _this; _this = _React$Component.call(this, props, context) || this; var handleExited = _this.handleExited.bind(_assertThisInitialized(_assertThisInitialized(_this))); // Initial children should all be entering, dependent on appear _this.state = { handleExited: handleExited, firstRender: true }; return _this; } var _proto = TransitionGroup.prototype; _proto.getChildContext = function getChildContext() { return { transitionGroup: { isMounting: !this.appeared } }; }; _proto.componentDidMount = function componentDidMount() { this.appeared = true; this.mounted = true; }; _proto.componentWillUnmount = function componentWillUnmount() { this.mounted = false; }; TransitionGroup.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, _ref) { var prevChildMapping = _ref.children, handleExited = _ref.handleExited, firstRender = _ref.firstRender; return { children: firstRender ? (0, ChildMapping.getInitialChildMapping)(nextProps, handleExited) : (0, ChildMapping.getNextChildMapping)(nextProps, prevChildMapping, handleExited), firstRender: false }; }; _proto.handleExited = function handleExited(child, node) { var currentChildMapping = (0, ChildMapping.getChildMapping)(this.props.children); if (child.key in currentChildMapping) return; if (child.props.onExited) { child.props.onExited(node); } if (this.mounted) { this.setState(function (state) { var children = _extends({}, state.children); delete children[child.key]; return { children: children }; }); } }; _proto.render = function render() { var _this$props = this.props, Component = _this$props.component, childFactory = _this$props.childFactory, props = _objectWithoutPropertiesLoose(_this$props, ["component", "childFactory"]); var children = values(this.state.children).map(childFactory); delete props.appear; delete props.enter; delete props.exit; if (Component === null) { return children; } return _react.default.createElement(Component, props, children); }; return TransitionGroup; }(_react.default.Component); TransitionGroup.childContextTypes = { transitionGroup: _propTypes.default.object.isRequired }; TransitionGroup.propTypes = {}; TransitionGroup.defaultProps = defaultProps; var _default = (0, _reactLifecyclesCompat.polyfill)(TransitionGroup); exports.default = _default; module.exports = exports["default"]; }); unwrapExports(TransitionGroup_1); var ReplaceTransition_1 = createCommonjsModule(function (module, exports) { exports.__esModule = true; exports.default = void 0; var _propTypes = _interopRequireDefault(propTypes); var _react = _interopRequireDefault(React__default); var _TransitionGroup = _interopRequireDefault(TransitionGroup_1); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } /** * The `` component is a specialized `Transition` component * that animates between two children. * * ```jsx * *
I appear first
*
I replace the above
*
* ``` */ var ReplaceTransition = /*#__PURE__*/function (_React$Component) { _inheritsLoose(ReplaceTransition, _React$Component); function ReplaceTransition() { var _this; for (var _len = arguments.length, _args = new Array(_len), _key = 0; _key < _len; _key++) { _args[_key] = arguments[_key]; } _this = _React$Component.call.apply(_React$Component, [this].concat(_args)) || this; _this.handleEnter = function () { for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { args[_key2] = arguments[_key2]; } return _this.handleLifecycle('onEnter', 0, args); }; _this.handleEntering = function () { for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) { args[_key3] = arguments[_key3]; } return _this.handleLifecycle('onEntering', 0, args); }; _this.handleEntered = function () { for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) { args[_key4] = arguments[_key4]; } return _this.handleLifecycle('onEntered', 0, args); }; _this.handleExit = function () { for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) { args[_key5] = arguments[_key5]; } return _this.handleLifecycle('onExit', 1, args); }; _this.handleExiting = function () { for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) { args[_key6] = arguments[_key6]; } return _this.handleLifecycle('onExiting', 1, args); }; _this.handleExited = function () { for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) { args[_key7] = arguments[_key7]; } return _this.handleLifecycle('onExited', 1, args); }; return _this; } var _proto = ReplaceTransition.prototype; _proto.handleLifecycle = function handleLifecycle(handler, idx, originalArgs) { var _child$props; var children = this.props.children; var child = _react.default.Children.toArray(children)[idx]; if (child.props[handler]) (_child$props = child.props)[handler].apply(_child$props, originalArgs); if (this.props[handler]) this.props[handler]((0, ReactDOM.findDOMNode)(this)); }; _proto.render = function render() { var _this$props = this.props, children = _this$props.children, inProp = _this$props.in, props = _objectWithoutPropertiesLoose(_this$props, ["children", "in"]); var _React$Children$toArr = _react.default.Children.toArray(children), first = _React$Children$toArr[0], second = _React$Children$toArr[1]; delete props.onEnter; delete props.onEntering; delete props.onEntered; delete props.onExit; delete props.onExiting; delete props.onExited; return _react.default.createElement(_TransitionGroup.default, props, inProp ? _react.default.cloneElement(first, { key: 'first', onEnter: this.handleEnter, onEntering: this.handleEntering, onEntered: this.handleEntered }) : _react.default.cloneElement(second, { key: 'second', onEnter: this.handleExit, onEntering: this.handleExiting, onEntered: this.handleExited })); }; return ReplaceTransition; }(_react.default.Component); ReplaceTransition.propTypes = {}; var _default = ReplaceTransition; exports.default = _default; module.exports = exports["default"]; }); unwrapExports(ReplaceTransition_1); var reactTransitionGroup = createCommonjsModule(function (module) { var _CSSTransition = _interopRequireDefault(CSSTransition_1); var _ReplaceTransition = _interopRequireDefault(ReplaceTransition_1); var _TransitionGroup = _interopRequireDefault(TransitionGroup_1); var _Transition = _interopRequireDefault(Transition_1); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } module.exports = { Transition: _Transition.default, TransitionGroup: _TransitionGroup.default, ReplaceTransition: _ReplaceTransition.default, CSSTransition: _CSSTransition.default }; }); unwrapExports(reactTransitionGroup); var reactTransitionGroup_1 = reactTransitionGroup.Transition; var reactTransitionGroup_2 = reactTransitionGroup.TransitionGroup; var reactTransitionGroup_3 = reactTransitionGroup.ReplaceTransition; var reactTransitionGroup_4 = reactTransitionGroup.CSSTransition; var propTypes$m = _extends({}, reactTransitionGroup_1.propTypes, { children: propTypes.oneOfType([propTypes.arrayOf(propTypes.node), propTypes.node]), tag: tagPropType, baseClass: propTypes.string, baseClassActive: propTypes.string, className: propTypes.string, cssModule: propTypes.object, innerRef: propTypes.oneOfType([propTypes.object, propTypes.string, propTypes.func]) }); var defaultProps$k = _extends({}, reactTransitionGroup_1.defaultProps, { tag: 'div', baseClass: 'fade', baseClassActive: 'show', timeout: TransitionTimeouts.Fade, appear: true, enter: true, exit: true, in: true }); function Fade(props) { var Tag = props.tag, baseClass = props.baseClass, baseClassActive = props.baseClassActive, className = props.className, cssModule = props.cssModule, children = props.children, innerRef = props.innerRef, otherProps = _objectWithoutPropertiesLoose(props, ["tag", "baseClass", "baseClassActive", "className", "cssModule", "children", "innerRef"]); var transitionProps = pick(otherProps, TransitionPropTypeKeys); var childProps = omit(otherProps, TransitionPropTypeKeys); return /*#__PURE__*/React__default.createElement(reactTransitionGroup_1, transitionProps, function (status) { var isActive = status === 'entered'; var classes = mapToCssModules(classnames(className, baseClass, isActive && baseClassActive), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({ className: classes }, childProps, { ref: innerRef }), children); }); } Fade.propTypes = propTypes$m; Fade.defaultProps = defaultProps$k; var propTypes$n = { color: propTypes.string, pill: propTypes.bool, tag: tagPropType, innerRef: propTypes.oneOfType([propTypes.object, propTypes.func, propTypes.string]), children: propTypes.node, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$l = { color: 'secondary', pill: false, tag: 'span' }; var Badge = function Badge(props) { var className = props.className, cssModule = props.cssModule, color = props.color, innerRef = props.innerRef, pill = props.pill, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "color", "innerRef", "pill", "tag"]); var classes = mapToCssModules(classnames(className, 'badge', 'badge-' + color, pill ? 'badge-pill' : false), cssModule); if (attributes.href && Tag === 'span') { Tag = 'a'; } return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes, ref: innerRef })); }; Badge.propTypes = propTypes$n; Badge.defaultProps = defaultProps$l; var propTypes$o = { tag: tagPropType, inverse: propTypes.bool, color: propTypes.string, body: propTypes.bool, outline: propTypes.bool, className: propTypes.string, cssModule: propTypes.object, innerRef: propTypes.oneOfType([propTypes.object, propTypes.string, propTypes.func]) }; var defaultProps$m = { tag: 'div' }; var Card = function Card(props) { var className = props.className, cssModule = props.cssModule, color = props.color, body = props.body, inverse = props.inverse, outline = props.outline, Tag = props.tag, innerRef = props.innerRef, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "color", "body", "inverse", "outline", "tag", "innerRef"]); var classes = mapToCssModules(classnames(className, 'card', inverse ? 'text-white' : false, body ? 'card-body' : false, color ? (outline ? 'border' : 'bg') + "-" + color : false), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes, ref: innerRef })); }; Card.propTypes = propTypes$o; Card.defaultProps = defaultProps$m; var propTypes$p = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$n = { tag: 'div' }; var CardGroup = function CardGroup(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'card-group'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; CardGroup.propTypes = propTypes$p; CardGroup.defaultProps = defaultProps$n; var propTypes$q = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$o = { tag: 'div' }; var CardDeck = function CardDeck(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'card-deck'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; CardDeck.propTypes = propTypes$q; CardDeck.defaultProps = defaultProps$o; var propTypes$r = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$p = { tag: 'div' }; var CardColumns = function CardColumns(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'card-columns'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; CardColumns.propTypes = propTypes$r; CardColumns.defaultProps = defaultProps$p; var propTypes$s = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object, innerRef: propTypes.oneOfType([propTypes.object, propTypes.string, propTypes.func]) }; var defaultProps$q = { tag: 'div' }; var CardBody = function CardBody(props) { var className = props.className, cssModule = props.cssModule, innerRef = props.innerRef, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "innerRef", "tag"]); var classes = mapToCssModules(classnames(className, 'card-body'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes, ref: innerRef })); }; CardBody.propTypes = propTypes$s; CardBody.defaultProps = defaultProps$q; var propTypes$t = { tag: tagPropType, innerRef: propTypes.oneOfType([propTypes.object, propTypes.func, propTypes.string]), className: propTypes.string, cssModule: propTypes.object }; var defaultProps$r = { tag: 'a' }; var CardLink = function CardLink(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, innerRef = props.innerRef, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag", "innerRef"]); var classes = mapToCssModules(classnames(className, 'card-link'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { ref: innerRef, className: classes })); }; CardLink.propTypes = propTypes$t; CardLink.defaultProps = defaultProps$r; var propTypes$u = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$s = { tag: 'div' }; var CardFooter = function CardFooter(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'card-footer'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; CardFooter.propTypes = propTypes$u; CardFooter.defaultProps = defaultProps$s; var propTypes$v = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$t = { tag: 'div' }; var CardHeader = function CardHeader(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'card-header'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; CardHeader.propTypes = propTypes$v; CardHeader.defaultProps = defaultProps$t; var propTypes$w = { tag: tagPropType, top: propTypes.bool, bottom: propTypes.bool, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$u = { tag: 'img' }; var CardImg = function CardImg(props) { var className = props.className, cssModule = props.cssModule, top = props.top, bottom = props.bottom, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "top", "bottom", "tag"]); var cardImgClassName = 'card-img'; if (top) { cardImgClassName = 'card-img-top'; } if (bottom) { cardImgClassName = 'card-img-bottom'; } var classes = mapToCssModules(classnames(className, cardImgClassName), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; CardImg.propTypes = propTypes$w; CardImg.defaultProps = defaultProps$u; var propTypes$x = { tag: tagPropType, className: propTypes.string, cssModule: propTypes.object }; var defaultProps$v = { tag: 'div' }; var CardImgOverlay = function CardImgOverlay(props) { var className = props.className, cssModule = props.cssModule, Tag = props.tag, attributes = _objectWithoutPropertiesLoose(props, ["className", "cssModule", "tag"]); var classes = mapToCssModules(classnames(className, 'card-img-overlay'), cssModule); return /*#__PURE__*/React__default.createElement(Tag, _extends({}, attributes, { className: classes })); }; CardImgOverlay.propTypes = propTypes$x; CardImgOverlay.defaultProps = defaultProps$v; var CarouselItem = /*#__PURE__*/function (_React$Component) { _inheritsLoose(CarouselItem, _React$Component); function CarouselItem(props) { var _this; _this = _React$Component.call(this, props) || this; _this.state = { startAnimation: false }; _this.onEnter = _this.onEnter.bind(_assertThisInitialized(_this)); _this.onEntering = _this.onEntering.bind(_assertThisInitialized(_this)); _this.onExit = _this.onExit.bind(_assertThisInitialized(_this)); _this.onExiting = _this.onExiting.bind(_assertThisInitialized(_this)); _this.onExited = _this.onExited.bind(_assertThisInitialized(_this)); return _this; } var _proto = CarouselItem.prototype; _proto.onEnter = function onEnter(node, isAppearing) { this.setState({ startAnimation: false }); this.props.onEnter(node, isAppearing); }; _proto.onEntering = function onEntering(node, isAppearing) { // getting this variable triggers a reflow var offsetHeight = node.offsetHeight; this.setState({ startAnimation: true }); this.props.onEntering(node, isAppearing); return offsetHeight; }; _proto.onExit = function onExit(node) { this.setState({ startAnimation: false }); this.props.onExit(node); }; _proto.onExiting = function onExiting(node) { this.setState({ startAnimation: true }); node.dispatchEvent(new CustomEvent('slide.bs.carousel')); this.props.onExiting(node); }; _proto.onExited = function onExited(node) { node.dispatchEvent(new CustomEvent('slid.bs.carousel')); this.props.onExited(node); }; _proto.render = function render() { var _this2 = this; var _this$props = this.props, isIn = _this$props.in, children = _this$props.children, cssModule = _this$props.cssModule, slide = _this$props.slide, Tag = _this$props.tag, className = _this$props.className, transitionProps = _objectWithoutPropertiesLoose(_this$props, ["in", "children", "cssModule", "slide", "tag", "className"]); return /*#__PURE__*/React__default.createElement(reactTransitionGroup_1, _extends({}, transitionProps, { enter: slide, exit: slide, in: isIn, onEnter: this.onEnter, onEntering: this.onEntering, onExit: this.onExit, onExiting: this.onExiting, onExited: this.onExited }), function (status) { var direction = _this2.context.direction; var isActive = status === TransitionStatuses.ENTERED || status === TransitionStatuses.EXITING; var directionClassName = (status === TransitionStatuses.ENTERING || status === TransitionStatuses.EXITING) && _this2.state.startAnimation && (direction === 'right' ? 'carousel-item-left' : 'carousel-item-right'); var orderClassName = status === TransitionStatuses.ENTERING && (direction === 'right' ? 'carousel-item-next' : 'carousel-item-prev'); var itemClasses = mapToCssModules(classnames(className, 'carousel-item', isActive && 'active', directionClassName, orderClassName), cssModule); return /*#__PURE__*/React__default.createElement(Tag, { className: itemClasses }, children); }); }; return CarouselItem; }(React__default.Component); CarouselItem.propTypes = _extends({}, reactTransitionGroup_1.propTypes, { tag: tagPropType, in: propTypes.bool, cssModule: propTypes.object, children: propTypes.node, slide: propTypes.bool, className: propTypes.string }); CarouselItem.defaultProps = _extends({}, reactTransitionGroup_1.defaultProps, { tag: 'div', timeout: TransitionTimeouts.Carousel, slide: true }); CarouselItem.contextTypes = { direction: propTypes.string }; var SWIPE_THRESHOLD = 40; var Carousel = /*#__PURE__*/function (_React$Component) { _inheritsLoose(Carousel, _React$Component); function Carousel(props) { var _this; _this = _React$Component.call(this, props) || this; _this.handleKeyPress = _this.handleKeyPress.bind(_assertThisInitialized(_this)); _this.renderItems = _this.renderItems.bind(_assertThisInitialized(_this)); _this.hoverStart = _this.hoverStart.bind(_assertThisInitialized(_this)); _this.hoverEnd = _this.hoverEnd.bind(_assertThisInitialized(_this)); _this.handleTouchStart = _this.handleTouchStart.bind(_assertThisInitialized(_this)); _this.handleTouchEnd = _this.handleTouchEnd.bind(_assertThisInitialized(_this)); _this.touchStartX = 0; _this.touchStartY = 0; _this.state = { activeIndex: _this.props.activeIndex, direction: 'right', indicatorClicked: false }; return _this; } var _proto = Carousel.prototype; _proto.getChildContext = function getChildContext() { return { direction: this.state.direction }; }; _proto.componentDidMount = function componentDidMount() { // Set up the cycle if (this.props.ride === 'carousel') { this.setInterval(); } // TODO: move this to the specific carousel like bootstrap. Currently it will trigger ALL carousels on the page. document.addEventListener('keyup', this.handleKeyPress); }; Carousel.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) { var newState = null; var activeIndex = prevState.activeIndex, direction = prevState.direction, indicatorClicked = prevState.indicatorClicked; if (nextProps.activeIndex !== activeIndex) { // Calculate the direction to turn if (nextProps.activeIndex === activeIndex + 1) { direction = 'right'; } else if (nextProps.activeIndex === activeIndex - 1) { direction = 'left'; } else if (nextProps.activeIndex < activeIndex) { direction = indicatorClicked ? 'left' : 'right'; } else if (nextProps.activeIndex !== activeIndex) { direction = indicatorClicked ? 'right' : 'left'; } newState = { activeIndex: nextProps.activeIndex, direction: direction, indicatorClicked: false }; } return newState; }; _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) { if (prevState.activeIndex === this.state.activeIndex) return; this.setInterval(this.props); }; _proto.componentWillUnmount = function componentWillUnmount() { this.clearInterval(); document.removeEventListener('keyup', this.handleKeyPress); }; _proto.setInterval = function (_setInterval) { function setInterval() { return _setInterval.apply(this, arguments); } setInterval.toString = function () { return _setInterval.toString(); }; return setInterval; }(function (props) { if (props === void 0) { props = this.props; } // make sure not to have multiple intervals going... this.clearInterval(); if (props.interval) { this.cycleInterval = setInterval(function () { props.next(); }, parseInt(props.interval, 10)); } }); _proto.clearInterval = function (_clearInterval) { function clearInterval() { return _clearInterval.apply(this, arguments); } clearInterval.toString = function () { return _clearInterval.toString(); }; return clearInterval; }(function () { clearInterval(this.cycleInterval); }); _proto.hoverStart = function hoverStart() { if (this.props.pause === 'hover') { this.clearInterval(); } if (this.props.mouseEnter) { var _this$props; (_this$props = this.props).mouseEnter.apply(_this$props, arguments); } }; _proto.hoverEnd = function hoverEnd() { if (this.props.pause === 'hover') { this.setInterval(); } if (this.props.mouseLeave) { var _this$props2; (_this$props2 = this.props).mouseLeave.apply(_this$props2, arguments); } }; _proto.handleKeyPress = function handleKeyPress(evt) { if (this.props.keyboard) { if (evt.keyCode === 37) { this.props.previous(); } else if (evt.keyCode === 39) { this.props.next(); } } }; _proto.handleTouchStart = function handleTouchStart(e) { if (!this.props.enableTouch) { return; } this.touchStartX = e.changedTouches[0].screenX; this.touchStartY = e.changedTouches[0].screenY; }; _proto.handleTouchEnd = function handleTouchEnd(e) { if (!this.props.enableTouch) { return; } var currentX = e.changedTouches[0].screenX; var currentY = e.changedTouches[0].screenY; var diffX = Math.abs(this.touchStartX - currentX); var diffY = Math.abs(this.touchStartY - currentY); // Don't swipe if Y-movement is bigger than X-movement if (diffX < diffY) { return; } if (diffX < SWIPE_THRESHOLD) { return; } if (currentX < this.touchStartX) { this.props.next(); } else { this.props.previous(); } }; _proto.renderItems = function renderItems(carouselItems, className) { var _this2 = this; var slide = this.props.slide; return /*#__PURE__*/React__default.createElement("div", { className: className }, carouselItems.map(function (item, index) { var isIn = index === _this2.state.activeIndex; return /*#__PURE__*/React__default.cloneElement(item, { in: isIn, slide: slide }); })); }; _proto.render = function render() { var _this3 = this; var _this$props3 = this.props, cssModule = _this$props3.cssModule, slide = _this$props3.slide, className = _this$props3.className; var outerClasses = mapToCssModules(classnames(className, 'carousel', slide && 'slide'), cssModule); var innerClasses = mapToCssModules(classnames('carousel-inner'), cssModule); // filter out booleans, null, or undefined var children = this.props.children.filter(function (child) { return child !== null && child !== undefined && typeof child !== 'boolean'; }); var slidesOnly = children.every(function (child) { return child.type === CarouselItem; }); // Rendering only slides if (slidesOnly) { return /*#__PURE__*/React__default.createElement("div", { className: outerClasses, onMouseEnter: this.hoverStart, onMouseLeave: this.hoverEnd }, this.renderItems(children, innerClasses)); } // Rendering slides and controls if (children[0] instanceof Array) { var _carouselItems = children[0]; var _controlLeft = children[1]; var _controlRight = children[2]; return /*#__PURE__*/React__default.createElement("div", { className: outerClasses, onMouseEnter: this.hoverStart, onMouseLeave: this.hoverEnd }, this.renderItems(_carouselItems, innerClasses), _controlLeft, _controlRight); } // Rendering indicators, slides and controls var indicators = children[0]; var wrappedOnClick = function wrappedOnClick(e) { if (typeof indicators.props.onClickHandler === 'function') { _this3.setState({ indicatorClicked: true }, function () { return indicators.props.onClickHandler(e); }); } }; var wrappedIndicators = /*#__PURE__*/React__default.cloneElement(indicators, { onClickHandler: wrappedOnClick }); var carouselItems = children[1]; var controlLeft = children[2]; var controlRight = children[3]; return /*#__PURE__*/React__default.createElement("div", { className: outerClasses, onMouseEnter: this.hoverStart, onMouseLeave: this.hoverEnd, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, wrappedIndicators, this.renderItems(carouselItems, innerClasses), controlLeft, controlRight); }; return Carousel; }(React__default.Component); Carousel.propTypes = { // the current active slide of the carousel activeIndex: propTypes.number, // a function which should advance the carousel to the next slide (via activeIndex) next: propTypes.func.isRequired, // a function which should advance the carousel to the previous slide (via activeIndex) previous: propTypes.func.isRequired, // controls if the left and right arrow keys should control the carousel keyboard: propTypes.bool, /* If set to "hover", pauses the cycling of the carousel on mouseenter and resumes the cycling of the carousel on * mouseleave. If set to false, hovering over the carousel won't pause it. (default: "hover") */ pause: propTypes.oneOf(['hover', false]), // Autoplays the carousel after the user manually cycles the first item. If "carousel", autoplays the carousel on load. // This is how bootstrap defines it... I would prefer a bool named autoplay or something... ride: propTypes.oneOf(['carousel']), // the interval at which the carousel automatically cycles (default: 5000) // eslint-disable-next-line react/no-unused-prop-types interval: propTypes.oneOfType([propTypes.number, propTypes.string, propTypes.bool]), children: propTypes.array, // called when the mouse enters the Carousel mouseEnter: propTypes.func, // called when the mouse exits the Carousel mouseLeave: propTypes.func, // controls whether the slide animation on the Carousel works or not slide: propTypes.bool, cssModule: propTypes.object, className: propTypes.string, enableTouch: propTypes.bool }; Carousel.defaultProps = { interval: 5000, pause: 'hover', keyboard: true, slide: true, enableTouch: true }; Carousel.childContextTypes = { direction: propTypes.string }; var CarouselControl = function CarouselControl(props) { var direction = props.direction, onClickHandler = props.onClickHandler, cssModule = props.cssModule, directionText = props.directionText, className = props.className; var anchorClasses = mapToCssModules(classnames(className, "carousel-control-" + direction), cssModule); var iconClasses = mapToCssModules(classnames("carousel-control-" + direction + "-icon"), cssModule); var screenReaderClasses = mapToCssModules(classnames('sr-only'), cssModule); return ( /*#__PURE__*/ // We need to disable this linting rule to use an `` instead of // `