` by default. You can change this\n * behavior by providing a `component` prop.\n * If you use React v16+ and would like to avoid a wrapping `
` element\n * you can pass in `component={null}`. This is useful if the wrapping div\n * borks your css styles.\n */\n component: PropTypes.any,\n\n /**\n * A set of `
` components, that are toggled `in` and out as they\n * leave. the `` will inject specific transition props, so\n * remember to spread them through if you are wrapping the `` as\n * with our `` example.\n *\n * While this component is meant for multiple `Transition` or `CSSTransition`\n * children, sometimes you may want to have a single transition child with\n * content that you want to be transitioned out and in when you change it\n * (e.g. routes, images etc.) In that case you can change the `key` prop of\n * the transition child as you change its content, this will cause\n * `TransitionGroup` to transition the child out and back in.\n */\n children: PropTypes.node,\n\n /**\n * A convenience prop that enables or disables appear animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n appear: PropTypes.bool,\n\n /**\n * A convenience prop that enables or disables enter animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n enter: PropTypes.bool,\n\n /**\n * A convenience prop that enables or disables exit animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n exit: PropTypes.bool,\n\n /**\n * You may need to apply reactive updates to a child as it is exiting.\n * This is generally done by using `cloneElement` however in the case of an exiting\n * child the element has already been removed and not accessible to the consumer.\n *\n * If you do need to update a child as it leaves you can provide a `childFactory`\n * to wrap every child, even the ones that are leaving.\n *\n * @type Function(child: ReactElement) -> ReactElement\n */\n childFactory: PropTypes.func\n} : {};\nTransitionGroup.defaultProps = defaultProps;\nexport default TransitionGroup;","import _extends from '@babel/runtime/helpers/esm/extends';\nimport _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';\nimport _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';\nimport React, { Component, isValidElement, cloneElement } from 'react';\nimport PropTypes from 'prop-types';\nimport cx from 'classnames';\nimport { Transition, TransitionGroup } from 'react-transition-group';\nimport { render } from 'react-dom';\n\nvar POSITION = {\n TOP_LEFT: 'top-left',\n TOP_RIGHT: 'top-right',\n TOP_CENTER: 'top-center',\n BOTTOM_LEFT: 'bottom-left',\n BOTTOM_RIGHT: 'bottom-right',\n BOTTOM_CENTER: 'bottom-center'\n};\nvar TYPE = {\n INFO: 'info',\n SUCCESS: 'success',\n WARNING: 'warning',\n ERROR: 'error',\n DEFAULT: 'default'\n};\nvar ACTION = {\n SHOW: 0,\n CLEAR: 1,\n DID_MOUNT: 2,\n WILL_UNMOUNT: 3,\n ON_CHANGE: 4\n};\nvar NOOP = function NOOP() {};\nvar RT_NAMESPACE = 'Toastify';\n\nfunction isValidDelay(val) {\n return typeof val === 'number' && !isNaN(val) && val > 0;\n}\nfunction objectValues(obj) {\n return Object.keys(obj).map(function (key) {\n return obj[key];\n });\n}\nvar canUseDom = !!(typeof window !== 'undefined' && window.document && window.document.createElement);\n\nfunction withRequired(fn) {\n fn.isRequired = function (props, propName, componentName) {\n var prop = props[propName];\n\n if (typeof prop === 'undefined') {\n return new Error(\"The prop \" + propName + \" is marked as required in \\n \" + componentName + \", but its value is undefined.\");\n }\n\n fn(props, propName, componentName);\n };\n\n return fn;\n}\n\nvar falseOrDelay = withRequired(function (props, propName, componentName) {\n var prop = props[propName];\n\n if (prop !== false && !isValidDelay(prop)) {\n return new Error(componentName + \" expect \" + propName + \" \\n to be a valid Number > 0 or equal to false. \" + prop + \" given.\");\n }\n\n return null;\n});\n\nvar eventManager = {\n list: new Map(),\n emitQueue: new Map(),\n on: function on(event, callback) {\n this.list.has(event) || this.list.set(event, []);\n this.list.get(event).push(callback);\n return this;\n },\n off: function off(event) {\n this.list.delete(event);\n return this;\n },\n cancelEmit: function cancelEmit(event) {\n var timers = this.emitQueue.get(event);\n\n if (timers) {\n timers.forEach(function (timer) {\n return clearTimeout(timer);\n });\n this.emitQueue.delete(event);\n }\n\n return this;\n },\n\n /**\n * Enqueue the event at the end of the call stack\n * Doing so let the user call toast as follow:\n * toast('1')\n * toast('2')\n * toast('3')\n * Without setTimemout the code above will not work\n */\n emit: function emit(event) {\n var _this = this;\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 this.list.has(event) && this.list.get(event).forEach(function (callback) {\n var timer = setTimeout(function () {\n callback.apply(void 0, args);\n }, 0);\n _this.emitQueue.has(event) || _this.emitQueue.set(event, []);\n\n _this.emitQueue.get(event).push(timer);\n });\n }\n};\n\nfunction cssTransition(_ref) {\n var enter = _ref.enter,\n exit = _ref.exit,\n _ref$duration = _ref.duration,\n duration = _ref$duration === void 0 ? 750 : _ref$duration,\n _ref$appendPosition = _ref.appendPosition,\n appendPosition = _ref$appendPosition === void 0 ? false : _ref$appendPosition;\n return function Animation(_ref2) {\n var children = _ref2.children,\n position = _ref2.position,\n preventExitTransition = _ref2.preventExitTransition,\n props = _objectWithoutPropertiesLoose(_ref2, [\"children\", \"position\", \"preventExitTransition\"]);\n\n var enterClassName = appendPosition ? enter + \"--\" + position : enter;\n var exitClassName = appendPosition ? exit + \"--\" + position : exit;\n var enterDuration, exitDuration;\n\n if (Array.isArray(duration) && duration.length === 2) {\n enterDuration = duration[0];\n exitDuration = duration[1];\n } else {\n enterDuration = exitDuration = duration;\n }\n\n var onEnter = function onEnter(node) {\n node.classList.add(enterClassName);\n node.style.animationFillMode = 'forwards';\n node.style.animationDuration = enterDuration * 0.001 + \"s\";\n };\n\n var onEntered = function onEntered(node) {\n node.classList.remove(enterClassName);\n node.style.cssText = '';\n };\n\n var onExit = function onExit(node) {\n node.classList.add(exitClassName);\n node.style.animationFillMode = 'forwards';\n node.style.animationDuration = exitDuration * 0.001 + \"s\";\n };\n\n return React.createElement(Transition, _extends({}, props, {\n timeout: preventExitTransition ? 0 : {\n enter: enterDuration,\n exit: exitDuration\n },\n onEnter: onEnter,\n onEntered: onEntered,\n onExit: preventExitTransition ? NOOP : onExit\n }), children);\n };\n}\n\nfunction ProgressBar(_ref) {\n var _cx, _animationEvent;\n\n var delay = _ref.delay,\n isRunning = _ref.isRunning,\n closeToast = _ref.closeToast,\n type = _ref.type,\n hide = _ref.hide,\n className = _ref.className,\n userStyle = _ref.style,\n controlledProgress = _ref.controlledProgress,\n progress = _ref.progress,\n rtl = _ref.rtl;\n\n var style = _extends({}, userStyle, {\n animationDuration: delay + \"ms\",\n animationPlayState: isRunning ? 'running' : 'paused',\n opacity: hide ? 0 : 1,\n transform: controlledProgress ? \"scaleX(\" + progress + \")\" : null\n });\n\n var classNames = cx(RT_NAMESPACE + \"__progress-bar\", controlledProgress ? RT_NAMESPACE + \"__progress-bar--controlled\" : RT_NAMESPACE + \"__progress-bar--animated\", RT_NAMESPACE + \"__progress-bar--\" + type, (_cx = {}, _cx[RT_NAMESPACE + \"__progress-bar--rtl\"] = rtl, _cx), className);\n var animationEvent = (_animationEvent = {}, _animationEvent[controlledProgress && progress >= 1 ? 'onTransitionEnd' : 'onAnimationEnd'] = controlledProgress && progress < 1 ? null : closeToast, _animationEvent);\n return React.createElement(\"div\", _extends({\n className: classNames,\n style: style\n }, animationEvent));\n}\n\nProgressBar.propTypes = {\n /**\n * The animation delay which determine when to close the toast\n */\n delay: falseOrDelay.isRequired,\n\n /**\n * Whether or not the animation is running or paused\n */\n isRunning: PropTypes.bool.isRequired,\n\n /**\n * Func to close the current toast\n */\n closeToast: PropTypes.func.isRequired,\n\n /**\n * Support rtl content\n */\n rtl: PropTypes.bool.isRequired,\n\n /**\n * Optional type : info, success ...\n */\n type: PropTypes.string,\n\n /**\n * Hide or not the progress bar\n */\n hide: PropTypes.bool,\n\n /**\n * Optionnal className\n */\n className: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n\n /**\n * Controlled progress value\n */\n progress: PropTypes.number,\n\n /**\n * Tell wether or not controlled progress bar is used\n */\n controlledProgress: PropTypes.bool\n};\nProgressBar.defaultProps = {\n type: TYPE.DEFAULT,\n hide: false\n};\n\nfunction getX(e) {\n return e.targetTouches && e.targetTouches.length >= 1 ? e.targetTouches[0].clientX : e.clientX;\n}\n\nfunction getY(e) {\n return e.targetTouches && e.targetTouches.length >= 1 ? e.targetTouches[0].clientY : e.clientY;\n}\n\nvar iLoveInternetExplorer = canUseDom && /(msie|trident)/i.test(navigator.userAgent);\n\nvar Toast =\n/*#__PURE__*/\nfunction (_Component) {\n _inheritsLoose(Toast, _Component);\n\n function Toast() {\n var _this;\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n _this = _Component.call.apply(_Component, [this].concat(args)) || this;\n _this.state = {\n isRunning: true,\n preventExitTransition: false\n };\n _this.flag = {\n canCloseOnClick: true,\n canDrag: false\n };\n _this.drag = {\n start: 0,\n x: 0,\n y: 0,\n deltaX: 0,\n removalDistance: 0\n };\n _this.boundingRect = null;\n _this.ref = null;\n\n _this.pauseToast = function () {\n if (_this.props.autoClose) {\n _this.setState({\n isRunning: false\n });\n }\n };\n\n _this.playToast = function () {\n if (_this.props.autoClose) {\n _this.setState({\n isRunning: true\n });\n }\n };\n\n _this.onDragStart = function (e) {\n _this.flag.canCloseOnClick = true;\n _this.flag.canDrag = true;\n _this.boundingRect = _this.ref.getBoundingClientRect();\n _this.ref.style.transition = '';\n _this.drag.start = _this.drag.x = getX(e.nativeEvent);\n _this.drag.removalDistance = _this.ref.offsetWidth * (_this.props.draggablePercent / 100);\n };\n\n _this.onDragMove = function (e) {\n if (_this.flag.canDrag) {\n if (_this.state.isRunning) {\n _this.pauseToast();\n }\n\n _this.drag.x = getX(e);\n _this.drag.deltaX = _this.drag.x - _this.drag.start;\n _this.drag.y = getY(e); // prevent false positif during a toast click\n\n _this.drag.start !== _this.drag.x && (_this.flag.canCloseOnClick = false);\n _this.ref.style.transform = \"translateX(\" + _this.drag.deltaX + \"px)\";\n _this.ref.style.opacity = 1 - Math.abs(_this.drag.deltaX / _this.drag.removalDistance);\n }\n };\n\n _this.onDragEnd = function (e) {\n if (_this.flag.canDrag) {\n _this.flag.canDrag = false;\n\n if (Math.abs(_this.drag.deltaX) > _this.drag.removalDistance) {\n _this.setState({\n preventExitTransition: true\n }, _this.props.closeToast);\n\n return;\n }\n\n _this.ref.style.transition = 'transform 0.2s, opacity 0.2s';\n _this.ref.style.transform = 'translateX(0)';\n _this.ref.style.opacity = 1;\n }\n };\n\n _this.onDragTransitionEnd = function () {\n if (_this.boundingRect) {\n var _this$boundingRect = _this.boundingRect,\n top = _this$boundingRect.top,\n bottom = _this$boundingRect.bottom,\n left = _this$boundingRect.left,\n right = _this$boundingRect.right;\n\n if (_this.props.pauseOnHover && _this.drag.x >= left && _this.drag.x <= right && _this.drag.y >= top && _this.drag.y <= bottom) {\n _this.pauseToast();\n } else {\n _this.playToast();\n }\n }\n };\n\n _this.onExitTransitionEnd = function () {\n if (iLoveInternetExplorer) {\n _this.props.onExited();\n\n return;\n }\n\n var height = _this.ref.scrollHeight;\n var style = _this.ref.style;\n requestAnimationFrame(function () {\n style.minHeight = 'initial';\n style.height = height + 'px';\n style.transition = 'all 0.4s ';\n requestAnimationFrame(function () {\n style.height = 0;\n style.padding = 0;\n style.margin = 0;\n });\n setTimeout(function () {\n return _this.props.onExited();\n }, 400);\n });\n };\n\n return _this;\n }\n\n var _proto = Toast.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n this.props.onOpen(this.props.children.props);\n\n if (this.props.draggable) {\n this.bindDragEvents();\n } // Maybe I could bind the event in the ToastContainer and rely on delegation\n\n\n if (this.props.pauseOnFocusLoss) {\n this.bindFocusEvents();\n }\n };\n\n _proto.componentDidUpdate = function componentDidUpdate(prevProps) {\n if (prevProps.draggable !== this.props.draggable) {\n if (this.props.draggable) {\n this.bindDragEvents();\n } else {\n this.unbindDragEvents();\n }\n }\n\n if (prevProps.pauseOnFocusLoss !== this.props.pauseOnFocusLoss) {\n if (this.props.pauseOnFocusLoss) {\n this.bindFocusEvents();\n } else {\n this.unbindFocusEvents();\n }\n }\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.props.onClose(this.props.children.props);\n\n if (this.props.draggable) {\n this.unbindDragEvents();\n }\n\n if (this.props.pauseOnFocusLoss) {\n this.unbindFocusEvents();\n }\n };\n\n _proto.bindFocusEvents = function bindFocusEvents() {\n window.addEventListener('focus', this.playToast);\n window.addEventListener('blur', this.pauseToast);\n };\n\n _proto.unbindFocusEvents = function unbindFocusEvents() {\n window.removeEventListener('focus', this.playToast);\n window.removeEventListener('blur', this.pauseToast);\n };\n\n _proto.bindDragEvents = function bindDragEvents() {\n document.addEventListener('mousemove', this.onDragMove);\n document.addEventListener('mouseup', this.onDragEnd);\n document.addEventListener('touchmove', this.onDragMove);\n document.addEventListener('touchend', this.onDragEnd);\n };\n\n _proto.unbindDragEvents = function unbindDragEvents() {\n document.removeEventListener('mousemove', this.onDragMove);\n document.removeEventListener('mouseup', this.onDragEnd);\n document.removeEventListener('touchmove', this.onDragMove);\n document.removeEventListener('touchend', this.onDragEnd);\n };\n\n _proto.render = function render() {\n var _cx,\n _this2 = this;\n\n var _this$props = this.props,\n closeButton = _this$props.closeButton,\n children = _this$props.children,\n autoClose = _this$props.autoClose,\n pauseOnHover = _this$props.pauseOnHover,\n onClick = _this$props.onClick,\n closeOnClick = _this$props.closeOnClick,\n type = _this$props.type,\n hideProgressBar = _this$props.hideProgressBar,\n closeToast = _this$props.closeToast,\n Transition = _this$props.transition,\n position = _this$props.position,\n className = _this$props.className,\n bodyClassName = _this$props.bodyClassName,\n progressClassName = _this$props.progressClassName,\n progressStyle = _this$props.progressStyle,\n updateId = _this$props.updateId,\n role = _this$props.role,\n progress = _this$props.progress,\n rtl = _this$props.rtl;\n var toastProps = {\n className: cx(RT_NAMESPACE + \"__toast\", RT_NAMESPACE + \"__toast--\" + type, (_cx = {}, _cx[RT_NAMESPACE + \"__toast--rtl\"] = rtl, _cx), className)\n };\n\n if (autoClose && pauseOnHover) {\n toastProps.onMouseEnter = this.pauseToast;\n toastProps.onMouseLeave = this.playToast;\n } // prevent toast from closing when user drags the toast\n\n\n if (closeOnClick) {\n toastProps.onClick = function (e) {\n onClick && onClick(e);\n _this2.flag.canCloseOnClick && closeToast();\n };\n }\n\n var controlledProgress = parseFloat(progress) === progress;\n return React.createElement(Transition, {\n in: this.props.in,\n appear: true,\n onExited: this.onExitTransitionEnd,\n position: position,\n preventExitTransition: this.state.preventExitTransition\n }, React.createElement(\"div\", _extends({\n onClick: onClick\n }, toastProps, {\n ref: function ref(_ref) {\n return _this2.ref = _ref;\n },\n onMouseDown: this.onDragStart,\n onTouchStart: this.onDragStart,\n onMouseUp: this.onDragTransitionEnd,\n onTouchEnd: this.onDragTransitionEnd\n }), React.createElement(\"div\", _extends({}, this.props.in && {\n role: role\n }, {\n className: cx(RT_NAMESPACE + \"__toast-body\", bodyClassName)\n }), children), closeButton && closeButton, (autoClose || controlledProgress) && React.createElement(ProgressBar, _extends({}, updateId && !controlledProgress ? {\n key: \"pb-\" + updateId\n } : {}, {\n rtl: rtl,\n delay: autoClose,\n isRunning: this.state.isRunning,\n closeToast: closeToast,\n hide: hideProgressBar,\n type: type,\n style: progressStyle,\n className: progressClassName,\n controlledProgress: controlledProgress,\n progress: progress\n }))));\n };\n\n return Toast;\n}(Component);\n\nToast.propTypes = {\n closeButton: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]).isRequired,\n autoClose: falseOrDelay.isRequired,\n children: PropTypes.node.isRequired,\n closeToast: PropTypes.func.isRequired,\n position: PropTypes.oneOf(objectValues(POSITION)).isRequired,\n pauseOnHover: PropTypes.bool.isRequired,\n pauseOnFocusLoss: PropTypes.bool.isRequired,\n closeOnClick: PropTypes.bool.isRequired,\n transition: PropTypes.func.isRequired,\n rtl: PropTypes.bool.isRequired,\n hideProgressBar: PropTypes.bool.isRequired,\n draggable: PropTypes.bool.isRequired,\n draggablePercent: PropTypes.number.isRequired,\n in: PropTypes.bool,\n onExited: PropTypes.func,\n onOpen: PropTypes.func,\n onClose: PropTypes.func,\n type: PropTypes.oneOf(objectValues(TYPE)),\n className: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n bodyClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n progressClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n progressStyle: PropTypes.object,\n progress: PropTypes.number,\n updateId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n ariaLabel: PropTypes.string,\n containerId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n role: PropTypes.string\n};\nToast.defaultProps = {\n type: TYPE.DEFAULT,\n in: true,\n onOpen: NOOP,\n onClose: NOOP,\n className: null,\n bodyClassName: null,\n progressClassName: null,\n updateId: null\n};\n\nfunction CloseButton(_ref) {\n var closeToast = _ref.closeToast,\n type = _ref.type,\n ariaLabel = _ref.ariaLabel;\n return React.createElement(\"button\", {\n className: RT_NAMESPACE + \"__close-button \" + RT_NAMESPACE + \"__close-button--\" + type,\n type: \"button\",\n onClick: function onClick(e) {\n e.stopPropagation();\n closeToast(e);\n },\n \"aria-label\": ariaLabel\n }, \"\\u2716\\uFE0E\");\n}\n\nCloseButton.propTypes = {\n closeToast: PropTypes.func,\n arialLabel: PropTypes.string\n};\nCloseButton.defaultProps = {\n ariaLabel: 'close'\n};\n\nvar Bounce = cssTransition({\n enter: RT_NAMESPACE + \"__bounce-enter\",\n exit: RT_NAMESPACE + \"__bounce-exit\",\n appendPosition: true\n});\nvar Slide = cssTransition({\n enter: RT_NAMESPACE + \"__slide-enter\",\n exit: RT_NAMESPACE + \"__slide-exit\",\n duration: [450, 750],\n appendPosition: true\n});\nvar Zoom = cssTransition({\n enter: RT_NAMESPACE + \"__zoom-enter\",\n exit: RT_NAMESPACE + \"__zoom-exit\"\n});\nvar Flip = cssTransition({\n enter: RT_NAMESPACE + \"__flip-enter\",\n exit: RT_NAMESPACE + \"__flip-exit\"\n});\n\nvar ToastContainer =\n/*#__PURE__*/\nfunction (_Component) {\n _inheritsLoose(ToastContainer, _Component);\n\n function ToastContainer() {\n var _this;\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n _this = _Component.call.apply(_Component, [this].concat(args)) || this;\n _this.state = {\n toast: []\n };\n _this.toastKey = 1;\n _this.collection = {};\n\n _this.isToastActive = function (id) {\n return _this.state.toast.indexOf(id) !== -1;\n };\n\n return _this;\n }\n\n var _proto = ToastContainer.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n var _this2 = this;\n\n eventManager.cancelEmit(ACTION.WILL_UNMOUNT).on(ACTION.SHOW, function (content, options) {\n return _this2.ref ? _this2.buildToast(content, options) : null;\n }).on(ACTION.CLEAR, function (id) {\n return !_this2.ref ? null : id == null ? _this2.clear() : _this2.removeToast(id);\n }).emit(ACTION.DID_MOUNT, this);\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n eventManager.emit(ACTION.WILL_UNMOUNT, this);\n };\n\n _proto.removeToast = function removeToast(id) {\n this.setState({\n toast: this.state.toast.filter(function (v) {\n return v !== id;\n })\n }, this.dispatchChange);\n };\n\n _proto.dispatchChange = function dispatchChange() {\n eventManager.emit(ACTION.ON_CHANGE, this.state.toast.length, this.props.containerId);\n };\n\n _proto.makeCloseButton = function makeCloseButton(toastClose, toastId, type) {\n var _this3 = this;\n\n var closeButton = this.props.closeButton;\n\n if (isValidElement(toastClose) || toastClose === false) {\n closeButton = toastClose;\n } else if (toastClose === true) {\n closeButton = this.props.closeButton && typeof this.props.closeButton !== 'boolean' ? this.props.closeButton : React.createElement(CloseButton, null);\n }\n\n return closeButton === false ? false : cloneElement(closeButton, {\n closeToast: function closeToast() {\n return _this3.removeToast(toastId);\n },\n type: type\n });\n };\n\n _proto.getAutoCloseDelay = function getAutoCloseDelay(toastAutoClose) {\n return toastAutoClose === false || isValidDelay(toastAutoClose) ? toastAutoClose : this.props.autoClose;\n };\n\n _proto.canBeRendered = function canBeRendered(content) {\n return isValidElement(content) || typeof content === 'string' || typeof content === 'number' || typeof content === 'function';\n };\n\n _proto.parseClassName = function parseClassName(prop) {\n if (typeof prop === 'string') {\n return prop;\n } else if (prop !== null && typeof prop === 'object' && 'toString' in prop) {\n return prop.toString();\n }\n\n return null;\n };\n\n _proto.belongToContainer = function belongToContainer(_ref) {\n var containerId = _ref.containerId;\n return containerId === this.props.containerId;\n };\n\n _proto.buildToast = function buildToast(content, _ref2) {\n var _this4 = this;\n\n var delay = _ref2.delay,\n options = _objectWithoutPropertiesLoose(_ref2, [\"delay\"]);\n\n if (!this.canBeRendered(content)) {\n throw new Error(\"The element you provided cannot be rendered. You provided an element of type \" + typeof content);\n }\n\n var toastId = options.toastId,\n updateId = options.updateId; // Check for multi-container and also for duplicate toastId\n // Maybe it would be better to extract it\n\n if (this.props.enableMultiContainer && !this.belongToContainer(options) || this.isToastActive(toastId) && updateId == null) {\n return;\n }\n\n var closeToast = function closeToast() {\n return _this4.removeToast(toastId);\n };\n\n var toastOptions = {\n id: toastId,\n // ⚠️ if no options.key, this.toastKey - 1 is assigned\n key: options.key || this.toastKey++,\n type: options.type,\n closeToast: closeToast,\n updateId: options.updateId,\n rtl: this.props.rtl,\n position: options.position || this.props.position,\n transition: options.transition || this.props.transition,\n className: this.parseClassName(options.className || this.props.toastClassName),\n bodyClassName: this.parseClassName(options.bodyClassName || this.props.bodyClassName),\n onClick: options.onClick || this.props.onClick,\n closeButton: this.makeCloseButton(options.closeButton, toastId, options.type),\n pauseOnHover: typeof options.pauseOnHover === 'boolean' ? options.pauseOnHover : this.props.pauseOnHover,\n pauseOnFocusLoss: typeof options.pauseOnFocusLoss === 'boolean' ? options.pauseOnFocusLoss : this.props.pauseOnFocusLoss,\n draggable: typeof options.draggable === 'boolean' ? options.draggable : this.props.draggable,\n draggablePercent: typeof options.draggablePercent === 'number' && !isNaN(options.draggablePercent) ? options.draggablePercent : this.props.draggablePercent,\n closeOnClick: typeof options.closeOnClick === 'boolean' ? options.closeOnClick : this.props.closeOnClick,\n progressClassName: this.parseClassName(options.progressClassName || this.props.progressClassName),\n progressStyle: this.props.progressStyle,\n autoClose: this.getAutoCloseDelay(options.autoClose),\n hideProgressBar: typeof options.hideProgressBar === 'boolean' ? options.hideProgressBar : this.props.hideProgressBar,\n progress: parseFloat(options.progress),\n role: typeof options.role === 'string' ? options.role : this.props.role\n };\n typeof options.onOpen === 'function' && (toastOptions.onOpen = options.onOpen);\n typeof options.onClose === 'function' && (toastOptions.onClose = options.onClose); // add closeToast function to react component only\n\n if (isValidElement(content) && typeof content.type !== 'string' && typeof content.type !== 'number') {\n content = cloneElement(content, {\n closeToast: closeToast\n });\n } else if (typeof content === 'function') {\n content = content({\n closeToast: closeToast\n });\n }\n\n if (isValidDelay(delay)) {\n setTimeout(function () {\n _this4.appendToast(toastOptions, content, options.staleToastId);\n }, delay);\n } else {\n this.appendToast(toastOptions, content, options.staleToastId);\n }\n };\n\n _proto.appendToast = function appendToast(options, content, staleToastId) {\n var _extends2;\n\n var id = options.id,\n updateId = options.updateId;\n this.collection = _extends({}, this.collection, (_extends2 = {}, _extends2[id] = {\n options: options,\n content: content,\n position: options.position\n }, _extends2));\n this.setState({\n toast: (updateId ? [].concat(this.state.toast) : [].concat(this.state.toast, [id])).filter(function (id) {\n return id !== staleToastId;\n })\n }, this.dispatchChange);\n };\n\n _proto.clear = function clear() {\n this.setState({\n toast: []\n });\n };\n\n _proto.renderToast = function renderToast() {\n var _this5 = this;\n\n var toastToRender = {};\n var _this$props = this.props,\n className = _this$props.className,\n style = _this$props.style,\n newestOnTop = _this$props.newestOnTop;\n var collection = newestOnTop ? Object.keys(this.collection).reverse() : Object.keys(this.collection); // group toast by position\n\n collection.forEach(function (toastId) {\n var _this5$collection$toa = _this5.collection[toastId],\n position = _this5$collection$toa.position,\n options = _this5$collection$toa.options,\n content = _this5$collection$toa.content;\n toastToRender[position] || (toastToRender[position] = []);\n\n if (_this5.state.toast.indexOf(options.id) !== -1) {\n toastToRender[position].push(React.createElement(Toast, _extends({}, options, {\n isDocumentHidden: _this5.state.isDocumentHidden,\n key: \"toast-\" + options.key\n }), content));\n } else {\n toastToRender[position].push(null);\n delete _this5.collection[toastId];\n }\n });\n return Object.keys(toastToRender).map(function (position) {\n var _cx;\n\n var disablePointer = toastToRender[position].length === 1 && toastToRender[position][0] === null;\n var props = {\n className: cx(RT_NAMESPACE + \"__toast-container\", RT_NAMESPACE + \"__toast-container--\" + position, (_cx = {}, _cx[RT_NAMESPACE + \"__toast-container--rtl\"] = _this5.props.rtl, _cx), _this5.parseClassName(className)),\n style: disablePointer ? _extends({}, style, {\n pointerEvents: 'none'\n }) : _extends({}, style)\n };\n return React.createElement(TransitionGroup, _extends({}, props, {\n key: \"container-\" + position\n }), toastToRender[position]);\n });\n };\n\n _proto.render = function render() {\n var _this6 = this;\n\n return React.createElement(\"div\", {\n ref: function ref(node) {\n return _this6.ref = node;\n },\n className: \"\" + RT_NAMESPACE\n }, this.renderToast());\n };\n\n return ToastContainer;\n}(Component);\n\nToastContainer.propTypes = {\n /**\n * Set toast position\n */\n position: PropTypes.oneOf(objectValues(POSITION)),\n\n /**\n * Disable or set autoClose delay\n */\n autoClose: falseOrDelay,\n\n /**\n * Disable or set a custom react element for the close button\n */\n closeButton: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]),\n\n /**\n * Hide or not progress bar when autoClose is enabled\n */\n hideProgressBar: PropTypes.bool,\n\n /**\n * Pause toast duration on hover\n */\n pauseOnHover: PropTypes.bool,\n\n /**\n * Dismiss toast on click\n */\n closeOnClick: PropTypes.bool,\n\n /**\n * Newest on top\n */\n newestOnTop: PropTypes.bool,\n\n /**\n * An optional className\n */\n className: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n\n /**\n * An optional style\n */\n style: PropTypes.object,\n\n /**\n * An optional className for the toast\n */\n toastClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n\n /**\n * An optional className for the toast body\n */\n bodyClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n\n /**\n * An optional className for the toast progress bar\n */\n progressClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n\n /**\n * An optional style for the toast progress bar\n */\n progressStyle: PropTypes.object,\n\n /**\n * Define enter and exit transition using react-transition-group\n */\n transition: PropTypes.func,\n\n /**\n * Support rtl display\n */\n rtl: PropTypes.bool,\n\n /**\n * Allow toast to be draggable\n */\n draggable: PropTypes.bool,\n\n /**\n * The percentage of the toast's width it takes for a drag to dismiss a toast\n */\n draggablePercent: PropTypes.number,\n\n /**\n * Pause the toast on focus loss\n */\n pauseOnFocusLoss: PropTypes.bool,\n\n /**\n * Show the toast only if it includes containerId and it's the same as containerId\n */\n enableMultiContainer: PropTypes.bool,\n\n /**\n * Set id to handle multiple container\n */\n containerId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Set role attribute for the toast body\n */\n role: PropTypes.string,\n\n /**\n * Fired when clicking inside toaster\n */\n onClick: PropTypes.func\n};\nToastContainer.defaultProps = {\n position: POSITION.TOP_RIGHT,\n transition: Bounce,\n rtl: false,\n autoClose: 5000,\n hideProgressBar: false,\n closeButton: React.createElement(CloseButton, null),\n pauseOnHover: true,\n pauseOnFocusLoss: true,\n closeOnClick: true,\n newestOnTop: false,\n draggable: true,\n draggablePercent: 80,\n className: null,\n style: null,\n toastClassName: null,\n bodyClassName: null,\n progressClassName: null,\n progressStyle: null,\n role: 'alert'\n};\n\nvar containers = new Map();\nvar latestInstance = null;\nvar containerDomNode = null;\nvar containerConfig = {};\nvar queue = [];\nvar lazy = false;\n/**\n * Check whether any container is currently mounted in the DOM\n */\n\nfunction isAnyContainerMounted() {\n return containers.size > 0;\n}\n/**\n * Get the container by id. Returns the last container declared when no id is given.\n */\n\n\nfunction getContainer(containerId) {\n if (!isAnyContainerMounted()) return null;\n if (!containerId) return containers.get(latestInstance);\n return containers.get(containerId);\n}\n/**\n * Get the toast by id, given it's in the DOM, otherwise returns null\n */\n\n\nfunction getToast(toastId, _ref) {\n var containerId = _ref.containerId;\n var container = getContainer(containerId);\n if (!container) return null;\n var toast = container.collection[toastId];\n if (typeof toast === 'undefined') return null;\n return toast;\n}\n/**\n * Merge provided options with the defaults settings and generate the toastId\n */\n\n\nfunction mergeOptions(options, type) {\n return _extends({}, options, {\n type: type,\n toastId: getToastId(options)\n });\n}\n/**\n * Generate a random toastId\n */\n\n\nfunction generateToastId() {\n return (Math.random().toString(36) + Date.now().toString(36)).substr(2, 10);\n}\n/**\n * Generate a toastId or use the one provided\n */\n\n\nfunction getToastId(options) {\n if (options && (typeof options.toastId === 'string' || typeof options.toastId === 'number' && !isNaN(options.toastId))) {\n return options.toastId;\n }\n\n return generateToastId();\n}\n/**\n * If the container is not mounted, the toast is enqueued and\n * the container lazy mounted\n */\n\n\nfunction dispatchToast(content, options) {\n if (isAnyContainerMounted()) {\n eventManager.emit(ACTION.SHOW, content, options);\n } else {\n queue.push({\n action: ACTION.SHOW,\n content: content,\n options: options\n });\n\n if (lazy && canUseDom) {\n lazy = false;\n containerDomNode = document.createElement('div');\n document.body.appendChild(containerDomNode);\n render(React.createElement(ToastContainer, containerConfig), containerDomNode);\n }\n }\n\n return options.toastId;\n}\n\nvar toast = function toast(content, options) {\n return dispatchToast(content, mergeOptions(options, options && options.type || TYPE.DEFAULT));\n};\n/**\n * For each available type create a shortcut\n */\n\n\nvar _loop = function _loop(t) {\n if (TYPE[t] !== TYPE.DEFAULT) {\n toast[TYPE[t].toLowerCase()] = function (content, options) {\n return dispatchToast(content, mergeOptions(options, options && options.type || TYPE[t]));\n };\n }\n};\n\nfor (var t in TYPE) {\n _loop(t);\n}\n/**\n * Maybe I should remove warning in favor of warn, I don't know\n */\n\n\ntoast.warn = toast.warning;\n/**\n * Remove toast programmaticaly\n */\n\ntoast.dismiss = function (id) {\n if (id === void 0) {\n id = null;\n }\n\n return isAnyContainerMounted() && eventManager.emit(ACTION.CLEAR, id);\n};\n/**\n * return true if one container is displaying the toast\n */\n\n\ntoast.isActive = function (id) {\n var isToastActive = false;\n\n if (containers.size > 0) {\n containers.forEach(function (container) {\n if (container.isToastActive(id)) {\n isToastActive = true;\n }\n });\n }\n\n return isToastActive;\n};\n\ntoast.update = function (toastId, options) {\n if (options === void 0) {\n options = {};\n }\n\n // if you call toast and toast.update directly nothing will be displayed\n // this is why I defered the update\n setTimeout(function () {\n var toast = getToast(toastId, options);\n\n if (toast) {\n var oldOptions = toast.options,\n oldContent = toast.content;\n\n var nextOptions = _extends({}, oldOptions, {}, options, {\n toastId: options.toastId || toastId\n });\n\n if (!options.toastId || options.toastId === toastId) {\n nextOptions.updateId = generateToastId();\n } else {\n nextOptions.staleToastId = toastId;\n }\n\n var content = typeof nextOptions.render !== 'undefined' ? nextOptions.render : oldContent;\n delete nextOptions.render;\n dispatchToast(content, nextOptions);\n }\n }, 0);\n};\n/**\n * Used for controlled progress bar.\n */\n\n\ntoast.done = function (id) {\n toast.update(id, {\n progress: 1\n });\n};\n/**\n * Track changes. The callback get the number of toast displayed\n */\n\n\ntoast.onChange = function (callback) {\n if (typeof callback === 'function') {\n eventManager.on(ACTION.ON_CHANGE, callback);\n }\n};\n/**\n * Configure the ToastContainer when lazy mounted\n */\n\n\ntoast.configure = function (config) {\n lazy = true;\n containerConfig = config;\n};\n\ntoast.POSITION = POSITION;\ntoast.TYPE = TYPE;\n/**\n * Wait until the ToastContainer is mounted to dispatch the toast\n * and attach isActive method\n */\n\neventManager.on(ACTION.DID_MOUNT, function (containerInstance) {\n latestInstance = containerInstance.props.containerId || containerInstance;\n containers.set(latestInstance, containerInstance);\n queue.forEach(function (item) {\n eventManager.emit(item.action, item.content, item.options);\n });\n queue = [];\n}).on(ACTION.WILL_UNMOUNT, function (containerInstance) {\n if (containerInstance) containers.delete(containerInstance.props.containerId || containerInstance);else containers.clear();\n\n if (containers.size === 0) {\n eventManager.off(ACTION.SHOW).off(ACTION.CLEAR);\n }\n\n if (canUseDom && containerDomNode) {\n document.body.removeChild(containerDomNode);\n }\n});\n\nexport { Bounce, Flip, Slide, ToastContainer, POSITION as ToastPosition, TYPE as ToastType, Zoom, cssTransition, toast };\n","import React from 'react'\nimport { Modal, TextContainer, TextField, Button, Heading, Card, Badge } from \"@shopify/polaris\"\n\nclass ChangelogModal extends React.Component {\n\n render() {\n let {\n showChangelogModal,\n toggleChangelogModal,\n ...rest\n } = this.props;\n\n const SectionTitle = ({title, badge, status}) => {\n return (\n \n {title} \n {badge}\n
\n );\n }\n\n return (\n \n \n \n \n Find out about all new & upcoming updates to our app here.\n
\n \n
\n \n \n \n July 2021\n \n }>\n
\n You can now choose to show the Total Order Weight on your invoices.\n
\n Go to Design Invoice > Invoice Details > Tick/Untick ‘Total weight’ > Save\n
\n This will reflect on all the documents.\n
\n
\n \n \n
\n }>\n \n You can now choose to enable/disable the Product Item Name.\n
\n Go to Design Invoice > Product Details > Tick/Untick ‘Product item name’ and Save the Changes.\n
\n
\n \n \n
\n }>\n \n The app now allows you to edit the Store address in individual invoices.\n
\n If you’d like to change the store address for a particular invoice, go to the invoice > click on ‘Edit’ > Edit Supplier Address > Save > View Document.\n
\n
\n \n \n
\n }>\n \n Invoice Falcon now allows setting customer tags to whom the invoices should NOT get sent.\n
\n To use this setting, please go to Automatic Invoices > Advanced tab and enable the Automatic Invoices settings. Here, under Customer Tags, enter the tags that you do not want to send invoices to and Save. Make sure your customer tags are added to the customers in your Shopify store.\n
\n
\n \n \n
\n }>\n \n You can temporarily delete invoices created in the app that are not linked to a Shopify order.\n
\n Go to the Invoices tab > click on ‘Filter Invoices’ > click on ‘Not linked to Shopify order’ open the invoice you want to delete > click on More > Here, you can either delete the invoice permanently or delete it temporarily by clicking on ‘Delete’.\n
\n To restore this invoice, you can go to Invoice > click on ‘Filter Invoices’ > Trashed Invoices > And regenerate an invoice by clicking on the Document No.\n
\n
\n \n \n
\n }>\n \n Packing Slips now allow to enable/disable the Invoice Issue Date, Order Status, Bill To Address and Footer Message.\n
\n To make changes, go to Design Invoice > Scroll to the bottom and click on Packing Slip > Make required changes > Save\n
\n
\n \n \n
\n }>\n \n The csv files will now also pick the SKU and HS code for products and share the tax-break up in separate columns.\n
\n
\n \n \n
\n }>\n \n The SKU field is now highlighted on the invoices.\n
\n
\n \n \n
\n \n \n Feb 2021\n \n For Security reasons we have updated the code for Automatic Invoices (basic) and made it more secure.\n
\n Merchant's using basic code for Automatic Invoices need to update the code in their Shopify store to continue using this feature. Please follow the steps mentioned in basic section of Automatic Invoices and update the code accordingly in your Shopify store.\n
\n
\n If you do have any questions about these changes, please let us know at invoicefalcon.shopify@gmail.com.\n
\n \n \n \n }>\n \n Export to CSV is now live! To export your orders/invoices to CSV, please follow these steps -\n
\n
\n 1. Click on '+New Invoice from Shopify order' in the 'Invoices' page.\n
\n 2. Use the date & status filters provided at the top of the page to filter the orders, or individually select the orders in the list, that you want to export to CSV.\n
\n 3. Click 'Export to CSV'\n
\n 4. CSV will be sent to the 'From' address specified in the 'Email Settings' page in a few minutes.\n
\n
\n Please note that this feature is available only on Plus, Superhero & Ultimate plans.\n
\n
\n We're always looking for feedback! If you do have any about these changes, please let us know at invoicefalcon.shopify@gmail.com.\n
\n \n \n \n }>\n \n With Invoice Falcon v2.1, we've completely revamped our invoicing systems to support invoices for partial/fully refunded Shopify orders better.\n
\n
\n Starting today, your invoices will contain all items, even if they were removed from the order, and you'll now see a Refunds subtotal if the order has been adjusted such that you need to refund your customer. For items that are no longer in the order, you'll see a \"Refunded\" label next to them.\n
\n
\n We're always looking for feedback! If you do have any about these changes, please let us know.\n
\n \n \n \n \n );\n }\n}\n\nexport default ChangelogModal\n","import _objectSpread from \"@babel/runtime/helpers/esm/objectSpread2\";\nvar attributes = \"accept acceptCharset accessKey action allowFullScreen allowTransparency\\n alt async autoComplete autoFocus autoPlay capture cellPadding cellSpacing challenge\\n charSet checked classID className colSpan cols content contentEditable contextMenu\\n controls coords crossOrigin data dateTime default defer dir disabled download draggable\\n encType form formAction formEncType formMethod formNoValidate formTarget frameBorder\\n headers height hidden high href hrefLang htmlFor httpEquiv icon id inputMode integrity\\n is keyParams keyType kind label lang list loop low manifest marginHeight marginWidth max maxLength media\\n mediaGroup method min minLength multiple muted name noValidate nonce open\\n optimum pattern placeholder poster preload radioGroup readOnly rel required\\n reversed role rowSpan rows sandbox scope scoped scrolling seamless selected\\n shape size sizes span spellCheck src srcDoc srcLang srcSet start step style\\n summary tabIndex target title type useMap value width wmode wrap\";\nvar eventsName = \"onCopy onCut onPaste onCompositionEnd onCompositionStart onCompositionUpdate onKeyDown\\n onKeyPress onKeyUp onFocus onBlur onChange onInput onSubmit onClick onContextMenu onDoubleClick\\n onDrag onDragEnd onDragEnter onDragExit onDragLeave onDragOver onDragStart onDrop onMouseDown\\n onMouseEnter onMouseLeave onMouseMove onMouseOut onMouseOver onMouseUp onSelect onTouchCancel\\n onTouchEnd onTouchMove onTouchStart onScroll onWheel onAbort onCanPlay onCanPlayThrough\\n onDurationChange onEmptied onEncrypted onEnded onError onLoadedData onLoadedMetadata\\n onLoadStart onPause onPlay onPlaying onProgress onRateChange onSeeked onSeeking onStalled onSuspend onTimeUpdate onVolumeChange onWaiting onLoad onError\";\nvar propList = \"\".concat(attributes, \" \").concat(eventsName).split(/[\\s\\n]+/);\n\n/* eslint-enable max-len */\nvar ariaPrefix = 'aria-';\nvar dataPrefix = 'data-';\nfunction match(key, prefix) {\n return key.indexOf(prefix) === 0;\n}\n/**\n * Picker props from exist props with filter\n * @param props Passed props\n * @param ariaOnly boolean | { aria?: boolean; data?: boolean; attr?: boolean; } filter config\n */\nexport default function pickAttrs(props) {\n var ariaOnly = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;\n var mergedConfig;\n if (ariaOnly === false) {\n mergedConfig = {\n aria: true,\n data: true,\n attr: true\n };\n } else if (ariaOnly === true) {\n mergedConfig = {\n aria: true\n };\n } else {\n mergedConfig = _objectSpread({}, ariaOnly);\n }\n var attrs = {};\n Object.keys(props).forEach(function (key) {\n if (\n // Aria\n mergedConfig.aria && (key === 'role' || match(key, ariaPrefix)) ||\n // Data\n mergedConfig.data && match(key, dataPrefix) ||\n // Attr\n mergedConfig.attr && propList.includes(key)) {\n attrs[key] = props[key];\n }\n });\n return attrs;\n}","import { unit } from '@ant-design/cssinjs';\nimport { resetComponent } from '../../style';\nimport { genStyleHooks } from '../../theme/internal';\nconst genAlertTypeStyle = (bgColor, borderColor, iconColor, token, alertCls) => ({\n background: bgColor,\n border: `${unit(token.lineWidth)} ${token.lineType} ${borderColor}`,\n [`${alertCls}-icon`]: {\n color: iconColor\n }\n});\nexport const genBaseStyle = token => {\n const {\n componentCls,\n motionDurationSlow: duration,\n marginXS,\n marginSM,\n fontSize,\n fontSizeLG,\n lineHeight,\n borderRadiusLG: borderRadius,\n motionEaseInOutCirc,\n withDescriptionIconSize,\n colorText,\n colorTextHeading,\n withDescriptionPadding,\n defaultPadding\n } = token;\n return {\n [componentCls]: Object.assign(Object.assign({}, resetComponent(token)), {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n padding: defaultPadding,\n wordWrap: 'break-word',\n borderRadius,\n [`&${componentCls}-rtl`]: {\n direction: 'rtl'\n },\n [`${componentCls}-content`]: {\n flex: 1,\n minWidth: 0\n },\n [`${componentCls}-icon`]: {\n marginInlineEnd: marginXS,\n lineHeight: 0\n },\n [`&-description`]: {\n display: 'none',\n fontSize,\n lineHeight\n },\n '&-message': {\n color: colorTextHeading\n },\n [`&${componentCls}-motion-leave`]: {\n overflow: 'hidden',\n opacity: 1,\n transition: `max-height ${duration} ${motionEaseInOutCirc}, opacity ${duration} ${motionEaseInOutCirc},\n padding-top ${duration} ${motionEaseInOutCirc}, padding-bottom ${duration} ${motionEaseInOutCirc},\n margin-bottom ${duration} ${motionEaseInOutCirc}`\n },\n [`&${componentCls}-motion-leave-active`]: {\n maxHeight: 0,\n marginBottom: '0 !important',\n paddingTop: 0,\n paddingBottom: 0,\n opacity: 0\n }\n }),\n [`${componentCls}-with-description`]: {\n alignItems: 'flex-start',\n padding: withDescriptionPadding,\n [`${componentCls}-icon`]: {\n marginInlineEnd: marginSM,\n fontSize: withDescriptionIconSize,\n lineHeight: 0\n },\n [`${componentCls}-message`]: {\n display: 'block',\n marginBottom: marginXS,\n color: colorTextHeading,\n fontSize: fontSizeLG\n },\n [`${componentCls}-description`]: {\n display: 'block',\n color: colorText\n }\n },\n [`${componentCls}-banner`]: {\n marginBottom: 0,\n border: '0 !important',\n borderRadius: 0\n }\n };\n};\nexport const genTypeStyle = token => {\n const {\n componentCls,\n colorSuccess,\n colorSuccessBorder,\n colorSuccessBg,\n colorWarning,\n colorWarningBorder,\n colorWarningBg,\n colorError,\n colorErrorBorder,\n colorErrorBg,\n colorInfo,\n colorInfoBorder,\n colorInfoBg\n } = token;\n return {\n [componentCls]: {\n '&-success': genAlertTypeStyle(colorSuccessBg, colorSuccessBorder, colorSuccess, token, componentCls),\n '&-info': genAlertTypeStyle(colorInfoBg, colorInfoBorder, colorInfo, token, componentCls),\n '&-warning': genAlertTypeStyle(colorWarningBg, colorWarningBorder, colorWarning, token, componentCls),\n '&-error': Object.assign(Object.assign({}, genAlertTypeStyle(colorErrorBg, colorErrorBorder, colorError, token, componentCls)), {\n [`${componentCls}-description > pre`]: {\n margin: 0,\n padding: 0\n }\n })\n }\n };\n};\nexport const genActionStyle = token => {\n const {\n componentCls,\n iconCls,\n motionDurationMid,\n marginXS,\n fontSizeIcon,\n colorIcon,\n colorIconHover\n } = token;\n return {\n [componentCls]: {\n [`&-action`]: {\n marginInlineStart: marginXS\n },\n [`${componentCls}-close-icon`]: {\n marginInlineStart: marginXS,\n padding: 0,\n overflow: 'hidden',\n fontSize: fontSizeIcon,\n lineHeight: unit(fontSizeIcon),\n backgroundColor: 'transparent',\n border: 'none',\n outline: 'none',\n cursor: 'pointer',\n [`${iconCls}-close`]: {\n color: colorIcon,\n transition: `color ${motionDurationMid}`,\n '&:hover': {\n color: colorIconHover\n }\n }\n },\n '&-close-text': {\n color: colorIcon,\n transition: `color ${motionDurationMid}`,\n '&:hover': {\n color: colorIconHover\n }\n }\n }\n };\n};\nexport const prepareComponentToken = token => {\n const paddingHorizontal = 12; // Fixed value here.\n return {\n withDescriptionIconSize: token.fontSizeHeading3,\n defaultPadding: `${token.paddingContentVerticalSM}px ${paddingHorizontal}px`,\n withDescriptionPadding: `${token.paddingMD}px ${token.paddingContentHorizontalLG}px`\n };\n};\nexport default genStyleHooks('Alert', token => [genBaseStyle(token), genTypeStyle(token), genActionStyle(token)], prepareComponentToken);","\"use client\";\n\nvar __rest = this && this.__rest || function (s, e) {\n var t = {};\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];\n }\n return t;\n};\nimport * as React from 'react';\nimport CheckCircleFilled from \"@ant-design/icons/es/icons/CheckCircleFilled\";\nimport CloseCircleFilled from \"@ant-design/icons/es/icons/CloseCircleFilled\";\nimport CloseOutlined from \"@ant-design/icons/es/icons/CloseOutlined\";\nimport ExclamationCircleFilled from \"@ant-design/icons/es/icons/ExclamationCircleFilled\";\nimport InfoCircleFilled from \"@ant-design/icons/es/icons/InfoCircleFilled\";\nimport classNames from 'classnames';\nimport CSSMotion from 'rc-motion';\nimport pickAttrs from \"rc-util/es/pickAttrs\";\nimport { replaceElement } from '../_util/reactNode';\nimport { devUseWarning } from '../_util/warning';\nimport { ConfigContext } from '../config-provider';\nimport useStyle from './style';\nconst iconMapFilled = {\n success: CheckCircleFilled,\n info: InfoCircleFilled,\n error: CloseCircleFilled,\n warning: ExclamationCircleFilled\n};\nconst IconNode = props => {\n const {\n icon,\n prefixCls,\n type\n } = props;\n const iconType = iconMapFilled[type] || null;\n if (icon) {\n return replaceElement(icon, /*#__PURE__*/React.createElement(\"span\", {\n className: `${prefixCls}-icon`\n }, icon), () => ({\n className: classNames(`${prefixCls}-icon`, {\n [icon.props.className]: icon.props.className\n })\n }));\n }\n return /*#__PURE__*/React.createElement(iconType, {\n className: `${prefixCls}-icon`\n });\n};\nconst CloseIconNode = props => {\n const {\n isClosable,\n prefixCls,\n closeIcon,\n handleClose,\n ariaProps\n } = props;\n const mergedCloseIcon = closeIcon === true || closeIcon === undefined ? /*#__PURE__*/React.createElement(CloseOutlined, null) : closeIcon;\n return isClosable ? ( /*#__PURE__*/React.createElement(\"button\", Object.assign({\n type: \"button\",\n onClick: handleClose,\n className: `${prefixCls}-close-icon`,\n tabIndex: 0\n }, ariaProps), mergedCloseIcon)) : null;\n};\nconst Alert = props => {\n const {\n description,\n prefixCls: customizePrefixCls,\n message,\n banner,\n className,\n rootClassName,\n style,\n onMouseEnter,\n onMouseLeave,\n onClick,\n afterClose,\n showIcon,\n closable,\n closeText,\n closeIcon,\n action\n } = props,\n otherProps = __rest(props, [\"description\", \"prefixCls\", \"message\", \"banner\", \"className\", \"rootClassName\", \"style\", \"onMouseEnter\", \"onMouseLeave\", \"onClick\", \"afterClose\", \"showIcon\", \"closable\", \"closeText\", \"closeIcon\", \"action\"]);\n const [closed, setClosed] = React.useState(false);\n if (process.env.NODE_ENV !== 'production') {\n const warning = devUseWarning('Alert');\n warning.deprecated(!closeText, 'closeText', 'closable.closeIcon');\n }\n const ref = React.useRef(null);\n const {\n getPrefixCls,\n direction,\n alert\n } = React.useContext(ConfigContext);\n const prefixCls = getPrefixCls('alert', customizePrefixCls);\n const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);\n const handleClose = e => {\n var _a;\n setClosed(true);\n (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props, e);\n };\n const type = React.useMemo(() => {\n if (props.type !== undefined) {\n return props.type;\n }\n // banner mode defaults to 'warning'\n return banner ? 'warning' : 'info';\n }, [props.type, banner]);\n // closeable when closeText or closeIcon is assigned\n const isClosable = React.useMemo(() => {\n if (typeof closable === 'object' && closable.closeIcon) return true;\n if (closeText) {\n return true;\n }\n if (typeof closable === 'boolean') {\n return closable;\n }\n // should be true when closeIcon is 0 or ''\n if (closeIcon !== false && closeIcon !== null && closeIcon !== undefined) {\n return true;\n }\n return !!(alert === null || alert === void 0 ? void 0 : alert.closable);\n }, [closeText, closeIcon, closable, alert === null || alert === void 0 ? void 0 : alert.closable]);\n // banner mode defaults to Icon\n const isShowIcon = banner && showIcon === undefined ? true : showIcon;\n const alertCls = classNames(prefixCls, `${prefixCls}-${type}`, {\n [`${prefixCls}-with-description`]: !!description,\n [`${prefixCls}-no-icon`]: !isShowIcon,\n [`${prefixCls}-banner`]: !!banner,\n [`${prefixCls}-rtl`]: direction === 'rtl'\n }, alert === null || alert === void 0 ? void 0 : alert.className, className, rootClassName, cssVarCls, hashId);\n const restProps = pickAttrs(otherProps, {\n aria: true,\n data: true\n });\n const mergedCloseIcon = React.useMemo(() => {\n var _a, _b;\n if (typeof closable === 'object' && closable.closeIcon) {\n return closable.closeIcon;\n }\n if (closeText) {\n return closeText;\n }\n if (closeIcon !== undefined) {\n return closeIcon;\n }\n if (typeof (alert === null || alert === void 0 ? void 0 : alert.closable) === 'object' && ((_a = alert === null || alert === void 0 ? void 0 : alert.closable) === null || _a === void 0 ? void 0 : _a.closeIcon)) {\n return (_b = alert === null || alert === void 0 ? void 0 : alert.closable) === null || _b === void 0 ? void 0 : _b.closeIcon;\n }\n return alert === null || alert === void 0 ? void 0 : alert.closeIcon;\n }, [closeIcon, closable, closeText, alert === null || alert === void 0 ? void 0 : alert.closeIcon]);\n const mergeAriaProps = React.useMemo(() => {\n const merged = closable !== null && closable !== void 0 ? closable : alert === null || alert === void 0 ? void 0 : alert.closable;\n if (typeof merged === 'object') {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n closeIcon: _\n } = merged,\n ariaProps = __rest(merged, [\"closeIcon\"]);\n return ariaProps;\n }\n return {};\n }, [closable, alert === null || alert === void 0 ? void 0 : alert.closable]);\n return wrapCSSVar( /*#__PURE__*/React.createElement(CSSMotion, {\n visible: !closed,\n motionName: `${prefixCls}-motion`,\n motionAppear: false,\n motionEnter: false,\n onLeaveStart: node => ({\n maxHeight: node.offsetHeight\n }),\n onLeaveEnd: afterClose\n }, _ref => {\n let {\n className: motionClassName,\n style: motionStyle\n } = _ref;\n return /*#__PURE__*/React.createElement(\"div\", Object.assign({\n ref: ref,\n \"data-show\": !closed,\n className: classNames(alertCls, motionClassName),\n style: Object.assign(Object.assign(Object.assign({}, alert === null || alert === void 0 ? void 0 : alert.style), style), motionStyle),\n onMouseEnter: onMouseEnter,\n onMouseLeave: onMouseLeave,\n onClick: onClick,\n role: \"alert\"\n }, restProps), isShowIcon ? ( /*#__PURE__*/React.createElement(IconNode, {\n description: description,\n icon: props.icon,\n prefixCls: prefixCls,\n type: type\n })) : null, /*#__PURE__*/React.createElement(\"div\", {\n className: `${prefixCls}-content`\n }, message ? /*#__PURE__*/React.createElement(\"div\", {\n className: `${prefixCls}-message`\n }, message) : null, description ? /*#__PURE__*/React.createElement(\"div\", {\n className: `${prefixCls}-description`\n }, description) : null), action ? /*#__PURE__*/React.createElement(\"div\", {\n className: `${prefixCls}-action`\n }, action) : null, /*#__PURE__*/React.createElement(CloseIconNode, {\n isClosable: isClosable,\n prefixCls: prefixCls,\n closeIcon: mergedCloseIcon,\n handleClose: handleClose,\n ariaProps: mergeAriaProps\n }));\n }));\n};\nif (process.env.NODE_ENV !== 'production') {\n Alert.displayName = 'Alert';\n}\nexport default Alert;","\"use client\";\n\nimport _classCallCheck from \"@babel/runtime/helpers/esm/classCallCheck\";\nimport _createClass from \"@babel/runtime/helpers/esm/createClass\";\nimport _callSuper from \"@babel/runtime/helpers/esm/callSuper\";\nimport _inherits from \"@babel/runtime/helpers/esm/inherits\";\nimport * as React from 'react';\nimport Alert from './Alert';\nlet ErrorBoundary = /*#__PURE__*/function (_React$Component) {\n _inherits(ErrorBoundary, _React$Component);\n function ErrorBoundary() {\n var _this;\n _classCallCheck(this, ErrorBoundary);\n _this = _callSuper(this, ErrorBoundary, arguments);\n _this.state = {\n error: undefined,\n info: {\n componentStack: ''\n }\n };\n return _this;\n }\n _createClass(ErrorBoundary, [{\n key: \"componentDidCatch\",\n value: function componentDidCatch(error, info) {\n this.setState({\n error,\n info\n });\n }\n }, {\n key: \"render\",\n value: function render() {\n const {\n message,\n description,\n children\n } = this.props;\n const {\n error,\n info\n } = this.state;\n const componentStack = info && info.componentStack ? info.componentStack : null;\n const errorMessage = typeof message === 'undefined' ? (error || '').toString() : message;\n const errorDescription = typeof description === 'undefined' ? componentStack : description;\n if (error) {\n return /*#__PURE__*/React.createElement(Alert, {\n type: \"error\",\n message: errorMessage,\n description: /*#__PURE__*/React.createElement(\"pre\", {\n style: {\n fontSize: '0.9em',\n overflowX: 'auto'\n }\n }, errorDescription)\n });\n }\n return children;\n }\n }]);\n return ErrorBoundary;\n}(React.Component);\nexport default ErrorBoundary;","\"use client\";\n\nimport InternalAlert from './Alert';\nimport ErrorBoundary from './ErrorBoundary';\nconst Alert = InternalAlert;\nAlert.ErrorBoundary = ErrorBoundary;\nexport default Alert;","import React, { useEffect, useState } from 'react'\nimport { http } from '../utils/api'\nimport { Alert } from 'antd'\n\nconst UsageBanner = () => {\n const [usage, setUsage] = useState({\n monthlyOrderCount: 0,\n resetDate: null,\n heroPlan: false,\n })\n\n const [loading, setLoading] = useState(false)\n\n const fetchUsage = async () => {\n try {\n setLoading(true)\n const { data } = await http.get('/api/shop/usage.json')\n setUsage(data)\n } catch (error) {\n console.log(error)\n } finally {\n setLoading(false)\n }\n }\n\n useEffect(async () => {\n await fetchUsage()\n }, [])\n\n const message = (\n <>\n {usage.monthlyOrderCount > 50 ? (\n <>\n You have used all 50 invoices. A usage fee has been charged to your account, but now you can send invoices for unlimited orders for the rest of this billing cycle.
\n