{"version":3,"file":"Modal-7193e35a.js","sources":["../../../app/javascript/components/common/Knowledges/Payment/LearningQuantityPopup.tsx","../../../app/javascript/components/common/Knowledges/Payment/ChangePlanPriceList.tsx","../../../node_modules/@babel/runtime/helpers/esm/extends.js","../../../node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js","../../../node_modules/classnames/index.js","../../../node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js","../../../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js","../../../node_modules/react-bootstrap/esm/ThemeProvider.js","../../../node_modules/dom-helpers/esm/ownerDocument.js","../../../node_modules/dom-helpers/esm/ownerWindow.js","../../../node_modules/dom-helpers/esm/getComputedStyle.js","../../../node_modules/dom-helpers/esm/hyphenate.js","../../../node_modules/dom-helpers/esm/hyphenateStyle.js","../../../node_modules/dom-helpers/esm/isTransform.js","../../../node_modules/dom-helpers/esm/css.js","../../../node_modules/react-transition-group/esm/config.js","../../../node_modules/react-transition-group/esm/TransitionGroupContext.js","../../../node_modules/react-transition-group/esm/utils/reflow.js","../../../node_modules/react-transition-group/esm/Transition.js","../../../node_modules/dom-helpers/esm/canUseDOM.js","../../../node_modules/dom-helpers/esm/addEventListener.js","../../../node_modules/dom-helpers/esm/removeEventListener.js","../../../node_modules/dom-helpers/esm/listen.js","../../../node_modules/dom-helpers/esm/triggerEvent.js","../../../node_modules/dom-helpers/esm/transitionEnd.js","../../../node_modules/react-bootstrap/esm/transitionEndListener.js","../../../node_modules/react-bootstrap/esm/triggerBrowserReflow.js","../../../node_modules/@restart/hooks/esm/useCommittedRef.js","../../../node_modules/@restart/hooks/esm/useEventCallback.js","../../../node_modules/react-bootstrap/esm/Fade.js","../../../node_modules/react-bootstrap/esm/CloseButton.js","../../../node_modules/react-bootstrap/esm/divWithClassName.js","../../../node_modules/dom-helpers/esm/camelize.js","../../../node_modules/react-bootstrap/esm/createWithBsPrefix.js","../../../node_modules/@restart/hooks/esm/useMounted.js","../../../node_modules/@restart/hooks/esm/useUpdatedRef.js","../../../node_modules/@restart/hooks/esm/useWillUnmount.js","../../../node_modules/dom-helpers/esm/querySelectorAll.js","../../../node_modules/@restart/hooks/esm/usePrevious.js","../../../node_modules/@restart/hooks/esm/useCallbackRef.js","../../../node_modules/dom-helpers/esm/contains.js","../../../node_modules/dom-helpers/esm/hasClass.js","../../../node_modules/dom-helpers/esm/scrollbarSize.js","../../../node_modules/dom-helpers/esm/activeElement.js","../../../node_modules/dom-helpers/esm/addClass.js","../../../node_modules/dom-helpers/esm/removeClass.js","../../../node_modules/dom-helpers/esm/isDocument.js","../../../node_modules/dom-helpers/esm/isWindow.js","../../../node_modules/react-overlays/esm/isOverflowing.js","../../../node_modules/react-overlays/esm/manageAriaHidden.js","../../../node_modules/react-overlays/esm/ModalManager.js","../../../node_modules/react-overlays/esm/useWaitForDOMRef.js","../../../node_modules/react-overlays/esm/Modal.js","../../../node_modules/react-bootstrap/esm/BootstrapModalManager.js","../../../node_modules/react-bootstrap/esm/ModalBody.js","../../../node_modules/react-bootstrap/esm/ModalContext.js","../../../node_modules/react-bootstrap/esm/ModalDialog.js","../../../node_modules/react-bootstrap/esm/ModalFooter.js","../../../node_modules/react-bootstrap/esm/ModalHeader.js","../../../node_modules/react-bootstrap/esm/ModalTitle.js","../../../node_modules/react-bootstrap/esm/Modal.js"],"sourcesContent":["// @ts-nocheck\nimport React from \"react\";\nimport style from \"./ChangePlanPriceList.module.scss\";\nimport PropTypes from \"prop-types\";\nimport { useTranslation } from \"react-i18next\";\n\nexport const LearningQuantityPopup = ({\n selectedPlanType,\n closeRef,\n learningQuantityInfo,\n setCurrentSelectedLeaningQuantity,\n setIsLeaningQuantityPopup,\n}) => {\n const { t } = useTranslation(\"translation\", { keyPrefix: \"LearningQuantityPopup\" });\n return (\n <>\n \n {learningQuantityInfo?.map((learningQuantityValue, i) => (\n {\n setCurrentSelectedLeaningQuantity(learningQuantityValue);\n setIsLeaningQuantityPopup(false);\n }}\n >\n {learningQuantityValue?.display_name}\n \n {t(\"amountMark\")} {`${learningQuantityValue?.cost?.toLocaleString()}`}\n \n \n ))}\n \n \n );\n};\n\nLearningQuantityPopup.propTypes = {\n selectedPlanType: PropTypes.string,\n closeRef: PropTypes.func,\n learningQuantityInfo: PropTypes.array,\n setCurrentSelectedLeaningQuantity: PropTypes.func,\n setIsLeaningQuantityPopup: PropTypes.func,\n};\n","// @ts-nocheck\nimport React, { useEffect, useRef, useState } from \"react\";\nimport style from \"./ChangePlanPriceList.module.scss\";\nimport PropTypes from \"prop-types\";\nimport { getImageUrl } from \"../../../../commons/assets_path\";\nimport { LearningQuantityPopup } from \"./LearningQuantityPopup\";\nimport { useTranslation } from \"react-i18next\";\n\nexport const ChangePlanPriceList = ({\n currentPlanInfo,\n learningQuantityInfo,\n setPageCategory,\n setChangePlanInfo,\n setPageNumber,\n isNewRegister,\n createPlan,\n isDisabled = false,\n}) => {\n const { t } = useTranslation(\"translation\", { keyPrefix: \"ChangePlanPriceList\" });\n const [gptThreePointFiveSelectedLeaningQuantity, setGptThreePointFiveSelectedLeaningQuantity] = useState(\n learningQuantityInfo ? learningQuantityInfo[0] : {},\n );\n const [gptFourSelectedLeaningQuantity, setGptFourSelectedLeaningQuantity] = useState(\n learningQuantityInfo ? learningQuantityInfo[0] : {},\n );\n const [isLeaningQuantityPopup, setIsLeaningQuantityPopup] = useState(false);\n const [selectedPlanType, setSelectedPlanType] = useState(\"\");\n\n const closeRef = useRef();\n\n const onClickOuterClose = (e) => {\n if (e.target.id === \"leaningQuantityBtn\") {\n return;\n } else if (isLeaningQuantityPopup) {\n if (!closeRef.current.contains(e.target)) {\n setIsLeaningQuantityPopup(false);\n }\n }\n };\n\n const onClickLearningQuantityBtn = (planType) => {\n setSelectedPlanType(planType);\n setIsLeaningQuantityPopup(!isLeaningQuantityPopup);\n };\n\n const onClickPlanChangeBtn = (selectedLeaningQuantity, planType) => {\n if (isNewRegister) {\n createPlan({ learning_quantity: selectedLeaningQuantity?.grade, plan: planType });\n } else {\n setChangePlanInfo({\n beforePlanInfo: currentPlanInfo,\n afterPlanInfo: { learning_quantity: selectedLeaningQuantity?.grade, plan: planType },\n });\n setPageCategory(\"planUpdate\");\n }\n };\n\n useEffect(() => {\n document.addEventListener(\"click\", onClickOuterClose);\n return () => {\n if (isLeaningQuantityPopup) {\n document.removeEventListener(\"click\", onClickOuterClose);\n }\n };\n }, [isLeaningQuantityPopup]);\n\n useEffect(() => {\n if (currentPlanInfo?.learning_quantity) {\n const resultObject = learningQuantityInfo.find((obj) => obj.grade === currentPlanInfo.learning_quantity);\n if (currentPlanInfo.plan === \"gpt35\") {\n setGptThreePointFiveSelectedLeaningQuantity(resultObject);\n } else if (currentPlanInfo.plan === \"gpt4\") {\n setGptFourSelectedLeaningQuantity(resultObject);\n }\n }\n }, []);\n\n return (\n <>\n
\n {!isNewRegister && (\n setPageNumber(1)}\n src={getImageUrl(\"images/icons/chevron-left.svg\")}\n />\n )}\n {t(\"title\")}\n
\n
\n
\n
\n \n
\n
\n
\n {t(\"gptThreePointFive.planName\")}\n
\n
{t(\"gptThreePointFive.description\")}
\n
\n
\n
\n
{t(\"monthlyLicenseAmount\")}
\n
\n {t(\"amountMark\")}\n {t(\"gptThreePointFive.licenseAmount\")}\n {t(\"nameUnit\")}\n
\n
\n
\n
{t(\"monthlyLearningAmount\")}
\n
\n {t(\"amountMark\")}\n \n {gptThreePointFiveSelectedLeaningQuantity?.cost?.toLocaleString()}\n \n
\n
\n onClickLearningQuantityBtn(\"gpt35\")}\n >\n
\n \n \n {gptThreePointFiveSelectedLeaningQuantity?.display_name}\n \n \n
\n
\n
\n \n isDisabled ||\n (currentPlanInfo.plan === \"gpt35\" &&\n currentPlanInfo.learning_quantity === gptThreePointFiveSelectedLeaningQuantity.grade)\n ? \"\"\n : onClickPlanChangeBtn(gptThreePointFiveSelectedLeaningQuantity, \"gpt35\")\n }\n style={{\n backgroundColor:\n isDisabled ||\n (currentPlanInfo.plan === \"gpt35\" &&\n currentPlanInfo.learning_quantity === gptThreePointFiveSelectedLeaningQuantity.grade)\n ? \"#cacaca\"\n : \"\",\n cursor:\n isDisabled ||\n (currentPlanInfo.plan === \"gpt35\" &&\n currentPlanInfo.learning_quantity === gptThreePointFiveSelectedLeaningQuantity.grade)\n ? \"default\"\n : \"pointer\",\n }}\n >\n {currentPlanInfo.plan === \"gpt35\" &&\n currentPlanInfo.learning_quantity === gptThreePointFiveSelectedLeaningQuantity.grade\n ? t(\"currentPlan\")\n : gptThreePointFiveSelectedLeaningQuantity.rank < currentPlanInfo.rank ||\n currentPlanInfo.plan === \"gpt4\"\n ? t(\"gptThreePointFive.downgradeSubmit\")\n : t(\"gptThreePointFive.upgradeSubmit\")}\n
\n
\n \n\n
\n
\n
\n
{t(\"gptFour.planName\")}
\n
{t(\"gptFour.description\")}
\n
\n
\n
\n
{t(\"monthlyLicenseAmount\")}
\n
\n {t(\"amountMark\")}\n {t(\"gptFour.licenseAmount\")}\n {t(\"nameUnit\")}\n
\n
\n
\n
{t(\"monthlyLearningAmount\")}
\n
\n {t(\"amountMark\")}\n \n {gptFourSelectedLeaningQuantity?.cost?.toLocaleString()}\n \n
\n
\n onClickLearningQuantityBtn(\"gpt4\")}\n >\n
\n \n {gptFourSelectedLeaningQuantity?.display_name}\n \n
\n
\n
\n \n isDisabled ||\n (currentPlanInfo.plan === \"gpt4\" &&\n currentPlanInfo.learning_quantity === gptFourSelectedLeaningQuantity.grade)\n ? \"\"\n : onClickPlanChangeBtn(gptFourSelectedLeaningQuantity, \"gpt4\")\n }\n style={{\n backgroundColor:\n isDisabled ||\n (currentPlanInfo.plan === \"gpt4\" &&\n currentPlanInfo.learning_quantity === gptFourSelectedLeaningQuantity.grade)\n ? \"#cacaca\"\n : \"\",\n cursor:\n isDisabled ||\n (currentPlanInfo.plan === \"gpt4\" &&\n currentPlanInfo.learning_quantity === gptFourSelectedLeaningQuantity.grade)\n ? \"default\"\n : \"pointer\",\n }}\n >\n {currentPlanInfo.plan === \"gpt4\" &&\n currentPlanInfo.learning_quantity === gptFourSelectedLeaningQuantity.grade\n ? t(\"currentPlan\")\n : gptFourSelectedLeaningQuantity.rank < currentPlanInfo.rank\n ? t(\"gptFour.downgradeSubmit\")\n : t(\"gptFour.upgradeSubmit\")}\n \n \n \n
\n {isLeaningQuantityPopup && (\n <>\n {selectedPlanType === \"gpt35\" ? (\n \n ) : selectedPlanType === \"gpt4\" ? (\n \n ) : (\n <>\n )}\n \n )}\n
\n \n
\n
\n
\n {t(\"planTable.licenseAmount.title\")}\n
\n
\n \n {t(\"planTable.licenseAmount.gpt35Value\")}\n
\n
\n {t(\"planTable.licenseAmount.gpt4Value\")}\n
\n
\n
\n\n
\n \n {t(\"planTable.learningAmount.title\")}\n
\n
\n \n
{t(\"planTable.learningAmount.cost_description.0\")}
\n
{t(\"planTable.learningAmount.cost_description.10\")}
\n
{t(\"planTable.learningAmount.cost_description.25\")}
\n
{t(\"planTable.learningAmount.cost_description.50\")}
\n
{t(\"planTable.learningAmount.cost_description.100\")}
\n
{t(\"planTable.learningAmount.cost_description.200\")}
\n
{t(\"planTable.learningAmount.cost_description.300\")}
\n
{t(\"planTable.learningAmount.cost_description.400\")}
\n
{t(\"planTable.learningAmount.cost_description.500\")}
\n
\n \n
{t(\"planTable.learningAmount.cost_description.0\")}
\n
{t(\"planTable.learningAmount.cost_description.10\")}
\n
{t(\"planTable.learningAmount.cost_description.25\")}
\n
{t(\"planTable.learningAmount.cost_description.50\")}
\n
{t(\"planTable.learningAmount.cost_description.100\")}
\n
{t(\"planTable.learningAmount.cost_description.200\")}
\n
{t(\"planTable.learningAmount.cost_description.300\")}
\n
{t(\"planTable.learningAmount.cost_description.400\")}
\n
{t(\"planTable.learningAmount.cost_description.500\")}
\n \n \n \n
\n
\n {t(\"planTable.taskAmountLimit.title\")}\n
\n
\n \n {t(\"planTable.taskAmountLimit.gpt35Value\")}\n
\n
\n {t(\"planTable.taskAmountLimit.gpt4Value\")}\n
\n
\n \n
\n
\n {t(\"planTable.userLimit.title\")}\n
\n
\n \n {t(\"planTable.userLimit.gpt35Value\")}\n
\n
\n {t(\"planTable.userLimit.gpt4Value\")}\n
\n
\n \n
\n
\n {t(\"planTable.knowledgeSearchModel.title\")}\n
\n
\n \n {t(\"planTable.knowledgeSearchModel.gpt35Value\")}\n
\n
\n {t(\"planTable.knowledgeSearchModel.gpt4Value\")}\n
\n
\n \n
\n
\n {t(\"planTable.mailGenerationModel.title\")}\n
\n
\n \n {t(\"planTable.mailGenerationModel.gpt35Value\")}\n
\n
\n {t(\"planTable.mailGenerationModel.gpt4Value\")}\n
\n
\n \n
\n
\n {t(\"planTable.learningModel.title\")}\n
\n
\n \n {t(\"planTable.learningModel.gpt35Value\")}\n
\n
\n {t(\"planTable.learningModel.gpt4Value\")}\n
\n
\n \n
\n
{t(\"firstConsideration\")}
\n
{t(\"secondConsideration\")}
\n
{t(\"thirdConsideration\")}
\n
\n \n \n \n \n );\n};\n\nChangePlanPriceList.propTypes = {\n currentPlanInfo: PropTypes.object,\n learningQuantityInfo: PropTypes.array,\n setPageCategory: PropTypes.func,\n setChangePlanInfo: PropTypes.func,\n setPageNumber: PropTypes.func,\n isNewRegister: PropTypes.bool,\n createPlan: PropTypes.func,\n isDisabled: PropTypes.bool,\n};\n","export default function _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n };\n return _extends.apply(this, arguments);\n}","export default function _objectWithoutPropertiesLoose(source, excluded) {\n if (source == null) return {};\n var target = {};\n var sourceKeys = Object.keys(source);\n var key, i;\n\n for (i = 0; i < sourceKeys.length; i++) {\n key = sourceKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n target[key] = source[key];\n }\n\n return target;\n}","/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\tvar nativeCodeString = '[native code]';\n\n\tfunction classNames() {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg)) {\n\t\t\t\tif (arg.length) {\n\t\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\t\tif (inner) {\n\t\t\t\t\t\tclasses.push(inner);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\t\t\tclasses.push(arg.toString());\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","export default function _setPrototypeOf(o, p) {\n _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n return _setPrototypeOf(o, p);\n}","import setPrototypeOf from \"./setPrototypeOf.js\";\nexport default function _inheritsLoose(subClass, superClass) {\n subClass.prototype = Object.create(superClass.prototype);\n subClass.prototype.constructor = subClass;\n setPrototypeOf(subClass, superClass);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React, { useContext, useMemo } from 'react';\nvar ThemeContext = /*#__PURE__*/React.createContext({});\nvar Consumer = ThemeContext.Consumer,\n Provider = ThemeContext.Provider;\n\nfunction ThemeProvider(_ref) {\n var prefixes = _ref.prefixes,\n children = _ref.children;\n var copiedPrefixes = useMemo(function () {\n return _extends({}, prefixes);\n }, [prefixes]);\n return /*#__PURE__*/React.createElement(Provider, {\n value: copiedPrefixes\n }, children);\n}\n\nexport function useBootstrapPrefix(prefix, defaultPrefix) {\n var prefixes = useContext(ThemeContext);\n return prefix || prefixes[defaultPrefix] || defaultPrefix;\n}\n\nfunction createBootstrapComponent(Component, opts) {\n if (typeof opts === 'string') opts = {\n prefix: opts\n };\n var isClassy = Component.prototype && Component.prototype.isReactComponent; // If it's a functional component make sure we don't break it with a ref\n\n var _opts = opts,\n prefix = _opts.prefix,\n _opts$forwardRefAs = _opts.forwardRefAs,\n forwardRefAs = _opts$forwardRefAs === void 0 ? isClassy ? 'ref' : 'innerRef' : _opts$forwardRefAs;\n var Wrapped = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {\n var props = _extends({}, _ref2);\n\n props[forwardRefAs] = ref;\n var bsPrefix = useBootstrapPrefix(props.bsPrefix, prefix);\n return /*#__PURE__*/React.createElement(Component, _extends({}, props, {\n bsPrefix: bsPrefix\n }));\n });\n Wrapped.displayName = \"Bootstrap(\" + (Component.displayName || Component.name) + \")\";\n return Wrapped;\n}\n\nexport { createBootstrapComponent, Consumer as ThemeConsumer };\nexport default ThemeProvider;","/**\n * Returns the owner document of a given element.\n * \n * @param node the element\n */\nexport default function ownerDocument(node) {\n return node && node.ownerDocument || document;\n}","import ownerDocument from './ownerDocument';\n/**\n * Returns the owner window of a given element.\n * \n * @param node the element\n */\n\nexport default function ownerWindow(node) {\n var doc = ownerDocument(node);\n return doc && doc.defaultView || window;\n}","import ownerWindow from './ownerWindow';\n/**\n * Returns one or all computed style properties of an element.\n * \n * @param node the element\n * @param psuedoElement the style property\n */\n\nexport default function getComputedStyle(node, psuedoElement) {\n return ownerWindow(node).getComputedStyle(node, psuedoElement);\n}","var rUpper = /([A-Z])/g;\nexport default function hyphenate(string) {\n return string.replace(rUpper, '-$1').toLowerCase();\n}","/**\n * Copyright 2013-2014, Facebook, Inc.\n * All rights reserved.\n * https://github.com/facebook/react/blob/2aeb8a2a6beb00617a4217f7f8284924fa2ad819/src/vendor/core/hyphenateStyleName.js\n */\nimport hyphenate from './hyphenate';\nvar msPattern = /^ms-/;\nexport default function hyphenateStyleName(string) {\n return hyphenate(string).replace(msPattern, '-ms-');\n}","var supportedTransforms = /^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i;\nexport default function isTransform(value) {\n return !!(value && supportedTransforms.test(value));\n}","import getComputedStyle from './getComputedStyle';\nimport hyphenate from './hyphenateStyle';\nimport isTransform from './isTransform';\n\nfunction style(node, property) {\n var css = '';\n var transforms = '';\n\n if (typeof property === 'string') {\n return node.style.getPropertyValue(hyphenate(property)) || getComputedStyle(node).getPropertyValue(hyphenate(property));\n }\n\n Object.keys(property).forEach(function (key) {\n var value = property[key];\n\n if (!value && value !== 0) {\n node.style.removeProperty(hyphenate(key));\n } else if (isTransform(key)) {\n transforms += key + \"(\" + value + \") \";\n } else {\n css += hyphenate(key) + \": \" + value + \";\";\n }\n });\n\n if (transforms) {\n css += \"transform: \" + transforms + \";\";\n }\n\n node.style.cssText += \";\" + css;\n}\n\nexport default style;","export default {\n disabled: false\n};","import React from 'react';\nexport default React.createContext(null);","export var forceReflow = function forceReflow(node) {\n return node.scrollTop;\n};","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport config from './config';\nimport { timeoutsShape } from './utils/PropTypes';\nimport TransitionGroupContext from './TransitionGroupContext';\nimport { forceReflow } from './utils/reflow';\nexport var UNMOUNTED = 'unmounted';\nexport var EXITED = 'exited';\nexport var ENTERING = 'entering';\nexport var ENTERED = 'entered';\nexport var EXITING = 'exiting';\n/**\n * The Transition component lets you describe a transition from one component\n * state to another _over time_ with a simple declarative API. Most commonly\n * it's used to animate the mounting and unmounting of a component, but can also\n * be used to describe in-place transition states as well.\n *\n * ---\n *\n * **Note**: `Transition` is a platform-agnostic base component. If you're using\n * transitions in CSS, you'll probably want to use\n * [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition)\n * instead. It inherits all the features of `Transition`, but contains\n * additional features necessary to play nice with CSS transitions (hence the\n * name of the component).\n *\n * ---\n *\n * By default the `Transition` component does not alter the behavior of the\n * component it renders, it only tracks \"enter\" and \"exit\" states for the\n * components. It's up to you to give meaning and effect to those states. For\n * example we can add styles to a component when it enters or exits:\n *\n * ```jsx\n * import { Transition } from 'react-transition-group';\n *\n * const duration = 300;\n *\n * const defaultStyle = {\n * transition: `opacity ${duration}ms ease-in-out`,\n * opacity: 0,\n * }\n *\n * const transitionStyles = {\n * entering: { opacity: 1 },\n * entered: { opacity: 1 },\n * exiting: { opacity: 0 },\n * exited: { opacity: 0 },\n * };\n *\n * const Fade = ({ in: inProp }) => (\n * \n * {state => (\n *
\n * I'm a fade Transition!\n *
\n * )}\n *
\n * );\n * ```\n *\n * There are 4 main states a Transition can be in:\n * - `'entering'`\n * - `'entered'`\n * - `'exiting'`\n * - `'exited'`\n *\n * Transition state is toggled via the `in` prop. When `true` the component\n * begins the \"Enter\" stage. During this stage, the component will shift from\n * its current transition state, to `'entering'` for the duration of the\n * transition and then to the `'entered'` stage once it's complete. Let's take\n * the following example (we'll use the\n * [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook):\n *\n * ```jsx\n * function App() {\n * const [inProp, setInProp] = useState(false);\n * return (\n *
\n * \n * {state => (\n * // ...\n * )}\n * \n * \n *
\n * );\n * }\n * ```\n *\n * When the button is clicked the component will shift to the `'entering'` state\n * and stay there for 500ms (the value of `timeout`) before it finally switches\n * to `'entered'`.\n *\n * When `in` is `false` the same thing happens except the state moves from\n * `'exiting'` to `'exited'`.\n */\n\nvar Transition = /*#__PURE__*/function (_React$Component) {\n _inheritsLoose(Transition, _React$Component);\n\n function Transition(props, context) {\n var _this;\n\n _this = _React$Component.call(this, props, context) || this;\n var parentGroup = context; // In the context of a TransitionGroup all enters are really appears\n\n var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;\n var initialStatus;\n _this.appearStatus = null;\n\n if (props.in) {\n if (appear) {\n initialStatus = EXITED;\n _this.appearStatus = ENTERING;\n } else {\n initialStatus = ENTERED;\n }\n } else {\n if (props.unmountOnExit || props.mountOnEnter) {\n initialStatus = UNMOUNTED;\n } else {\n initialStatus = EXITED;\n }\n }\n\n _this.state = {\n status: initialStatus\n };\n _this.nextCallback = null;\n return _this;\n }\n\n Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {\n var nextIn = _ref.in;\n\n if (nextIn && prevState.status === UNMOUNTED) {\n return {\n status: EXITED\n };\n }\n\n return null;\n } // getSnapshotBeforeUpdate(prevProps) {\n // let nextStatus = null\n // if (prevProps !== this.props) {\n // const { status } = this.state\n // if (this.props.in) {\n // if (status !== ENTERING && status !== ENTERED) {\n // nextStatus = ENTERING\n // }\n // } else {\n // if (status === ENTERING || status === ENTERED) {\n // nextStatus = EXITING\n // }\n // }\n // }\n // return { nextStatus }\n // }\n ;\n\n var _proto = Transition.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n this.updateStatus(true, this.appearStatus);\n };\n\n _proto.componentDidUpdate = function componentDidUpdate(prevProps) {\n var nextStatus = null;\n\n if (prevProps !== this.props) {\n var status = this.state.status;\n\n if (this.props.in) {\n if (status !== ENTERING && status !== ENTERED) {\n nextStatus = ENTERING;\n }\n } else {\n if (status === ENTERING || status === ENTERED) {\n nextStatus = EXITING;\n }\n }\n }\n\n this.updateStatus(false, nextStatus);\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.cancelNextCallback();\n };\n\n _proto.getTimeouts = function getTimeouts() {\n var timeout = this.props.timeout;\n var exit, enter, appear;\n exit = enter = appear = timeout;\n\n if (timeout != null && typeof timeout !== 'number') {\n exit = timeout.exit;\n enter = timeout.enter; // TODO: remove fallback for next major\n\n appear = timeout.appear !== undefined ? timeout.appear : enter;\n }\n\n return {\n exit: exit,\n enter: enter,\n appear: appear\n };\n };\n\n _proto.updateStatus = function updateStatus(mounting, nextStatus) {\n if (mounting === void 0) {\n mounting = false;\n }\n\n if (nextStatus !== null) {\n // nextStatus will always be ENTERING or EXITING.\n this.cancelNextCallback();\n\n if (nextStatus === ENTERING) {\n if (this.props.unmountOnExit || this.props.mountOnEnter) {\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749\n // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.\n // To make the animation happen, we have to separate each rendering and avoid being processed as batched.\n\n if (node) forceReflow(node);\n }\n\n this.performEnter(mounting);\n } else {\n this.performExit();\n }\n } else if (this.props.unmountOnExit && this.state.status === EXITED) {\n this.setState({\n status: UNMOUNTED\n });\n }\n };\n\n _proto.performEnter = function performEnter(mounting) {\n var _this2 = this;\n\n var enter = this.props.enter;\n var appearing = this.context ? this.context.isMounting : mounting;\n\n var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],\n maybeNode = _ref2[0],\n maybeAppearing = _ref2[1];\n\n var timeouts = this.getTimeouts();\n var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED\n // if we are mounting and running this it means appear _must_ be set\n\n if (!mounting && !enter || config.disabled) {\n this.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode);\n });\n return;\n }\n\n this.props.onEnter(maybeNode, maybeAppearing);\n this.safeSetState({\n status: ENTERING\n }, function () {\n _this2.props.onEntering(maybeNode, maybeAppearing);\n\n _this2.onTransitionEnd(enterTimeout, function () {\n _this2.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode, maybeAppearing);\n });\n });\n });\n };\n\n _proto.performExit = function performExit() {\n var _this3 = this;\n\n var exit = this.props.exit;\n var timeouts = this.getTimeouts();\n var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED\n\n if (!exit || config.disabled) {\n this.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n return;\n }\n\n this.props.onExit(maybeNode);\n this.safeSetState({\n status: EXITING\n }, function () {\n _this3.props.onExiting(maybeNode);\n\n _this3.onTransitionEnd(timeouts.exit, function () {\n _this3.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n });\n });\n };\n\n _proto.cancelNextCallback = function cancelNextCallback() {\n if (this.nextCallback !== null) {\n this.nextCallback.cancel();\n this.nextCallback = null;\n }\n };\n\n _proto.safeSetState = function safeSetState(nextState, callback) {\n // This shouldn't be necessary, but there are weird race conditions with\n // setState callbacks and unmounting in testing, so always make sure that\n // we can cancel any pending setState callbacks after we unmount.\n callback = this.setNextCallback(callback);\n this.setState(nextState, callback);\n };\n\n _proto.setNextCallback = function setNextCallback(callback) {\n var _this4 = this;\n\n var active = true;\n\n this.nextCallback = function (event) {\n if (active) {\n active = false;\n _this4.nextCallback = null;\n callback(event);\n }\n };\n\n this.nextCallback.cancel = function () {\n active = false;\n };\n\n return this.nextCallback;\n };\n\n _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {\n this.setNextCallback(handler);\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);\n var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;\n\n if (!node || doesNotHaveTimeoutOrListener) {\n setTimeout(this.nextCallback, 0);\n return;\n }\n\n if (this.props.addEndListener) {\n var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],\n maybeNode = _ref3[0],\n maybeNextCallback = _ref3[1];\n\n this.props.addEndListener(maybeNode, maybeNextCallback);\n }\n\n if (timeout != null) {\n setTimeout(this.nextCallback, timeout);\n }\n };\n\n _proto.render = function render() {\n var status = this.state.status;\n\n if (status === UNMOUNTED) {\n return null;\n }\n\n var _this$props = this.props,\n children = _this$props.children,\n _in = _this$props.in,\n _mountOnEnter = _this$props.mountOnEnter,\n _unmountOnExit = _this$props.unmountOnExit,\n _appear = _this$props.appear,\n _enter = _this$props.enter,\n _exit = _this$props.exit,\n _timeout = _this$props.timeout,\n _addEndListener = _this$props.addEndListener,\n _onEnter = _this$props.onEnter,\n _onEntering = _this$props.onEntering,\n _onEntered = _this$props.onEntered,\n _onExit = _this$props.onExit,\n _onExiting = _this$props.onExiting,\n _onExited = _this$props.onExited,\n _nodeRef = _this$props.nodeRef,\n childProps = _objectWithoutPropertiesLoose(_this$props, [\"children\", \"in\", \"mountOnEnter\", \"unmountOnExit\", \"appear\", \"enter\", \"exit\", \"timeout\", \"addEndListener\", \"onEnter\", \"onEntering\", \"onEntered\", \"onExit\", \"onExiting\", \"onExited\", \"nodeRef\"]);\n\n return (\n /*#__PURE__*/\n // allows for nested Transitions\n React.createElement(TransitionGroupContext.Provider, {\n value: null\n }, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))\n );\n };\n\n return Transition;\n}(React.Component);\n\nTransition.contextType = TransitionGroupContext;\nTransition.propTypes = process.env.NODE_ENV !== \"production\" ? {\n /**\n * A React reference to DOM element that need to transition:\n * https://stackoverflow.com/a/51127130/4671932\n *\n * - When `nodeRef` prop is used, `node` is not passed to callback functions\n * (e.g. `onEnter`) because user already has direct access to the node.\n * - When changing `key` prop of `Transition` in a `TransitionGroup` a new\n * `nodeRef` need to be provided to `Transition` with changed `key` prop\n * (see\n * [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).\n */\n nodeRef: PropTypes.shape({\n current: typeof Element === 'undefined' ? PropTypes.any : function (propValue, key, componentName, location, propFullName, secret) {\n var value = propValue[key];\n return PropTypes.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);\n }\n }),\n\n /**\n * A `function` child can be used instead of a React element. This function is\n * called with the current transition status (`'entering'`, `'entered'`,\n * `'exiting'`, `'exited'`), which can be used to apply context\n * specific props to a component.\n *\n * ```jsx\n * \n * {state => (\n * \n * )}\n * \n * ```\n */\n children: PropTypes.oneOfType([PropTypes.func.isRequired, PropTypes.element.isRequired]).isRequired,\n\n /**\n * Show the component; triggers the enter or exit states\n */\n in: PropTypes.bool,\n\n /**\n * By default the child component is mounted immediately along with\n * the parent `Transition` component. If you want to \"lazy mount\" the component on the\n * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay\n * mounted, even on \"exited\", unless you also specify `unmountOnExit`.\n */\n mountOnEnter: PropTypes.bool,\n\n /**\n * By default the child component stays mounted after it reaches the `'exited'` state.\n * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.\n */\n unmountOnExit: PropTypes.bool,\n\n /**\n * By default the child component does not perform the enter transition when\n * it first mounts, regardless of the value of `in`. If you want this\n * behavior, set both `appear` and `in` to `true`.\n *\n * > **Note**: there are no special appear states like `appearing`/`appeared`, this prop\n * > only adds an additional enter transition. However, in the\n * > `` component that first enter transition does result in\n * > additional `.appear-*` classes, that way you can choose to style it\n * > differently.\n */\n appear: PropTypes.bool,\n\n /**\n * Enable or disable enter transitions.\n */\n enter: PropTypes.bool,\n\n /**\n * Enable or disable exit transitions.\n */\n exit: PropTypes.bool,\n\n /**\n * The duration of the transition, in milliseconds.\n * Required unless `addEndListener` is provided.\n *\n * You may specify a single timeout for all transitions:\n *\n * ```jsx\n * timeout={500}\n * ```\n *\n * or individually:\n *\n * ```jsx\n * timeout={{\n * appear: 500,\n * enter: 300,\n * exit: 500,\n * }}\n * ```\n *\n * - `appear` defaults to the value of `enter`\n * - `enter` defaults to `0`\n * - `exit` defaults to `0`\n *\n * @type {number | { enter?: number, exit?: number, appear?: number }}\n */\n timeout: function timeout(props) {\n var pt = timeoutsShape;\n if (!props.addEndListener) pt = pt.isRequired;\n\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n return pt.apply(void 0, [props].concat(args));\n },\n\n /**\n * Add a custom transition end trigger. Called with the transitioning\n * DOM node and a `done` callback. Allows for more fine grained transition end\n * logic. Timeouts are still used as a fallback if provided.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * ```jsx\n * addEndListener={(node, done) => {\n * // use the css transitionend event to mark the finish of a transition\n * node.addEventListener('transitionend', done, false);\n * }}\n * ```\n */\n addEndListener: PropTypes.func,\n\n /**\n * Callback fired before the \"entering\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement, isAppearing: bool) -> void\n */\n onEnter: PropTypes.func,\n\n /**\n * Callback fired after the \"entering\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement, isAppearing: bool)\n */\n onEntering: PropTypes.func,\n\n /**\n * Callback fired after the \"entered\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement, isAppearing: bool) -> void\n */\n onEntered: PropTypes.func,\n\n /**\n * Callback fired before the \"exiting\" status is applied.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExit: PropTypes.func,\n\n /**\n * Callback fired after the \"exiting\" status is applied.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed.\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExiting: PropTypes.func,\n\n /**\n * Callback fired after the \"exited\" status is applied.\n *\n * **Note**: when `nodeRef` prop is passed, `node` is not passed\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExited: PropTypes.func\n} : {}; // Name the function so it is clearer in the documentation\n\nfunction noop() {}\n\nTransition.defaultProps = {\n in: false,\n mountOnEnter: false,\n unmountOnExit: false,\n appear: false,\n enter: true,\n exit: true,\n onEnter: noop,\n onEntering: noop,\n onEntered: noop,\n onExit: noop,\n onExiting: noop,\n onExited: noop\n};\nTransition.UNMOUNTED = UNMOUNTED;\nTransition.EXITED = EXITED;\nTransition.ENTERING = ENTERING;\nTransition.ENTERED = ENTERED;\nTransition.EXITING = EXITING;\nexport default Transition;","export default !!(typeof window !== 'undefined' && window.document && window.document.createElement);","/* eslint-disable no-return-assign */\nimport canUseDOM from './canUseDOM';\nexport var optionsSupported = false;\nexport var onceSupported = false;\n\ntry {\n var options = {\n get passive() {\n return optionsSupported = true;\n },\n\n get once() {\n // eslint-disable-next-line no-multi-assign\n return onceSupported = optionsSupported = true;\n }\n\n };\n\n if (canUseDOM) {\n window.addEventListener('test', options, options);\n window.removeEventListener('test', options, true);\n }\n} catch (e) {\n /* */\n}\n\n/**\n * An `addEventListener` ponyfill, supports the `once` option\n * \n * @param node the element\n * @param eventName the event name\n * @param handle the handler\n * @param options event options\n */\nfunction addEventListener(node, eventName, handler, options) {\n if (options && typeof options !== 'boolean' && !onceSupported) {\n var once = options.once,\n capture = options.capture;\n var wrappedHandler = handler;\n\n if (!onceSupported && once) {\n wrappedHandler = handler.__once || function onceHandler(event) {\n this.removeEventListener(eventName, onceHandler, capture);\n handler.call(this, event);\n };\n\n handler.__once = wrappedHandler;\n }\n\n node.addEventListener(eventName, wrappedHandler, optionsSupported ? options : capture);\n }\n\n node.addEventListener(eventName, handler, options);\n}\n\nexport default addEventListener;","/**\n * A `removeEventListener` ponyfill\n * \n * @param node the element\n * @param eventName the event name\n * @param handle the handler\n * @param options event options\n */\nfunction removeEventListener(node, eventName, handler, options) {\n var capture = options && typeof options !== 'boolean' ? options.capture : options;\n node.removeEventListener(eventName, handler, capture);\n\n if (handler.__once) {\n node.removeEventListener(eventName, handler.__once, capture);\n }\n}\n\nexport default removeEventListener;","import addEventListener from './addEventListener';\nimport removeEventListener from './removeEventListener';\n\nfunction listen(node, eventName, handler, options) {\n addEventListener(node, eventName, handler, options);\n return function () {\n removeEventListener(node, eventName, handler, options);\n };\n}\n\nexport default listen;","/**\n * Triggers an event on a given element.\n * \n * @param node the element\n * @param eventName the event name to trigger\n * @param bubbles whether the event should bubble up\n * @param cancelable whether the event should be cancelable\n */\nexport default function triggerEvent(node, eventName, bubbles, cancelable) {\n if (bubbles === void 0) {\n bubbles = false;\n }\n\n if (cancelable === void 0) {\n cancelable = true;\n }\n\n if (node) {\n var event = document.createEvent('HTMLEvents');\n event.initEvent(eventName, bubbles, cancelable);\n node.dispatchEvent(event);\n }\n}","import css from './css';\nimport listen from './listen';\nimport triggerEvent from './triggerEvent';\n\nfunction parseDuration(node) {\n var str = css(node, 'transitionDuration') || '';\n var mult = str.indexOf('ms') === -1 ? 1000 : 1;\n return parseFloat(str) * mult;\n}\n\nfunction emulateTransitionEnd(element, duration, padding) {\n if (padding === void 0) {\n padding = 5;\n }\n\n var called = false;\n var handle = setTimeout(function () {\n if (!called) triggerEvent(element, 'transitionend', true);\n }, duration + padding);\n var remove = listen(element, 'transitionend', function () {\n called = true;\n }, {\n once: true\n });\n return function () {\n clearTimeout(handle);\n remove();\n };\n}\n\nexport default function transitionEnd(element, handler, duration, padding) {\n if (duration == null) duration = parseDuration(element) || 0;\n var removeEmulate = emulateTransitionEnd(element, duration, padding);\n var remove = listen(element, 'transitionend', handler);\n return function () {\n removeEmulate();\n remove();\n };\n}","import css from 'dom-helpers/css';\nimport transitionEnd from 'dom-helpers/transitionEnd';\n\nfunction parseDuration(node, property) {\n var str = css(node, property) || '';\n var mult = str.indexOf('ms') === -1 ? 1000 : 1;\n return parseFloat(str) * mult;\n}\n\nexport default function transitionEndListener(element, handler) {\n var duration = parseDuration(element, 'transitionDuration');\n var delay = parseDuration(element, 'transitionDelay');\n var remove = transitionEnd(element, function (e) {\n if (e.target === element) {\n remove();\n handler(e);\n }\n }, duration + delay);\n}","// reading a dimension prop will cause the browser to recalculate,\n// which will let our animations work\nexport default function triggerBrowserReflow(node) {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n node.offsetHeight;\n}","import { useEffect, useRef } from 'react';\n/**\n * Creates a `Ref` whose value is updated in an effect, ensuring the most recent\n * value is the one rendered with. Generally only required for Concurrent mode usage\n * where previous work in `render()` may be discarded before being used.\n *\n * This is safe to access in an event handler.\n *\n * @param value The `Ref` value\n */\n\nfunction useCommittedRef(value) {\n var ref = useRef(value);\n useEffect(function () {\n ref.current = value;\n }, [value]);\n return ref;\n}\n\nexport default useCommittedRef;","import { useCallback } from 'react';\nimport useCommittedRef from './useCommittedRef';\nexport default function useEventCallback(fn) {\n var ref = useCommittedRef(fn);\n return useCallback(function () {\n return ref.current && ref.current.apply(ref, arguments);\n }, [ref]);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"className\", \"children\"];\n\nvar _fadeStyles;\n\nimport classNames from 'classnames';\nimport React, { useCallback } from 'react';\nimport Transition, { ENTERED, ENTERING } from 'react-transition-group/Transition';\nimport transitionEndListener from './transitionEndListener';\nimport triggerBrowserReflow from './triggerBrowserReflow';\nvar defaultProps = {\n in: false,\n timeout: 300,\n mountOnEnter: false,\n unmountOnExit: false,\n appear: false\n};\nvar fadeStyles = (_fadeStyles = {}, _fadeStyles[ENTERING] = 'show', _fadeStyles[ENTERED] = 'show', _fadeStyles);\nvar Fade = /*#__PURE__*/React.forwardRef(function (_ref, ref) {\n var className = _ref.className,\n children = _ref.children,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n\n var handleEnter = useCallback(function (node) {\n triggerBrowserReflow(node);\n if (props.onEnter) props.onEnter(node);\n }, [props]);\n return /*#__PURE__*/React.createElement(Transition, _extends({\n ref: ref,\n addEndListener: transitionEndListener\n }, props, {\n onEnter: handleEnter\n }), function (status, innerProps) {\n return /*#__PURE__*/React.cloneElement(children, _extends({}, innerProps, {\n className: classNames('fade', className, children.props.className, fadeStyles[status])\n }));\n });\n});\nFade.defaultProps = defaultProps;\nFade.displayName = 'Fade';\nexport default Fade;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"label\", \"onClick\", \"className\"];\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport classNames from 'classnames';\nvar propTypes = {\n label: PropTypes.string.isRequired,\n onClick: PropTypes.func\n};\nvar defaultProps = {\n label: 'Close'\n};\nvar CloseButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {\n var label = _ref.label,\n onClick = _ref.onClick,\n className = _ref.className,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n\n return /*#__PURE__*/React.createElement(\"button\", _extends({\n ref: ref,\n type: \"button\",\n className: classNames('close', className),\n onClick: onClick\n }, props), /*#__PURE__*/React.createElement(\"span\", {\n \"aria-hidden\": \"true\"\n }, \"\\xD7\"), /*#__PURE__*/React.createElement(\"span\", {\n className: \"sr-only\"\n }, label));\n});\nCloseButton.displayName = 'CloseButton';\nCloseButton.propTypes = propTypes;\nCloseButton.defaultProps = defaultProps;\nexport default CloseButton;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport classNames from 'classnames';\nexport default (function (className) {\n return /*#__PURE__*/React.forwardRef(function (p, ref) {\n return /*#__PURE__*/React.createElement(\"div\", _extends({}, p, {\n ref: ref,\n className: classNames(p.className, className)\n }));\n });\n});","var rHyphen = /-(.)/g;\nexport default function camelize(string) {\n return string.replace(rHyphen, function (_, chr) {\n return chr.toUpperCase();\n });\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"className\", \"bsPrefix\", \"as\"];\nimport classNames from 'classnames';\nimport camelize from 'dom-helpers/camelize';\nimport React from 'react';\nimport { useBootstrapPrefix } from './ThemeProvider';\n\nvar pascalCase = function pascalCase(str) {\n return str[0].toUpperCase() + camelize(str).slice(1);\n};\n\n// TODO: emstricten & fix the typing here! `createWithBsPrefix...`\nexport default function createWithBsPrefix(prefix, _temp) {\n var _ref = _temp === void 0 ? {} : _temp,\n _ref$displayName = _ref.displayName,\n displayName = _ref$displayName === void 0 ? pascalCase(prefix) : _ref$displayName,\n Component = _ref.Component,\n defaultProps = _ref.defaultProps;\n\n var BsComponent = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {\n var className = _ref2.className,\n bsPrefix = _ref2.bsPrefix,\n _ref2$as = _ref2.as,\n Tag = _ref2$as === void 0 ? Component || 'div' : _ref2$as,\n props = _objectWithoutPropertiesLoose(_ref2, _excluded);\n\n var resolvedPrefix = useBootstrapPrefix(bsPrefix, prefix);\n return /*#__PURE__*/React.createElement(Tag, _extends({\n ref: ref,\n className: classNames(className, resolvedPrefix)\n }, props));\n });\n BsComponent.defaultProps = defaultProps;\n BsComponent.displayName = displayName;\n return BsComponent;\n}","import { useRef, useEffect } from 'react';\n/**\n * Track whether a component is current mounted. Generally less preferable than\n * properlly canceling effects so they don't run after a component is unmounted,\n * but helpful in cases where that isn't feasible, such as a `Promise` resolution.\n *\n * @returns a function that returns the current isMounted state of the component\n *\n * ```ts\n * const [data, setData] = useState(null)\n * const isMounted = useMounted()\n *\n * useEffect(() => {\n * fetchdata().then((newData) => {\n * if (isMounted()) {\n * setData(newData);\n * }\n * })\n * })\n * ```\n */\n\nexport default function useMounted() {\n var mounted = useRef(true);\n var isMounted = useRef(function () {\n return mounted.current;\n });\n useEffect(function () {\n mounted.current = true;\n return function () {\n mounted.current = false;\n };\n }, []);\n return isMounted.current;\n}","import { useRef } from 'react';\n/**\n * Returns a ref that is immediately updated with the new value\n *\n * @param value The Ref value\n * @category refs\n */\n\nexport default function useUpdatedRef(value) {\n var valueRef = useRef(value);\n valueRef.current = value;\n return valueRef;\n}","import useUpdatedRef from './useUpdatedRef';\nimport { useEffect } from 'react';\n/**\n * Attach a callback that fires when a component unmounts\n *\n * @param fn Handler to run when the component unmounts\n * @category effects\n */\n\nexport default function useWillUnmount(fn) {\n var onUnmount = useUpdatedRef(fn);\n useEffect(function () {\n return function () {\n return onUnmount.current();\n };\n }, []);\n}","var toArray = Function.prototype.bind.call(Function.prototype.call, [].slice);\n/**\n * Runs `querySelectorAll` on a given element.\n * \n * @param element the element\n * @param selector the selector\n */\n\nexport default function qsa(element, selector) {\n return toArray(element.querySelectorAll(selector));\n}","import { useEffect, useRef } from 'react';\n/**\n * Store the last of some value. Tracked via a `Ref` only updating it\n * after the component renders.\n *\n * Helpful if you need to compare a prop value to it's previous value during render.\n *\n * ```ts\n * function Component(props) {\n * const lastProps = usePrevious(props)\n *\n * if (lastProps.foo !== props.foo)\n * resetValueFromProps(props.foo)\n * }\n * ```\n *\n * @param value the value to track\n */\n\nexport default function usePrevious(value) {\n var ref = useRef(null);\n useEffect(function () {\n ref.current = value;\n });\n return ref.current;\n}","import { useState } from 'react';\n/**\n * A convenience hook around `useState` designed to be paired with\n * the component [callback ref](https://reactjs.org/docs/refs-and-the-dom.html#callback-refs) api.\n * Callback refs are useful over `useRef()` when you need to respond to the ref being set\n * instead of lazily accessing it in an effect.\n *\n * ```ts\n * const [element, attachRef] = useCallbackRef()\n *\n * useEffect(() => {\n * if (!element) return\n *\n * const calendar = new FullCalendar.Calendar(element)\n *\n * return () => {\n * calendar.destroy()\n * }\n * }, [element])\n *\n * return
\n * ```\n *\n * @category refs\n */\n\nexport default function useCallbackRef() {\n return useState(null);\n}","/* eslint-disable no-bitwise, no-cond-assign */\n\n/**\n * Checks if an element contains another given element.\n * \n * @param context the context element\n * @param node the element to check\n */\nexport default function contains(context, node) {\n // HTML DOM and SVG DOM may have different support levels,\n // so we need to check on context instead of a document root element.\n if (context.contains) return context.contains(node);\n if (context.compareDocumentPosition) return context === node || !!(context.compareDocumentPosition(node) & 16);\n}","/**\n * Checks if a given element has a CSS class.\n * \n * @param element the element\n * @param className the CSS class name\n */\nexport default function hasClass(element, className) {\n if (element.classList) return !!className && element.classList.contains(className);\n return (\" \" + (element.className.baseVal || element.className) + \" \").indexOf(\" \" + className + \" \") !== -1;\n}","import canUseDOM from './canUseDOM';\nvar size;\nexport default function scrollbarSize(recalc) {\n if (!size && size !== 0 || recalc) {\n if (canUseDOM) {\n var scrollDiv = document.createElement('div');\n scrollDiv.style.position = 'absolute';\n scrollDiv.style.top = '-9999px';\n scrollDiv.style.width = '50px';\n scrollDiv.style.height = '50px';\n scrollDiv.style.overflow = 'scroll';\n document.body.appendChild(scrollDiv);\n size = scrollDiv.offsetWidth - scrollDiv.clientWidth;\n document.body.removeChild(scrollDiv);\n }\n }\n\n return size;\n}","import ownerDocument from './ownerDocument';\n/**\n * Returns the actively focused element safely.\n *\n * @param doc the document to check\n */\n\nexport default function activeElement(doc) {\n if (doc === void 0) {\n doc = ownerDocument();\n }\n\n // Support: IE 9 only\n // IE9 throws an \"Unspecified error\" accessing document.activeElement from an