) nor does it use the innerRef prop.\\n\\n' + 'See https://goo.gl/LrBNgw for more info.';\n/**\n * Raise an error if \"children\" is not a DOM Element and there is no ref provided to Waypoint\n *\n * @param {?React.element} children\n * @param {?HTMLElement} ref\n * @return {undefined}\n */\n\nfunction ensureRefIsProvidedByChild(children, ref) {\n if (children && !isDOMElement(children) && !ref) {\n throw new Error(errorMessage);\n }\n}\n/**\n * @param {object} bounds An object with bounds data for the waypoint and\n * scrollable parent\n * @return {string} The current position of the waypoint in relation to the\n * visible portion of the scrollable parent. One of the constants `ABOVE`,\n * `BELOW`, `INSIDE` or `INVISIBLE`.\n */\n\n\nfunction getCurrentPosition(bounds) {\n if (bounds.viewportBottom - bounds.viewportTop === 0) {\n return INVISIBLE;\n } // top is within the viewport\n\n\n if (bounds.viewportTop <= bounds.waypointTop && bounds.waypointTop <= bounds.viewportBottom) {\n return INSIDE;\n } // bottom is within the viewport\n\n\n if (bounds.viewportTop <= bounds.waypointBottom && bounds.waypointBottom <= bounds.viewportBottom) {\n return INSIDE;\n } // top is above the viewport and bottom is below the viewport\n\n\n if (bounds.waypointTop <= bounds.viewportTop && bounds.viewportBottom <= bounds.waypointBottom) {\n return INSIDE;\n }\n\n if (bounds.viewportBottom < bounds.waypointTop) {\n return BELOW;\n }\n\n if (bounds.waypointTop < bounds.viewportTop) {\n return ABOVE;\n }\n\n return INVISIBLE;\n}\n\nvar timeout;\nvar timeoutQueue = [];\n\nfunction onNextTick(cb) {\n timeoutQueue.push(cb);\n\n if (!timeout) {\n timeout = setTimeout(function () {\n timeout = null; // Drain the timeoutQueue\n\n var item; // eslint-disable-next-line no-cond-assign\n\n while (item = timeoutQueue.shift()) {\n item();\n }\n }, 0);\n }\n\n var isSubscribed = true;\n return function unsubscribe() {\n if (!isSubscribed) {\n return;\n }\n\n isSubscribed = false;\n var index = timeoutQueue.indexOf(cb);\n\n if (index === -1) {\n return;\n }\n\n timeoutQueue.splice(index, 1);\n\n if (!timeoutQueue.length && timeout) {\n clearTimeout(timeout);\n timeout = null;\n }\n };\n}\n\nfunction resolveScrollableAncestorProp(scrollableAncestor) {\n // When Waypoint is rendered on the server, `window` is not available.\n // To make Waypoint easier to work with, we allow this to be specified in\n // string form and safely convert to `window` here.\n if (scrollableAncestor === 'window') {\n return global.window;\n }\n\n return scrollableAncestor;\n}\n\nvar hasWindow = typeof window !== 'undefined';\nvar defaultProps = {\n debug: false,\n scrollableAncestor: undefined,\n children: undefined,\n topOffset: '0px',\n bottomOffset: '0px',\n horizontal: false,\n onEnter: function onEnter() {},\n onLeave: function onLeave() {},\n onPositionChange: function onPositionChange() {},\n fireOnRapidScroll: true\n}; // Calls a function when you scroll to the element.\n\nvar Waypoint = /*#__PURE__*/function (_React$PureComponent) {\n _inheritsLoose(Waypoint, _React$PureComponent);\n\n function Waypoint(props) {\n var _this;\n\n _this = _React$PureComponent.call(this, props) || this;\n\n _this.refElement = function (e) {\n _this._ref = e;\n };\n\n return _this;\n }\n\n var _proto = Waypoint.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n var _this2 = this;\n\n if (!hasWindow) {\n return;\n } // this._ref may occasionally not be set at this time. To help ensure that\n // this works smoothly and to avoid layout thrashing, we want to delay the\n // initial execution until the next tick.\n\n\n this.cancelOnNextTick = onNextTick(function () {\n _this2.cancelOnNextTick = null;\n var _this2$props = _this2.props,\n children = _this2$props.children,\n debug = _this2$props.debug; // Berofe doing anything, we want to check that this._ref is avaliable in Waypoint\n\n ensureRefIsProvidedByChild(children, _this2._ref);\n _this2._handleScroll = _this2._handleScroll.bind(_this2);\n _this2.scrollableAncestor = _this2._findScrollableAncestor();\n\n if (process.env.NODE_ENV !== 'production' && debug) {\n debugLog('scrollableAncestor', _this2.scrollableAncestor);\n }\n\n _this2.scrollEventListenerUnsubscribe = addEventListener(_this2.scrollableAncestor, 'scroll', _this2._handleScroll, {\n passive: true\n });\n _this2.resizeEventListenerUnsubscribe = addEventListener(window, 'resize', _this2._handleScroll, {\n passive: true\n });\n\n _this2._handleScroll(null);\n });\n };\n\n _proto.componentDidUpdate = function componentDidUpdate() {\n var _this3 = this;\n\n if (!hasWindow) {\n return;\n }\n\n if (!this.scrollableAncestor) {\n // The Waypoint has not yet initialized.\n return;\n } // The element may have moved, so we need to recompute its position on the\n // page. This happens via handleScroll in a way that forces layout to be\n // computed.\n //\n // We want this to be deferred to avoid forcing layout during render, which\n // causes layout thrashing. And, if we already have this work enqueued, we\n // can just wait for that to happen instead of enqueueing again.\n\n\n if (this.cancelOnNextTick) {\n return;\n }\n\n this.cancelOnNextTick = onNextTick(function () {\n _this3.cancelOnNextTick = null;\n\n _this3._handleScroll(null);\n });\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n if (!hasWindow) {\n return;\n }\n\n if (this.scrollEventListenerUnsubscribe) {\n this.scrollEventListenerUnsubscribe();\n }\n\n if (this.resizeEventListenerUnsubscribe) {\n this.resizeEventListenerUnsubscribe();\n }\n\n if (this.cancelOnNextTick) {\n this.cancelOnNextTick();\n }\n }\n /**\n * Traverses up the DOM to find an ancestor container which has an overflow\n * style that allows for scrolling.\n *\n * @return {Object} the closest ancestor element with an overflow style that\n * allows for scrolling. If none is found, the `window` object is returned\n * as a fallback.\n */\n ;\n\n _proto._findScrollableAncestor = function _findScrollableAncestor() {\n var _this$props = this.props,\n horizontal = _this$props.horizontal,\n scrollableAncestor = _this$props.scrollableAncestor;\n\n if (scrollableAncestor) {\n return resolveScrollableAncestorProp(scrollableAncestor);\n }\n\n var node = this._ref;\n\n while (node.parentNode) {\n node = node.parentNode;\n\n if (node === document.body) {\n // We've reached all the way to the root node.\n return window;\n }\n\n var style = window.getComputedStyle(node);\n var overflowDirec = horizontal ? style.getPropertyValue('overflow-x') : style.getPropertyValue('overflow-y');\n var overflow = overflowDirec || style.getPropertyValue('overflow');\n\n if (overflow === 'auto' || overflow === 'scroll' || overflow === 'overlay') {\n return node;\n }\n } // A scrollable ancestor element was not found, which means that we need to\n // do stuff on window.\n\n\n return window;\n }\n /**\n * @param {Object} event the native scroll event coming from the scrollable\n * ancestor, or resize event coming from the window. Will be undefined if\n * called by a React lifecyle method\n */\n ;\n\n _proto._handleScroll = function _handleScroll(event) {\n if (!this._ref) {\n // There's a chance we end up here after the component has been unmounted.\n return;\n }\n\n var bounds = this._getBounds();\n\n var currentPosition = getCurrentPosition(bounds);\n var previousPosition = this._previousPosition;\n var _this$props2 = this.props,\n debug = _this$props2.debug,\n onPositionChange = _this$props2.onPositionChange,\n onEnter = _this$props2.onEnter,\n onLeave = _this$props2.onLeave,\n fireOnRapidScroll = _this$props2.fireOnRapidScroll;\n\n if (process.env.NODE_ENV !== 'production' && debug) {\n debugLog('currentPosition', currentPosition);\n debugLog('previousPosition', previousPosition);\n } // Save previous position as early as possible to prevent cycles\n\n\n this._previousPosition = currentPosition;\n\n if (previousPosition === currentPosition) {\n // No change since last trigger\n return;\n }\n\n var callbackArg = {\n currentPosition: currentPosition,\n previousPosition: previousPosition,\n event: event,\n waypointTop: bounds.waypointTop,\n waypointBottom: bounds.waypointBottom,\n viewportTop: bounds.viewportTop,\n viewportBottom: bounds.viewportBottom\n };\n onPositionChange.call(this, callbackArg);\n\n if (currentPosition === INSIDE) {\n onEnter.call(this, callbackArg);\n } else if (previousPosition === INSIDE) {\n onLeave.call(this, callbackArg);\n }\n\n var isRapidScrollDown = previousPosition === BELOW && currentPosition === ABOVE;\n var isRapidScrollUp = previousPosition === ABOVE && currentPosition === BELOW;\n\n if (fireOnRapidScroll && (isRapidScrollDown || isRapidScrollUp)) {\n // If the scroll event isn't fired often enough to occur while the\n // waypoint was visible, we trigger both callbacks anyway.\n onEnter.call(this, {\n currentPosition: INSIDE,\n previousPosition: previousPosition,\n event: event,\n waypointTop: bounds.waypointTop,\n waypointBottom: bounds.waypointBottom,\n viewportTop: bounds.viewportTop,\n viewportBottom: bounds.viewportBottom\n });\n onLeave.call(this, {\n currentPosition: currentPosition,\n previousPosition: INSIDE,\n event: event,\n waypointTop: bounds.waypointTop,\n waypointBottom: bounds.waypointBottom,\n viewportTop: bounds.viewportTop,\n viewportBottom: bounds.viewportBottom\n });\n }\n };\n\n _proto._getBounds = function _getBounds() {\n var _this$props3 = this.props,\n horizontal = _this$props3.horizontal,\n debug = _this$props3.debug;\n\n var _this$_ref$getBoundin = this._ref.getBoundingClientRect(),\n left = _this$_ref$getBoundin.left,\n top = _this$_ref$getBoundin.top,\n right = _this$_ref$getBoundin.right,\n bottom = _this$_ref$getBoundin.bottom;\n\n var waypointTop = horizontal ? left : top;\n var waypointBottom = horizontal ? right : bottom;\n var contextHeight;\n var contextScrollTop;\n\n if (this.scrollableAncestor === window) {\n contextHeight = horizontal ? window.innerWidth : window.innerHeight;\n contextScrollTop = 0;\n } else {\n contextHeight = horizontal ? this.scrollableAncestor.offsetWidth : this.scrollableAncestor.offsetHeight;\n contextScrollTop = horizontal ? this.scrollableAncestor.getBoundingClientRect().left : this.scrollableAncestor.getBoundingClientRect().top;\n }\n\n if (process.env.NODE_ENV !== 'production' && debug) {\n debugLog('waypoint top', waypointTop);\n debugLog('waypoint bottom', waypointBottom);\n debugLog('scrollableAncestor height', contextHeight);\n debugLog('scrollableAncestor scrollTop', contextScrollTop);\n }\n\n var _this$props4 = this.props,\n bottomOffset = _this$props4.bottomOffset,\n topOffset = _this$props4.topOffset;\n var topOffsetPx = computeOffsetPixels(topOffset, contextHeight);\n var bottomOffsetPx = computeOffsetPixels(bottomOffset, contextHeight);\n var contextBottom = contextScrollTop + contextHeight;\n return {\n waypointTop: waypointTop,\n waypointBottom: waypointBottom,\n viewportTop: contextScrollTop + topOffsetPx,\n viewportBottom: contextBottom - bottomOffsetPx\n };\n }\n /**\n * @return {Object}\n */\n ;\n\n _proto.render = function render() {\n var _this4 = this;\n\n var children = this.props.children;\n\n if (!children) {\n // We need an element that we can locate in the DOM to determine where it is\n // rendered relative to the top of its context.\n return /*#__PURE__*/React.createElement(\"span\", {\n ref: this.refElement,\n style: {\n fontSize: 0\n }\n });\n }\n\n if (isDOMElement(children) || isForwardRef(children)) {\n var ref = function ref(node) {\n _this4.refElement(node);\n\n if (children.ref) {\n if (typeof children.ref === 'function') {\n children.ref(node);\n } else {\n children.ref.current = node;\n }\n }\n };\n\n return /*#__PURE__*/React.cloneElement(children, {\n ref: ref\n });\n }\n\n return /*#__PURE__*/React.cloneElement(children, {\n innerRef: this.refElement\n });\n };\n\n return Waypoint;\n}(React.PureComponent);\n\nif (process.env.NODE_ENV !== 'production') {}\n\nWaypoint.above = ABOVE;\nWaypoint.below = BELOW;\nWaypoint.inside = INSIDE;\nWaypoint.invisible = INVISIBLE;\nWaypoint.defaultProps = defaultProps;\nWaypoint.displayName = 'Waypoint';\nexport { Waypoint };","/**\n * @license React\n * react-is.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';\n\nvar b = Symbol.for(\"react.element\"),\n c = Symbol.for(\"react.portal\"),\n d = Symbol.for(\"react.fragment\"),\n e = Symbol.for(\"react.strict_mode\"),\n f = Symbol.for(\"react.profiler\"),\n g = Symbol.for(\"react.provider\"),\n h = Symbol.for(\"react.context\"),\n k = Symbol.for(\"react.server_context\"),\n l = Symbol.for(\"react.forward_ref\"),\n m = Symbol.for(\"react.suspense\"),\n n = Symbol.for(\"react.suspense_list\"),\n p = Symbol.for(\"react.memo\"),\n q = Symbol.for(\"react.lazy\"),\n t = Symbol.for(\"react.offscreen\"),\n u;\nu = Symbol.for(\"react.module.reference\");\n\nfunction v(a) {\n if (\"object\" === typeof a && null !== a) {\n var r = a.$$typeof;\n\n switch (r) {\n case b:\n switch (a = a.type, a) {\n case d:\n case f:\n case e:\n case m:\n case n:\n return a;\n\n default:\n switch (a = a && a.$$typeof, a) {\n case k:\n case h:\n case l:\n case q:\n case p:\n case g:\n return a;\n\n default:\n return r;\n }\n\n }\n\n case c:\n return r;\n }\n }\n}\n\nexports.ContextConsumer = h;\nexports.ContextProvider = g;\nexports.Element = b;\nexports.ForwardRef = l;\nexports.Fragment = d;\nexports.Lazy = q;\nexports.Memo = p;\nexports.Portal = c;\nexports.Profiler = f;\nexports.StrictMode = e;\nexports.Suspense = m;\nexports.SuspenseList = n;\n\nexports.isAsyncMode = function () {\n return !1;\n};\n\nexports.isConcurrentMode = function () {\n return !1;\n};\n\nexports.isContextConsumer = function (a) {\n return v(a) === h;\n};\n\nexports.isContextProvider = function (a) {\n return v(a) === g;\n};\n\nexports.isElement = function (a) {\n return \"object\" === typeof a && null !== a && a.$$typeof === b;\n};\n\nexports.isForwardRef = function (a) {\n return v(a) === l;\n};\n\nexports.isFragment = function (a) {\n return v(a) === d;\n};\n\nexports.isLazy = function (a) {\n return v(a) === q;\n};\n\nexports.isMemo = function (a) {\n return v(a) === p;\n};\n\nexports.isPortal = function (a) {\n return v(a) === c;\n};\n\nexports.isProfiler = function (a) {\n return v(a) === f;\n};\n\nexports.isStrictMode = function (a) {\n return v(a) === e;\n};\n\nexports.isSuspense = function (a) {\n return v(a) === m;\n};\n\nexports.isSuspenseList = function (a) {\n return v(a) === n;\n};\n\nexports.isValidElementType = function (a) {\n return \"string\" === typeof a || \"function\" === typeof a || a === d || a === f || a === e || a === m || a === n || a === t || \"object\" === typeof a && null !== a && (a.$$typeof === q || a.$$typeof === p || a.$$typeof === g || a.$$typeof === h || a.$$typeof === l || a.$$typeof === u || void 0 !== a.getModuleId) ? !0 : !1;\n};\n\nexports.typeOf = v;","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n module.exports = require('./cjs/react-is.production.min.js');\n} else {\n module.exports = require('./cjs/react-is.development.js');\n}","var characterMap = {\n \"À\": \"A\",\n \"Á\": \"A\",\n \"Â\": \"A\",\n \"Ã\": \"A\",\n \"Ä\": \"A\",\n \"Å\": \"A\",\n \"Ấ\": \"A\",\n \"Ắ\": \"A\",\n \"Ẳ\": \"A\",\n \"Ẵ\": \"A\",\n \"Ặ\": \"A\",\n \"Æ\": \"AE\",\n \"Ầ\": \"A\",\n \"Ằ\": \"A\",\n \"Ȃ\": \"A\",\n \"Ç\": \"C\",\n \"Ḉ\": \"C\",\n \"È\": \"E\",\n \"É\": \"E\",\n \"Ê\": \"E\",\n \"Ë\": \"E\",\n \"Ế\": \"E\",\n \"Ḗ\": \"E\",\n \"Ề\": \"E\",\n \"Ḕ\": \"E\",\n \"Ḝ\": \"E\",\n \"Ȇ\": \"E\",\n \"Ì\": \"I\",\n \"Í\": \"I\",\n \"Î\": \"I\",\n \"Ï\": \"I\",\n \"Ḯ\": \"I\",\n \"Ȋ\": \"I\",\n \"Ð\": \"D\",\n \"Ñ\": \"N\",\n \"Ò\": \"O\",\n \"Ó\": \"O\",\n \"Ô\": \"O\",\n \"Õ\": \"O\",\n \"Ö\": \"O\",\n \"Ø\": \"O\",\n \"Ố\": \"O\",\n \"Ṍ\": \"O\",\n \"Ṓ\": \"O\",\n \"Ȏ\": \"O\",\n \"Ù\": \"U\",\n \"Ú\": \"U\",\n \"Û\": \"U\",\n \"Ü\": \"U\",\n \"Ý\": \"Y\",\n \"à\": \"a\",\n \"á\": \"a\",\n \"â\": \"a\",\n \"ã\": \"a\",\n \"ä\": \"a\",\n \"å\": \"a\",\n \"ấ\": \"a\",\n \"ắ\": \"a\",\n \"ẳ\": \"a\",\n \"ẵ\": \"a\",\n \"ặ\": \"a\",\n \"æ\": \"ae\",\n \"ầ\": \"a\",\n \"ằ\": \"a\",\n \"ȃ\": \"a\",\n \"ç\": \"c\",\n \"ḉ\": \"c\",\n \"è\": \"e\",\n \"é\": \"e\",\n \"ê\": \"e\",\n \"ë\": \"e\",\n \"ế\": \"e\",\n \"ḗ\": \"e\",\n \"ề\": \"e\",\n \"ḕ\": \"e\",\n \"ḝ\": \"e\",\n \"ȇ\": \"e\",\n \"ì\": \"i\",\n \"í\": \"i\",\n \"î\": \"i\",\n \"ï\": \"i\",\n \"ḯ\": \"i\",\n \"ȋ\": \"i\",\n \"ð\": \"d\",\n \"ñ\": \"n\",\n \"ò\": \"o\",\n \"ó\": \"o\",\n \"ô\": \"o\",\n \"õ\": \"o\",\n \"ö\": \"o\",\n \"ø\": \"o\",\n \"ố\": \"o\",\n \"ṍ\": \"o\",\n \"ṓ\": \"o\",\n \"ȏ\": \"o\",\n \"ù\": \"u\",\n \"ú\": \"u\",\n \"û\": \"u\",\n \"ü\": \"u\",\n \"ý\": \"y\",\n \"ÿ\": \"y\",\n \"Ā\": \"A\",\n \"ā\": \"a\",\n \"Ă\": \"A\",\n \"ă\": \"a\",\n \"Ą\": \"A\",\n \"ą\": \"a\",\n \"Ć\": \"C\",\n \"ć\": \"c\",\n \"Ĉ\": \"C\",\n \"ĉ\": \"c\",\n \"Ċ\": \"C\",\n \"ċ\": \"c\",\n \"Č\": \"C\",\n \"č\": \"c\",\n \"C̆\": \"C\",\n \"c̆\": \"c\",\n \"Ď\": \"D\",\n \"ď\": \"d\",\n \"Đ\": \"D\",\n \"đ\": \"d\",\n \"Ē\": \"E\",\n \"ē\": \"e\",\n \"Ĕ\": \"E\",\n \"ĕ\": \"e\",\n \"Ė\": \"E\",\n \"ė\": \"e\",\n \"Ę\": \"E\",\n \"ę\": \"e\",\n \"Ě\": \"E\",\n \"ě\": \"e\",\n \"Ĝ\": \"G\",\n \"Ǵ\": \"G\",\n \"ĝ\": \"g\",\n \"ǵ\": \"g\",\n \"Ğ\": \"G\",\n \"ğ\": \"g\",\n \"Ġ\": \"G\",\n \"ġ\": \"g\",\n \"Ģ\": \"G\",\n \"ģ\": \"g\",\n \"Ĥ\": \"H\",\n \"ĥ\": \"h\",\n \"Ħ\": \"H\",\n \"ħ\": \"h\",\n \"Ḫ\": \"H\",\n \"ḫ\": \"h\",\n \"Ĩ\": \"I\",\n \"ĩ\": \"i\",\n \"Ī\": \"I\",\n \"ī\": \"i\",\n \"Ĭ\": \"I\",\n \"ĭ\": \"i\",\n \"Į\": \"I\",\n \"į\": \"i\",\n \"İ\": \"I\",\n \"ı\": \"i\",\n \"IJ\": \"IJ\",\n \"ij\": \"ij\",\n \"Ĵ\": \"J\",\n \"ĵ\": \"j\",\n \"Ķ\": \"K\",\n \"ķ\": \"k\",\n \"Ḱ\": \"K\",\n \"ḱ\": \"k\",\n \"K̆\": \"K\",\n \"k̆\": \"k\",\n \"Ĺ\": \"L\",\n \"ĺ\": \"l\",\n \"Ļ\": \"L\",\n \"ļ\": \"l\",\n \"Ľ\": \"L\",\n \"ľ\": \"l\",\n \"Ŀ\": \"L\",\n \"ŀ\": \"l\",\n \"Ł\": \"l\",\n \"ł\": \"l\",\n \"Ḿ\": \"M\",\n \"ḿ\": \"m\",\n \"M̆\": \"M\",\n \"m̆\": \"m\",\n \"Ń\": \"N\",\n \"ń\": \"n\",\n \"Ņ\": \"N\",\n \"ņ\": \"n\",\n \"Ň\": \"N\",\n \"ň\": \"n\",\n \"ʼn\": \"n\",\n \"N̆\": \"N\",\n \"n̆\": \"n\",\n \"Ō\": \"O\",\n \"ō\": \"o\",\n \"Ŏ\": \"O\",\n \"ŏ\": \"o\",\n \"Ő\": \"O\",\n \"ő\": \"o\",\n \"Œ\": \"OE\",\n \"œ\": \"oe\",\n \"P̆\": \"P\",\n \"p̆\": \"p\",\n \"Ŕ\": \"R\",\n \"ŕ\": \"r\",\n \"Ŗ\": \"R\",\n \"ŗ\": \"r\",\n \"Ř\": \"R\",\n \"ř\": \"r\",\n \"R̆\": \"R\",\n \"r̆\": \"r\",\n \"Ȓ\": \"R\",\n \"ȓ\": \"r\",\n \"Ś\": \"S\",\n \"ś\": \"s\",\n \"Ŝ\": \"S\",\n \"ŝ\": \"s\",\n \"Ş\": \"S\",\n \"Ș\": \"S\",\n \"ș\": \"s\",\n \"ş\": \"s\",\n \"Š\": \"S\",\n \"š\": \"s\",\n \"Ţ\": \"T\",\n \"ţ\": \"t\",\n \"ț\": \"t\",\n \"Ț\": \"T\",\n \"Ť\": \"T\",\n \"ť\": \"t\",\n \"Ŧ\": \"T\",\n \"ŧ\": \"t\",\n \"T̆\": \"T\",\n \"t̆\": \"t\",\n \"Ũ\": \"U\",\n \"ũ\": \"u\",\n \"Ū\": \"U\",\n \"ū\": \"u\",\n \"Ŭ\": \"U\",\n \"ŭ\": \"u\",\n \"Ů\": \"U\",\n \"ů\": \"u\",\n \"Ű\": \"U\",\n \"ű\": \"u\",\n \"Ų\": \"U\",\n \"ų\": \"u\",\n \"Ȗ\": \"U\",\n \"ȗ\": \"u\",\n \"V̆\": \"V\",\n \"v̆\": \"v\",\n \"Ŵ\": \"W\",\n \"ŵ\": \"w\",\n \"Ẃ\": \"W\",\n \"ẃ\": \"w\",\n \"X̆\": \"X\",\n \"x̆\": \"x\",\n \"Ŷ\": \"Y\",\n \"ŷ\": \"y\",\n \"Ÿ\": \"Y\",\n \"Y̆\": \"Y\",\n \"y̆\": \"y\",\n \"Ź\": \"Z\",\n \"ź\": \"z\",\n \"Ż\": \"Z\",\n \"ż\": \"z\",\n \"Ž\": \"Z\",\n \"ž\": \"z\",\n \"ſ\": \"s\",\n \"ƒ\": \"f\",\n \"Ơ\": \"O\",\n \"ơ\": \"o\",\n \"Ư\": \"U\",\n \"ư\": \"u\",\n \"Ǎ\": \"A\",\n \"ǎ\": \"a\",\n \"Ǐ\": \"I\",\n \"ǐ\": \"i\",\n \"Ǒ\": \"O\",\n \"ǒ\": \"o\",\n \"Ǔ\": \"U\",\n \"ǔ\": \"u\",\n \"Ǖ\": \"U\",\n \"ǖ\": \"u\",\n \"Ǘ\": \"U\",\n \"ǘ\": \"u\",\n \"Ǚ\": \"U\",\n \"ǚ\": \"u\",\n \"Ǜ\": \"U\",\n \"ǜ\": \"u\",\n \"Ứ\": \"U\",\n \"ứ\": \"u\",\n \"Ṹ\": \"U\",\n \"ṹ\": \"u\",\n \"Ǻ\": \"A\",\n \"ǻ\": \"a\",\n \"Ǽ\": \"AE\",\n \"ǽ\": \"ae\",\n \"Ǿ\": \"O\",\n \"ǿ\": \"o\",\n \"Þ\": \"TH\",\n \"þ\": \"th\",\n \"Ṕ\": \"P\",\n \"ṕ\": \"p\",\n \"Ṥ\": \"S\",\n \"ṥ\": \"s\",\n \"X́\": \"X\",\n \"x́\": \"x\",\n \"Ѓ\": \"Г\",\n \"ѓ\": \"г\",\n \"Ќ\": \"К\",\n \"ќ\": \"к\",\n \"A̋\": \"A\",\n \"a̋\": \"a\",\n \"E̋\": \"E\",\n \"e̋\": \"e\",\n \"I̋\": \"I\",\n \"i̋\": \"i\",\n \"Ǹ\": \"N\",\n \"ǹ\": \"n\",\n \"Ồ\": \"O\",\n \"ồ\": \"o\",\n \"Ṑ\": \"O\",\n \"ṑ\": \"o\",\n \"Ừ\": \"U\",\n \"ừ\": \"u\",\n \"Ẁ\": \"W\",\n \"ẁ\": \"w\",\n \"Ỳ\": \"Y\",\n \"ỳ\": \"y\",\n \"Ȁ\": \"A\",\n \"ȁ\": \"a\",\n \"Ȅ\": \"E\",\n \"ȅ\": \"e\",\n \"Ȉ\": \"I\",\n \"ȉ\": \"i\",\n \"Ȍ\": \"O\",\n \"ȍ\": \"o\",\n \"Ȑ\": \"R\",\n \"ȑ\": \"r\",\n \"Ȕ\": \"U\",\n \"ȕ\": \"u\",\n \"B̌\": \"B\",\n \"b̌\": \"b\",\n \"Č̣\": \"C\",\n \"č̣\": \"c\",\n \"Ê̌\": \"E\",\n \"ê̌\": \"e\",\n \"F̌\": \"F\",\n \"f̌\": \"f\",\n \"Ǧ\": \"G\",\n \"ǧ\": \"g\",\n \"Ȟ\": \"H\",\n \"ȟ\": \"h\",\n \"J̌\": \"J\",\n \"ǰ\": \"j\",\n \"Ǩ\": \"K\",\n \"ǩ\": \"k\",\n \"M̌\": \"M\",\n \"m̌\": \"m\",\n \"P̌\": \"P\",\n \"p̌\": \"p\",\n \"Q̌\": \"Q\",\n \"q̌\": \"q\",\n \"Ř̩\": \"R\",\n \"ř̩\": \"r\",\n \"Ṧ\": \"S\",\n \"ṧ\": \"s\",\n \"V̌\": \"V\",\n \"v̌\": \"v\",\n \"W̌\": \"W\",\n \"w̌\": \"w\",\n \"X̌\": \"X\",\n \"x̌\": \"x\",\n \"Y̌\": \"Y\",\n \"y̌\": \"y\",\n \"A̧\": \"A\",\n \"a̧\": \"a\",\n \"B̧\": \"B\",\n \"b̧\": \"b\",\n \"Ḑ\": \"D\",\n \"ḑ\": \"d\",\n \"Ȩ\": \"E\",\n \"ȩ\": \"e\",\n \"Ɛ̧\": \"E\",\n \"ɛ̧\": \"e\",\n \"Ḩ\": \"H\",\n \"ḩ\": \"h\",\n \"I̧\": \"I\",\n \"i̧\": \"i\",\n \"Ɨ̧\": \"I\",\n \"ɨ̧\": \"i\",\n \"M̧\": \"M\",\n \"m̧\": \"m\",\n \"O̧\": \"O\",\n \"o̧\": \"o\",\n \"Q̧\": \"Q\",\n \"q̧\": \"q\",\n \"U̧\": \"U\",\n \"u̧\": \"u\",\n \"X̧\": \"X\",\n \"x̧\": \"x\",\n \"Z̧\": \"Z\",\n \"z̧\": \"z\"\n};\nvar chars = Object.keys(characterMap).join('|');\nvar allAccents = new RegExp(chars, 'g');\nvar firstAccent = new RegExp(chars, '');\n\nvar removeAccents = function removeAccents(string) {\n return string.replace(allAccents, function (match) {\n return characterMap[match];\n });\n};\n\nvar hasAccents = function hasAccents(string) {\n return !!string.match(firstAccent);\n};\n\nmodule.exports = removeAccents;\nmodule.exports.has = hasAccents;\nmodule.exports.remove = removeAccents;","/**\r\n * A collection of shims that provide minimal functionality of the ES6 collections.\r\n *\r\n * These implementations are not meant to be used outside of the ResizeObserver\r\n * modules as they cover only a limited range of use cases.\r\n */\n\n/* eslint-disable require-jsdoc, valid-jsdoc */\nvar MapShim = function () {\n if (typeof Map !== 'undefined') {\n return Map;\n }\n /**\r\n * Returns index in provided array that matches the specified key.\r\n *\r\n * @param {Array} arr\r\n * @param {*} key\r\n * @returns {number}\r\n */\n\n\n function getIndex(arr, key) {\n var result = -1;\n arr.some(function (entry, index) {\n if (entry[0] === key) {\n result = index;\n return true;\n }\n\n return false;\n });\n return result;\n }\n\n return (\n /** @class */\n function () {\n function class_1() {\n this.__entries__ = [];\n }\n\n Object.defineProperty(class_1.prototype, \"size\", {\n /**\r\n * @returns {boolean}\r\n */\n get: function get() {\n return this.__entries__.length;\n },\n enumerable: true,\n configurable: true\n });\n /**\r\n * @param {*} key\r\n * @returns {*}\r\n */\n\n class_1.prototype.get = function (key) {\n var index = getIndex(this.__entries__, key);\n var entry = this.__entries__[index];\n return entry && entry[1];\n };\n /**\r\n * @param {*} key\r\n * @param {*} value\r\n * @returns {void}\r\n */\n\n\n class_1.prototype.set = function (key, value) {\n var index = getIndex(this.__entries__, key);\n\n if (~index) {\n this.__entries__[index][1] = value;\n } else {\n this.__entries__.push([key, value]);\n }\n };\n /**\r\n * @param {*} key\r\n * @returns {void}\r\n */\n\n\n class_1.prototype.delete = function (key) {\n var entries = this.__entries__;\n var index = getIndex(entries, key);\n\n if (~index) {\n entries.splice(index, 1);\n }\n };\n /**\r\n * @param {*} key\r\n * @returns {void}\r\n */\n\n\n class_1.prototype.has = function (key) {\n return !!~getIndex(this.__entries__, key);\n };\n /**\r\n * @returns {void}\r\n */\n\n\n class_1.prototype.clear = function () {\n this.__entries__.splice(0);\n };\n /**\r\n * @param {Function} callback\r\n * @param {*} [ctx=null]\r\n * @returns {void}\r\n */\n\n\n class_1.prototype.forEach = function (callback, ctx) {\n if (ctx === void 0) {\n ctx = null;\n }\n\n for (var _i = 0, _a = this.__entries__; _i < _a.length; _i++) {\n var entry = _a[_i];\n callback.call(ctx, entry[1], entry[0]);\n }\n };\n\n return class_1;\n }()\n );\n}();\n/**\r\n * Detects whether window and document objects are available in current environment.\r\n */\n\n\nvar isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined' && window.document === document; // Returns global object of a current environment.\n\nvar global$1 = function () {\n if (typeof global !== 'undefined' && global.Math === Math) {\n return global;\n }\n\n if (typeof self !== 'undefined' && self.Math === Math) {\n return self;\n }\n\n if (typeof window !== 'undefined' && window.Math === Math) {\n return window;\n } // eslint-disable-next-line no-new-func\n\n\n return Function('return this')();\n}();\n/**\r\n * A shim for the requestAnimationFrame which falls back to the setTimeout if\r\n * first one is not supported.\r\n *\r\n * @returns {number} Requests' identifier.\r\n */\n\n\nvar requestAnimationFrame$1 = function () {\n if (typeof requestAnimationFrame === 'function') {\n // It's required to use a bounded function because IE sometimes throws\n // an \"Invalid calling object\" error if rAF is invoked without the global\n // object on the left hand side.\n return requestAnimationFrame.bind(global$1);\n }\n\n return function (callback) {\n return setTimeout(function () {\n return callback(Date.now());\n }, 1000 / 60);\n };\n}(); // Defines minimum timeout before adding a trailing call.\n\n\nvar trailingTimeout = 2;\n/**\r\n * Creates a wrapper function which ensures that provided callback will be\r\n * invoked only once during the specified delay period.\r\n *\r\n * @param {Function} callback - Function to be invoked after the delay period.\r\n * @param {number} delay - Delay after which to invoke callback.\r\n * @returns {Function}\r\n */\n\nfunction throttle(callback, delay) {\n var leadingCall = false,\n trailingCall = false,\n lastCallTime = 0;\n /**\r\n * Invokes the original callback function and schedules new invocation if\r\n * the \"proxy\" was called during current request.\r\n *\r\n * @returns {void}\r\n */\n\n function resolvePending() {\n if (leadingCall) {\n leadingCall = false;\n callback();\n }\n\n if (trailingCall) {\n proxy();\n }\n }\n /**\r\n * Callback invoked after the specified delay. It will further postpone\r\n * invocation of the original function delegating it to the\r\n * requestAnimationFrame.\r\n *\r\n * @returns {void}\r\n */\n\n\n function timeoutCallback() {\n requestAnimationFrame$1(resolvePending);\n }\n /**\r\n * Schedules invocation of the original function.\r\n *\r\n * @returns {void}\r\n */\n\n\n function proxy() {\n var timeStamp = Date.now();\n\n if (leadingCall) {\n // Reject immediately following calls.\n if (timeStamp - lastCallTime < trailingTimeout) {\n return;\n } // Schedule new call to be in invoked when the pending one is resolved.\n // This is important for \"transitions\" which never actually start\n // immediately so there is a chance that we might miss one if change\n // happens amids the pending invocation.\n\n\n trailingCall = true;\n } else {\n leadingCall = true;\n trailingCall = false;\n setTimeout(timeoutCallback, delay);\n }\n\n lastCallTime = timeStamp;\n }\n\n return proxy;\n} // Minimum delay before invoking the update of observers.\n\n\nvar REFRESH_DELAY = 20; // A list of substrings of CSS properties used to find transition events that\n// might affect dimensions of observed elements.\n\nvar transitionKeys = ['top', 'right', 'bottom', 'left', 'width', 'height', 'size', 'weight']; // Check if MutationObserver is available.\n\nvar mutationObserverSupported = typeof MutationObserver !== 'undefined';\n/**\r\n * Singleton controller class which handles updates of ResizeObserver instances.\r\n */\n\nvar ResizeObserverController =\n/** @class */\nfunction () {\n /**\r\n * Creates a new instance of ResizeObserverController.\r\n *\r\n * @private\r\n */\n function ResizeObserverController() {\n /**\r\n * Indicates whether DOM listeners have been added.\r\n *\r\n * @private {boolean}\r\n */\n this.connected_ = false;\n /**\r\n * Tells that controller has subscribed for Mutation Events.\r\n *\r\n * @private {boolean}\r\n */\n\n this.mutationEventsAdded_ = false;\n /**\r\n * Keeps reference to the instance of MutationObserver.\r\n *\r\n * @private {MutationObserver}\r\n */\n\n this.mutationsObserver_ = null;\n /**\r\n * A list of connected observers.\r\n *\r\n * @private {Array}\r\n */\n\n this.observers_ = [];\n this.onTransitionEnd_ = this.onTransitionEnd_.bind(this);\n this.refresh = throttle(this.refresh.bind(this), REFRESH_DELAY);\n }\n /**\r\n * Adds observer to observers list.\r\n *\r\n * @param {ResizeObserverSPI} observer - Observer to be added.\r\n * @returns {void}\r\n */\n\n\n ResizeObserverController.prototype.addObserver = function (observer) {\n if (!~this.observers_.indexOf(observer)) {\n this.observers_.push(observer);\n } // Add listeners if they haven't been added yet.\n\n\n if (!this.connected_) {\n this.connect_();\n }\n };\n /**\r\n * Removes observer from observers list.\r\n *\r\n * @param {ResizeObserverSPI} observer - Observer to be removed.\r\n * @returns {void}\r\n */\n\n\n ResizeObserverController.prototype.removeObserver = function (observer) {\n var observers = this.observers_;\n var index = observers.indexOf(observer); // Remove observer if it's present in registry.\n\n if (~index) {\n observers.splice(index, 1);\n } // Remove listeners if controller has no connected observers.\n\n\n if (!observers.length && this.connected_) {\n this.disconnect_();\n }\n };\n /**\r\n * Invokes the update of observers. It will continue running updates insofar\r\n * it detects changes.\r\n *\r\n * @returns {void}\r\n */\n\n\n ResizeObserverController.prototype.refresh = function () {\n var changesDetected = this.updateObservers_(); // Continue running updates if changes have been detected as there might\n // be future ones caused by CSS transitions.\n\n if (changesDetected) {\n this.refresh();\n }\n };\n /**\r\n * Updates every observer from observers list and notifies them of queued\r\n * entries.\r\n *\r\n * @private\r\n * @returns {boolean} Returns \"true\" if any observer has detected changes in\r\n * dimensions of it's elements.\r\n */\n\n\n ResizeObserverController.prototype.updateObservers_ = function () {\n // Collect observers that have active observations.\n var activeObservers = this.observers_.filter(function (observer) {\n return observer.gatherActive(), observer.hasActive();\n }); // Deliver notifications in a separate cycle in order to avoid any\n // collisions between observers, e.g. when multiple instances of\n // ResizeObserver are tracking the same element and the callback of one\n // of them changes content dimensions of the observed target. Sometimes\n // this may result in notifications being blocked for the rest of observers.\n\n activeObservers.forEach(function (observer) {\n return observer.broadcastActive();\n });\n return activeObservers.length > 0;\n };\n /**\r\n * Initializes DOM listeners.\r\n *\r\n * @private\r\n * @returns {void}\r\n */\n\n\n ResizeObserverController.prototype.connect_ = function () {\n // Do nothing if running in a non-browser environment or if listeners\n // have been already added.\n if (!isBrowser || this.connected_) {\n return;\n } // Subscription to the \"Transitionend\" event is used as a workaround for\n // delayed transitions. This way it's possible to capture at least the\n // final state of an element.\n\n\n document.addEventListener('transitionend', this.onTransitionEnd_);\n window.addEventListener('resize', this.refresh);\n\n if (mutationObserverSupported) {\n this.mutationsObserver_ = new MutationObserver(this.refresh);\n this.mutationsObserver_.observe(document, {\n attributes: true,\n childList: true,\n characterData: true,\n subtree: true\n });\n } else {\n document.addEventListener('DOMSubtreeModified', this.refresh);\n this.mutationEventsAdded_ = true;\n }\n\n this.connected_ = true;\n };\n /**\r\n * Removes DOM listeners.\r\n *\r\n * @private\r\n * @returns {void}\r\n */\n\n\n ResizeObserverController.prototype.disconnect_ = function () {\n // Do nothing if running in a non-browser environment or if listeners\n // have been already removed.\n if (!isBrowser || !this.connected_) {\n return;\n }\n\n document.removeEventListener('transitionend', this.onTransitionEnd_);\n window.removeEventListener('resize', this.refresh);\n\n if (this.mutationsObserver_) {\n this.mutationsObserver_.disconnect();\n }\n\n if (this.mutationEventsAdded_) {\n document.removeEventListener('DOMSubtreeModified', this.refresh);\n }\n\n this.mutationsObserver_ = null;\n this.mutationEventsAdded_ = false;\n this.connected_ = false;\n };\n /**\r\n * \"Transitionend\" event handler.\r\n *\r\n * @private\r\n * @param {TransitionEvent} event\r\n * @returns {void}\r\n */\n\n\n ResizeObserverController.prototype.onTransitionEnd_ = function (_a) {\n var _b = _a.propertyName,\n propertyName = _b === void 0 ? '' : _b; // Detect whether transition may affect dimensions of an element.\n\n var isReflowProperty = transitionKeys.some(function (key) {\n return !!~propertyName.indexOf(key);\n });\n\n if (isReflowProperty) {\n this.refresh();\n }\n };\n /**\r\n * Returns instance of the ResizeObserverController.\r\n *\r\n * @returns {ResizeObserverController}\r\n */\n\n\n ResizeObserverController.getInstance = function () {\n if (!this.instance_) {\n this.instance_ = new ResizeObserverController();\n }\n\n return this.instance_;\n };\n /**\r\n * Holds reference to the controller's instance.\r\n *\r\n * @private {ResizeObserverController}\r\n */\n\n\n ResizeObserverController.instance_ = null;\n return ResizeObserverController;\n}();\n/**\r\n * Defines non-writable/enumerable properties of the provided target object.\r\n *\r\n * @param {Object} target - Object for which to define properties.\r\n * @param {Object} props - Properties to be defined.\r\n * @returns {Object} Target object.\r\n */\n\n\nvar defineConfigurable = function defineConfigurable(target, props) {\n for (var _i = 0, _a = Object.keys(props); _i < _a.length; _i++) {\n var key = _a[_i];\n Object.defineProperty(target, key, {\n value: props[key],\n enumerable: false,\n writable: false,\n configurable: true\n });\n }\n\n return target;\n};\n/**\r\n * Returns the global object associated with provided element.\r\n *\r\n * @param {Object} target\r\n * @returns {Object}\r\n */\n\n\nvar getWindowOf = function getWindowOf(target) {\n // Assume that the element is an instance of Node, which means that it\n // has the \"ownerDocument\" property from which we can retrieve a\n // corresponding global object.\n var ownerGlobal = target && target.ownerDocument && target.ownerDocument.defaultView; // Return the local global object if it's not possible extract one from\n // provided element.\n\n return ownerGlobal || global$1;\n}; // Placeholder of an empty content rectangle.\n\n\nvar emptyRect = createRectInit(0, 0, 0, 0);\n/**\r\n * Converts provided string to a number.\r\n *\r\n * @param {number|string} value\r\n * @returns {number}\r\n */\n\nfunction toFloat(value) {\n return parseFloat(value) || 0;\n}\n/**\r\n * Extracts borders size from provided styles.\r\n *\r\n * @param {CSSStyleDeclaration} styles\r\n * @param {...string} positions - Borders positions (top, right, ...)\r\n * @returns {number}\r\n */\n\n\nfunction getBordersSize(styles) {\n var positions = [];\n\n for (var _i = 1; _i < arguments.length; _i++) {\n positions[_i - 1] = arguments[_i];\n }\n\n return positions.reduce(function (size, position) {\n var value = styles['border-' + position + '-width'];\n return size + toFloat(value);\n }, 0);\n}\n/**\r\n * Extracts paddings sizes from provided styles.\r\n *\r\n * @param {CSSStyleDeclaration} styles\r\n * @returns {Object} Paddings box.\r\n */\n\n\nfunction getPaddings(styles) {\n var positions = ['top', 'right', 'bottom', 'left'];\n var paddings = {};\n\n for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {\n var position = positions_1[_i];\n var value = styles['padding-' + position];\n paddings[position] = toFloat(value);\n }\n\n return paddings;\n}\n/**\r\n * Calculates content rectangle of provided SVG element.\r\n *\r\n * @param {SVGGraphicsElement} target - Element content rectangle of which needs\r\n * to be calculated.\r\n * @returns {DOMRectInit}\r\n */\n\n\nfunction getSVGContentRect(target) {\n var bbox = target.getBBox();\n return createRectInit(0, 0, bbox.width, bbox.height);\n}\n/**\r\n * Calculates content rectangle of provided HTMLElement.\r\n *\r\n * @param {HTMLElement} target - Element for which to calculate the content rectangle.\r\n * @returns {DOMRectInit}\r\n */\n\n\nfunction getHTMLElementContentRect(target) {\n // Client width & height properties can't be\n // used exclusively as they provide rounded values.\n var clientWidth = target.clientWidth,\n clientHeight = target.clientHeight; // By this condition we can catch all non-replaced inline, hidden and\n // detached elements. Though elements with width & height properties less\n // than 0.5 will be discarded as well.\n //\n // Without it we would need to implement separate methods for each of\n // those cases and it's not possible to perform a precise and performance\n // effective test for hidden elements. E.g. even jQuery's ':visible' filter\n // gives wrong results for elements with width & height less than 0.5.\n\n if (!clientWidth && !clientHeight) {\n return emptyRect;\n }\n\n var styles = getWindowOf(target).getComputedStyle(target);\n var paddings = getPaddings(styles);\n var horizPad = paddings.left + paddings.right;\n var vertPad = paddings.top + paddings.bottom; // Computed styles of width & height are being used because they are the\n // only dimensions available to JS that contain non-rounded values. It could\n // be possible to utilize the getBoundingClientRect if only it's data wasn't\n // affected by CSS transformations let alone paddings, borders and scroll bars.\n\n var width = toFloat(styles.width),\n height = toFloat(styles.height); // Width & height include paddings and borders when the 'border-box' box\n // model is applied (except for IE).\n\n if (styles.boxSizing === 'border-box') {\n // Following conditions are required to handle Internet Explorer which\n // doesn't include paddings and borders to computed CSS dimensions.\n //\n // We can say that if CSS dimensions + paddings are equal to the \"client\"\n // properties then it's either IE, and thus we don't need to subtract\n // anything, or an element merely doesn't have paddings/borders styles.\n if (Math.round(width + horizPad) !== clientWidth) {\n width -= getBordersSize(styles, 'left', 'right') + horizPad;\n }\n\n if (Math.round(height + vertPad) !== clientHeight) {\n height -= getBordersSize(styles, 'top', 'bottom') + vertPad;\n }\n } // Following steps can't be applied to the document's root element as its\n // client[Width/Height] properties represent viewport area of the window.\n // Besides, it's as well not necessary as the itself neither has\n // rendered scroll bars nor it can be clipped.\n\n\n if (!isDocumentElement(target)) {\n // In some browsers (only in Firefox, actually) CSS width & height\n // include scroll bars size which can be removed at this step as scroll\n // bars are the only difference between rounded dimensions + paddings\n // and \"client\" properties, though that is not always true in Chrome.\n var vertScrollbar = Math.round(width + horizPad) - clientWidth;\n var horizScrollbar = Math.round(height + vertPad) - clientHeight; // Chrome has a rather weird rounding of \"client\" properties.\n // E.g. for an element with content width of 314.2px it sometimes gives\n // the client width of 315px and for the width of 314.7px it may give\n // 314px. And it doesn't happen all the time. So just ignore this delta\n // as a non-relevant.\n\n if (Math.abs(vertScrollbar) !== 1) {\n width -= vertScrollbar;\n }\n\n if (Math.abs(horizScrollbar) !== 1) {\n height -= horizScrollbar;\n }\n }\n\n return createRectInit(paddings.left, paddings.top, width, height);\n}\n/**\r\n * Checks whether provided element is an instance of the SVGGraphicsElement.\r\n *\r\n * @param {Element} target - Element to be checked.\r\n * @returns {boolean}\r\n */\n\n\nvar isSVGGraphicsElement = function () {\n // Some browsers, namely IE and Edge, don't have the SVGGraphicsElement\n // interface.\n if (typeof SVGGraphicsElement !== 'undefined') {\n return function (target) {\n return target instanceof getWindowOf(target).SVGGraphicsElement;\n };\n } // If it's so, then check that element is at least an instance of the\n // SVGElement and that it has the \"getBBox\" method.\n // eslint-disable-next-line no-extra-parens\n\n\n return function (target) {\n return target instanceof getWindowOf(target).SVGElement && typeof target.getBBox === 'function';\n };\n}();\n/**\r\n * Checks whether provided element is a document element ().\r\n *\r\n * @param {Element} target - Element to be checked.\r\n * @returns {boolean}\r\n */\n\n\nfunction isDocumentElement(target) {\n return target === getWindowOf(target).document.documentElement;\n}\n/**\r\n * Calculates an appropriate content rectangle for provided html or svg element.\r\n *\r\n * @param {Element} target - Element content rectangle of which needs to be calculated.\r\n * @returns {DOMRectInit}\r\n */\n\n\nfunction getContentRect(target) {\n if (!isBrowser) {\n return emptyRect;\n }\n\n if (isSVGGraphicsElement(target)) {\n return getSVGContentRect(target);\n }\n\n return getHTMLElementContentRect(target);\n}\n/**\r\n * Creates rectangle with an interface of the DOMRectReadOnly.\r\n * Spec: https://drafts.fxtf.org/geometry/#domrectreadonly\r\n *\r\n * @param {DOMRectInit} rectInit - Object with rectangle's x/y coordinates and dimensions.\r\n * @returns {DOMRectReadOnly}\r\n */\n\n\nfunction createReadOnlyRect(_a) {\n var x = _a.x,\n y = _a.y,\n width = _a.width,\n height = _a.height; // If DOMRectReadOnly is available use it as a prototype for the rectangle.\n\n var Constr = typeof DOMRectReadOnly !== 'undefined' ? DOMRectReadOnly : Object;\n var rect = Object.create(Constr.prototype); // Rectangle's properties are not writable and non-enumerable.\n\n defineConfigurable(rect, {\n x: x,\n y: y,\n width: width,\n height: height,\n top: y,\n right: x + width,\n bottom: height + y,\n left: x\n });\n return rect;\n}\n/**\r\n * Creates DOMRectInit object based on the provided dimensions and the x/y coordinates.\r\n * Spec: https://drafts.fxtf.org/geometry/#dictdef-domrectinit\r\n *\r\n * @param {number} x - X coordinate.\r\n * @param {number} y - Y coordinate.\r\n * @param {number} width - Rectangle's width.\r\n * @param {number} height - Rectangle's height.\r\n * @returns {DOMRectInit}\r\n */\n\n\nfunction createRectInit(x, y, width, height) {\n return {\n x: x,\n y: y,\n width: width,\n height: height\n };\n}\n/**\r\n * Class that is responsible for computations of the content rectangle of\r\n * provided DOM element and for keeping track of it's changes.\r\n */\n\n\nvar ResizeObservation =\n/** @class */\nfunction () {\n /**\r\n * Creates an instance of ResizeObservation.\r\n *\r\n * @param {Element} target - Element to be observed.\r\n */\n function ResizeObservation(target) {\n /**\r\n * Broadcasted width of content rectangle.\r\n *\r\n * @type {number}\r\n */\n this.broadcastWidth = 0;\n /**\r\n * Broadcasted height of content rectangle.\r\n *\r\n * @type {number}\r\n */\n\n this.broadcastHeight = 0;\n /**\r\n * Reference to the last observed content rectangle.\r\n *\r\n * @private {DOMRectInit}\r\n */\n\n this.contentRect_ = createRectInit(0, 0, 0, 0);\n this.target = target;\n }\n /**\r\n * Updates content rectangle and tells whether it's width or height properties\r\n * have changed since the last broadcast.\r\n *\r\n * @returns {boolean}\r\n */\n\n\n ResizeObservation.prototype.isActive = function () {\n var rect = getContentRect(this.target);\n this.contentRect_ = rect;\n return rect.width !== this.broadcastWidth || rect.height !== this.broadcastHeight;\n };\n /**\r\n * Updates 'broadcastWidth' and 'broadcastHeight' properties with a data\r\n * from the corresponding properties of the last observed content rectangle.\r\n *\r\n * @returns {DOMRectInit} Last observed content rectangle.\r\n */\n\n\n ResizeObservation.prototype.broadcastRect = function () {\n var rect = this.contentRect_;\n this.broadcastWidth = rect.width;\n this.broadcastHeight = rect.height;\n return rect;\n };\n\n return ResizeObservation;\n}();\n\nvar ResizeObserverEntry =\n/** @class */\nfunction () {\n /**\r\n * Creates an instance of ResizeObserverEntry.\r\n *\r\n * @param {Element} target - Element that is being observed.\r\n * @param {DOMRectInit} rectInit - Data of the element's content rectangle.\r\n */\n function ResizeObserverEntry(target, rectInit) {\n var contentRect = createReadOnlyRect(rectInit); // According to the specification following properties are not writable\n // and are also not enumerable in the native implementation.\n //\n // Property accessors are not being used as they'd require to define a\n // private WeakMap storage which may cause memory leaks in browsers that\n // don't support this type of collections.\n\n defineConfigurable(this, {\n target: target,\n contentRect: contentRect\n });\n }\n\n return ResizeObserverEntry;\n}();\n\nvar ResizeObserverSPI =\n/** @class */\nfunction () {\n /**\r\n * Creates a new instance of ResizeObserver.\r\n *\r\n * @param {ResizeObserverCallback} callback - Callback function that is invoked\r\n * when one of the observed elements changes it's content dimensions.\r\n * @param {ResizeObserverController} controller - Controller instance which\r\n * is responsible for the updates of observer.\r\n * @param {ResizeObserver} callbackCtx - Reference to the public\r\n * ResizeObserver instance which will be passed to callback function.\r\n */\n function ResizeObserverSPI(callback, controller, callbackCtx) {\n /**\r\n * Collection of resize observations that have detected changes in dimensions\r\n * of elements.\r\n *\r\n * @private {Array}\r\n */\n this.activeObservations_ = [];\n /**\r\n * Registry of the ResizeObservation instances.\r\n *\r\n * @private {Map}\r\n */\n\n this.observations_ = new MapShim();\n\n if (typeof callback !== 'function') {\n throw new TypeError('The callback provided as parameter 1 is not a function.');\n }\n\n this.callback_ = callback;\n this.controller_ = controller;\n this.callbackCtx_ = callbackCtx;\n }\n /**\r\n * Starts observing provided element.\r\n *\r\n * @param {Element} target - Element to be observed.\r\n * @returns {void}\r\n */\n\n\n ResizeObserverSPI.prototype.observe = function (target) {\n if (!arguments.length) {\n throw new TypeError('1 argument required, but only 0 present.');\n } // Do nothing if current environment doesn't have the Element interface.\n\n\n if (typeof Element === 'undefined' || !(Element instanceof Object)) {\n return;\n }\n\n if (!(target instanceof getWindowOf(target).Element)) {\n throw new TypeError('parameter 1 is not of type \"Element\".');\n }\n\n var observations = this.observations_; // Do nothing if element is already being observed.\n\n if (observations.has(target)) {\n return;\n }\n\n observations.set(target, new ResizeObservation(target));\n this.controller_.addObserver(this); // Force the update of observations.\n\n this.controller_.refresh();\n };\n /**\r\n * Stops observing provided element.\r\n *\r\n * @param {Element} target - Element to stop observing.\r\n * @returns {void}\r\n */\n\n\n ResizeObserverSPI.prototype.unobserve = function (target) {\n if (!arguments.length) {\n throw new TypeError('1 argument required, but only 0 present.');\n } // Do nothing if current environment doesn't have the Element interface.\n\n\n if (typeof Element === 'undefined' || !(Element instanceof Object)) {\n return;\n }\n\n if (!(target instanceof getWindowOf(target).Element)) {\n throw new TypeError('parameter 1 is not of type \"Element\".');\n }\n\n var observations = this.observations_; // Do nothing if element is not being observed.\n\n if (!observations.has(target)) {\n return;\n }\n\n observations.delete(target);\n\n if (!observations.size) {\n this.controller_.removeObserver(this);\n }\n };\n /**\r\n * Stops observing all elements.\r\n *\r\n * @returns {void}\r\n */\n\n\n ResizeObserverSPI.prototype.disconnect = function () {\n this.clearActive();\n this.observations_.clear();\n this.controller_.removeObserver(this);\n };\n /**\r\n * Collects observation instances the associated element of which has changed\r\n * it's content rectangle.\r\n *\r\n * @returns {void}\r\n */\n\n\n ResizeObserverSPI.prototype.gatherActive = function () {\n var _this = this;\n\n this.clearActive();\n this.observations_.forEach(function (observation) {\n if (observation.isActive()) {\n _this.activeObservations_.push(observation);\n }\n });\n };\n /**\r\n * Invokes initial callback function with a list of ResizeObserverEntry\r\n * instances collected from active resize observations.\r\n *\r\n * @returns {void}\r\n */\n\n\n ResizeObserverSPI.prototype.broadcastActive = function () {\n // Do nothing if observer doesn't have active observations.\n if (!this.hasActive()) {\n return;\n }\n\n var ctx = this.callbackCtx_; // Create ResizeObserverEntry instance for every active observation.\n\n var entries = this.activeObservations_.map(function (observation) {\n return new ResizeObserverEntry(observation.target, observation.broadcastRect());\n });\n this.callback_.call(ctx, entries, ctx);\n this.clearActive();\n };\n /**\r\n * Clears the collection of active observations.\r\n *\r\n * @returns {void}\r\n */\n\n\n ResizeObserverSPI.prototype.clearActive = function () {\n this.activeObservations_.splice(0);\n };\n /**\r\n * Tells whether observer has active observations.\r\n *\r\n * @returns {boolean}\r\n */\n\n\n ResizeObserverSPI.prototype.hasActive = function () {\n return this.activeObservations_.length > 0;\n };\n\n return ResizeObserverSPI;\n}(); // Registry of internal observers. If WeakMap is not available use current shim\n// for the Map collection as it has all required methods and because WeakMap\n// can't be fully polyfilled anyway.\n\n\nvar observers = typeof WeakMap !== 'undefined' ? new WeakMap() : new MapShim();\n/**\r\n * ResizeObserver API. Encapsulates the ResizeObserver SPI implementation\r\n * exposing only those methods and properties that are defined in the spec.\r\n */\n\nvar ResizeObserver =\n/** @class */\nfunction () {\n /**\r\n * Creates a new instance of ResizeObserver.\r\n *\r\n * @param {ResizeObserverCallback} callback - Callback that is invoked when\r\n * dimensions of the observed elements change.\r\n */\n function ResizeObserver(callback) {\n if (!(this instanceof ResizeObserver)) {\n throw new TypeError('Cannot call a class as a function.');\n }\n\n if (!arguments.length) {\n throw new TypeError('1 argument required, but only 0 present.');\n }\n\n var controller = ResizeObserverController.getInstance();\n var observer = new ResizeObserverSPI(callback, controller, this);\n observers.set(this, observer);\n }\n\n return ResizeObserver;\n}(); // Expose public methods of ResizeObserver.\n\n\n['observe', 'unobserve', 'disconnect'].forEach(function (method) {\n ResizeObserver.prototype[method] = function () {\n var _a;\n\n return (_a = observers.get(this))[method].apply(_a, arguments);\n };\n});\n\nvar index = function () {\n // Export existing implementation if available.\n if (typeof global$1.ResizeObserver !== 'undefined') {\n return global$1.ResizeObserver;\n }\n\n return ResizeObserver;\n}();\n\nexport default index;","\"use strict\";\n\nvar _slicedToArray = function () {\n function sliceIterator(arr, i) {\n var _arr = [];\n var _n = true;\n var _d = false;\n var _e = undefined;\n\n try {\n for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {\n _arr.push(_s.value);\n\n if (i && _arr.length === i) break;\n }\n } catch (err) {\n _d = true;\n _e = err;\n } finally {\n try {\n if (!_n && _i[\"return\"]) _i[\"return\"]();\n } finally {\n if (_d) throw _e;\n }\n }\n\n return _arr;\n }\n\n return function (arr, i) {\n if (Array.isArray(arr)) {\n return arr;\n } else if (Symbol.iterator in Object(arr)) {\n return sliceIterator(arr, i);\n } else {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance\");\n }\n };\n}();\n\nmodule.exports = function (_ref) {\n var data = _ref.data;\n var multiSection = _ref.multiSection;\n\n function nextNonEmptySectionIndex(sectionIndex) {\n if (sectionIndex === null) {\n sectionIndex = 0;\n } else {\n sectionIndex++;\n }\n\n while (sectionIndex < data.length && data[sectionIndex] === 0) {\n sectionIndex++;\n }\n\n return sectionIndex === data.length ? null : sectionIndex;\n }\n\n function prevNonEmptySectionIndex(sectionIndex) {\n if (sectionIndex === null) {\n sectionIndex = data.length - 1;\n } else {\n sectionIndex--;\n }\n\n while (sectionIndex >= 0 && data[sectionIndex] === 0) {\n sectionIndex--;\n }\n\n return sectionIndex === -1 ? null : sectionIndex;\n }\n\n function next(position) {\n var _position = _slicedToArray(position, 2);\n\n var sectionIndex = _position[0];\n var itemIndex = _position[1];\n\n if (multiSection) {\n if (itemIndex === null || itemIndex === data[sectionIndex] - 1) {\n sectionIndex = nextNonEmptySectionIndex(sectionIndex);\n\n if (sectionIndex === null) {\n return [null, null];\n }\n\n return [sectionIndex, 0];\n }\n\n return [sectionIndex, itemIndex + 1];\n }\n\n if (data === 0 || itemIndex === data - 1) {\n return [null, null];\n }\n\n if (itemIndex === null) {\n return [null, 0];\n }\n\n return [null, itemIndex + 1];\n }\n\n function prev(position) {\n var _position2 = _slicedToArray(position, 2);\n\n var sectionIndex = _position2[0];\n var itemIndex = _position2[1];\n\n if (multiSection) {\n if (itemIndex === null || itemIndex === 0) {\n sectionIndex = prevNonEmptySectionIndex(sectionIndex);\n\n if (sectionIndex === null) {\n return [null, null];\n }\n\n return [sectionIndex, data[sectionIndex] - 1];\n }\n\n return [sectionIndex, itemIndex - 1];\n }\n\n if (data === 0 || itemIndex === 0) {\n return [null, null];\n }\n\n if (itemIndex === null) {\n return [null, data - 1];\n }\n\n return [null, itemIndex - 1];\n }\n\n function isLast(position) {\n return next(position)[1] === null;\n }\n\n return {\n next: next,\n prev: prev,\n isLast: isLast\n };\n};","'use strict';\n\nfunction shallowEqualArrays(arrA, arrB) {\n if (arrA === arrB) {\n return true;\n }\n\n if (!arrA || !arrB) {\n return false;\n }\n\n var len = arrA.length;\n\n if (arrB.length !== len) {\n return false;\n }\n\n for (var i = 0; i < len; i++) {\n if (arrA[i] !== arrB[i]) {\n return false;\n }\n }\n\n return true;\n}\n\nmodule.exports = shallowEqualArrays;","var camel2hyphen = function camel2hyphen(str) {\n return str.replace(/[A-Z]/g, function (match) {\n return '-' + match.toLowerCase();\n }).toLowerCase();\n};\n\nmodule.exports = camel2hyphen;","import PropTypes from 'prop-types';\nimport withSideEffect from 'react-side-effect';\nimport isEqual from 'react-fast-compare';\nimport React from 'react';\nimport objectAssign from 'object-assign';\nvar ATTRIBUTE_NAMES = {\n BODY: \"bodyAttributes\",\n HTML: \"htmlAttributes\",\n TITLE: \"titleAttributes\"\n};\nvar TAG_NAMES = {\n BASE: \"base\",\n BODY: \"body\",\n HEAD: \"head\",\n HTML: \"html\",\n LINK: \"link\",\n META: \"meta\",\n NOSCRIPT: \"noscript\",\n SCRIPT: \"script\",\n STYLE: \"style\",\n TITLE: \"title\"\n};\nvar VALID_TAG_NAMES = Object.keys(TAG_NAMES).map(function (name) {\n return TAG_NAMES[name];\n});\nvar TAG_PROPERTIES = {\n CHARSET: \"charset\",\n CSS_TEXT: \"cssText\",\n HREF: \"href\",\n HTTPEQUIV: \"http-equiv\",\n INNER_HTML: \"innerHTML\",\n ITEM_PROP: \"itemprop\",\n NAME: \"name\",\n PROPERTY: \"property\",\n REL: \"rel\",\n SRC: \"src\",\n TARGET: \"target\"\n};\nvar REACT_TAG_MAP = {\n accesskey: \"accessKey\",\n charset: \"charSet\",\n class: \"className\",\n contenteditable: \"contentEditable\",\n contextmenu: \"contextMenu\",\n \"http-equiv\": \"httpEquiv\",\n itemprop: \"itemProp\",\n tabindex: \"tabIndex\"\n};\nvar HELMET_PROPS = {\n DEFAULT_TITLE: \"defaultTitle\",\n DEFER: \"defer\",\n ENCODE_SPECIAL_CHARACTERS: \"encodeSpecialCharacters\",\n ON_CHANGE_CLIENT_STATE: \"onChangeClientState\",\n TITLE_TEMPLATE: \"titleTemplate\"\n};\nvar HTML_TAG_MAP = Object.keys(REACT_TAG_MAP).reduce(function (obj, key) {\n obj[REACT_TAG_MAP[key]] = key;\n return obj;\n}, {});\nvar SELF_CLOSING_TAGS = [TAG_NAMES.NOSCRIPT, TAG_NAMES.SCRIPT, TAG_NAMES.STYLE];\nvar HELMET_ATTRIBUTE = \"data-react-helmet\";\n\nvar _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) {\n return typeof obj;\n} : function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n};\n\nvar classCallCheck = function classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n};\n\nvar createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n}();\n\nvar _extends = Object.assign || function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n};\n\nvar inherits = function inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass);\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n enumerable: false,\n writable: true,\n configurable: true\n }\n });\n if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;\n};\n\nvar objectWithoutProperties = function objectWithoutProperties(obj, keys) {\n var target = {};\n\n for (var i in obj) {\n if (keys.indexOf(i) >= 0) continue;\n if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;\n target[i] = obj[i];\n }\n\n return target;\n};\n\nvar possibleConstructorReturn = function possibleConstructorReturn(self, call) {\n if (!self) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self;\n};\n\nvar encodeSpecialCharacters = function encodeSpecialCharacters(str) {\n var encode = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;\n\n if (encode === false) {\n return String(str);\n }\n\n return String(str).replace(/&/g, \"&\").replace(//g, \">\").replace(/\"/g, \""\").replace(/'/g, \"'\");\n};\n\nvar getTitleFromPropsList = function getTitleFromPropsList(propsList) {\n var innermostTitle = getInnermostProperty(propsList, TAG_NAMES.TITLE);\n var innermostTemplate = getInnermostProperty(propsList, HELMET_PROPS.TITLE_TEMPLATE);\n\n if (innermostTemplate && innermostTitle) {\n // use function arg to avoid need to escape $ characters\n return innermostTemplate.replace(/%s/g, function () {\n return Array.isArray(innermostTitle) ? innermostTitle.join(\"\") : innermostTitle;\n });\n }\n\n var innermostDefaultTitle = getInnermostProperty(propsList, HELMET_PROPS.DEFAULT_TITLE);\n return innermostTitle || innermostDefaultTitle || undefined;\n};\n\nvar getOnChangeClientState = function getOnChangeClientState(propsList) {\n return getInnermostProperty(propsList, HELMET_PROPS.ON_CHANGE_CLIENT_STATE) || function () {};\n};\n\nvar getAttributesFromPropsList = function getAttributesFromPropsList(tagType, propsList) {\n return propsList.filter(function (props) {\n return typeof props[tagType] !== \"undefined\";\n }).map(function (props) {\n return props[tagType];\n }).reduce(function (tagAttrs, current) {\n return _extends({}, tagAttrs, current);\n }, {});\n};\n\nvar getBaseTagFromPropsList = function getBaseTagFromPropsList(primaryAttributes, propsList) {\n return propsList.filter(function (props) {\n return typeof props[TAG_NAMES.BASE] !== \"undefined\";\n }).map(function (props) {\n return props[TAG_NAMES.BASE];\n }).reverse().reduce(function (innermostBaseTag, tag) {\n if (!innermostBaseTag.length) {\n var keys = Object.keys(tag);\n\n for (var i = 0; i < keys.length; i++) {\n var attributeKey = keys[i];\n var lowerCaseAttributeKey = attributeKey.toLowerCase();\n\n if (primaryAttributes.indexOf(lowerCaseAttributeKey) !== -1 && tag[lowerCaseAttributeKey]) {\n return innermostBaseTag.concat(tag);\n }\n }\n }\n\n return innermostBaseTag;\n }, []);\n};\n\nvar getTagsFromPropsList = function getTagsFromPropsList(tagName, primaryAttributes, propsList) {\n // Calculate list of tags, giving priority innermost component (end of the propslist)\n var approvedSeenTags = {};\n return propsList.filter(function (props) {\n if (Array.isArray(props[tagName])) {\n return true;\n }\n\n if (typeof props[tagName] !== \"undefined\") {\n warn(\"Helmet: \" + tagName + \" should be of type \\\"Array\\\". Instead found type \\\"\" + _typeof(props[tagName]) + \"\\\"\");\n }\n\n return false;\n }).map(function (props) {\n return props[tagName];\n }).reverse().reduce(function (approvedTags, instanceTags) {\n var instanceSeenTags = {};\n instanceTags.filter(function (tag) {\n var primaryAttributeKey = void 0;\n var keys = Object.keys(tag);\n\n for (var i = 0; i < keys.length; i++) {\n var attributeKey = keys[i];\n var lowerCaseAttributeKey = attributeKey.toLowerCase(); // Special rule with link tags, since rel and href are both primary tags, rel takes priority\n\n if (primaryAttributes.indexOf(lowerCaseAttributeKey) !== -1 && !(primaryAttributeKey === TAG_PROPERTIES.REL && tag[primaryAttributeKey].toLowerCase() === \"canonical\") && !(lowerCaseAttributeKey === TAG_PROPERTIES.REL && tag[lowerCaseAttributeKey].toLowerCase() === \"stylesheet\")) {\n primaryAttributeKey = lowerCaseAttributeKey;\n } // Special case for innerHTML which doesn't work lowercased\n\n\n if (primaryAttributes.indexOf(attributeKey) !== -1 && (attributeKey === TAG_PROPERTIES.INNER_HTML || attributeKey === TAG_PROPERTIES.CSS_TEXT || attributeKey === TAG_PROPERTIES.ITEM_PROP)) {\n primaryAttributeKey = attributeKey;\n }\n }\n\n if (!primaryAttributeKey || !tag[primaryAttributeKey]) {\n return false;\n }\n\n var value = tag[primaryAttributeKey].toLowerCase();\n\n if (!approvedSeenTags[primaryAttributeKey]) {\n approvedSeenTags[primaryAttributeKey] = {};\n }\n\n if (!instanceSeenTags[primaryAttributeKey]) {\n instanceSeenTags[primaryAttributeKey] = {};\n }\n\n if (!approvedSeenTags[primaryAttributeKey][value]) {\n instanceSeenTags[primaryAttributeKey][value] = true;\n return true;\n }\n\n return false;\n }).reverse().forEach(function (tag) {\n return approvedTags.push(tag);\n }); // Update seen tags with tags from this instance\n\n var keys = Object.keys(instanceSeenTags);\n\n for (var i = 0; i < keys.length; i++) {\n var attributeKey = keys[i];\n var tagUnion = objectAssign({}, approvedSeenTags[attributeKey], instanceSeenTags[attributeKey]);\n approvedSeenTags[attributeKey] = tagUnion;\n }\n\n return approvedTags;\n }, []).reverse();\n};\n\nvar getInnermostProperty = function getInnermostProperty(propsList, property) {\n for (var i = propsList.length - 1; i >= 0; i--) {\n var props = propsList[i];\n\n if (props.hasOwnProperty(property)) {\n return props[property];\n }\n }\n\n return null;\n};\n\nvar reducePropsToState = function reducePropsToState(propsList) {\n return {\n baseTag: getBaseTagFromPropsList([TAG_PROPERTIES.HREF, TAG_PROPERTIES.TARGET], propsList),\n bodyAttributes: getAttributesFromPropsList(ATTRIBUTE_NAMES.BODY, propsList),\n defer: getInnermostProperty(propsList, HELMET_PROPS.DEFER),\n encode: getInnermostProperty(propsList, HELMET_PROPS.ENCODE_SPECIAL_CHARACTERS),\n htmlAttributes: getAttributesFromPropsList(ATTRIBUTE_NAMES.HTML, propsList),\n linkTags: getTagsFromPropsList(TAG_NAMES.LINK, [TAG_PROPERTIES.REL, TAG_PROPERTIES.HREF], propsList),\n metaTags: getTagsFromPropsList(TAG_NAMES.META, [TAG_PROPERTIES.NAME, TAG_PROPERTIES.CHARSET, TAG_PROPERTIES.HTTPEQUIV, TAG_PROPERTIES.PROPERTY, TAG_PROPERTIES.ITEM_PROP], propsList),\n noscriptTags: getTagsFromPropsList(TAG_NAMES.NOSCRIPT, [TAG_PROPERTIES.INNER_HTML], propsList),\n onChangeClientState: getOnChangeClientState(propsList),\n scriptTags: getTagsFromPropsList(TAG_NAMES.SCRIPT, [TAG_PROPERTIES.SRC, TAG_PROPERTIES.INNER_HTML], propsList),\n styleTags: getTagsFromPropsList(TAG_NAMES.STYLE, [TAG_PROPERTIES.CSS_TEXT], propsList),\n title: getTitleFromPropsList(propsList),\n titleAttributes: getAttributesFromPropsList(ATTRIBUTE_NAMES.TITLE, propsList)\n };\n};\n\nvar rafPolyfill = function () {\n var clock = Date.now();\n return function (callback) {\n var currentTime = Date.now();\n\n if (currentTime - clock > 16) {\n clock = currentTime;\n callback(currentTime);\n } else {\n setTimeout(function () {\n rafPolyfill(callback);\n }, 0);\n }\n };\n}();\n\nvar cafPolyfill = function cafPolyfill(id) {\n return clearTimeout(id);\n};\n\nvar requestAnimationFrame = typeof window !== \"undefined\" ? window.requestAnimationFrame && window.requestAnimationFrame.bind(window) || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || rafPolyfill : global.requestAnimationFrame || rafPolyfill;\nvar cancelAnimationFrame = typeof window !== \"undefined\" ? window.cancelAnimationFrame || window.webkitCancelAnimationFrame || window.mozCancelAnimationFrame || cafPolyfill : global.cancelAnimationFrame || cafPolyfill;\n\nvar warn = function warn(msg) {\n return console && typeof console.warn === \"function\" && console.warn(msg);\n};\n\nvar _helmetCallback = null;\n\nvar handleClientStateChange = function handleClientStateChange(newState) {\n if (_helmetCallback) {\n cancelAnimationFrame(_helmetCallback);\n }\n\n if (newState.defer) {\n _helmetCallback = requestAnimationFrame(function () {\n commitTagChanges(newState, function () {\n _helmetCallback = null;\n });\n });\n } else {\n commitTagChanges(newState);\n _helmetCallback = null;\n }\n};\n\nvar commitTagChanges = function commitTagChanges(newState, cb) {\n var baseTag = newState.baseTag,\n bodyAttributes = newState.bodyAttributes,\n htmlAttributes = newState.htmlAttributes,\n linkTags = newState.linkTags,\n metaTags = newState.metaTags,\n noscriptTags = newState.noscriptTags,\n onChangeClientState = newState.onChangeClientState,\n scriptTags = newState.scriptTags,\n styleTags = newState.styleTags,\n title = newState.title,\n titleAttributes = newState.titleAttributes;\n updateAttributes(TAG_NAMES.BODY, bodyAttributes);\n updateAttributes(TAG_NAMES.HTML, htmlAttributes);\n updateTitle(title, titleAttributes);\n var tagUpdates = {\n baseTag: updateTags(TAG_NAMES.BASE, baseTag),\n linkTags: updateTags(TAG_NAMES.LINK, linkTags),\n metaTags: updateTags(TAG_NAMES.META, metaTags),\n noscriptTags: updateTags(TAG_NAMES.NOSCRIPT, noscriptTags),\n scriptTags: updateTags(TAG_NAMES.SCRIPT, scriptTags),\n styleTags: updateTags(TAG_NAMES.STYLE, styleTags)\n };\n var addedTags = {};\n var removedTags = {};\n Object.keys(tagUpdates).forEach(function (tagType) {\n var _tagUpdates$tagType = tagUpdates[tagType],\n newTags = _tagUpdates$tagType.newTags,\n oldTags = _tagUpdates$tagType.oldTags;\n\n if (newTags.length) {\n addedTags[tagType] = newTags;\n }\n\n if (oldTags.length) {\n removedTags[tagType] = tagUpdates[tagType].oldTags;\n }\n });\n cb && cb();\n onChangeClientState(newState, addedTags, removedTags);\n};\n\nvar flattenArray = function flattenArray(possibleArray) {\n return Array.isArray(possibleArray) ? possibleArray.join(\"\") : possibleArray;\n};\n\nvar updateTitle = function updateTitle(title, attributes) {\n if (typeof title !== \"undefined\" && document.title !== title) {\n document.title = flattenArray(title);\n }\n\n updateAttributes(TAG_NAMES.TITLE, attributes);\n};\n\nvar updateAttributes = function updateAttributes(tagName, attributes) {\n var elementTag = document.getElementsByTagName(tagName)[0];\n\n if (!elementTag) {\n return;\n }\n\n var helmetAttributeString = elementTag.getAttribute(HELMET_ATTRIBUTE);\n var helmetAttributes = helmetAttributeString ? helmetAttributeString.split(\",\") : [];\n var attributesToRemove = [].concat(helmetAttributes);\n var attributeKeys = Object.keys(attributes);\n\n for (var i = 0; i < attributeKeys.length; i++) {\n var attribute = attributeKeys[i];\n var value = attributes[attribute] || \"\";\n\n if (elementTag.getAttribute(attribute) !== value) {\n elementTag.setAttribute(attribute, value);\n }\n\n if (helmetAttributes.indexOf(attribute) === -1) {\n helmetAttributes.push(attribute);\n }\n\n var indexToSave = attributesToRemove.indexOf(attribute);\n\n if (indexToSave !== -1) {\n attributesToRemove.splice(indexToSave, 1);\n }\n }\n\n for (var _i = attributesToRemove.length - 1; _i >= 0; _i--) {\n elementTag.removeAttribute(attributesToRemove[_i]);\n }\n\n if (helmetAttributes.length === attributesToRemove.length) {\n elementTag.removeAttribute(HELMET_ATTRIBUTE);\n } else if (elementTag.getAttribute(HELMET_ATTRIBUTE) !== attributeKeys.join(\",\")) {\n elementTag.setAttribute(HELMET_ATTRIBUTE, attributeKeys.join(\",\"));\n }\n};\n\nvar updateTags = function updateTags(type, tags) {\n var headElement = document.head || document.querySelector(TAG_NAMES.HEAD);\n var tagNodes = headElement.querySelectorAll(type + \"[\" + HELMET_ATTRIBUTE + \"]\");\n var oldTags = Array.prototype.slice.call(tagNodes);\n var newTags = [];\n var indexToDelete = void 0;\n\n if (tags && tags.length) {\n tags.forEach(function (tag) {\n var newElement = document.createElement(type);\n\n for (var attribute in tag) {\n if (tag.hasOwnProperty(attribute)) {\n if (attribute === TAG_PROPERTIES.INNER_HTML) {\n newElement.innerHTML = tag.innerHTML;\n } else if (attribute === TAG_PROPERTIES.CSS_TEXT) {\n if (newElement.styleSheet) {\n newElement.styleSheet.cssText = tag.cssText;\n } else {\n newElement.appendChild(document.createTextNode(tag.cssText));\n }\n } else {\n var value = typeof tag[attribute] === \"undefined\" ? \"\" : tag[attribute];\n newElement.setAttribute(attribute, value);\n }\n }\n }\n\n newElement.setAttribute(HELMET_ATTRIBUTE, \"true\"); // Remove a duplicate tag from domTagstoRemove, so it isn't cleared.\n\n if (oldTags.some(function (existingTag, index) {\n indexToDelete = index;\n return newElement.isEqualNode(existingTag);\n })) {\n oldTags.splice(indexToDelete, 1);\n } else {\n newTags.push(newElement);\n }\n });\n }\n\n oldTags.forEach(function (tag) {\n return tag.parentNode.removeChild(tag);\n });\n newTags.forEach(function (tag) {\n return headElement.appendChild(tag);\n });\n return {\n oldTags: oldTags,\n newTags: newTags\n };\n};\n\nvar generateElementAttributesAsString = function generateElementAttributesAsString(attributes) {\n return Object.keys(attributes).reduce(function (str, key) {\n var attr = typeof attributes[key] !== \"undefined\" ? key + \"=\\\"\" + attributes[key] + \"\\\"\" : \"\" + key;\n return str ? str + \" \" + attr : attr;\n }, \"\");\n};\n\nvar generateTitleAsString = function generateTitleAsString(type, title, attributes, encode) {\n var attributeString = generateElementAttributesAsString(attributes);\n var flattenedTitle = flattenArray(title);\n return attributeString ? \"<\" + type + \" \" + HELMET_ATTRIBUTE + \"=\\\"true\\\" \" + attributeString + \">\" + encodeSpecialCharacters(flattenedTitle, encode) + \"\" : \"<\" + type + \" \" + HELMET_ATTRIBUTE + \"=\\\"true\\\">\" + encodeSpecialCharacters(flattenedTitle, encode) + \"\";\n};\n\nvar generateTagsAsString = function generateTagsAsString(type, tags, encode) {\n return tags.reduce(function (str, tag) {\n var attributeHtml = Object.keys(tag).filter(function (attribute) {\n return !(attribute === TAG_PROPERTIES.INNER_HTML || attribute === TAG_PROPERTIES.CSS_TEXT);\n }).reduce(function (string, attribute) {\n var attr = typeof tag[attribute] === \"undefined\" ? attribute : attribute + \"=\\\"\" + encodeSpecialCharacters(tag[attribute], encode) + \"\\\"\";\n return string ? string + \" \" + attr : attr;\n }, \"\");\n var tagContent = tag.innerHTML || tag.cssText || \"\";\n var isSelfClosing = SELF_CLOSING_TAGS.indexOf(type) === -1;\n return str + \"<\" + type + \" \" + HELMET_ATTRIBUTE + \"=\\\"true\\\" \" + attributeHtml + (isSelfClosing ? \"/>\" : \">\" + tagContent + \"\");\n }, \"\");\n};\n\nvar convertElementAttributestoReactProps = function convertElementAttributestoReactProps(attributes) {\n var initProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n return Object.keys(attributes).reduce(function (obj, key) {\n obj[REACT_TAG_MAP[key] || key] = attributes[key];\n return obj;\n }, initProps);\n};\n\nvar convertReactPropstoHtmlAttributes = function convertReactPropstoHtmlAttributes(props) {\n var initAttributes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n return Object.keys(props).reduce(function (obj, key) {\n obj[HTML_TAG_MAP[key] || key] = props[key];\n return obj;\n }, initAttributes);\n};\n\nvar generateTitleAsReactComponent = function generateTitleAsReactComponent(type, title, attributes) {\n var _initProps; // assigning into an array to define toString function on it\n\n\n var initProps = (_initProps = {\n key: title\n }, _initProps[HELMET_ATTRIBUTE] = true, _initProps);\n var props = convertElementAttributestoReactProps(attributes, initProps);\n return [React.createElement(TAG_NAMES.TITLE, props, title)];\n};\n\nvar generateTagsAsReactComponent = function generateTagsAsReactComponent(type, tags) {\n return tags.map(function (tag, i) {\n var _mappedTag;\n\n var mappedTag = (_mappedTag = {\n key: i\n }, _mappedTag[HELMET_ATTRIBUTE] = true, _mappedTag);\n Object.keys(tag).forEach(function (attribute) {\n var mappedAttribute = REACT_TAG_MAP[attribute] || attribute;\n\n if (mappedAttribute === TAG_PROPERTIES.INNER_HTML || mappedAttribute === TAG_PROPERTIES.CSS_TEXT) {\n var content = tag.innerHTML || tag.cssText;\n mappedTag.dangerouslySetInnerHTML = {\n __html: content\n };\n } else {\n mappedTag[mappedAttribute] = tag[attribute];\n }\n });\n return React.createElement(type, mappedTag);\n });\n};\n\nvar getMethodsForTag = function getMethodsForTag(type, tags, encode) {\n switch (type) {\n case TAG_NAMES.TITLE:\n return {\n toComponent: function toComponent() {\n return generateTitleAsReactComponent(type, tags.title, tags.titleAttributes, encode);\n },\n toString: function toString() {\n return generateTitleAsString(type, tags.title, tags.titleAttributes, encode);\n }\n };\n\n case ATTRIBUTE_NAMES.BODY:\n case ATTRIBUTE_NAMES.HTML:\n return {\n toComponent: function toComponent() {\n return convertElementAttributestoReactProps(tags);\n },\n toString: function toString() {\n return generateElementAttributesAsString(tags);\n }\n };\n\n default:\n return {\n toComponent: function toComponent() {\n return generateTagsAsReactComponent(type, tags);\n },\n toString: function toString() {\n return generateTagsAsString(type, tags, encode);\n }\n };\n }\n};\n\nvar mapStateOnServer = function mapStateOnServer(_ref) {\n var baseTag = _ref.baseTag,\n bodyAttributes = _ref.bodyAttributes,\n encode = _ref.encode,\n htmlAttributes = _ref.htmlAttributes,\n linkTags = _ref.linkTags,\n metaTags = _ref.metaTags,\n noscriptTags = _ref.noscriptTags,\n scriptTags = _ref.scriptTags,\n styleTags = _ref.styleTags,\n _ref$title = _ref.title,\n title = _ref$title === undefined ? \"\" : _ref$title,\n titleAttributes = _ref.titleAttributes;\n return {\n base: getMethodsForTag(TAG_NAMES.BASE, baseTag, encode),\n bodyAttributes: getMethodsForTag(ATTRIBUTE_NAMES.BODY, bodyAttributes, encode),\n htmlAttributes: getMethodsForTag(ATTRIBUTE_NAMES.HTML, htmlAttributes, encode),\n link: getMethodsForTag(TAG_NAMES.LINK, linkTags, encode),\n meta: getMethodsForTag(TAG_NAMES.META, metaTags, encode),\n noscript: getMethodsForTag(TAG_NAMES.NOSCRIPT, noscriptTags, encode),\n script: getMethodsForTag(TAG_NAMES.SCRIPT, scriptTags, encode),\n style: getMethodsForTag(TAG_NAMES.STYLE, styleTags, encode),\n title: getMethodsForTag(TAG_NAMES.TITLE, {\n title: title,\n titleAttributes: titleAttributes\n }, encode)\n };\n};\n\nvar Helmet = function Helmet(Component) {\n var _class, _temp;\n\n return _temp = _class = function (_React$Component) {\n inherits(HelmetWrapper, _React$Component);\n\n function HelmetWrapper() {\n classCallCheck(this, HelmetWrapper);\n return possibleConstructorReturn(this, _React$Component.apply(this, arguments));\n }\n\n HelmetWrapper.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {\n return !isEqual(this.props, nextProps);\n };\n\n HelmetWrapper.prototype.mapNestedChildrenToProps = function mapNestedChildrenToProps(child, nestedChildren) {\n if (!nestedChildren) {\n return null;\n }\n\n switch (child.type) {\n case TAG_NAMES.SCRIPT:\n case TAG_NAMES.NOSCRIPT:\n return {\n innerHTML: nestedChildren\n };\n\n case TAG_NAMES.STYLE:\n return {\n cssText: nestedChildren\n };\n }\n\n throw new Error(\"<\" + child.type + \" /> elements are self-closing and can not contain children. Refer to our API for more information.\");\n };\n\n HelmetWrapper.prototype.flattenArrayTypeChildren = function flattenArrayTypeChildren(_ref) {\n var _babelHelpers$extends;\n\n var child = _ref.child,\n arrayTypeChildren = _ref.arrayTypeChildren,\n newChildProps = _ref.newChildProps,\n nestedChildren = _ref.nestedChildren;\n return _extends({}, arrayTypeChildren, (_babelHelpers$extends = {}, _babelHelpers$extends[child.type] = [].concat(arrayTypeChildren[child.type] || [], [_extends({}, newChildProps, this.mapNestedChildrenToProps(child, nestedChildren))]), _babelHelpers$extends));\n };\n\n HelmetWrapper.prototype.mapObjectTypeChildren = function mapObjectTypeChildren(_ref2) {\n var _babelHelpers$extends2, _babelHelpers$extends3;\n\n var child = _ref2.child,\n newProps = _ref2.newProps,\n newChildProps = _ref2.newChildProps,\n nestedChildren = _ref2.nestedChildren;\n\n switch (child.type) {\n case TAG_NAMES.TITLE:\n return _extends({}, newProps, (_babelHelpers$extends2 = {}, _babelHelpers$extends2[child.type] = nestedChildren, _babelHelpers$extends2.titleAttributes = _extends({}, newChildProps), _babelHelpers$extends2));\n\n case TAG_NAMES.BODY:\n return _extends({}, newProps, {\n bodyAttributes: _extends({}, newChildProps)\n });\n\n case TAG_NAMES.HTML:\n return _extends({}, newProps, {\n htmlAttributes: _extends({}, newChildProps)\n });\n }\n\n return _extends({}, newProps, (_babelHelpers$extends3 = {}, _babelHelpers$extends3[child.type] = _extends({}, newChildProps), _babelHelpers$extends3));\n };\n\n HelmetWrapper.prototype.mapArrayTypeChildrenToProps = function mapArrayTypeChildrenToProps(arrayTypeChildren, newProps) {\n var newFlattenedProps = _extends({}, newProps);\n\n Object.keys(arrayTypeChildren).forEach(function (arrayChildName) {\n var _babelHelpers$extends4;\n\n newFlattenedProps = _extends({}, newFlattenedProps, (_babelHelpers$extends4 = {}, _babelHelpers$extends4[arrayChildName] = arrayTypeChildren[arrayChildName], _babelHelpers$extends4));\n });\n return newFlattenedProps;\n };\n\n HelmetWrapper.prototype.warnOnInvalidChildren = function warnOnInvalidChildren(child, nestedChildren) {\n if (process.env.NODE_ENV !== \"production\") {\n if (!VALID_TAG_NAMES.some(function (name) {\n return child.type === name;\n })) {\n if (typeof child.type === \"function\") {\n return warn(\"You may be attempting to nest components within each other, which is not allowed. Refer to our API for more information.\");\n }\n\n return warn(\"Only elements types \" + VALID_TAG_NAMES.join(\", \") + \" are allowed. Helmet does not support rendering <\" + child.type + \"> elements. Refer to our API for more information.\");\n }\n\n if (nestedChildren && typeof nestedChildren !== \"string\" && (!Array.isArray(nestedChildren) || nestedChildren.some(function (nestedChild) {\n return typeof nestedChild !== \"string\";\n }))) {\n throw new Error(\"Helmet expects a string as a child of <\" + child.type + \">. Did you forget to wrap your children in braces? ( <\" + child.type + \">{``} ) Refer to our API for more information.\");\n }\n }\n\n return true;\n };\n\n HelmetWrapper.prototype.mapChildrenToProps = function mapChildrenToProps(children, newProps) {\n var _this2 = this;\n\n var arrayTypeChildren = {};\n React.Children.forEach(children, function (child) {\n if (!child || !child.props) {\n return;\n }\n\n var _child$props = child.props,\n nestedChildren = _child$props.children,\n childProps = objectWithoutProperties(_child$props, [\"children\"]);\n var newChildProps = convertReactPropstoHtmlAttributes(childProps);\n\n _this2.warnOnInvalidChildren(child, nestedChildren);\n\n switch (child.type) {\n case TAG_NAMES.LINK:\n case TAG_NAMES.META:\n case TAG_NAMES.NOSCRIPT:\n case TAG_NAMES.SCRIPT:\n case TAG_NAMES.STYLE:\n arrayTypeChildren = _this2.flattenArrayTypeChildren({\n child: child,\n arrayTypeChildren: arrayTypeChildren,\n newChildProps: newChildProps,\n nestedChildren: nestedChildren\n });\n break;\n\n default:\n newProps = _this2.mapObjectTypeChildren({\n child: child,\n newProps: newProps,\n newChildProps: newChildProps,\n nestedChildren: nestedChildren\n });\n break;\n }\n });\n newProps = this.mapArrayTypeChildrenToProps(arrayTypeChildren, newProps);\n return newProps;\n };\n\n HelmetWrapper.prototype.render = function render() {\n var _props = this.props,\n children = _props.children,\n props = objectWithoutProperties(_props, [\"children\"]);\n\n var newProps = _extends({}, props);\n\n if (children) {\n newProps = this.mapChildrenToProps(children, newProps);\n }\n\n return React.createElement(Component, newProps);\n };\n\n createClass(HelmetWrapper, null, [{\n key: \"canUseDOM\",\n // Component.peek comes from react-side-effect:\n // For testing, you may use a static peek() method available on the returned component.\n // It lets you get the current state without resetting the mounted instance stack.\n // Don’t use it for anything other than testing.\n\n /**\n * @param {Object} base: {\"target\": \"_blank\", \"href\": \"http://mysite.com/\"}\n * @param {Object} bodyAttributes: {\"className\": \"root\"}\n * @param {String} defaultTitle: \"Default Title\"\n * @param {Boolean} defer: true\n * @param {Boolean} encodeSpecialCharacters: true\n * @param {Object} htmlAttributes: {\"lang\": \"en\", \"amp\": undefined}\n * @param {Array} link: [{\"rel\": \"canonical\", \"href\": \"http://mysite.com/example\"}]\n * @param {Array} meta: [{\"name\": \"description\", \"content\": \"Test description\"}]\n * @param {Array} noscript: [{\"innerHTML\": \"
console.log(newState)\"\n * @param {Array} script: [{\"type\": \"text/javascript\", \"src\": \"http://mysite.com/js/test.js\"}]\n * @param {Array} style: [{\"type\": \"text/css\", \"cssText\": \"div { display: block; color: blue; }\"}]\n * @param {String} title: \"Title\"\n * @param {Object} titleAttributes: {\"itemprop\": \"name\"}\n * @param {String} titleTemplate: \"MySite.com - %s\"\n */\n set: function set$$1(canUseDOM) {\n Component.canUseDOM = canUseDOM;\n }\n }]);\n return HelmetWrapper;\n }(React.Component), _class.propTypes = {\n base: PropTypes.object,\n bodyAttributes: PropTypes.object,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n defaultTitle: PropTypes.string,\n defer: PropTypes.bool,\n encodeSpecialCharacters: PropTypes.bool,\n htmlAttributes: PropTypes.object,\n link: PropTypes.arrayOf(PropTypes.object),\n meta: PropTypes.arrayOf(PropTypes.object),\n noscript: PropTypes.arrayOf(PropTypes.object),\n onChangeClientState: PropTypes.func,\n script: PropTypes.arrayOf(PropTypes.object),\n style: PropTypes.arrayOf(PropTypes.object),\n title: PropTypes.string,\n titleAttributes: PropTypes.object,\n titleTemplate: PropTypes.string\n }, _class.defaultProps = {\n defer: true,\n encodeSpecialCharacters: true\n }, _class.peek = Component.peek, _class.rewind = function () {\n var mappedState = Component.rewind();\n\n if (!mappedState) {\n // provide fallback if mappedState is undefined\n mappedState = mapStateOnServer({\n baseTag: [],\n bodyAttributes: {},\n encodeSpecialCharacters: true,\n htmlAttributes: {},\n linkTags: [],\n metaTags: [],\n noscriptTags: [],\n scriptTags: [],\n styleTags: [],\n title: \"\",\n titleAttributes: {}\n });\n }\n\n return mappedState;\n }, _temp;\n};\n\nvar NullComponent = function NullComponent() {\n return null;\n};\n\nvar HelmetSideEffects = withSideEffect(reducePropsToState, handleClientStateChange, mapStateOnServer)(NullComponent);\nvar HelmetExport = Helmet(HelmetSideEffects);\nHelmetExport.renderStatic = HelmetExport.rewind;\nexport default HelmetExport;\nexport { HelmetExport as Helmet };","import {createGlobalStyle} from \"styled-components\";\nimport {fonts} from \"../models\";\n\nimport \"../../static/fonts.css\";\n\nconst GlobalStyle = createGlobalStyle`\nbody {\n font-family: ${fonts.headerFont};\n padding: 0;\n margin: 0;\n\n /* OpenType features: kerning, ligatures & contextual alternates */\n font-kerning: normal; /* CSS3 */\n -webkit-font-feature-settings: \"kern\" 1, \"liga\" 1, \"calt\" 1;\n -moz-font-feature-settings: \"kern=1\", \"liga=1\", \"calt=1\";\t/* Firefox 4.0 to 14.0 */\n -moz-font-feature-settings: \"kern\" 1, \"liga\" 1, \"calt\" 1;\t/* Firefox 15.0 onwards */\n font-feature-settings: \"kern\" 1, \"liga\" 1, \"calt\" 1;\n\n /* Make rendering look more consistent across platforms */\n -webkit-font-smoothing: antialiased !important;\n -moz-osx-font-smoothing: grayscale;\n}\na {\n text-decoration: none;\n}\nul {\n margin: 0 auto;\n list-style-type: none;\n}\n\nbody.overflow-y-hidden {\n overflow-y: hidden;\n}\n`;\n\nexport default GlobalStyle;\n","/**\n * SEO component that queries for data with\n * Gatsby's useStaticQuery React hook\n *\n * See: https://www.gatsbyjs.org/docs/use-static-query/\n */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport Helmet from \"react-helmet\";\nimport { useStaticQuery, graphql } from \"gatsby\";\n\nfunction SEO({ description, lang, meta, title }) {\n const { site } = useStaticQuery(\n graphql`\n query {\n site {\n siteMetadata {\n title\n description\n author\n }\n }\n }\n `\n );\n\n const metaDescription = description || site.siteMetadata.description;\n\n return (\n {\n value: T;\n label: string;\n}\n\ninterface NativeSelectProps {\n options: [Option];\n value?: T;\n onChange: (value: T) => void;\n selectedOption: any;\n isBold?: boolean;\n}\n\nfunction NativeSelect(props: NativeSelectProps) {\n function handleOnChange(e: React.FormEvent) {\n const {selectedIndex} = e.currentTarget;\n const selectedOption = props.options[selectedIndex];\n props.onChange(selectedOption.value);\n }\n return (\n \n );\n}\n\nexport default NativeSelect;\n","/*\n\nBased off glamor's StyleSheet, thanks Sunil ❤️\n\nhigh performance StyleSheet for css-in-js systems\n\n- uses multiple style tags behind the scenes for millions of rules\n- uses `insertRule` for appending in production for *much* faster performance\n\n// usage\n\nimport { StyleSheet } from '@emotion/sheet'\n\nlet styleSheet = new StyleSheet({ key: '', container: document.head })\n\nstyleSheet.insert('#box { border: 1px solid red; }')\n- appends a css rule into the stylesheet\n\nstyleSheet.flush()\n- empties the stylesheet of all its contents\n\n*/\n// $FlowFixMe\nfunction sheetForTag(tag) {\n if (tag.sheet) {\n // $FlowFixMe\n return tag.sheet;\n } // this weirdness brought to you by firefox\n\n /* istanbul ignore next */\n\n\n for (var i = 0; i < document.styleSheets.length; i++) {\n if (document.styleSheets[i].ownerNode === tag) {\n // $FlowFixMe\n return document.styleSheets[i];\n }\n }\n}\n\nfunction createStyleElement(options) {\n var tag = document.createElement('style');\n tag.setAttribute('data-emotion', options.key);\n\n if (options.nonce !== undefined) {\n tag.setAttribute('nonce', options.nonce);\n }\n\n tag.appendChild(document.createTextNode(''));\n tag.setAttribute('data-s', '');\n return tag;\n}\n\nvar StyleSheet = /*#__PURE__*/function () {\n function StyleSheet(options) {\n var _this = this;\n\n this._insertTag = function (tag) {\n var before;\n\n if (_this.tags.length === 0) {\n before = _this.prepend ? _this.container.firstChild : _this.before;\n } else {\n before = _this.tags[_this.tags.length - 1].nextSibling;\n }\n\n _this.container.insertBefore(tag, before);\n\n _this.tags.push(tag);\n };\n\n this.isSpeedy = options.speedy === undefined ? process.env.NODE_ENV === 'production' : options.speedy;\n this.tags = [];\n this.ctr = 0;\n this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets\n\n this.key = options.key;\n this.container = options.container;\n this.prepend = options.prepend;\n this.before = null;\n }\n\n var _proto = StyleSheet.prototype;\n\n _proto.hydrate = function hydrate(nodes) {\n nodes.forEach(this._insertTag);\n };\n\n _proto.insert = function insert(rule) {\n // the max length is how many rules we have per style tag, it's 65000 in speedy mode\n // it's 1 in dev because we insert source maps that map a single rule to a location\n // and you can only have one source map per style tag\n if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {\n this._insertTag(createStyleElement(this));\n }\n\n var tag = this.tags[this.tags.length - 1];\n\n if (process.env.NODE_ENV !== 'production') {\n var isImportRule = rule.charCodeAt(0) === 64 && rule.charCodeAt(1) === 105;\n\n if (isImportRule && this._alreadyInsertedOrderInsensitiveRule) {\n // this would only cause problem in speedy mode\n // but we don't want enabling speedy to affect the observable behavior\n // so we report this error at all times\n console.error(\"You're attempting to insert the following rule:\\n\" + rule + '\\n\\n`@import` rules must be before all other types of rules in a stylesheet but other rules have already been inserted. Please ensure that `@import` rules are before all other rules.');\n }\n\n this._alreadyInsertedOrderInsensitiveRule = this._alreadyInsertedOrderInsensitiveRule || !isImportRule;\n }\n\n if (this.isSpeedy) {\n var sheet = sheetForTag(tag);\n\n try {\n // this is the ultrafast version, works across browsers\n // the big drawback is that the css won't be editable in devtools\n sheet.insertRule(rule, sheet.cssRules.length);\n } catch (e) {\n if (process.env.NODE_ENV !== 'production' && !/:(-moz-placeholder|-moz-focus-inner|-moz-focusring|-ms-input-placeholder|-moz-read-write|-moz-read-only|-ms-clear){/.test(rule)) {\n console.error(\"There was a problem inserting the following rule: \\\"\" + rule + \"\\\"\", e);\n }\n }\n } else {\n tag.appendChild(document.createTextNode(rule));\n }\n\n this.ctr++;\n };\n\n _proto.flush = function flush() {\n // $FlowFixMe\n this.tags.forEach(function (tag) {\n return tag.parentNode.removeChild(tag);\n });\n this.tags = [];\n this.ctr = 0;\n\n if (process.env.NODE_ENV !== 'production') {\n this._alreadyInsertedOrderInsensitiveRule = false;\n }\n };\n\n return StyleSheet;\n}();\n\nexport { StyleSheet };","/**\n * @param {number}\n * @return {number}\n */\nexport var abs = Math.abs;\n/**\n * @param {number}\n * @return {string}\n */\n\nexport var from = String.fromCharCode;\n/**\n * @param {string} value\n * @param {number} length\n * @return {number}\n */\n\nexport function hash(value, length) {\n return (((length << 2 ^ charat(value, 0)) << 2 ^ charat(value, 1)) << 2 ^ charat(value, 2)) << 2 ^ charat(value, 3);\n}\n/**\n * @param {string} value\n * @return {string}\n */\n\nexport function trim(value) {\n return value.trim();\n}\n/**\n * @param {string} value\n * @param {RegExp} pattern\n * @return {string?}\n */\n\nexport function match(value, pattern) {\n return (value = pattern.exec(value)) ? value[0] : value;\n}\n/**\n * @param {string} value\n * @param {(string|RegExp)} pattern\n * @param {string} replacement\n * @return {string}\n */\n\nexport function replace(value, pattern, replacement) {\n return value.replace(pattern, replacement);\n}\n/**\n * @param {string} value\n * @param {string} value\n * @return {number}\n */\n\nexport function indexof(value, search) {\n return value.indexOf(search);\n}\n/**\n * @param {string} value\n * @param {number} index\n * @return {number}\n */\n\nexport function charat(value, index) {\n return value.charCodeAt(index) | 0;\n}\n/**\n * @param {string} value\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\n\nexport function substr(value, begin, end) {\n return value.slice(begin, end);\n}\n/**\n * @param {string} value\n * @return {number}\n */\n\nexport function strlen(value) {\n return value.length;\n}\n/**\n * @param {any[]} value\n * @return {number}\n */\n\nexport function sizeof(value) {\n return value.length;\n}\n/**\n * @param {any} value\n * @param {any[]} array\n * @return {any}\n */\n\nexport function append(value, array) {\n return array.push(value), value;\n}\n/**\n * @param {string[]} array\n * @param {function} callback\n * @return {string}\n */\n\nexport function combine(array, callback) {\n return array.map(callback).join('');\n}","import { from, trim, charat, strlen, substr, append } from './Utility.js';\nexport var line = 1;\nexport var column = 1;\nexport var length = 0;\nexport var position = 0;\nexport var character = 0;\nexport var characters = '';\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {string} type\n * @param {string[]} props\n * @param {object[]} children\n * @param {number} length\n */\n\nexport function node(value, root, parent, type, props, children, length) {\n return {\n value: value,\n root: root,\n parent: parent,\n type: type,\n props: props,\n children: children,\n line: line,\n column: column,\n length: length,\n return: ''\n };\n}\n/**\n * @param {string} value\n * @param {object} root\n * @param {string} type\n */\n\nexport function copy(value, root, type) {\n return node(value, root.root, root.parent, type, root.props, root.children, 0);\n}\n/**\n * @return {number}\n */\n\nexport function char() {\n return character;\n}\n/**\n * @return {number}\n */\n\nexport function prev() {\n character = position > 0 ? charat(characters, --position) : 0;\n if (column--, character === 10) column = 1, line--;\n return character;\n}\n/**\n * @return {number}\n */\n\nexport function next() {\n character = position < length ? charat(characters, position++) : 0;\n if (column++, character === 10) column = 1, line++;\n return character;\n}\n/**\n * @return {number}\n */\n\nexport function peek() {\n return charat(characters, position);\n}\n/**\n * @return {number}\n */\n\nexport function caret() {\n return position;\n}\n/**\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\n\nexport function slice(begin, end) {\n return substr(characters, begin, end);\n}\n/**\n * @param {number} type\n * @return {number}\n */\n\nexport function token(type) {\n switch (type) {\n // \\0 \\t \\n \\r \\s whitespace token\n case 0:\n case 9:\n case 10:\n case 13:\n case 32:\n return 5;\n // ! + , / > @ ~ isolate token\n\n case 33:\n case 43:\n case 44:\n case 47:\n case 62:\n case 64:\n case 126: // ; { } breakpoint token\n\n case 59:\n case 123:\n case 125:\n return 4;\n // : accompanied token\n\n case 58:\n return 3;\n // \" ' ( [ opening delimit token\n\n case 34:\n case 39:\n case 40:\n case 91:\n return 2;\n // ) ] closing delimit token\n\n case 41:\n case 93:\n return 1;\n }\n\n return 0;\n}\n/**\n * @param {string} value\n * @return {any[]}\n */\n\nexport function alloc(value) {\n return line = column = 1, length = strlen(characters = value), position = 0, [];\n}\n/**\n * @param {any} value\n * @return {any}\n */\n\nexport function dealloc(value) {\n return characters = '', value;\n}\n/**\n * @param {number} type\n * @return {string}\n */\n\nexport function delimit(type) {\n return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)));\n}\n/**\n * @param {string} value\n * @return {string[]}\n */\n\nexport function tokenize(value) {\n return dealloc(tokenizer(alloc(value)));\n}\n/**\n * @param {number} type\n * @return {string}\n */\n\nexport function whitespace(type) {\n while (character = peek()) {\n if (character < 33) next();else break;\n }\n\n return token(type) > 2 || token(character) > 3 ? '' : ' ';\n}\n/**\n * @param {string[]} children\n * @return {string[]}\n */\n\nexport function tokenizer(children) {\n while (next()) {\n switch (token(character)) {\n case 0:\n append(identifier(position - 1), children);\n break;\n\n case 2:\n append(delimit(character), children);\n break;\n\n default:\n append(from(character), children);\n }\n }\n\n return children;\n}\n/**\n * @param {number} index\n * @param {number} count\n * @return {string}\n */\n\nexport function escaping(index, count) {\n while (--count && next()) {\n // not 0-9 A-F a-f\n if (character < 48 || character > 102 || character > 57 && character < 65 || character > 70 && character < 97) break;\n }\n\n return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32));\n}\n/**\n * @param {number} type\n * @return {number}\n */\n\nexport function delimiter(type) {\n while (next()) {\n switch (character) {\n // ] ) \" '\n case type:\n return position;\n // \" '\n\n case 34:\n case 39:\n return delimiter(type === 34 || type === 39 ? type : character);\n // (\n\n case 40:\n if (type === 41) delimiter(type);\n break;\n // \\\n\n case 92:\n next();\n break;\n }\n }\n\n return position;\n}\n/**\n * @param {number} type\n * @param {number} index\n * @return {number}\n */\n\nexport function commenter(type, index) {\n while (next()) {\n // //\n if (type + character === 47 + 10) break; // /*\n else if (type + character === 42 + 42 && peek() === 47) break;\n }\n\n return '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next());\n}\n/**\n * @param {number} index\n * @return {string}\n */\n\nexport function identifier(index) {\n while (!token(peek())) {\n next();\n }\n\n return slice(index, position);\n}","export var MS = '-ms-';\nexport var MOZ = '-moz-';\nexport var WEBKIT = '-webkit-';\nexport var COMMENT = 'comm';\nexport var RULESET = 'rule';\nexport var DECLARATION = 'decl';\nexport var PAGE = '@page';\nexport var MEDIA = '@media';\nexport var IMPORT = '@import';\nexport var CHARSET = '@charset';\nexport var VIEWPORT = '@viewport';\nexport var SUPPORTS = '@supports';\nexport var DOCUMENT = '@document';\nexport var NAMESPACE = '@namespace';\nexport var KEYFRAMES = '@keyframes';\nexport var FONT_FACE = '@font-face';\nexport var COUNTER_STYLE = '@counter-style';\nexport var FONT_FEATURE_VALUES = '@font-feature-values';","import { IMPORT, COMMENT, RULESET, DECLARATION } from './Enum.js';\nimport { strlen, sizeof } from './Utility.js';\n/**\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\n\nexport function serialize(children, callback) {\n var output = '';\n var length = sizeof(children);\n\n for (var i = 0; i < length; i++) {\n output += callback(children[i], i, children, callback) || '';\n }\n\n return output;\n}\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\n\nexport function stringify(element, index, children, callback) {\n switch (element.type) {\n case IMPORT:\n case DECLARATION:\n return element.return = element.return || element.value;\n\n case COMMENT:\n return '';\n\n case RULESET:\n element.value = element.props.join(',');\n }\n\n return strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : '';\n}","import { MS, MOZ, WEBKIT } from './Enum.js';\nimport { hash, charat, strlen, indexof, replace } from './Utility.js';\n/**\n * @param {string} value\n * @param {number} length\n * @return {string}\n */\n\nexport function prefix(value, length) {\n switch (hash(value, length)) {\n // color-adjust\n case 5103:\n return WEBKIT + 'print-' + value + value;\n // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)\n\n case 5737:\n case 4201:\n case 3177:\n case 3433:\n case 1641:\n case 4457:\n case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break\n\n case 5572:\n case 6356:\n case 5844:\n case 3191:\n case 6645:\n case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,\n\n case 6391:\n case 5879:\n case 5623:\n case 6135:\n case 4599:\n case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)\n\n case 4215:\n case 6389:\n case 5109:\n case 5365:\n case 5621:\n case 3829:\n return WEBKIT + value + value;\n // appearance, user-select, transform, hyphens, text-size-adjust\n\n case 5349:\n case 4246:\n case 4810:\n case 6968:\n case 2756:\n return WEBKIT + value + MOZ + value + MS + value + value;\n // flex, flex-direction\n\n case 6828:\n case 4268:\n return WEBKIT + value + MS + value + value;\n // order\n\n case 6165:\n return WEBKIT + value + MS + 'flex-' + value + value;\n // align-items\n\n case 5187:\n return WEBKIT + value + replace(value, /(\\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value;\n // align-self\n\n case 5443:\n return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/, '') + value;\n // align-content\n\n case 4675:\n return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/, '') + value;\n // flex-shrink\n\n case 5548:\n return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value;\n // flex-basis\n\n case 5292:\n return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value;\n // flex-grow\n\n case 6060:\n return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value;\n // transition\n\n case 4554:\n return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value;\n // cursor\n\n case 6187:\n return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value;\n // background, background-image\n\n case 5495:\n case 3959:\n return replace(value, /(image-set\\([^]*)/, WEBKIT + '$1' + '$`$1');\n // justify-content\n\n case 4968:\n return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value;\n // (margin|padding)-inline-(start|end)\n\n case 4095:\n case 3583:\n case 4068:\n case 2532:\n return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value;\n // (min|max)?(width|height|inline-size|block-size)\n\n case 8116:\n case 7059:\n case 5753:\n case 5535:\n case 5445:\n case 5701:\n case 4933:\n case 4677:\n case 5533:\n case 5789:\n case 5021:\n case 4765:\n // stretch, max-content, min-content, fill-available\n if (strlen(value) - 1 - length > 6) switch (charat(value, length + 1)) {\n // (m)ax-content, (m)in-content\n case 109:\n // -\n if (charat(value, length + 4) !== 45) break;\n // (f)ill-available, (f)it-content\n\n case 102:\n return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;\n // (s)tretch\n\n case 115:\n return ~indexof(value, 'stretch') ? prefix(replace(value, 'stretch', 'fill-available'), length) + value : value;\n }\n break;\n // position: sticky\n\n case 4949:\n // (s)ticky?\n if (charat(value, length + 1) !== 115) break;\n // display: (flex|inline-flex)\n\n case 6444:\n switch (charat(value, strlen(value) - 3 - (~indexof(value, '!important') && 10))) {\n // stic(k)y\n case 107:\n return replace(value, ':', ':' + WEBKIT) + value;\n // (inline-)?fl(e)x\n\n case 101:\n return replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value;\n }\n\n break;\n // writing-mode\n\n case 5936:\n switch (charat(value, length + 11)) {\n // vertical-l(r)\n case 114:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb') + value;\n // vertical-r(l)\n\n case 108:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb-rl') + value;\n // horizontal(-)tb\n\n case 45:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'lr') + value;\n }\n\n return WEBKIT + value + MS + value + value;\n }\n\n return value;\n}","import { COMMENT, RULESET, DECLARATION } from './Enum.js';\nimport { abs, trim, from, sizeof, strlen, substr, append, replace } from './Utility.js';\nimport { node, char, prev, next, peek, caret, alloc, dealloc, delimit, whitespace, escaping, identifier, commenter } from './Tokenizer.js';\n/**\n * @param {string} value\n * @return {object[]}\n */\n\nexport function compile(value) {\n return dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value));\n}\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {string[]} rule\n * @param {string[]} rules\n * @param {string[]} rulesets\n * @param {number[]} pseudo\n * @param {number[]} points\n * @param {string[]} declarations\n * @return {object}\n */\n\nexport function parse(value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {\n var index = 0;\n var offset = 0;\n var length = pseudo;\n var atrule = 0;\n var property = 0;\n var previous = 0;\n var variable = 1;\n var scanning = 1;\n var ampersand = 1;\n var character = 0;\n var type = '';\n var props = rules;\n var children = rulesets;\n var reference = rule;\n var characters = type;\n\n while (scanning) {\n switch (previous = character, character = next()) {\n // \" ' [ (\n case 34:\n case 39:\n case 91:\n case 40:\n characters += delimit(character);\n break;\n // \\t \\n \\r \\s\n\n case 9:\n case 10:\n case 13:\n case 32:\n characters += whitespace(previous);\n break;\n // \\\n\n case 92:\n characters += escaping(caret() - 1, 7);\n continue;\n // /\n\n case 47:\n switch (peek()) {\n case 42:\n case 47:\n append(comment(commenter(next(), caret()), root, parent), declarations);\n break;\n\n default:\n characters += '/';\n }\n\n break;\n // {\n\n case 123 * variable:\n points[index++] = strlen(characters) * ampersand;\n // } ; \\0\n\n case 125 * variable:\n case 59:\n case 0:\n switch (character) {\n // \\0 }\n case 0:\n case 125:\n scanning = 0;\n // ;\n\n case 59 + offset:\n if (property > 0 && strlen(characters) - length) append(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations);\n break;\n // @ ;\n\n case 59:\n characters += ';';\n // { rule/at-rule\n\n default:\n append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets);\n if (character === 123) if (offset === 0) parse(characters, root, reference, reference, props, rulesets, length, points, children);else switch (atrule) {\n // d m s\n case 100:\n case 109:\n case 115:\n parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children);\n break;\n\n default:\n parse(characters, reference, reference, reference, [''], children, length, points, children);\n }\n }\n\n index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo;\n break;\n // :\n\n case 58:\n length = 1 + strlen(characters), property = previous;\n\n default:\n if (variable < 1) if (character == 123) --variable;else if (character == 125 && variable++ == 0 && prev() == 125) continue;\n\n switch (characters += from(character), character * variable) {\n // &\n case 38:\n ampersand = offset > 0 ? 1 : (characters += '\\f', -1);\n break;\n // ,\n\n case 44:\n points[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1;\n break;\n // @\n\n case 64:\n // -\n if (peek() === 45) characters += delimit(next());\n atrule = peek(), offset = strlen(type = characters += identifier(caret())), character++;\n break;\n // -\n\n case 45:\n if (previous === 45 && strlen(characters) == 2) variable = 0;\n }\n\n }\n }\n\n return rulesets;\n}\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} index\n * @param {number} offset\n * @param {string[]} rules\n * @param {number[]} points\n * @param {string} type\n * @param {string[]} props\n * @param {string[]} children\n * @param {number} length\n * @return {object}\n */\n\nexport function ruleset(value, root, parent, index, offset, rules, points, type, props, children, length) {\n var post = offset - 1;\n var rule = offset === 0 ? rules : [''];\n var size = sizeof(rule);\n\n for (var i = 0, j = 0, k = 0; i < index; ++i) {\n for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x) {\n if (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\\f/g, rule[x]))) props[k++] = z;\n }\n }\n\n return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length);\n}\n/**\n * @param {number} value\n * @param {object} root\n * @param {object?} parent\n * @return {object}\n */\n\nexport function comment(value, root, parent) {\n return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0);\n}\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} length\n * @return {object}\n */\n\nexport function declaration(value, root, parent, length) {\n return node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length);\n}","import { StyleSheet } from '@emotion/sheet';\nimport { dealloc, alloc, next, token, from, peek, delimit, identifier, position, stringify, COMMENT, rulesheet, middleware, prefixer, serialize, compile } from 'stylis';\nimport '@emotion/weak-memoize';\nimport '@emotion/memoize';\n\nvar last = function last(arr) {\n return arr.length ? arr[arr.length - 1] : null;\n};\n\nvar toRules = function toRules(parsed, points) {\n // pretend we've started with a comma\n var index = -1;\n var character = 44;\n\n do {\n switch (token(character)) {\n case 0:\n // &\\f\n if (character === 38 && peek() === 12) {\n // this is not 100% correct, we don't account for literal sequences here - like for example quoted strings\n // stylis inserts \\f after & to know when & where it should replace this sequence with the context selector\n // and when it should just concatenate the outer and inner selectors\n // it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here\n points[index] = 1;\n }\n\n parsed[index] += identifier(position - 1);\n break;\n\n case 2:\n parsed[index] += delimit(character);\n break;\n\n case 4:\n // comma\n if (character === 44) {\n // colon\n parsed[++index] = peek() === 58 ? '&\\f' : '';\n points[index] = parsed[index].length;\n break;\n }\n\n // fallthrough\n\n default:\n parsed[index] += from(character);\n }\n } while (character = next());\n\n return parsed;\n};\n\nvar getRules = function getRules(value, points) {\n return dealloc(toRules(alloc(value), points));\n}; // WeakSet would be more appropriate, but only WeakMap is supported in IE11\n\n\nvar fixedElements = /* #__PURE__ */new WeakMap();\n\nvar compat = function compat(element) {\n if (element.type !== 'rule' || !element.parent || // .length indicates if this rule contains pseudo or not\n !element.length) {\n return;\n }\n\n var value = element.value,\n parent = element.parent;\n var isImplicitRule = element.column === parent.column && element.line === parent.line;\n\n while (parent.type !== 'rule') {\n parent = parent.parent;\n if (!parent) return;\n } // short-circuit for the simplest case\n\n\n if (element.props.length === 1 && value.charCodeAt(0) !== 58\n /* colon */\n && !fixedElements.get(parent)) {\n return;\n } // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level)\n // then the props has already been manipulated beforehand as they that array is shared between it and its \"rule parent\"\n\n\n if (isImplicitRule) {\n return;\n }\n\n fixedElements.set(element, true);\n var points = [];\n var rules = getRules(value, points);\n var parentRules = parent.props;\n\n for (var i = 0, k = 0; i < rules.length; i++) {\n for (var j = 0; j < parentRules.length; j++, k++) {\n element.props[k] = points[i] ? rules[i].replace(/&\\f/g, parentRules[j]) : parentRules[j] + \" \" + rules[i];\n }\n }\n};\n\nvar removeLabel = function removeLabel(element) {\n if (element.type === 'decl') {\n var value = element.value;\n\n if ( // charcode for l\n value.charCodeAt(0) === 108 && // charcode for b\n value.charCodeAt(2) === 98) {\n // this ignores label\n element[\"return\"] = '';\n element.value = '';\n }\n }\n};\n\nvar ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason';\n\nvar isIgnoringComment = function isIgnoringComment(element) {\n return !!element && element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1;\n};\n\nvar createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) {\n return function (element, index, children) {\n if (element.type !== 'rule') return;\n var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g);\n\n if (unsafePseudoClasses && cache.compat !== true) {\n var prevElement = index > 0 ? children[index - 1] : null;\n\n if (prevElement && isIgnoringComment(last(prevElement.children))) {\n return;\n }\n\n unsafePseudoClasses.forEach(function (unsafePseudoClass) {\n console.error(\"The pseudo class \\\"\" + unsafePseudoClass + \"\\\" is potentially unsafe when doing server-side rendering. Try changing it to \\\"\" + unsafePseudoClass.split('-child')[0] + \"-of-type\\\".\");\n });\n }\n };\n};\n\nvar isImportRule = function isImportRule(element) {\n return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64;\n};\n\nvar isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) {\n for (var i = index - 1; i >= 0; i--) {\n if (!isImportRule(children[i])) {\n return true;\n }\n }\n\n return false;\n}; // use this to remove incorrect elements from further processing\n// so they don't get handed to the `sheet` (or anything else)\n// as that could potentially lead to additional logs which in turn could be overhelming to the user\n\n\nvar nullifyElement = function nullifyElement(element) {\n element.type = '';\n element.value = '';\n element[\"return\"] = '';\n element.children = '';\n element.props = '';\n};\n\nvar incorrectImportAlarm = function incorrectImportAlarm(element, index, children) {\n if (!isImportRule(element)) {\n return;\n }\n\n if (element.parent) {\n console.error(\"`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles.\");\n nullifyElement(element);\n } else if (isPrependedWithRegularRules(index, children)) {\n console.error(\"`@import` rules can't be after other rules. Please put your `@import` rules before your other rules.\");\n nullifyElement(element);\n }\n};\n\nvar defaultStylisPlugins = [prefixer];\n\nvar createCache = function createCache(options) {\n var key = options.key;\n\n if (process.env.NODE_ENV !== 'production' && !key) {\n throw new Error(\"You have to configure `key` for your cache. Please make sure it's unique (and not equal to 'css') as it's used for linking styles to your cache.\\n\" + \"If multiple caches share the same key they might \\\"fight\\\" for each other's style elements.\");\n }\n\n if (key === 'css') {\n var ssrStyles = document.querySelectorAll(\"style[data-emotion]:not([data-s])\"); // get SSRed styles out of the way of React's hydration\n // document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be)\n // note this very very intentionally targets all style elements regardless of the key to ensure\n // that creating a cache works inside of render of a React component\n\n Array.prototype.forEach.call(ssrStyles, function (node) {\n // we want to only move elements which have a space in the data-emotion attribute value\n // because that indicates that it is an Emotion 11 server-side rendered style elements\n // while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector\n // Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes)\n // so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles\n // will not result in the Emotion 10 styles being destroyed\n var dataEmotionAttribute = node.getAttribute('data-emotion');\n\n if (dataEmotionAttribute.indexOf(' ') === -1) {\n return;\n }\n\n document.head.appendChild(node);\n node.setAttribute('data-s', '');\n });\n }\n\n var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;\n\n if (process.env.NODE_ENV !== 'production') {\n // $FlowFixMe\n if (/[^a-z-]/.test(key)) {\n throw new Error(\"Emotion key must only contain lower case alphabetical characters and - but \\\"\" + key + \"\\\" was passed\");\n }\n }\n\n var inserted = {}; // $FlowFixMe\n\n var container;\n var nodesToHydrate = [];\n {\n container = options.container || document.head;\n Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which\n // means that the style elements we're looking at are only Emotion 11 server-rendered style elements\n document.querySelectorAll(\"style[data-emotion^=\\\"\" + key + \" \\\"]\"), function (node) {\n var attrib = node.getAttribute(\"data-emotion\").split(' '); // $FlowFixMe\n\n for (var i = 1; i < attrib.length; i++) {\n inserted[attrib[i]] = true;\n }\n\n nodesToHydrate.push(node);\n });\n }\n\n var _insert;\n\n var omnipresentPlugins = [compat, removeLabel];\n\n if (process.env.NODE_ENV !== 'production') {\n omnipresentPlugins.push(createUnsafeSelectorsAlarm({\n get compat() {\n return cache.compat;\n }\n\n }), incorrectImportAlarm);\n }\n\n {\n var currentSheet;\n var finalizingPlugins = [stringify, process.env.NODE_ENV !== 'production' ? function (element) {\n if (!element.root) {\n if (element[\"return\"]) {\n currentSheet.insert(element[\"return\"]);\n } else if (element.value && element.type !== COMMENT) {\n // insert empty rule in non-production environments\n // so @emotion/jest can grab `key` from the (JS)DOM for caches without any rules inserted yet\n currentSheet.insert(element.value + \"{}\");\n }\n }\n } : rulesheet(function (rule) {\n currentSheet.insert(rule);\n })];\n var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));\n\n var stylis = function stylis(styles) {\n return serialize(compile(styles), serializer);\n };\n\n _insert = function insert(selector, serialized, sheet, shouldCache) {\n currentSheet = sheet;\n\n if (process.env.NODE_ENV !== 'production' && serialized.map !== undefined) {\n currentSheet = {\n insert: function insert(rule) {\n sheet.insert(rule + serialized.map);\n }\n };\n }\n\n stylis(selector ? selector + \"{\" + serialized.styles + \"}\" : serialized.styles);\n\n if (shouldCache) {\n cache.inserted[serialized.name] = true;\n }\n };\n }\n var cache = {\n key: key,\n sheet: new StyleSheet({\n key: key,\n container: container,\n nonce: options.nonce,\n speedy: options.speedy,\n prepend: options.prepend\n }),\n nonce: options.nonce,\n inserted: inserted,\n registered: {},\n insert: _insert\n };\n cache.sheet.hydrate(nodesToHydrate);\n return cache;\n};\n\nexport default createCache;","import { MS, MOZ, WEBKIT, RULESET, KEYFRAMES, DECLARATION } from './Enum.js';\nimport { match, charat, substr, strlen, sizeof, replace, combine } from './Utility.js';\nimport { copy, tokenize } from './Tokenizer.js';\nimport { serialize } from './Serializer.js';\nimport { prefix } from './Prefixer.js';\n/**\n * @param {function[]} collection\n * @return {function}\n */\n\nexport function middleware(collection) {\n var length = sizeof(collection);\n return function (element, index, children, callback) {\n var output = '';\n\n for (var i = 0; i < length; i++) {\n output += collection[i](element, index, children, callback) || '';\n }\n\n return output;\n };\n}\n/**\n * @param {function} callback\n * @return {function}\n */\n\nexport function rulesheet(callback) {\n return function (element) {\n if (!element.root) if (element = element.return) callback(element);\n };\n}\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n */\n\nexport function prefixer(element, index, children, callback) {\n if (!element.return) switch (element.type) {\n case DECLARATION:\n element.return = prefix(element.value, element.length);\n break;\n\n case KEYFRAMES:\n return serialize([copy(replace(element.value, '@', '@' + WEBKIT), element, '')], callback);\n\n case RULESET:\n if (element.length) return combine(element.props, function (value) {\n switch (match(value, /(::plac\\w+|:read-\\w+)/)) {\n // :read-(only|write)\n case ':read-only':\n case ':read-write':\n return serialize([copy(replace(value, /:(read-\\w+)/, ':' + MOZ + '$1'), element, '')], callback);\n // :placeholder\n\n case '::placeholder':\n return serialize([copy(replace(value, /:(plac\\w+)/, ':' + WEBKIT + 'input-$1'), element, ''), copy(replace(value, /:(plac\\w+)/, ':' + MOZ + '$1'), element, ''), copy(replace(value, /:(plac\\w+)/, MS + 'input-$1'), element, '')], callback);\n }\n\n return '';\n });\n }\n}\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n */\n\nexport function namespace(element) {\n switch (element.type) {\n case RULESET:\n element.props = element.props.map(function (value) {\n return combine(tokenize(value), function (value, index, children) {\n switch (charat(value, 0)) {\n // \\f\n case 12:\n return substr(value, 1, strlen(value));\n // \\0 ( + > ~\n\n case 0:\n case 40:\n case 43:\n case 62:\n case 126:\n return value;\n // :\n\n case 58:\n if (children[++index] === 'global') children[index] = '', children[++index] = '\\f' + substr(children[index], index = 1, -1);\n // \\s\n\n case 32:\n return index === 1 ? '' : value;\n\n default:\n switch (index) {\n case 0:\n element = value;\n return sizeof(children) > 1 ? '' : value;\n\n case index = sizeof(children) - 1:\n case 2:\n return index === 2 ? value + element + element : value + element;\n\n default:\n return value;\n }\n\n }\n });\n });\n }\n}","var isBrowser = \"object\" !== 'undefined';\n\nfunction getRegisteredStyles(registered, registeredStyles, classNames) {\n var rawClassName = '';\n classNames.split(' ').forEach(function (className) {\n if (registered[className] !== undefined) {\n registeredStyles.push(registered[className] + \";\");\n } else {\n rawClassName += className + \" \";\n }\n });\n return rawClassName;\n}\n\nvar insertStyles = function insertStyles(cache, serialized, isStringTag) {\n var className = cache.key + \"-\" + serialized.name;\n\n if ( // we only need to add the styles to the registered cache if the\n // class name could be used further down\n // the tree but if it's a string tag, we know it won't\n // so we don't have to add it to registered cache.\n // this improves memory usage since we can avoid storing the whole style string\n (isStringTag === false || // we need to always store it if we're in compat mode and\n // in node since emotion-server relies on whether a style is in\n // the registered cache to know whether a style is global or not\n // also, note that this check will be dead code eliminated in the browser\n isBrowser === false) && cache.registered[className] === undefined) {\n cache.registered[className] = serialized.styles;\n }\n\n if (cache.inserted[serialized.name] === undefined) {\n var current = serialized;\n\n do {\n var maybeStyles = cache.insert(serialized === current ? \".\" + className : '', current, cache.sheet, true);\n current = current.next;\n } while (current !== undefined);\n }\n};\n\nexport { getRegisteredStyles, insertStyles };","/* eslint-disable */\n// Inspired by https://github.com/garycourt/murmurhash-js\n// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86\nfunction murmur2(str) {\n // 'm' and 'r' are mixing constants generated offline.\n // They're not really 'magic', they just happen to work well.\n // const m = 0x5bd1e995;\n // const r = 24;\n // Initialize the hash\n var h = 0; // Mix 4 bytes at a time into the hash\n\n var k,\n i = 0,\n len = str.length;\n\n for (; len >= 4; ++i, len -= 4) {\n k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;\n k =\n /* Math.imul(k, m): */\n (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);\n k ^=\n /* k >>> r: */\n k >>> 24;\n h =\n /* Math.imul(k, m): */\n (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n } // Handle the last few bytes of the input array\n\n\n switch (len) {\n case 3:\n h ^= (str.charCodeAt(i + 2) & 0xff) << 16;\n\n case 2:\n h ^= (str.charCodeAt(i + 1) & 0xff) << 8;\n\n case 1:\n h ^= str.charCodeAt(i) & 0xff;\n h =\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n } // Do a few final mixes of the hash to ensure the last few\n // bytes are well-incorporated.\n\n\n h ^= h >>> 13;\n h =\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n return ((h ^ h >>> 15) >>> 0).toString(36);\n}\n\nexport default murmur2;","import hashString from '@emotion/hash';\nimport unitless from '@emotion/unitless';\nimport memoize from '@emotion/memoize';\nvar ILLEGAL_ESCAPE_SEQUENCE_ERROR = \"You have illegal escape sequence in your template literal, most likely inside content's property value.\\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \\\"content: '\\\\00d7';\\\" should become \\\"content: '\\\\\\\\00d7';\\\".\\nYou can read more about this here:\\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences\";\nvar UNDEFINED_AS_OBJECT_KEY_ERROR = \"You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).\";\nvar hyphenateRegex = /[A-Z]|^ms/g;\nvar animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;\n\nvar isCustomProperty = function isCustomProperty(property) {\n return property.charCodeAt(1) === 45;\n};\n\nvar isProcessableValue = function isProcessableValue(value) {\n return value != null && typeof value !== 'boolean';\n};\n\nvar processStyleName = /* #__PURE__ */memoize(function (styleName) {\n return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();\n});\n\nvar processStyleValue = function processStyleValue(key, value) {\n switch (key) {\n case 'animation':\n case 'animationName':\n {\n if (typeof value === 'string') {\n return value.replace(animationRegex, function (match, p1, p2) {\n cursor = {\n name: p1,\n styles: p2,\n next: cursor\n };\n return p1;\n });\n }\n }\n }\n\n if (unitless[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {\n return value + 'px';\n }\n\n return value;\n};\n\nif (process.env.NODE_ENV !== 'production') {\n var contentValuePattern = /(attr|counters?|url|(((repeating-)?(linear|radial))|conic)-gradient)\\(|(no-)?(open|close)-quote/;\n var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset'];\n var oldProcessStyleValue = processStyleValue;\n var msPattern = /^-ms-/;\n var hyphenPattern = /-(.)/g;\n var hyphenatedCache = {};\n\n processStyleValue = function processStyleValue(key, value) {\n if (key === 'content') {\n if (typeof value !== 'string' || contentValues.indexOf(value) === -1 && !contentValuePattern.test(value) && (value.charAt(0) !== value.charAt(value.length - 1) || value.charAt(0) !== '\"' && value.charAt(0) !== \"'\")) {\n throw new Error(\"You seem to be using a value for 'content' without quotes, try replacing it with `content: '\\\"\" + value + \"\\\"'`\");\n }\n }\n\n var processed = oldProcessStyleValue(key, value);\n\n if (processed !== '' && !isCustomProperty(key) && key.indexOf('-') !== -1 && hyphenatedCache[key] === undefined) {\n hyphenatedCache[key] = true;\n console.error(\"Using kebab-case for css properties in objects is not supported. Did you mean \" + key.replace(msPattern, 'ms-').replace(hyphenPattern, function (str, _char) {\n return _char.toUpperCase();\n }) + \"?\");\n }\n\n return processed;\n };\n}\n\nfunction handleInterpolation(mergedProps, registered, interpolation) {\n if (interpolation == null) {\n return '';\n }\n\n if (interpolation.__emotion_styles !== undefined) {\n if (process.env.NODE_ENV !== 'production' && interpolation.toString() === 'NO_COMPONENT_SELECTOR') {\n throw new Error('Component selectors can only be used in conjunction with @emotion/babel-plugin.');\n }\n\n return interpolation;\n }\n\n switch (typeof interpolation) {\n case 'boolean':\n {\n return '';\n }\n\n case 'object':\n {\n if (interpolation.anim === 1) {\n cursor = {\n name: interpolation.name,\n styles: interpolation.styles,\n next: cursor\n };\n return interpolation.name;\n }\n\n if (interpolation.styles !== undefined) {\n var next = interpolation.next;\n\n if (next !== undefined) {\n // not the most efficient thing ever but this is a pretty rare case\n // and there will be very few iterations of this generally\n while (next !== undefined) {\n cursor = {\n name: next.name,\n styles: next.styles,\n next: cursor\n };\n next = next.next;\n }\n }\n\n var styles = interpolation.styles + \";\";\n\n if (process.env.NODE_ENV !== 'production' && interpolation.map !== undefined) {\n styles += interpolation.map;\n }\n\n return styles;\n }\n\n return createStringFromObject(mergedProps, registered, interpolation);\n }\n\n case 'function':\n {\n if (mergedProps !== undefined) {\n var previousCursor = cursor;\n var result = interpolation(mergedProps);\n cursor = previousCursor;\n return handleInterpolation(mergedProps, registered, result);\n } else if (process.env.NODE_ENV !== 'production') {\n console.error('Functions that are interpolated in css calls will be stringified.\\n' + 'If you want to have a css call based on props, create a function that returns a css call like this\\n' + 'let dynamicStyle = (props) => css`color: ${props.color}`\\n' + 'It can be called directly with props or interpolated in a styled call like this\\n' + \"let SomeComponent = styled('div')`${dynamicStyle}`\");\n }\n\n break;\n }\n\n case 'string':\n if (process.env.NODE_ENV !== 'production') {\n var matched = [];\n var replaced = interpolation.replace(animationRegex, function (match, p1, p2) {\n var fakeVarName = \"animation\" + matched.length;\n matched.push(\"const \" + fakeVarName + \" = keyframes`\" + p2.replace(/^@keyframes animation-\\w+/, '') + \"`\");\n return \"${\" + fakeVarName + \"}\";\n });\n\n if (matched.length) {\n console.error('`keyframes` output got interpolated into plain string, please wrap it with `css`.\\n\\n' + 'Instead of doing this:\\n\\n' + [].concat(matched, [\"`\" + replaced + \"`\"]).join('\\n') + '\\n\\nYou should wrap it with `css` like this:\\n\\n' + (\"css`\" + replaced + \"`\"));\n }\n }\n\n break;\n } // finalize string values (regular strings and functions interpolated into css calls)\n\n\n if (registered == null) {\n return interpolation;\n }\n\n var cached = registered[interpolation];\n return cached !== undefined ? cached : interpolation;\n}\n\nfunction createStringFromObject(mergedProps, registered, obj) {\n var string = '';\n\n if (Array.isArray(obj)) {\n for (var i = 0; i < obj.length; i++) {\n string += handleInterpolation(mergedProps, registered, obj[i]) + \";\";\n }\n } else {\n for (var _key in obj) {\n var value = obj[_key];\n\n if (typeof value !== 'object') {\n if (registered != null && registered[value] !== undefined) {\n string += _key + \"{\" + registered[value] + \"}\";\n } else if (isProcessableValue(value)) {\n string += processStyleName(_key) + \":\" + processStyleValue(_key, value) + \";\";\n }\n } else {\n if (_key === 'NO_COMPONENT_SELECTOR' && process.env.NODE_ENV !== 'production') {\n throw new Error('Component selectors can only be used in conjunction with @emotion/babel-plugin.');\n }\n\n if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {\n for (var _i = 0; _i < value.length; _i++) {\n if (isProcessableValue(value[_i])) {\n string += processStyleName(_key) + \":\" + processStyleValue(_key, value[_i]) + \";\";\n }\n }\n } else {\n var interpolated = handleInterpolation(mergedProps, registered, value);\n\n switch (_key) {\n case 'animation':\n case 'animationName':\n {\n string += processStyleName(_key) + \":\" + interpolated + \";\";\n break;\n }\n\n default:\n {\n if (process.env.NODE_ENV !== 'production' && _key === 'undefined') {\n console.error(UNDEFINED_AS_OBJECT_KEY_ERROR);\n }\n\n string += _key + \"{\" + interpolated + \"}\";\n }\n }\n }\n }\n }\n }\n\n return string;\n}\n\nvar labelPattern = /label:\\s*([^\\s;\\n{]+)\\s*(;|$)/g;\nvar sourceMapPattern;\n\nif (process.env.NODE_ENV !== 'production') {\n sourceMapPattern = /\\/\\*#\\ssourceMappingURL=data:application\\/json;\\S+\\s+\\*\\//g;\n} // this is the cursor for keyframes\n// keyframes are stored on the SerializedStyles object as a linked list\n\n\nvar cursor;\n\nvar serializeStyles = function serializeStyles(args, registered, mergedProps) {\n if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {\n return args[0];\n }\n\n var stringMode = true;\n var styles = '';\n cursor = undefined;\n var strings = args[0];\n\n if (strings == null || strings.raw === undefined) {\n stringMode = false;\n styles += handleInterpolation(mergedProps, registered, strings);\n } else {\n if (process.env.NODE_ENV !== 'production' && strings[0] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles += strings[0];\n } // we start at 1 since we've already handled the first arg\n\n\n for (var i = 1; i < args.length; i++) {\n styles += handleInterpolation(mergedProps, registered, args[i]);\n\n if (stringMode) {\n if (process.env.NODE_ENV !== 'production' && strings[i] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles += strings[i];\n }\n }\n\n var sourceMap;\n\n if (process.env.NODE_ENV !== 'production') {\n styles = styles.replace(sourceMapPattern, function (match) {\n sourceMap = match;\n return '';\n });\n } // using a global regex with .exec is stateful so lastIndex has to be reset each time\n\n\n labelPattern.lastIndex = 0;\n var identifierName = '';\n var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5\n\n while ((match = labelPattern.exec(styles)) !== null) {\n identifierName += '-' + // $FlowFixMe we know it's not null\n match[1];\n }\n\n var name = hashString(styles) + identifierName;\n\n if (process.env.NODE_ENV !== 'production') {\n // $FlowFixMe SerializedStyles type doesn't have toString property (and we don't want to add it)\n return {\n name: name,\n styles: styles,\n map: sourceMap,\n next: cursor,\n toString: function toString() {\n return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\";\n }\n };\n }\n\n return {\n name: name,\n styles: styles,\n next: cursor\n };\n};\n\nexport { serializeStyles };","import { createContext, useContext, forwardRef, createElement } from 'react';\nimport createCache from '@emotion/cache';\nimport _extends from '@babel/runtime/helpers/esm/extends';\nimport weakMemoize from '@emotion/weak-memoize';\nimport hoistNonReactStatics from '../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.browser.esm.js';\nimport { getRegisteredStyles, insertStyles } from '@emotion/utils';\nimport { serializeStyles } from '@emotion/serialize';\nvar hasOwnProperty = Object.prototype.hasOwnProperty;\nvar EmotionCacheContext = /* #__PURE__ */createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case\n// because this module is primarily intended for the browser and node\n// but it's also required in react native and similar environments sometimes\n// and we could have a special build just for that\n// but this is much easier and the native packages\n// might use a different theme context in the future anyway\ntypeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache({\n key: 'css'\n}) : null);\n\nif (process.env.NODE_ENV !== 'production') {\n EmotionCacheContext.displayName = 'EmotionCacheContext';\n}\n\nvar CacheProvider = EmotionCacheContext.Provider;\n\nvar __unsafe_useEmotionCache = function useEmotionCache() {\n return useContext(EmotionCacheContext);\n};\n\nvar withEmotionCache = function withEmotionCache(func) {\n // $FlowFixMe\n return /*#__PURE__*/forwardRef(function (props, ref) {\n // the cache will never be null in the browser\n var cache = useContext(EmotionCacheContext);\n return func(props, cache, ref);\n });\n};\n\nvar ThemeContext = /* #__PURE__ */createContext({});\n\nif (process.env.NODE_ENV !== 'production') {\n ThemeContext.displayName = 'EmotionThemeContext';\n}\n\nvar useTheme = function useTheme() {\n return useContext(ThemeContext);\n};\n\nvar getTheme = function getTheme(outerTheme, theme) {\n if (typeof theme === 'function') {\n var mergedTheme = theme(outerTheme);\n\n if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {\n throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');\n }\n\n return mergedTheme;\n }\n\n if (process.env.NODE_ENV !== 'production' && (theme == null || typeof theme !== 'object' || Array.isArray(theme))) {\n throw new Error('[ThemeProvider] Please make your theme prop a plain object');\n }\n\n return _extends({}, outerTheme, theme);\n};\n\nvar createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {\n return weakMemoize(function (theme) {\n return getTheme(outerTheme, theme);\n });\n});\n\nvar ThemeProvider = function ThemeProvider(props) {\n var theme = useContext(ThemeContext);\n\n if (props.theme !== theme) {\n theme = createCacheWithTheme(theme)(props.theme);\n }\n\n return /*#__PURE__*/createElement(ThemeContext.Provider, {\n value: theme\n }, props.children);\n};\n\nfunction withTheme(Component) {\n var componentName = Component.displayName || Component.name || 'Component';\n\n var render = function render(props, ref) {\n var theme = useContext(ThemeContext);\n return /*#__PURE__*/createElement(Component, _extends({\n theme: theme,\n ref: ref\n }, props));\n }; // $FlowFixMe\n\n\n var WithTheme = /*#__PURE__*/forwardRef(render);\n WithTheme.displayName = \"WithTheme(\" + componentName + \")\";\n return hoistNonReactStatics(WithTheme, Component);\n} // thus we only need to replace what is a valid character for JS, but not for CSS\n\n\nvar sanitizeIdentifier = function sanitizeIdentifier(identifier) {\n return identifier.replace(/\\$/g, '-');\n};\n\nvar typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';\nvar labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';\n\nvar createEmotionProps = function createEmotionProps(type, props) {\n if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration\n props.css.indexOf(':') !== -1) {\n throw new Error(\"Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`\" + props.css + \"`\");\n }\n\n var newProps = {};\n\n for (var key in props) {\n if (hasOwnProperty.call(props, key)) {\n newProps[key] = props[key];\n }\n }\n\n newProps[typePropName] = type;\n\n if (process.env.NODE_ENV !== 'production') {\n var error = new Error();\n\n if (error.stack) {\n // chrome\n var match = error.stack.match(/at (?:Object\\.|Module\\.|)(?:jsx|createEmotionProps).*\\n\\s+at (?:Object\\.|)([A-Z][A-Za-z0-9$]+) /);\n\n if (!match) {\n // safari and firefox\n match = error.stack.match(/.*\\n([A-Z][A-Za-z0-9$]+)@/);\n }\n\n if (match) {\n newProps[labelPropName] = sanitizeIdentifier(match[1]);\n }\n }\n }\n\n return newProps;\n};\n\nvar Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {\n var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works\n // not passing the registered cache to serializeStyles because it would\n // make certain babel optimisations not possible\n\n if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {\n cssProp = cache.registered[cssProp];\n }\n\n var type = props[typePropName];\n var registeredStyles = [cssProp];\n var className = '';\n\n if (typeof props.className === 'string') {\n className = getRegisteredStyles(cache.registered, registeredStyles, props.className);\n } else if (props.className != null) {\n className = props.className + \" \";\n }\n\n var serialized = serializeStyles(registeredStyles, undefined, useContext(ThemeContext));\n\n if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {\n var labelFromStack = props[labelPropName];\n\n if (labelFromStack) {\n serialized = serializeStyles([serialized, 'label:' + labelFromStack + ';']);\n }\n }\n\n var rules = insertStyles(cache, serialized, typeof type === 'string');\n className += cache.key + \"-\" + serialized.name;\n var newProps = {};\n\n for (var key in props) {\n if (hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {\n newProps[key] = props[key];\n }\n }\n\n newProps.ref = ref;\n newProps.className = className;\n var ele = /*#__PURE__*/createElement(type, newProps);\n return ele;\n});\n\nif (process.env.NODE_ENV !== 'production') {\n Emotion.displayName = 'EmotionCssPropInternal';\n}\n\nexport { CacheProvider as C, Emotion as E, ThemeContext as T, __unsafe_useEmotionCache as _, ThemeProvider as a, withTheme as b, createEmotionProps as c, hasOwnProperty as h, useTheme as u, withEmotionCache as w };","import { createElement, useContext, useRef, useLayoutEffect } from 'react';\nimport '@emotion/cache';\nimport { h as hasOwnProperty, E as Emotion, c as createEmotionProps, w as withEmotionCache, T as ThemeContext } from './emotion-element-99289b21.browser.esm.js';\nexport { C as CacheProvider, T as ThemeContext, a as ThemeProvider, _ as __unsafe_useEmotionCache, u as useTheme, w as withEmotionCache, b as withTheme } from './emotion-element-99289b21.browser.esm.js';\nimport '@babel/runtime/helpers/extends';\nimport '@emotion/weak-memoize';\nimport 'hoist-non-react-statics';\nimport '../isolated-hoist-non-react-statics-do-not-use-this-in-your-code/dist/emotion-react-isolated-hoist-non-react-statics-do-not-use-this-in-your-code.browser.esm.js';\nimport { insertStyles, getRegisteredStyles } from '@emotion/utils';\nimport { serializeStyles } from '@emotion/serialize';\nimport { StyleSheet } from '@emotion/sheet';\nvar pkg = {\n name: \"@emotion/react\",\n version: \"11.4.1\",\n main: \"dist/emotion-react.cjs.js\",\n module: \"dist/emotion-react.esm.js\",\n browser: {\n \"./dist/emotion-react.cjs.js\": \"./dist/emotion-react.browser.cjs.js\",\n \"./dist/emotion-react.esm.js\": \"./dist/emotion-react.browser.esm.js\"\n },\n types: \"types/index.d.ts\",\n files: [\"src\", \"dist\", \"jsx-runtime\", \"jsx-dev-runtime\", \"isolated-hoist-non-react-statics-do-not-use-this-in-your-code\", \"types/*.d.ts\", \"macro.js\", \"macro.d.ts\", \"macro.js.flow\"],\n sideEffects: false,\n author: \"mitchellhamilton \",\n license: \"MIT\",\n scripts: {\n \"test:typescript\": \"dtslint types\"\n },\n dependencies: {\n \"@babel/runtime\": \"^7.13.10\",\n \"@emotion/cache\": \"^11.4.0\",\n \"@emotion/serialize\": \"^1.0.2\",\n \"@emotion/sheet\": \"^1.0.2\",\n \"@emotion/utils\": \"^1.0.0\",\n \"@emotion/weak-memoize\": \"^0.2.5\",\n \"hoist-non-react-statics\": \"^3.3.1\"\n },\n peerDependencies: {\n \"@babel/core\": \"^7.0.0\",\n react: \">=16.8.0\"\n },\n peerDependenciesMeta: {\n \"@babel/core\": {\n optional: true\n },\n \"@types/react\": {\n optional: true\n }\n },\n devDependencies: {\n \"@babel/core\": \"^7.13.10\",\n \"@emotion/css\": \"11.1.3\",\n \"@emotion/css-prettifier\": \"1.0.0\",\n \"@emotion/server\": \"11.4.0\",\n \"@emotion/styled\": \"11.3.0\",\n \"@types/react\": \"^16.9.11\",\n dtslint: \"^0.3.0\",\n \"html-tag-names\": \"^1.1.2\",\n react: \"16.14.0\",\n \"svg-tag-names\": \"^1.1.1\"\n },\n repository: \"https://github.com/emotion-js/emotion/tree/main/packages/react\",\n publishConfig: {\n access: \"public\"\n },\n \"umd:main\": \"dist/emotion-react.umd.min.js\",\n preconstruct: {\n entrypoints: [\"./index.js\", \"./jsx-runtime.js\", \"./jsx-dev-runtime.js\", \"./isolated-hoist-non-react-statics-do-not-use-this-in-your-code.js\"],\n umdName: \"emotionReact\"\n }\n};\n\nvar jsx = function jsx(type, props) {\n var args = arguments;\n\n if (props == null || !hasOwnProperty.call(props, 'css')) {\n // $FlowFixMe\n return createElement.apply(undefined, args);\n }\n\n var argsLength = args.length;\n var createElementArgArray = new Array(argsLength);\n createElementArgArray[0] = Emotion;\n createElementArgArray[1] = createEmotionProps(type, props);\n\n for (var i = 2; i < argsLength; i++) {\n createElementArgArray[i] = args[i];\n } // $FlowFixMe\n\n\n return createElement.apply(null, createElementArgArray);\n};\n\nvar warnedAboutCssPropForGlobal = false; // maintain place over rerenders.\n// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild\n// initial client-side render from SSR, use place of hydrating tag\n\nvar Global = /* #__PURE__ */withEmotionCache(function (props, cache) {\n if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is\n // probably using the custom createElement which\n // means it will be turned into a className prop\n // $FlowFixMe I don't really want to add it to the type since it shouldn't be used\n props.className || props.css)) {\n console.error(\"It looks like you're using the css prop on Global, did you mean to use the styles prop instead?\");\n warnedAboutCssPropForGlobal = true;\n }\n\n var styles = props.styles;\n var serialized = serializeStyles([styles], undefined, useContext(ThemeContext)); // but it is based on a constant that will never change at runtime\n // it's effectively like having two implementations and switching them out\n // so it's not actually breaking anything\n\n var sheetRef = useRef();\n useLayoutEffect(function () {\n var key = cache.key + \"-global\";\n var sheet = new StyleSheet({\n key: key,\n nonce: cache.sheet.nonce,\n container: cache.sheet.container,\n speedy: cache.sheet.isSpeedy\n });\n var rehydrating = false; // $FlowFixMe\n\n var node = document.querySelector(\"style[data-emotion=\\\"\" + key + \" \" + serialized.name + \"\\\"]\");\n\n if (cache.sheet.tags.length) {\n sheet.before = cache.sheet.tags[0];\n }\n\n if (node !== null) {\n rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other \n \n );\n};\n\nexport default CustomSelect;\n","import { createElement, Component } from 'react';\nimport { findDOMNode } from 'react-dom';\n\nfunction _inheritsLoose(subClass, superClass) {\n subClass.prototype = Object.create(superClass.prototype);\n subClass.prototype.constructor = subClass;\n\n _setPrototypeOf(subClass, superClass);\n}\n\nfunction _setPrototypeOf(o, p) {\n _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n\n return _setPrototypeOf(o, p);\n}\n\nfunction _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\nfunction _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return self;\n}\n/**\n* Check whether some DOM node is our Component's node.\n*/\n\n\nfunction isNodeFound(current, componentNode, ignoreClass) {\n if (current === componentNode) {\n return true;\n } // SVG elements do not technically reside in the rendered DOM, so\n // they do not have classList directly, but they offer a link to their\n // corresponding element, which can have classList. This extra check is for\n // that case.\n // See: http://www.w3.org/TR/SVG11/struct.html#InterfaceSVGUseElement\n // Discussion: https://github.com/Pomax/react-onclickoutside/pull/17\n\n\n if (current.correspondingElement) {\n return current.correspondingElement.classList.contains(ignoreClass);\n }\n\n return current.classList.contains(ignoreClass);\n}\n/**\n * Try to find our node in a hierarchy of nodes, returning the document\n * node as highest node if our node is not found in the path up.\n */\n\n\nfunction findHighest(current, componentNode, ignoreClass) {\n if (current === componentNode) {\n return true;\n } // If source=local then this event came from 'somewhere'\n // inside and should be ignored. We could handle this with\n // a layered approach, too, but that requires going back to\n // thinking in terms of Dom node nesting, running counter\n // to React's 'you shouldn't care about the DOM' philosophy.\n // Also cover shadowRoot node by checking current.host\n\n\n while (current.parentNode || current.host) {\n // Only check normal node without shadowRoot\n if (current.parentNode && isNodeFound(current, componentNode, ignoreClass)) {\n return true;\n }\n\n current = current.parentNode || current.host;\n }\n\n return current;\n}\n/**\n * Check if the browser scrollbar was clicked\n */\n\n\nfunction clickedScrollbar(evt) {\n return document.documentElement.clientWidth <= evt.clientX || document.documentElement.clientHeight <= evt.clientY;\n} // ideally will get replaced with external dep\n// when rafrex/detect-passive-events#4 and rafrex/detect-passive-events#5 get merged in\n\n\nvar testPassiveEventSupport = function testPassiveEventSupport() {\n if (typeof window === 'undefined' || typeof window.addEventListener !== 'function') {\n return;\n }\n\n var passive = false;\n var options = Object.defineProperty({}, 'passive', {\n get: function get() {\n passive = true;\n }\n });\n\n var noop = function noop() {};\n\n window.addEventListener('testPassiveEventSupport', noop, options);\n window.removeEventListener('testPassiveEventSupport', noop, options);\n return passive;\n};\n\nfunction autoInc(seed) {\n if (seed === void 0) {\n seed = 0;\n }\n\n return function () {\n return ++seed;\n };\n}\n\nvar uid = autoInc();\nvar passiveEventSupport;\nvar handlersMap = {};\nvar enabledInstances = {};\nvar touchEvents = ['touchstart', 'touchmove'];\nvar IGNORE_CLASS_NAME = 'ignore-react-onclickoutside';\n/**\n * Options for addEventHandler and removeEventHandler\n */\n\nfunction getEventHandlerOptions(instance, eventName) {\n var handlerOptions = null;\n var isTouchEvent = touchEvents.indexOf(eventName) !== -1;\n\n if (isTouchEvent && passiveEventSupport) {\n handlerOptions = {\n passive: !instance.props.preventDefault\n };\n }\n\n return handlerOptions;\n}\n/**\n * This function generates the HOC function that you'll use\n * in order to impart onOutsideClick listening to an\n * arbitrary component. It gets called at the end of the\n * bootstrapping code to yield an instance of the\n * onClickOutsideHOC function defined inside setupHOC().\n */\n\n\nfunction onClickOutsideHOC(WrappedComponent, config) {\n var _class, _temp;\n\n var componentName = WrappedComponent.displayName || WrappedComponent.name || 'Component';\n return _temp = _class = /*#__PURE__*/function (_Component) {\n _inheritsLoose(onClickOutside, _Component);\n\n function onClickOutside(props) {\n var _this;\n\n _this = _Component.call(this, props) || this;\n\n _this.__outsideClickHandler = function (event) {\n if (typeof _this.__clickOutsideHandlerProp === 'function') {\n _this.__clickOutsideHandlerProp(event);\n\n return;\n }\n\n var instance = _this.getInstance();\n\n if (typeof instance.props.handleClickOutside === 'function') {\n instance.props.handleClickOutside(event);\n return;\n }\n\n if (typeof instance.handleClickOutside === 'function') {\n instance.handleClickOutside(event);\n return;\n }\n\n throw new Error(\"WrappedComponent: \" + componentName + \" lacks a handleClickOutside(event) function for processing outside click events.\");\n };\n\n _this.__getComponentNode = function () {\n var instance = _this.getInstance();\n\n if (config && typeof config.setClickOutsideRef === 'function') {\n return config.setClickOutsideRef()(instance);\n }\n\n if (typeof instance.setClickOutsideRef === 'function') {\n return instance.setClickOutsideRef();\n }\n\n return findDOMNode(instance);\n };\n\n _this.enableOnClickOutside = function () {\n if (typeof document === 'undefined' || enabledInstances[_this._uid]) {\n return;\n }\n\n if (typeof passiveEventSupport === 'undefined') {\n passiveEventSupport = testPassiveEventSupport();\n }\n\n enabledInstances[_this._uid] = true;\n var events = _this.props.eventTypes;\n\n if (!events.forEach) {\n events = [events];\n }\n\n handlersMap[_this._uid] = function (event) {\n if (_this.componentNode === null) return;\n\n if (_this.props.preventDefault) {\n event.preventDefault();\n }\n\n if (_this.props.stopPropagation) {\n event.stopPropagation();\n }\n\n if (_this.props.excludeScrollbar && clickedScrollbar(event)) return;\n var current = event.composed && event.composedPath && event.composedPath().shift() || event.target;\n\n if (findHighest(current, _this.componentNode, _this.props.outsideClickIgnoreClass) !== document) {\n return;\n }\n\n _this.__outsideClickHandler(event);\n };\n\n events.forEach(function (eventName) {\n document.addEventListener(eventName, handlersMap[_this._uid], getEventHandlerOptions(_assertThisInitialized(_this), eventName));\n });\n };\n\n _this.disableOnClickOutside = function () {\n delete enabledInstances[_this._uid];\n var fn = handlersMap[_this._uid];\n\n if (fn && typeof document !== 'undefined') {\n var events = _this.props.eventTypes;\n\n if (!events.forEach) {\n events = [events];\n }\n\n events.forEach(function (eventName) {\n return document.removeEventListener(eventName, fn, getEventHandlerOptions(_assertThisInitialized(_this), eventName));\n });\n delete handlersMap[_this._uid];\n }\n };\n\n _this.getRef = function (ref) {\n return _this.instanceRef = ref;\n };\n\n _this._uid = uid();\n return _this;\n }\n /**\n * Access the WrappedComponent's instance.\n */\n\n\n var _proto = onClickOutside.prototype;\n\n _proto.getInstance = function getInstance() {\n if (WrappedComponent.prototype && !WrappedComponent.prototype.isReactComponent) {\n return this;\n }\n\n var ref = this.instanceRef;\n return ref.getInstance ? ref.getInstance() : ref;\n };\n /**\n * Add click listeners to the current document,\n * linked to this component's state.\n */\n\n\n _proto.componentDidMount = function componentDidMount() {\n // If we are in an environment without a DOM such\n // as shallow rendering or snapshots then we exit\n // early to prevent any unhandled errors being thrown.\n if (typeof document === 'undefined' || !document.createElement) {\n return;\n }\n\n var instance = this.getInstance();\n\n if (config && typeof config.handleClickOutside === 'function') {\n this.__clickOutsideHandlerProp = config.handleClickOutside(instance);\n\n if (typeof this.__clickOutsideHandlerProp !== 'function') {\n throw new Error(\"WrappedComponent: \" + componentName + \" lacks a function for processing outside click events specified by the handleClickOutside config option.\");\n }\n }\n\n this.componentNode = this.__getComponentNode(); // return early so we dont initiate onClickOutside\n\n if (this.props.disableOnClickOutside) return;\n this.enableOnClickOutside();\n };\n\n _proto.componentDidUpdate = function componentDidUpdate() {\n this.componentNode = this.__getComponentNode();\n }\n /**\n * Remove all document's event listeners for this component\n */\n ;\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.disableOnClickOutside();\n }\n /**\n * Can be called to explicitly enable event listening\n * for clicks and touches outside of this element.\n */\n ;\n /**\n * Pass-through render\n */\n\n\n _proto.render = function render() {\n // eslint-disable-next-line no-unused-vars\n var _this$props = this.props;\n _this$props.excludeScrollbar;\n\n var props = _objectWithoutPropertiesLoose(_this$props, [\"excludeScrollbar\"]);\n\n if (WrappedComponent.prototype && WrappedComponent.prototype.isReactComponent) {\n props.ref = this.getRef;\n } else {\n props.wrappedRef = this.getRef;\n }\n\n props.disableOnClickOutside = this.disableOnClickOutside;\n props.enableOnClickOutside = this.enableOnClickOutside;\n return createElement(WrappedComponent, props);\n };\n\n return onClickOutside;\n }(Component), _class.displayName = \"OnClickOutside(\" + componentName + \")\", _class.defaultProps = {\n eventTypes: ['mousedown', 'touchstart'],\n excludeScrollbar: config && config.excludeScrollbar || false,\n outsideClickIgnoreClass: IGNORE_CLASS_NAME,\n preventDefault: false,\n stopPropagation: false\n }, _class.getClass = function () {\n return WrappedComponent.getClass ? WrappedComponent.getClass() : WrappedComponent;\n }, _temp;\n}\n\nexport default onClickOutsideHOC;\nexport { IGNORE_CLASS_NAME };","/**\n * A custom dropdown component with typesafe options\n *\n */\n\nimport * as React from \"react\";\nimport onClickOutside from \"react-onclickoutside\";\nimport styled from \"styled-components\";\nimport {Caret} from \"../components\";\nimport {condensedMicroRegular, px, colors, zIndices, elementSizes, condensedMicroBold, RowDiv} from \"../models\";\n\nconst DropdownWrapper = styled(RowDiv)`\n position: relative;\n width: 100%;\n z-index: ${zIndices.zDropdown};\n box-sizing: border-box;\n`;\nconst Select = styled(RowDiv)`\n ${condensedMicroRegular};\n width: 100%;\n height: ${px(elementSizes.dropdownHeight)};\n background-color: ${colors.white};\n line-height: 1.25em;\n cursor: pointer;\n box-sizing: border-box;\n border-bottom: 1px solid ${colors.grayMedium};\n justify-content: space-between;\n`;\nconst Title = styled.div`\n ${condensedMicroBold};\n margin-right: 10px;\n`;\nconst CaretWrapper = styled.div`\n width: 8px;\n height: 8px;\n margin: 2px 0 0 4px;\n display: flex;\n flex-direction: row;\n align-items: center;\n`;\n\nconst Choice = styled(RowDiv)`\n ${condensedMicroRegular};\n width: 100%;\n padding: ${px(6)} ${px(8)};\n background-color: ${colors.white};\n line-height: 1.25em;\n cursor: pointer;\n box-sizing: border-box;\n border: 1px solid ${colors.grayMedium};\n margin-top: -1px;\n justify-content: space-between;\n\n &:hover {\n background-color: ${colors.grayUltraLight};\n }\n`;\ninterface ChoicesListProps {\n isCollapsed: boolean;\n}\nconst ChoicesList = styled.div`\n position: absolute;\n box-sizing: border-box;\n width: 100%;\n top: ${px(elementSizes.dropdownHeight + 7)};\n left: 0;\n opacity: ${(props: ChoicesListProps) => (props.isCollapsed ? 0 : 1)};\n pointer-events: ${(props: ChoicesListProps) => (props.isCollapsed ? \"none\" : \"all\")};\n max-height: 300px;\n overflow-y: auto;\n\n ${Choice} {\n :nth-child(1) {\n margin-top: 0;\n }\n }\n`;\n\ntype OptionValue = string | number;\ninterface Option {\n value: T;\n label: string;\n}\ninterface GenericSelectProps {\n options: [Option];\n value: Option;\n onChange: (value: T) => void;\n title: string;\n}\ninterface GenericSelectState {\n isCollapsed: boolean;\n}\nclass GenericSelect extends React.Component, GenericSelectState> {\n constructor(props: GenericSelectProps) {\n super(props);\n this.state = {\n isCollapsed: true,\n };\n this.toggleCollapsed = this.toggleCollapsed.bind(this);\n this.handleClickOutside = this.handleClickOutside.bind(this);\n }\n render() {\n const {options, onChange, value, title} = this.props;\n return (\n \n \n\n \n {options.map((option, i) => (\n {\n onChange(option.value);\n this.toggleCollapsed();\n }}\n >\n {title} \n {option.label}\n \n ))}\n \n \n );\n }\n\n handleClickOutside() {\n if (!this.state.isCollapsed) {\n this.setState({\n isCollapsed: true,\n });\n }\n }\n toggleCollapsed() {\n this.setState({\n isCollapsed: !this.state.isCollapsed,\n });\n }\n}\n\nexport default onClickOutside(GenericSelect);\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport {Caret} from \"../components\";\nimport {colors, smallBold, ButtonProps, CenteredDiv} from \"../models\";\n\nconst CTA = styled.a`\n ${smallBold};\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n position: relative;\n width: 100%;\n height: 50px;\n text-decoration: none;\n background-color: ${colors.white};\n color: ${colors.redDFL};\n border: 2px solid ${colors.redDFL};\n box-sizing: border-box;\n text-transform: uppercase;\n\n &:hover {\n background-color: ${colors.redDFL};\n color: ${colors.white};\n }\n`;\n\nconst CaretWrapper = styled(CenteredDiv)`\n position: absolute;\n width: 16px;\n height: 16px;\n top: 16px;\n right: 10px;\n transform: rotate(-90deg);\n`;\n\ninterface CtaState {\n hovered: boolean;\n}\nclass CTAComp extends React.Component {\n constructor(props: ButtonProps) {\n super(props);\n this.state = {\n hovered: false,\n };\n }\n\n render() {\n const {link, label} = this.props;\n\n return (\n this.setState({hovered: true})}\n onMouseLeave={() => this.setState({hovered: false})}\n >\n {label}\n \n \n \n );\n }\n}\n\nexport default CTAComp;\n","/**\n * Image component that shows a placeholder of the same dimensions until\n * has finished loading.\n * \n */\n\nimport React from \"react\";\n\ninterface ImageWithSpinnerProps {\n imageUrl: string;\n width: number;\n height: number;\n}\ninterface ImageWithSpinnerState {\n imageStatus: \"loading\" | \"loaded\" | \"failed to load\";\n}\nclass ImageWithSpinner extends React.Component {\n constructor(props: ImageWithSpinnerProps) {\n super(props);\n this.state = { imageStatus: \"loading\" };\n\n this.handleImageLoaded = this.handleImageLoaded.bind(this);\n this.handleImageErrored = this.handleImageErrored.bind(this);\n }\n\n handleImageLoaded() {\n this.setState({ imageStatus: \"loaded\" });\n }\n\n handleImageErrored() {\n this.setState({ imageStatus: \"failed to load\" });\n }\n\n render() {\n return (\n \n {!useVerticalVideo && (\n \n \n )}\n {useVerticalVideo && (\n \n \n )}\n \n );\n};\n\nexport default connect(mapStateToProps)(mainstageVideoComp);\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport {Caret} from \"../../components\";\nimport {\n colors,\n zIndices,\n mediumBold,\n ProductCategory,\n px,\n baseBold,\n componentBreakpoints,\n CenteredDiv,\n macroRegular,\n smallRegular,\n} from \"../../models\";\n\nconst Title = styled.div`\n ${baseBold};\n font-size: 18px;\n color: ${colors.white};\n text-transform: uppercase;\n line-height: 1.1em;\n margin-bottom: 7px;\n position: relative;\n z-index: ${zIndices.zTileText};\n\n /* desktop */\n @media (min-width: ${px(componentBreakpoints.categoryList)}) {\n ${mediumBold};\n color: ${colors.white};\n margin-bottom: 10px;\n line-height: 1.1em;\n }\n`;\nconst Text = styled.div`\n ${macroRegular};\n font-size: 11px;\n line-height: 1.3em;\n color: ${colors.white};\n position: relative;\n z-index: ${zIndices.zTileText};\n\n /* desktop */\n @media (min-width: ${px(componentBreakpoints.categoryList)}) {\n ${smallRegular};\n color: ${colors.white};\n line-height: 1.3em;\n }\n`;\n\nconst CaretIcon = styled(CenteredDiv)`\n background-color: ${colors.whiteAlpha60};\n width: 22px;\n height: 22px;\n position: absolute;\n right: 5px;\n bottom: 5px;\n\n /* desktop */\n @media (min-width: ${px(componentBreakpoints.categoryList)}) {\n width: 30px;\n height: 30px;\n }\n`;\nconst CaretWrapper = styled.div`\n width: 10px;\n height: 10px;\n transform: rotate(-90deg);\n margin-left: -12px;\n\n /* desktop */\n @media (min-width: ${px(componentBreakpoints.categoryList)}) {\n width: 16px;\n height: 16px;\n margin-left: 0;\n }\n`;\n\ninterface TileProps {\n color: string;\n image?: string;\n}\nconst Tile = styled.div`\n width: 100%;\n height: 100%;\n padding: 10px 20px 15px 10px;\n box-sizing: border-box;\n background-color: ${(props: TileProps) => props.color};\n background-image: ${(props: TileProps) => (props.image ? `url(${props.image})` : \"none\")};\n background-size: cover;\n position: relative;\n\n &:hover {\n ${Title} {\n text-decoration: underline;\n }\n }\n\n /* desktop */\n @media (min-width: ${px(componentBreakpoints.categoryList)}) {\n padding: 30px 20px;\n }\n`;\nconst TileOverlay = styled.div`\n width: 100%;\n height: 50%;\n background: rgb(0, 132, 255);\n background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);\n position: absolute;\n left: 0;\n top: 0;\n z-index: ${zIndices.zTileOverlay};\n`;\n\ninterface CategoryTileProps extends ProductCategory {\n isMobileNav?: boolean;\n}\nconst CategoryTile = (props: CategoryTileProps) => {\n const {title, description, color, image, isMobileNav} = props;\n return (\n \n {image && {title} \n {!isMobileNav && {description} }\n \n \n \n \n \n );\n};\n\nexport default CategoryTile;\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport {Link} from \"gatsby\";\nimport CategoryTile from \"./categoryTile\";\nimport {trackSubNavClick, SubNavType} from \"../../util/tracking\";\n\nimport {\n ProductCategory,\n px,\n componentBreakpoints,\n NavigationOverlayStateType,\n navigationOverlayStates,\n} from \"../../models\";\n\nconst Wrapper = styled.div`\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n flex-direction: row;\n display: none;\n\n /* desktop */\n @media (min-width: ${px(componentBreakpoints.categoryList)}) {\n display: flex;\n }\n`;\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n width: 100%;\n height: 100%;\n`;\nconst Column = styled.div`\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n`;\n\nconst Cell = styled.div`\n width: 100%;\n height: 100%;\n display: flex;\n`;\n\nconst CategoryLink = styled(props => )`\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n padding: 4px;\n`;\n\ninterface CloseOverlayLinkProps {\n updateNavigationOverlay: (newState: NavigationOverlayStateType) => void;\n category: ProductCategory;\n}\nconst CloseOverlayLink = (props: CloseOverlayLinkProps) => (\n {\n trackSubNavClick({type: SubNavType.Product, label: props.category.title, isMobile: false});\n props.updateNavigationOverlay(navigationOverlayStates.default);\n }}\n >\n \n \n {/* live */}\n \n
\n \n \n | \n \n | \n
\n \n\n \n \n {/* digital */}\n \n | \n\n {/* other 1 */}\n \n | \n \n\n \n \n | \n \n | \n \n | \n \n
\n \n );\n};\n\nexport default DesktopView;\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport {Link} from \"gatsby\";\nimport CategoryTile from \"./categoryTile\";\nimport {trackSubNavClick, SubNavType} from \"../../util/tracking\";\n\nimport {\n ProductCategory,\n px,\n breakpoints,\n RowDiv,\n ColumnDiv,\n baseBold,\n NavigationOverlayStateType,\n navigationOverlayStates,\n} from \"../../models\";\n\nconst MobileNavWrapper = styled(ColumnDiv)`\n position: relative;\n width: 100%;\n height: 100%;\n\n box-sizing: border-box;\n\n /* desktop */\n @media (min-width: ${px(breakpoints.desktopHd)}) {\n display: none;\n }\n`;\n\nconst Row = styled(RowDiv)`\n width: 100%;\n height: 100%;\n`;\n\nconst CategoryLink = styled(props => )`\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n padding: 4px;\n`;\n\nconst Headline = styled.div`\n ${baseBold};\n width: 100%;\n font-size: 18px;\n margin-bottom: 50px;\n text-transform: uppercase;\n text-align: center;\n`;\n\nconst Cell = styled.div`\n width: 100%;\n height: 100%;\n display: flex;\n`;\n\ninterface CloseOverlayLinkProps {\n updateNavigationOverlay: (newState: NavigationOverlayStateType) => void;\n category: ProductCategory;\n isMobileNav?: boolean;\n}\nconst CloseOverlayLink = (props: CloseOverlayLinkProps) => (\n {\n trackSubNavClick({type: SubNavType.Product, label: props.category.title, isMobile: true});\n props.updateNavigationOverlay(navigationOverlayStates.default);\n }}\n >\n \n \n );\n};\n\nexport default connect(\n null,\n mapDispatchToProps,\n)(CategoryListComp);\n// export default CategoryListComp;\n","import React from \"react\";\nimport {graphql, useStaticQuery} from \"gatsby\";\nimport {CategoryList} from \"../../components\";\nimport {wpPageNodeToCategory} from \"../../util/util\";\nimport {WPPageNodeProps, categoryClasses, wordpressPageIds} from \"../../models\";\n\ninterface QueryProps {\n allWpPage?: {\n edges: WPPageNodeProps[];\n };\n}\ninterface CategoryListWithQueryProps {\n isMobileNav?: boolean;\n}\n\nconst CategoryListWithQueryComp = (props: CategoryListWithQueryProps) => {\n const query: QueryProps = useStaticQuery(\n graphql`\n query {\n allWpPage {\n edges {\n node {\n databaseId\n slug\n category {\n categoryclass\n name\n description\n image {\n sourceUrl\n }\n }\n }\n }\n }\n }\n `,\n );\n\n const productPages = query.allWpPage.edges.filter(page => {\n return (\n page.node.databaseId === wordpressPageIds.bundesligaMatches ||\n page.node.databaseId === wordpressPageIds.matchInterviews ||\n page.node.databaseId === wordpressPageIds.matchHighlights ||\n page.node.databaseId === wordpressPageIds.digitalContent ||\n page.node.databaseId === wordpressPageIds.promoTrailerContent ||\n page.node.databaseId === wordpressPageIds.seasonalContent ||\n page.node.databaseId === wordpressPageIds.monthlyContent ||\n page.node.databaseId === wordpressPageIds.weeklyContent\n );\n });\n const matchdayCategories = productPages.filter(edge => edge.node.category.categoryclass === categoryClasses.matchday);\n const promotionCategories = productPages.filter(edge => edge.node.category.categoryclass === categoryClasses.promotion);\n const storytellingCategories = productPages.filter(\n edge => edge.node.category.categoryclass === categoryClasses.storytelling,\n );\n\n return (\n wpPageNodeToCategory(category))}\n digital={promotionCategories.map(category => wpPageNodeToCategory(category))}\n other={storytellingCategories.map(category => wpPageNodeToCategory(category))}\n isMobileNav={props.isMobileNav}\n />\n );\n};\n\nexport default CategoryListWithQueryComp;\n","import * as React from 'react';\nimport styled from 'styled-components';\nimport {px, stage, breakpoints, mobilePaddings} from \"../../models\";\nimport {createMarkup} from \"../../util/util\";\n\nimport {mediumBold, mediumLight} from \"../../models/style-constants\";\n\n\nconst MessageWrapper = styled.div`\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 0 ${px(mobilePaddings.mobile)};\n box-sizing: border-box;\n\n margin-top: 60px;\n margin-bottom: 20px;\n\n * {\n ${mediumLight};\n font-size: 25px;\n line-height: 1.5em;\n font-style: normal !important;\n text-decoration: none !important;\n }\n strong {\n ${mediumBold};\n font-size: 25px;\n line-height: 1.5em;\n }\n\n /* tablet */\n @media (min-width: ${px(breakpoints.tablet)}) {\n padding: 0 ${px(mobilePaddings.tablet)};\n margin-top: 0;\n margin-bottom: 0;\n\n * {\n font-size: 40px;\n line-height: 1.8em;\n font-style: normal !important;\n text-decoration: none !important;\n }\n strong {\n font-size: 40px;\n line-height: 1.8em;\n }\n }\n`;\n\nconst Message = styled.div`\n width: ${px(stage.innerWidth)};\n`;\n\ninterface USPMessageCompProps {\n message: string;\n}\nconst USPMessageComp = (props: USPMessageCompProps) => {\n const { message } = props;\n return (\n \n \n );\n};\n\nexport default USPMessageComp;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport {Link} from \"gatsby\";\nimport {ColorType, px, scheduleSizes, condensedMacroBold, condensedSmallBold, condensedSmallRegular} from \"../../../models\";\n\ninterface RegularCellProps {\n collapsed: boolean;\n backgroundColor: ColorType;\n opacity?: number;\n}\nexport const RegularCell = styled.td`\n width: ${(props: RegularCellProps) => props.collapsed ? px(scheduleSizes.collapsedColumnWidth) : \"initial\"};\n transition: width 0.5s, opacity 0.25s, color 0.5s;\n border: 1px solid white;\n box-sizing: border-box;\n vertical-align: top;\n text-align: left;\n background-color: ${(props: RegularCellProps) => props.backgroundColor};\n opacity: ${(props: RegularCellProps) => (props.opacity ? props.opacity : 1)};\n overflow: hidden;\n`;\n\nexport const CategoryAggregationCell = styled.td`\n width: ${px(scheduleSizes.categoryAggregationLabelColumn)};\n position: relative;\n padding: 0;\n`;\n\ninterface CategoryCellProps {\n color: ColorType;\n borderColor: ColorType;\n}\nexport const CategoryCell = styled.td`\n ${condensedMacroBold};\n text-transform: uppercase;\n width: ${px(scheduleSizes.categoryLabelColumn)};\n vertical-align: top;\n text-align: left;\n color: ${(props: CategoryCellProps) => props.color};\n border-left: 2px solid ${(props: CategoryCellProps) => props.borderColor};\n padding: 0 ${px(scheduleSizes.categoryLabelPadding)};\n box-sizing: content-box;\n`;\n\nexport const VerticalWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n`;\nexport const VerticalRegular = styled.div`\n ${condensedSmallRegular};\n text-transform: uppercase;\n`;\nexport const VerticalBold = styled.div`\n ${condensedSmallBold};\n text-transform: uppercase;\n white-space: nowrap;\n`;\n\nexport const FlippedTextContainer = styled.div`\n position: absolute;\n top: 0;\n left: 0;\n transform-origin: 0% 0%;\n transform: rotate(-90deg);\n`;\nexport const FlippedTextInner = styled.div`\n position: absolute;\n right: 0;\n`;\n\nexport const ContentTable = styled.table`\n width: 100%;\n height: 100%;\n border-spacing: 0;\n table-layout: fixed;\n`;\n\nexport const BroadcastEntryLink = styled(props => )`\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n`;\n","import {\n UPDATE_ACTIVE_MATCHDAYS,\n UPDATE_ACTIVE_SYNERGIES,\n UPDATE_HOVERED_DAY,\n UPDATE_UTC_TIME_OFFSET,\n UPDATE_SELECTED_VIEW,\n ScheduleActionTypes,\n} from \"./types\";\nimport {BroadcastProductType, UTCTimeStateType, ScheduleViewType} from \"../../models\";\n\nexport const updateActiveMatchdaysAction = (newMatchdays: [number, number]): ScheduleActionTypes => {\n return {\n type: UPDATE_ACTIVE_MATCHDAYS,\n payload: newMatchdays,\n };\n};\n\nexport const updateActiveSynergiesAction = (newSynergies: BroadcastProductType[]): ScheduleActionTypes => {\n return {\n type: UPDATE_ACTIVE_SYNERGIES,\n payload: newSynergies,\n };\n};\n\nexport const updateHoveredDayAction = (newDayIndex: number): ScheduleActionTypes => {\n return {\n type: UPDATE_HOVERED_DAY,\n payload: newDayIndex,\n };\n};\n\nexport const updateUTCTimeOffsetAction = (newTimeOffset: UTCTimeStateType): ScheduleActionTypes => {\n return {\n type: UPDATE_UTC_TIME_OFFSET,\n payload: newTimeOffset,\n };\n};\n\nexport const updateSelectedViewAction = (newView: ScheduleViewType): ScheduleActionTypes => {\n return {\n type: UPDATE_SELECTED_VIEW,\n payload: newView,\n };\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport {Dispatch} from \"redux\";\nimport {connect} from \"react-redux\";\nimport {\n RegularCell,\n CategoryAggregationCell,\n CategoryCell,\n BroadcastEntryLink,\n FlippedTextContainer,\n FlippedTextInner,\n} from \"../styled\";\nimport {Clock} from \"../../..\";\nimport {\n WeekDayType,\n condensedSmallBold,\n broadcastSynergyGroups,\n BroadcastProductType,\n ScheduleCategoryContentProps,\n UTCTimeStateType,\n utcTimeStates,\n DFL_UTC_OFFSET,\n timings,\n} from \"../../../../models\";\nimport {AppState} from \"../../../../store\";\nimport {updateActiveSynergiesAction, updateHoveredDayAction} from \"../../../../store/schedule/actions\";\nimport {createBroadcastDate, displayBroadcastTimeByLocalTimezoneOffset} from \"../../../../util/util\";\nimport {trackInternalLinkClick} from \"../../../../util/tracking\";\n\nconst TableRow = styled.tr``;\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n /* font-size: 13px; */\n`;\nconst CellInner = styled.div`\n width: 100%;\n height: 100%;\n padding-top: 8px;\n`;\nconst BroadcastEntry = styled(Row)`\n width: 100%;\n margin-bottom: 2px;\n`;\nconst LabelRow = styled(Row)`\n justify-content: space-between;\n align-items: flex-start;\n`;\nconst RowRight = styled(Row)`\n width: 220px;\n justify-content: space-between;\n`;\ninterface LabelProps {\n active: boolean;\n textColor: string;\n}\nconst Label = styled.div`\n ${condensedSmallBold};\n font-size: 13px;\n padding: 0;\n margin: 0;\n color: ${(props: LabelProps) => props.textColor};\n opacity: ${(props: LabelProps) => (props.active ? 1 : 0.3)};\n transition: opacity ${timings.hurried}ms;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n\n &:hover {\n text-decoration: underline;\n }\n`;\nconst SubLabel = styled(Label)`\n margin-left: 10px;\n`;\nconst TimeLabel = styled(Label)`\n width: 180px;\n justify-content: flex-start;\n\n &:hover {\n text-decoration: none;\n }\n`;\n\ninterface ClockWrapperProps {\n active: boolean;\n}\nconst ClockWrapper = styled.div`\n width: 15px;\n height: 15px;\n margin-right: 4px;\n opacity: ${(props: ClockWrapperProps) => (props.active ? 1 : 0.3)};\n transition: opacity ${timings.hurried}ms;\n`;\n\nconst SynergyDotWrapper = styled.div`\n width: 30px;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n`;\n\ninterface SynergyDotProps {\n active: boolean;\n color: string;\n}\nconst SynergyDot = styled.div`\n width: 6px;\n height: 6px;\n border-radius: 3px;\n background-color: ${(props: SynergyDotProps) => props.color};\n opacity: ${(props: SynergyDotProps) => (props.active ? 1 : 0)};\n transition: opacity ${timings.hurried}ms;\n`;\n\ninterface PropsFromState {\n activeSynergies: BroadcastProductType[];\n hoveredDay: number;\n localUTCOffset: number;\n selectedUTCOffset: UTCTimeStateType;\n}\nconst mapStateToProps = (state: AppState): PropsFromState => ({\n activeSynergies: state.schedule.activeBroadcastSynergies,\n hoveredDay: state.schedule.hoveredDay,\n localUTCOffset: state.system.utcOffset,\n selectedUTCOffset: state.schedule.selectedUTCTimeOffset,\n});\n\ninterface PropsFromDispatch {\n updateActiveSynergies: (newSynergies: BroadcastProductType[]) => void;\n updateHoveredDay: (newDayIndex: number) => void;\n}\nconst mapDispatchToProps = (dispatch: Dispatch): PropsFromDispatch => {\n return {\n updateActiveSynergies: (newSynergies: BroadcastProductType[]) => {\n return dispatch(updateActiveSynergiesAction(newSynergies));\n },\n updateHoveredDay: (newDayIndex: number) => {\n return dispatch(updateHoveredDayAction(newDayIndex));\n },\n };\n};\ninterface MatchdayCategoryRowProps extends PropsFromState, PropsFromDispatch {\n isSpan: boolean;\n span?: number;\n spanContent?: JSX.Element;\n content: ScheduleCategoryContentProps;\n activeMatchDays: [WeekDayType, WeekDayType];\n}\nconst MatchdayCategoryRow = (props: MatchdayCategoryRowProps) => {\n const {\n isSpan,\n span,\n spanContent,\n content,\n activeMatchDays,\n activeSynergies,\n updateActiveSynergies,\n updateHoveredDay,\n hoveredDay,\n localUTCOffset,\n selectedUTCOffset,\n } = props;\n const {categoryName, backgroundColor, labelColor, textColor, days} = content;\n\n return (\n \n {isSpan && (\n \n \n {spanContent} \n \n \n )}\n \n {categoryName}\n \n {days.map((day, dayIndex) => {\n const isCollapsed = !activeMatchDays.includes(dayIndex);\n const isDayHovered = hoveredDay === dayIndex;\n\n return (\n \n \n {!isCollapsed &&\n day.broadcastGroups.map((broadCastGroup, entryIndex) => {\n // check if any one broadcast of group is in the synergyGroup\n let isBroadcastGroupInActiveSynergyGroup = false;\n for (const broadcast of broadCastGroup.broadcasts) {\n if (activeSynergies.includes(broadcast.id)) {\n isBroadcastGroupInActiveSynergyGroup = true;\n }\n }\n\n // day.weekDay\n\n const linkTo = `/product/${broadCastGroup.productLink}`;\n\n return (\n \n \n \n\n trackInternalLinkClick({name: broadCastGroup.label, link: linkTo})}\n >\n \n {/* */}\n {\n const synergyGroup = broadcastSynergyGroups.filter(group => {\n return group.includes(broadCastGroup.broadcasts[0].id);\n });\n if (synergyGroup.length > 0) {\n updateActiveSynergies(synergyGroup[0]);\n updateHoveredDay(dayIndex);\n }\n }}\n onMouseLeave={() => {\n updateActiveSynergies([]);\n updateHoveredDay(null);\n }}*/\n >\n \n {broadCastGroup.label}\n \n \n {broadCastGroup.subLabel}\n \n \n\n \n {broadCastGroup.broadcasts.map((broadcast, broadcastIndex) => {\n // for each broadcast in broadcast group\n const utcOffsetToUse =\n selectedUTCOffset === utcTimeStates.localTime ? localUTCOffset : DFL_UTC_OFFSET;\n\n const isBroadcastInActiveSynergyGroup = activeSynergies.includes(broadcast.id);\n const broadCastDate = broadcast.time ?\n broadcast.time.anyTime ? 'Any time' : displayBroadcastTimeByLocalTimezoneOffset(\n utcOffsetToUse,\n createBroadcastDate(\n broadcast.time.day,\n broadcast.time.hours,\n broadcast.time.minutes,\n ),\n day.weekDay,\n )\n : null;\n\n return (\n broadcast.time && (\n {\n const synergyGroup = broadcastSynergyGroups.filter(group => {\n return group.includes(broadcast.id);\n });\n if (synergyGroup.length > 0) {\n updateActiveSynergies(synergyGroup[0]);\n updateHoveredDay(dayIndex);\n }\n }}\n onMouseLeave={() => {\n updateActiveSynergies([]);\n updateHoveredDay(null);\n }}*/\n >\n \n \n \n {broadCastDate}\n
\n \n )\n );\n })}\n \n \n \n \n );\n })}\n \n \n );\n })}\n \n );\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps,\n)(MatchdayCategoryRow);\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport {RegularCell, CategoryAggregationCell, CategoryCell} from \"../styled\";\nimport {px, scheduleSizes, WeekDayType, colors, scheduleWeek, weekDayMap, condensedSmallBold} from \"../../../../models\";\n\nconst DayLabelRow = styled.tr`\n height: ${px(scheduleSizes.dayLabelRow)};\n`;\n\ninterface LabelCellProps {\n centered: boolean;\n}\nconst LabelCell = styled(RegularCell)`\n${condensedSmallBold};\n font-size: 13px;\n color: white;\n text-transform: uppercase;\n text-align: ${(props: LabelCellProps) => (props.centered ? \"center\" : \"left\")};\n padding-left: ${(props: LabelCellProps) => (props.centered ? 0 : px(15))};\n vertical-align: middle;\n`;\n\ninterface DayLabelRowCompProps {\n activeMatchDays: [WeekDayType, WeekDayType];\n}\nconst DayLabelRowComp = (props: DayLabelRowCompProps) => {\n const {activeMatchDays} = props;\n\n return (\n \n \n {isDayCollapsed ? weekDayMap.get(day).shortName : weekDayMap.get(day).fullName}\n \n );\n })}\n \n );\n};\n\nexport default DayLabelRowComp;\n","import * as React from 'react';\nimport MatchdayCategoryRow from \"./matchdayCategoryRow\";\nimport DayLabelRow from \"./dayLabelRow\";\nimport styled from 'styled-components';\nimport {condensedSmallRegular, condensedSmallBold, ScheduleCategoryContentProps} from \"../../../../models\";\n\nconst ContentTable = styled.table`\n width: 100%;\n height: 100%;\n border-spacing: 0;\n table-layout: fixed;\n`;\nconst VerticalWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n`;\nconst VerticalRegular = styled.div`\n ${condensedSmallRegular};\n text-transform: uppercase;\n`;\nconst VerticalBold = styled.div`\n ${condensedSmallBold};\n text-transform: uppercase;\n white-space: nowrap;\n`;\n\ninterface AroundMatchdaysProps {\n categories: ScheduleCategoryContentProps[];\n activeMatchDays: [number, number];\n}\nconst aroundMatchdaysComp = (props: AroundMatchdaysProps) => {\n const {categories, activeMatchDays} = props;\n return (\n \n \n {/* day labels */}\n \n Bundesliga \n Matchday \n \n }\n content={categories[0]}\n activeMatchDays={activeMatchDays}\n />\n\n {/* bundesliga matches row */}\n \n Bundesliga \n Storytelling & Promotion \n \n }\n content={categories[4]}\n activeMatchDays={activeMatchDays}\n />\n\n {/* weekly content row */}\n \n \n );\n};\n\nexport default aroundMatchdaysComp;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport {Dispatch} from \"redux\";\nimport {connect} from \"react-redux\";\nimport {\n RegularCell,\n CategoryAggregationCell,\n CategoryCell,\n FlippedTextContainer,\n FlippedTextInner,\n BroadcastEntryLink,\n} from \"../styled\";\nimport {\n BroadcastProductType,\n UTCTimeStateType,\n ScheduleAroundSeasonContentProps,\n condensedMicroBold,\n condensedMicroRegular,\n ColumnDiv,\n RowDiv,\n ColorType,\n colors,\n} from \"../../../../models\";\nimport {AppState} from \"../../../../store\";\nimport {updateActiveSynergiesAction, updateHoveredDayAction} from \"../../../../store/schedule/actions\";\n\nconst TableRow = styled.tr``;\n\ninterface TitleProps {\n textColor: string;\n}\nconst SeasonalProduct = styled(ColumnDiv)`\n width: 100%;\n margin-top: 10px;\n`;\nconst TitleRow = styled(RowDiv)``;\nconst Title = styled.div`\n ${condensedMicroBold};\n padding: 0;\n margin: 0;\n color: ${(props: TitleProps) => props.textColor};\n`;\ninterface EnhancementProps {\n color: ColorType;\n}\nconst Enhancement = styled.div`\n ${condensedMicroBold};\n background-color: ${(props: EnhancementProps) => props.color};\n color: ${colors.white};\n text-transform: uppercase;\n padding: 2px 4px 0;\n margin-right: 4px;\n margin-bottom: 1px;\n`;\n\nconst Description = styled.div`\n ${condensedMicroRegular};\n font-size: 12px;\n padding: 0;\n margin-top: -2px;\n color: ${(props: TitleProps) => props.textColor};\n`;\n\nconst SeasonCell = styled(RegularCell)`\n padding: 0 30px 0 30px;\n`;\n\ninterface PropsFromState {\n activeSynergies: BroadcastProductType[];\n hoveredDay: number;\n localUTCOffset: number;\n selectedUTCOffset: UTCTimeStateType;\n}\nconst mapStateToProps = (state: AppState): PropsFromState => ({\n activeSynergies: state.schedule.activeBroadcastSynergies,\n hoveredDay: state.schedule.hoveredDay,\n localUTCOffset: state.system.utcOffset,\n selectedUTCOffset: state.schedule.selectedUTCTimeOffset,\n});\n\ninterface PropsFromDispatch {\n updateActiveSynergies: (newSynergies: BroadcastProductType[]) => void;\n updateHoveredDay: (newDayIndex: number) => void;\n}\nconst mapDispatchToProps = (dispatch: Dispatch): PropsFromDispatch => {\n return {\n updateActiveSynergies: (newSynergies: BroadcastProductType[]) => {\n return dispatch(updateActiveSynergiesAction(newSynergies));\n },\n updateHoveredDay: (newDayIndex: number) => {\n return dispatch(updateHoveredDayAction(newDayIndex));\n },\n };\n};\ninterface CategoryRowProps extends PropsFromState, PropsFromDispatch {\n isSpan: boolean;\n span?: number;\n spanContent?: JSX.Element;\n content: ScheduleAroundSeasonContentProps;\n}\nconst SeasonCategoryRow = (props: CategoryRowProps) => {\n const {isSpan, span, spanContent, content} = props;\n const {categoryName, backgroundColor, labelColor, textColor, seasons} = content;\n\n return (\n \n {isSpan && (\n \n \n {spanContent} \n \n \n )}\n \n {categoryName}\n \n {seasons.map((season, seasonIndex) => {\n return (\n \n {season.seasonalProducts.map((product, productIndex) => {\n return (\n \n \n \n {product.enhancement && (\n {product.enhancement.label} \n )}\n {product.label} \n \n\n {product.description} \n \n \n );\n })}\n \n );\n })}\n \n );\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps,\n)(SeasonCategoryRow);\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport {CategoryAggregationCell, CategoryCell, RegularCell} from \"../styled\";\nimport {px, scheduleSizes, colors, seasonMap, condensedSmallBold, seasons} from \"../../../../models\";\n\nconst SeasonLabelRow = styled.tr`\n height: ${px(scheduleSizes.dayLabelRow)};\n`;\n\nconst LabelCell = styled(RegularCell)`\n ${condensedSmallBold};\n font-size: 13px;\n color: white;\n text-transform: uppercase;\n padding-left: ${px(15)};\n vertical-align: middle;\n`;\n\nconst SeasonLabelRowComp = () => {\n return (\n \n \n {seasonMap.get(season).name}\n \n );\n })}\n \n );\n};\n\nexport default SeasonLabelRowComp;\n","import * as React from 'react';\nimport SeasonCategoryRow from \"./seasonCategoryRow\";\nimport SeasonLabelRow from \"./seasonLabelRow\";\nimport {VerticalBold, VerticalRegular, VerticalWrapper, ContentTable} from \"../styled\";\nimport {ScheduleAroundSeasonContentProps} from \"../../../../models\";\n\ninterface AroundMatchdaysProps {\n categories: ScheduleAroundSeasonContentProps[];\n}\nconst aroundSeasonComp = (props: AroundMatchdaysProps) => {\n const {categories} = props;\n return (\n \n \n {/* season labels */}\n \n Bundesliga \n Storytelling & Promotion \n \n }\n content={categories[1]}\n />\n\n {/* monthly content row */}\n \n \n );\n};\n\nexport default aroundSeasonComp;\n","import * as React from \"react\";\nimport {Link} from \"gatsby\";\nimport styled from \"styled-components\";\nimport Slider from \"react-slick\";\nimport {Clock} from \"../../../../components\";\nimport {\n ScheduleCategoryContentProps,\n px,\n breakpoints,\n weekDayMap,\n ColorType,\n ColumnDiv,\n colors,\n condensedSmallBold,\n CenteredDiv,\n RowDiv,\n ScheduleAroundSeasonContentProps,\n ScheduleViewType,\n scheduleViews,\n seasonMap,\n condensedMicroBold,\n} from \"../../../../models\";\nimport {leftPad} from \"../../../../util/util\";\n\nconst ScheduleMobile = styled.div`\n display: block;\n margin: 0 auto 80px;\n width: 100%;\n max-width: 600px;\n\n /* desktop */\n @media (min-width: ${px(breakpoints.desktopHd)}) {\n display: none;\n }\n`;\n\n// Toggle Buttons\ninterface ToggleButtonProps {\n active: boolean;\n}\nconst ToggleButton = styled.button`\n ${condensedMicroBold};\n color: ${(props: ToggleButtonProps) => (props.active ? colors.grayMediumDark : colors.black)};\n border: ${(props: ToggleButtonProps) => (props.active ? `1px solid ${colors.grayMediumDark}` : \"none\")};\n border-radius: 3px;\n padding: 2px 6px 8px;\n text-transform: uppercase;\n background-color: ${colors.white};\n cursor: pointer;\n`;\nconst ToggleButtonWrapper = styled(RowDiv)`\n justify-content: center;\n margin-bottom: 15px;\n\n ${ToggleButton} {\n &:nth-child(1) {\n margin-right: 10px;\n }\n }\n`;\n\n// Schedule Items\ninterface CategoryRowProps {\n color: ColorType;\n}\nconst CategoriesWrapper = styled(ColumnDiv)`\n height: 550px;\n margin-bottom: 50px;\n\n\n @media (min-width: ${px(380)}) {\n height: 450px;\n }\n`;\ninterface CategoryRowProps {\n hasMargin?: boolean;\n}\nconst CategoryRow = styled.div`\n flex: 1;\n background-color: ${(props: CategoryRowProps) => props.color};\n padding: 3px 20px 8px;\n margin: ${(props: CategoryRowProps) => (props.hasMargin ? \"1px 0\" : 0)};\n`;\ninterface CategoryLabelProps {\n color?: ColorType;\n}\nconst CategoryLabel = styled.div`\n ${condensedSmallBold};\n font-size: 9px;\n text-transform: uppercase;\n color: ${(props: CategoryLabelProps) => (props.color ? props.color : colors.white)};\n opacity: 0.6;\n`;\nconst BroadcastEntryLink = styled(props => )``;\n\nconst DayLabel = styled(CenteredDiv)`\n ${condensedSmallBold};\n font-size: 13px;\n background-color: ${colors.black};\n color: white;\n text-transform: uppercase;\n text-align: center;\n margin-bottom: 2px;\n padding: 4px;\n`;\nconst BroadcastEntry = styled(RowDiv)`\n justify-content: space-between;\n`;\ninterface BroadcastLabelProps {\n textColor?: ColorType;\n}\nconst BroadcastLabel = styled.div`\n ${condensedSmallBold};\n font-size: 15px;\n padding: 0;\n margin: 0;\n color: ${(props: BroadcastLabelProps) => (props.textColor ? props.textColor : colors.white)};\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-bottom: 2px;\n\n &:hover {\n text-decoration: underline;\n }\n`;\nconst SubLabel = styled(BroadcastLabel)`\n font-size: 13px;\n margin-left: 8px;\n\n &:hover {\n text-decoration: none;\n }\n`;\nconst TimeLabel = styled(SubLabel)`\n margin-left: 0;\n\n &:hover {\n text-decoration: none;\n }\n`;\nconst ClockWrapper = styled.div`\n width: 15px;\n height: 15px;\n margin-right: 4px;\n`;\nconst RowRight = styled(RowDiv)`\n width: 140px;\n justify-content: space-between;\n\n @media (min-width: ${px(380)}) {\n width: 160px;\n }\n`;\n\n// Carousel Dots\nconst CustomDot = styled.div`\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: ${colors.grayMedium};\n`;\nconst CustomDotsList = styled.ul`\n padding: 0;\n margin: 0;\n\n & li.slick-active {\n ${CustomDot} {\n background-color: ${colors.white};\n border: 1px solid ${colors.grayMedium};\n }\n }\n`;\n\ninterface ScheduleMobileCompProps {\n matchdaysCategories: ScheduleCategoryContentProps[];\n seasonCategories: ScheduleAroundSeasonContentProps[];\n selectedView: ScheduleViewType;\n updateSelectedView: (newView: ScheduleViewType) => void;\n}\nconst ScheduleMobileComp = (props: ScheduleMobileCompProps) => {\n const {matchdaysCategories, seasonCategories, selectedView, updateSelectedView} = props;\n\n const settings = {\n dots: true,\n infinite: true,\n slidesToShow: 1,\n slidesToScroll: 1,\n initialSlide: 2,\n appendDots: dots => (\n \n {dots} \n
\n ),\n customPaging: (_i: number) => \n
\n );\n }\n}\nexport default ImageWithSpinner;\n\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport {connect} from \"react-redux\";\nimport {AppState} from \"../../store\";\nimport {colors} from \"../../models\";\n\ninterface PropsFromState {\n screenWidth: number;\n}\nconst mapStateToProps = (state: AppState): PropsFromState => {\n return {\n screenWidth: state.system.screenWidth,\n };\n};\n\nconst Wrapper = styled.div`\n position: relative;\n width: 100%;\n height: 100%;\n background-color: ${colors.black};\n z-index: 1;\n`;\n\ninterface MainStageVideoProps {\n useVerticalVideo: boolean;\n}\nconst MainStageVideo = styled.video`\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n z-index: 1;\n\n /* depending on either using vertical or horizontal video, make the video fit the container */\n ${(props: MainStageVideoProps) => {\n return props.useVerticalVideo\n ? `\n @media screen and (max-aspect-ratio: 9/16) {\n height: 100%;\n }\n @media screen and (min-aspect-ratio: 9/16) {\n width: 100%;\n }\n `\n : `\n @media screen and (max-aspect-ratio: 16/9) { /* taller than 16:9 */\n height: 100%;\n }\n @media screen and (min-aspect-ratio: 16/9) { /* 16:9 or flatter */\n width: 100%;\n }\n `;\n }}\n`;\n\ninterface MainstageVideoCompProps extends PropsFromState {\n srcHorizontal: string;\n srcVertical: string;\n}\nconst mainstageVideoComp = (props: MainstageVideoCompProps) => {\n const {srcHorizontal, srcVertical, screenWidth} = props;\n const useVerticalVideo = screenWidth < 480;\n\n return (\n \n {/* CategoryList in mobile navigation overlay */}\n {isMobileNav && (\n \n {/* first row: Live Match */}\n \n \n | \n \n | \n
\n\n {/* second row: Match Highlights + Match Interviews */}\n \n \n | \n \n | \n
\n\n \n \n | \n \n | \n
\n\n \n \n | \n \n | \n
\n \n )}\n\n {/* CategoryList on mobile landing page */}\n {!isMobileNav && (\n \n Bundesliga Products \n \n )}\n
\n );\n};\n\nexport default MobileView;\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport {connect} from \"react-redux\";\nimport {Dispatch} from \"redux\";\nimport DesktopView from \"./DesktopView\";\nimport MobileView from \"./MobileView\";\n// import NavDropdownView from \"./NavDropdownView\"; // TODO: vllt doch genutzt\nimport {ProductCategory, px, breakpoints, NavigationOverlayStateType} from \"../../models\";\nimport {updateNavigationOverlayAction} from \"../../store/system/actions\";\n\n// COMPONENT PROPERTIES\n// interface PropsFromState {}\n// const mapStateToProps = (state: AppState): PropsFromState => {\n// return {};\n// };\n\ninterface PropsFromDispatch {\n updateNavigationOverlay: (newState: NavigationOverlayStateType) => void;\n}\nconst mapDispatchToProps = (dispatch: Dispatch): PropsFromDispatch => {\n return {\n updateNavigationOverlay: (newState: NavigationOverlayStateType) => {\n return dispatch(updateNavigationOverlayAction(newState));\n },\n };\n};\n\nconst Wrapper = styled.div`\n width: 100%;\n height: 100%;\n\n /* desktop */\n @media (min-width: ${px(breakpoints.desktopHd)}) {\n }\n`;\n\ninterface CategoryListCompProps extends PropsFromDispatch {\n live: ProductCategory[];\n digital: ProductCategory[];\n other: ProductCategory[];\n isMobileNav?: boolean;\n}\nconst CategoryListComp = (props: CategoryListCompProps) => {\n return (\n \n {/* first row: Live Match */}\n \n \n \n
\n\n {/* second row: Match Highlights + Match Interviews */}\n \n \n | \n \n | \n
\n\n \n \n \n | \n \n\n \n \n \n | \n \n \n \n | \n \n \n
\n\n \n \n | \n \n | \n
\n
\n \n {weekDayMap.get(currentDay.weekDay).fullName} \n\n \n {matchdaysCategories.map((category, categoryIndex) => {\n const dayEntry = category.days.find(day => day.weekDay === currentDay.weekDay);\n\n return (\n \n \n {category.categoryName}\n \n\n {dayEntry.broadcastGroups.map((group, groupIndex) => (\n \n \n \n {group.label} \n {group.subLabel} \n \n \n\n \n {group.broadcasts.map((broadcast, broadcastIndex) => {\n return (\n broadcast.time && (\n \n \n \n \n {`${broadcast.time.hours}:${leftPad(\n broadcast.time.minutes,\n )}`} \n \n \n )\n );\n })}\n \n \n ))}\n \n );\n })}\n \n
\n ))}\n \n {seasonMap.get(currentSeason.season).name} \n\n \n {seasonCategories.map((seasonCategory, seasonCategoryIndex) => {\n const seasonEntry = seasonCategory.seasons.find(season => season.season === currentSeason.season);\n\n return (\n \n {seasonCategory.categoryName} \n\n {seasonEntry.seasonalProducts.map((seasonalProduct, groupIndex) => (\n \n \n \n {seasonalProduct.label}\n \n \n \n ))}\n \n );\n })}\n \n
\n ))}\n \n \n \n | \n\n \n | \n \n\n \n \n \n trackFooterLinkClick(legalNoticeLabel)}\n >\n {legalNoticeLabel}\n \n\n | \n\n trackFooterLinkClick(privacyPolicyLabel)}\n >\n {privacyPolicyLabel}\n \n\n | \n\n trackFooterLinkClick(imprintLabel)}\n >\n {imprintLabel}\n \n \n\n © 2024 DFL Deutsche Fußball Liga e.V. \n \n \n
\n );\n }}\n />\n );\n};\n\nexport default ContactListComp;\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport {\n colors,\n smallRegular,\n smallBold,\n ContactPersonProps,\n px,\n breakpoints,\n microBold,\n microRegular,\n} from \"../../models\";\nimport {decryptMail} from \"../../util/util\";\n\nconst ContactCard = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n max-width: 100%;\n overflow: auto;\n\n /* tablet */\n @media (min-width: ${px(breakpoints.tablet)}) {\n width: 520px;\n max-width: 520px;\n display: flex;\n flex-direction: row;\n align-items: center;\n margin: 10px 40px 30px;\n overflow: auto;\n }\n\n /* Desktop HD */\n @media (min-width: ${px(breakpoints.desktopHd)}) {\n }\n`;\n\ninterface AvaterProps {\n src: string;\n}\nconst Avatar = styled.div`\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n background-image: url(${(props: AvaterProps) => props.src});\n width: 70px;\n height: 70px;\n border-radius: 50%;\n align-self: center;\n margin-bottom: 16px;\n\n /* tablet */\n @media (min-width: ${px(breakpoints.tablet)}) {\n width: 100px;\n height: 100px;\n margin-bottom: 0;\n }\n`;\n\nconst ContactDetails = styled.div`\n margin-left: 0;\n\n /* tablet */\n @media (min-width: ${px(breakpoints.tablet)}) {\n margin-left: 50px;\n }\n\n /* Desktop HD */\n @media (min-width: ${px(breakpoints.desktopHd)}) {\n }\n`;\n\nconst Title = styled.div`\n ${microBold};\n text-align: center;\n margin-bottom: 6px;\n\n /* tablet */\n @media (min-width: ${px(breakpoints.tablet)}) {\n ${smallBold};\n margin-bottom: 10px;\n }\n`;\n\nconst Text = styled.div`\n ${microRegular};\n text-align: center;\n max-width: 340px;\n\n /* tablet */\n @media (min-width: ${px(breakpoints.tablet)}) {\n ${smallRegular};\n }\n`;\n\n// @ts-ignore //TODO: Fehler mit styled() ?\nconst Email = styled(Text)`\n color: ${colors.redDFL};\n cursor: pointer;\n\n /* tablet */\n @media (min-width: ${px(breakpoints.tablet)}) {\n color: ${colors.redDFL};\n }\n`;\n\nconst ContactCardComp = (props: ContactPersonProps) => {\n const {avatar, name, position, position_two, phone, email} = props;\n\n return (\n \n \n \n
\n );\n })}\n \n \n ))}\n
\n
\n \n
\n );\n })}\n \n {visualElement} \n\n {infoBox}\n
\n )}\n \n \n {({measureRef: mapRef}) => (\n \n {text}\n }\n visualElement={ \n )}\n \n
\n );\n }\n\n handleResize(contentRect: ContentRect) {\n this.setState({\n fullWidth: (contentRect.entry && contentRect.entry.width) || 0,\n });\n }\n}\n\nexport default ProductIntroComp;\n","import * as React from \"react\";\nimport styled from \"styled-components\";\nimport Measure, {ContentRect} from \"react-measure\";\nimport {stage, px} from \"../models\";\n\n\n// Image\nconst PinnedImageRow = styled.div`\n width: 100%;\n max-width: ${px(stage.maxWidth)};\n margin: auto;\n display: flex;\n flex-direction: row;\n`;\n\ninterface ContentWrapperProps {\n marginLeft: number;\n width: number;\n}\nconst ContentWrapper = styled.div`\n margin-left: ${(props: ContentWrapperProps) => px(props.marginLeft)};\n width: ${(props: ContentWrapperProps) => px(props.width)};\n`;\n\n\ninterface ImageWrapperProps {\n marginLeft: number;\n width: number;\n isLeft: boolean;\n}\nconst VisualContentWrapper = styled.div`\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n margin-left: ${(props: ImageWrapperProps) => px(props.marginLeft)};\n order: ${(props: ImageWrapperProps) => props.isLeft ? -1 : 1};\n width: ${(props: ImageWrapperProps) => px(props.width)};\n height: ${(props: ImageWrapperProps) => px((props.width / 16) * 9)};\n overflow: hidden;\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n`;\n\n\n// COMPONENT\ninterface PinnedImageRowCompProps {\n stageWidth: number;\n visualPosition: \"left\" | \"right\";\n visualElement: JSX.Element;\n contentElement: JSX.Element;\n contentWidth: number;\n gapWidth: number;\n}\ninterface PinnedImageRowCompState {\n elementWidth: number;\n}\nclass PinnedImageRowComp extends React.Component{item.title}
\n{label}
\n \n {name} \n {phone} \n {email} \n {trimWebsiteUrl(website)} \n
\n \n
\n \n {resultsEmpty ? (\n \n \n \n {searchTerm} could not be matched. Explore our products\n \n \n\n {this.props.products\n .filter(product => product.type === \"category\")\n .map((category, categoryIndex) => {\n return (\n updateHoveredLink(category.link)}\n onMouseLeave={() => updateHoveredLink(null)}\n >\n {category.name} \n {category.subline} \n \n );\n })}\n \n ) : (\n \n {children}\n \n )}\n
\n );\n }\n}\n\nexport default SuggestionContainerComp;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport Autosuggest from \"react-autosuggest\";\nimport match from \"autosuggest-highlight/match\";\nimport parse from \"autosuggest-highlight/parse\";\nimport {navigate} from \"gatsby\";\nimport {Dispatch} from \"redux\";\nimport {connect} from \"react-redux\";\nimport SuggestionContainer from \"./suggestionContainer\";\nimport {Magnifier} from \"../../../components\";\nimport {\n smallBold,\n smallRegular,\n colors,\n ColorType,\n SearchableProductProps,\n px,\n CenteredDiv,\n NavigationOverlayStateType,\n navigationOverlayStates,\n breakpoint,\n} from \"../../../models\";\nimport {escapeRegexCharacters} from \"../../../util/util\";\nimport {trackSearchButtonClick, trackSuggestionClick} from \"../../../util/tracking\";\nimport {AppState} from \"../../../store\";\nimport {updateIsTextFilterActiveAction} from \"../../../store/system/actions\";\n\n// COMPONENT PROPERTIES\ninterface PropsFromState {\n isNavigationInverted: boolean;\n overlayState: NavigationOverlayStateType;\n}\nconst mapStateToProps = (state: AppState): PropsFromState => ({\n isNavigationInverted: state.system.isNavigationInverted,\n overlayState: state.system.overlayState,\n});\n\ninterface PropsFromDispatch {\n updateIsTextFilterActive: (isActive: boolean) => void;\n}\nconst mapDispatchToProps = (dispatch: Dispatch): PropsFromDispatch => {\n return {\n updateIsTextFilterActive: (isActive: boolean) => {\n return dispatch(updateIsTextFilterActiveAction(isActive));\n },\n };\n};\n\nconst Row = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n`;\n\n// collapsable container\ninterface IconContainerCollapsableProps {\n collapsed: boolean;\n}\nconst IconContainerCollapsable = styled(Row)`\n width: ${(props: IconContainerCollapsableProps) => (props.collapsed ? px(32) : px(300))};\n transition: width 0.2s;\n\n ${breakpoint.s.down} {\n width: ${(props: IconContainerCollapsableProps) => (props.collapsed ? px(32) : px(220))};\n };\n\n ${breakpoint.xs.down} {\n width: ${(props: IconContainerCollapsableProps) => (props.collapsed ? px(32) : px(160))};\n };\n`;\nconst IconWrapper = styled(CenteredDiv)`\n width: 32px;\n height: 32px;\n flex-shrink: 0;\n cursor: pointer;\n`;\nconst CollapsableContent = styled.div`\n flex-shrink: 1;\n overflow: hidden;\n opacity: ${(props: IconContainerCollapsableProps) => (props.collapsed ? 0 : 1)};\n transition: opacity 0.2s ease-in 0.1s;\n position: relative;\n`;\n\n// the autosuggest elements\ninterface AutosuggestWrapperProps {\n collapsed: boolean;\n}\nconst AutosuggestWrapper = styled.div`\n position: absolute;\n top: 4px;\n right: 0;\n width: ${(props: AutosuggestWrapperProps) => (props.collapsed ? 0 : px(300 - 32))};\n opacity: ${(props: AutosuggestWrapperProps) => (props.collapsed ? 0 : 1)};\n transition: opacity 0.2s, width 0.2s;\n\n ${breakpoint.s.down} {\n width: ${(props: AutosuggestWrapperProps) => (props.collapsed ? 0 : px(220 - 32))};\n };\n\n ${breakpoint.xs.down} {\n width: ${(props: AutosuggestWrapperProps) => (props.collapsed ? 0 : px(160 - 32))};\n };\n`;\n\nconst StyledInput = styled.input`\n ${smallRegular};\n outline: none;\n border: none;\n outline-width: 0;\n caret-color: ${colors.redDFL};\n border-bottom: 1px solid ${colors.grayLight};\n width: 100%;\n`;\n\nconst SuggestionTitle = styled.div`\n ${smallBold};\n`;\ninterface SuggestionTitleSpanProps {\n color: ColorType;\n}\nconst SuggestionTitleSpan = styled.span`\n color: ${(props: SuggestionTitleSpanProps) => props.color};\n`;\nconst SuggestionSubline = styled.div`\n ${smallRegular};\n`;\nconst SuggestionLink = styled.div`\n background-color: ${colors.white};\n padding: 8px 10px;\n display: block;\n border: 1px solid ${colors.grayMedium};\n margin-top: -1px;\n\n &:hover {\n background-color: ${colors.grayUltraLight};\n }\n`;\n\n// COMPONENT\ninterface TextFilterProps extends PropsFromState, PropsFromDispatch {\n products: SearchableProductProps[];\n}\ninterface TextFilterState {\n value: string;\n suggestions: SearchableProductProps[];\n isCollapsed: boolean;\n hoveredLink: string;\n}\nclass TextFilter extends React.Component\n \n \n \n \n\n \n \n
\n );\n }\n\n onChange = (_event: React.FormEvent, {newValue}) => {\n this.setState({\n value: newValue,\n });\n };\n\n onKeyDown = (event: React.KeyboardEvent