@ndla/ui 4.3.2 → 4.3.3-alpha.12

package/es/Filter/FilterCarousel.js

@@ -0,0 +1,198 @@
+import _styled from "@emotion/styled-base";
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { 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)."; }
+
+/**
+ * Copyright (c) 2021-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import React, { useLayoutEffect, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { css } from '@emotion/core';
+import { ChevronLeft, ChevronRight } from '@ndla/icons/common';
+import { useSwipeable } from 'react-swipeable';
+import { jsx as ___EmotionJSX } from "@emotion/core";
+
+var Carousel = _styled("div", {
+  target: "e3ylyeu0",
+  label: "Carousel"
+})(process.env.NODE_ENV === "production" ? {
+  name: "12as12q",
+  styles: "overflow-x:hidden;position:relative;margin:0 13px;"
+} : {
+  name: "12as12q",
+  styles: "overflow-x:hidden;position:relative;margin:0 13px;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpbHRlckNhcm91c2VsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQjJCIiwiZmlsZSI6IkZpbHRlckNhcm91c2VsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIxLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Q2hpbGQsIHVzZUxheW91dEVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcbmltcG9ydCB7IENoZXZyb25MZWZ0LCBDaGV2cm9uUmlnaHQgfSBmcm9tICdAbmRsYS9pY29ucy9jb21tb24nO1xuaW1wb3J0IHsgdXNlU3dpcGVhYmxlIH0gZnJvbSAncmVhY3Qtc3dpcGVhYmxlJztcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgY2hpbGRyZW46IFJlYWN0Q2hpbGRbXTtcbn1cblxuY29uc3QgQ2Fyb3VzZWwgPSBzdHlsZWQuZGl2YFxuICBvdmVyZmxvdy14OiBoaWRkZW47XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgbWFyZ2luOiAwIDEzcHg7XG5gO1xuXG5jb25zdCBJbm5lciA9IHN0eWxlZC5kaXZgXG4gIGZsZXgtd3JhcDogbm93cmFwO1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4zcztcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIHBhZGRpbmc6IDhweCAwO1xuYDtcblxuY29uc3QgTmF2QnV0dG9uID0gc3R5bGVkKCdidXR0b24nKTx7XG4gIGhpZGU/OiBib29sZWFuO1xuICBhbGlnblJpZ2h0PzogYm9vbGVhbjtcbn0+YFxuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICB3aWR0aDogNDhweDtcbiAgaGVpZ2h0OiA0OHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBib3JkZXI6IG5vbmU7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGJvcmRlci1yYWRpdXM6IDEwMHB4O1xuICB0cmFuc2l0aW9uOiBvcGFjaXR5IDAuNXMgZWFzZSwgdHJhbnNmb3JtIDAuNXMgZWFzZTtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoMHB4LCAwcHgsIDEpO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGJvdHRvbTogMDtcbiAgdG9wOiA0cHg7XG4gIHotaW5kZXg6IDM7XG4gIGxlZnQ6IDNweDtcblxuICBzdmcge1xuICAgIGNvbG9yOiAjMjA1ODhmO1xuICB9XG5cbiAgJjpob3ZlciB7XG4gICAgYm94LXNoYWRvdzogMCAwIDRweCByZ2JhKDAsIDAsIDAsIDAuMjQpO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgfVxuXG4gICR7KHByb3BzKSA9PlxuICAgIHByb3BzLmhpZGUgJiZcbiAgICBgXG4gICAgICAgIG9wYWNpdHk6IDA7XG4gICAgICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlKC00MHB4LCAwcHgpO1xuICAgIGB9XG5cbiAgJHsocHJvcHMpID0+XG4gICAgcHJvcHMuYWxpZ25SaWdodCAmJlxuICAgIGBcbiAgICAgICAgcmlnaHQ6IDJweDtcbiAgICAgICAgbGVmdDogdW5zZXQ7XG4gICAgYH1cblxuICAgICR7KHByb3BzKSA9PlxuICAgIHByb3BzLmFsaWduUmlnaHQgJiZcbiAgICBwcm9wcy5oaWRlICYmXG4gICAgYFxuICAgICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSg0MHB4LCAwcHgpO1xuICAgIGB9XG5gO1xuXG5jb25zdCBoYW5kbGVyV3JhcHBlckNTUyA9IGNzc2BcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBtYXgtd2lkdGg6IDEwMCU7XG4gIG92ZXJmbG93LXg6IGhpZGRlbjtcbmA7XG5cbmNvbnN0IEZpbHRlckNhcm91c2VsID0gKHsgY2hpbGRyZW4gfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCBbaGlkZU5leHQsIHNldEhpZGVOZXh0XSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgY29uc3QgW3RyYW5zbGF0ZVgsIHNldFRyYW5zbGF0ZVhdID0gdXNlU3RhdGUoMCk7XG4gIGNvbnN0IGNhcm91c2VsUmVmOiB7IGN1cnJlbnQ6IEhUTUxEaXZFbGVtZW50IHwgbnVsbCB9ID0gdXNlUmVmKG51bGwpO1xuICBjb25zdCBpbm5lclJlZjogeyBjdXJyZW50OiBIVE1MRGl2RWxlbWVudCB8IG51bGwgfSA9IHVzZVJlZihudWxsKTtcblxuICAvLyBDaGVjayBpZiB3ZSBuZWVkIHRvIHNob3cgdGhlIG5hdiBidXR0b25zXG4gIHVzZUxheW91dEVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGNhcm91c2VsUmVmLmN1cnJlbnQgJiYgaW5uZXJSZWYuY3VycmVudCkge1xuICAgICAgY29uc3QgY2Fyb3VzZWxXaWR0aCA9IGNhcm91c2VsUmVmLmN1cnJlbnQub2Zmc2V0V2lkdGggfHwgMDtcbiAgICAgIGNvbnN0IGlubmVyV2lkdGggPSBpbm5lclJlZi5jdXJyZW50LnNjcm9sbFdpZHRoO1xuICAgICAgaWYgKGlubmVyV2lkdGggPD0gY2Fyb3VzZWxXaWR0aCkge1xuICAgICAgICBzZXRIaWRlTmV4dCh0cnVlKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHNldEhpZGVOZXh0KGZhbHNlKTtcbiAgICAgIH1cbiAgICB9IGVsc2Uge1xuICAgICAgc2V0SGlkZU5leHQodHJ1ZSk7XG4gICAgfVxuICB9LCBbY2hpbGRyZW5dKTtcblxuICBjb25zdCB1cGRhdGVJbmRleCA9IChkaXJlY3Rpb246IHN0cmluZykgPT4ge1xuICAgIGNvbnN0IGNhcm91c2VsID0gY2Fyb3VzZWxSZWYuY3VycmVudDtcbiAgICBjb25zdCBpbm5lciA9IGlubmVyUmVmLmN1cnJlbnQ7XG4gICAgaWYgKGNhcm91c2VsICYmIGlubmVyKSB7XG4gICAgICBjb25zdCBjYXJvdXNlbFdpZHRoID0gY2Fyb3VzZWwub2Zmc2V0V2lkdGg7XG4gICAgICBjb25zdCBpbm5lcldpZHRoID0gaW5uZXIuc2Nyb2xsV2lkdGg7XG4gICAgICBpZiAoZGlyZWN0aW9uID09PSAnTkVYVCcpIHtcbiAgICAgICAgLy8gSWYgd2UgY2Fubm90IG1vdmUgbW9yZSB0aGFuIG9uZSBjYXJvdXNlbFdpZHRoIHRoZW4ganVzdCBhZGp1c3QgdG8gc2hvdyBhbGwgb2YgdGhlIGNvbmNlYWxlZCBpdGVtc1xuICAgICAgICBpZiAoY2Fyb3VzZWxXaWR0aCArIHRyYW5zbGF0ZVggKyBjYXJvdXNlbFdpZHRoID4gaW5uZXJXaWR0aCkge1xuICAgICAgICAgIGNvbnN0IG5ld09mZnNldCA9IGlubmVyV2lkdGggLSBjYXJvdXNlbFdpZHRoO1xuICAgICAgICAgIHNldFRyYW5zbGF0ZVgodHJhbnNsYXRlWCArIG5ld09mZnNldCk7XG4gICAgICAgICAgc2V0SGlkZU5leHQodHJ1ZSk7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgaWYgKGhpZGVOZXh0KSB7XG4gICAgICAgICAgICBzZXRIaWRlTmV4dChmYWxzZSk7XG4gICAgICAgICAgfVxuICAgICAgICAgIHNldFRyYW5zbGF0ZVgodHJhbnNsYXRlWCArIGNhcm91c2VsV2lkdGgpO1xuICAgICAgICB9XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBpZiAodHJhbnNsYXRlWCAtIGNhcm91c2VsV2lkdGggPiAwKSB7XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCh0cmFuc2xhdGVYIC0gY2Fyb3VzZWxXaWR0aCk7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCgwKTtcbiAgICAgICAgfVxuICAgICAgICBpZiAoaGlkZU5leHQpIHtcbiAgICAgICAgICBzZXRIaWRlTmV4dChmYWxzZSk7XG4gICAgICAgIH1cbiAgICAgIH1cbiAgICB9XG4gIH07XG5cbiAgY29uc3QgaGFuZGxlcnMgPSB1c2VTd2lwZWFibGUoe1xuICAgIG9uU3dpcGVkTGVmdDogKCkgPT4gdXBkYXRlSW5kZXgoJ05FWFQnKSxcbiAgICBvblN3aXBlZFJpZ2h0OiAoKSA9PiB1cGRhdGVJbmRleCgnUFJFVicpLFxuICAgIHByZXZlbnREZWZhdWx0VG91Y2htb3ZlRXZlbnQ6IGZhbHNlLFxuICAgIHRyYWNrTW91c2U6IHRydWUsXG4gIH0pO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdiB7Li4uaGFuZGxlcnN9IGNzcz17aGFuZGxlcldyYXBwZXJDU1N9PlxuICAgICAgPENhcm91c2VsIHJlZj17Y2Fyb3VzZWxSZWZ9PlxuICAgICAgICA8SW5uZXIgcmVmPXtpbm5lclJlZn0gc3R5bGU9e3sgdHJhbnNmb3JtOiBgdHJhbnNsYXRlWCgtJHt0cmFuc2xhdGVYfXB4KWAgfX0+XG4gICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICA8L0lubmVyPlxuICAgICAgPC9DYXJvdXNlbD5cbiAgICAgIDxOYXZCdXR0b24gdGl0bGU9e3QoJ2Nhcm91c2VsLmJhY2snKX0gb25DbGljaz17KCkgPT4gdXBkYXRlSW5kZXgoJ1BSRVYnKX0gaGlkZT17dHJhbnNsYXRlWCA8IDF9PlxuICAgICAgICA8Q2hldnJvbkxlZnQgc3R5bGU9e3sgd2lkdGg6ICcxOHB4JywgaGVpZ2h0OiAnMThweCcgfX0gYXJpYS1oaWRkZW4gdGl0bGU9XCJcIiAvPlxuICAgICAgPC9OYXZCdXR0b24+XG4gICAgICA8TmF2QnV0dG9uIHRpdGxlPXt0KCdjYXJvdXNlbC5mb3J3YXJkJyl9IG9uQ2xpY2s9eygpID0+IHVwZGF0ZUluZGV4KCdORVhUJyl9IGFsaWduUmlnaHQgaGlkZT17aGlkZU5leHR9PlxuICAgICAgICA8Q2hldnJvblJpZ2h0IHN0eWxlPXt7IHdpZHRoOiAnMThweCcsIGhlaWdodDogJzE4cHgnIH19IGFyaWEtaGlkZGVuIHRpdGxlPVwiXCIgLz5cbiAgICAgIDwvTmF2QnV0dG9uPlxuICAgIDwvZGl2PlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgRmlsdGVyQ2Fyb3VzZWw7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+
+var Inner = _styled("div", {
+  target: "e3ylyeu1",
+  label: "Inner"
+})(process.env.NODE_ENV === "production" ? {
+  name: "ngzp83",
+  styles: "flex-wrap:nowrap;transition:transform 0.3s;display:inline-flex;padding:8px 0;"
+} : {
+  name: "ngzp83",
+  styles: "flex-wrap:nowrap;transition:transform 0.3s;display:inline-flex;padding:8px 0;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpbHRlckNhcm91c2VsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QndCIiwiZmlsZSI6IkZpbHRlckNhcm91c2VsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIxLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Q2hpbGQsIHVzZUxheW91dEVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcbmltcG9ydCB7IENoZXZyb25MZWZ0LCBDaGV2cm9uUmlnaHQgfSBmcm9tICdAbmRsYS9pY29ucy9jb21tb24nO1xuaW1wb3J0IHsgdXNlU3dpcGVhYmxlIH0gZnJvbSAncmVhY3Qtc3dpcGVhYmxlJztcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgY2hpbGRyZW46IFJlYWN0Q2hpbGRbXTtcbn1cblxuY29uc3QgQ2Fyb3VzZWwgPSBzdHlsZWQuZGl2YFxuICBvdmVyZmxvdy14OiBoaWRkZW47XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgbWFyZ2luOiAwIDEzcHg7XG5gO1xuXG5jb25zdCBJbm5lciA9IHN0eWxlZC5kaXZgXG4gIGZsZXgtd3JhcDogbm93cmFwO1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4zcztcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIHBhZGRpbmc6IDhweCAwO1xuYDtcblxuY29uc3QgTmF2QnV0dG9uID0gc3R5bGVkKCdidXR0b24nKTx7XG4gIGhpZGU/OiBib29sZWFuO1xuICBhbGlnblJpZ2h0PzogYm9vbGVhbjtcbn0+YFxuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICB3aWR0aDogNDhweDtcbiAgaGVpZ2h0OiA0OHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBib3JkZXI6IG5vbmU7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGJvcmRlci1yYWRpdXM6IDEwMHB4O1xuICB0cmFuc2l0aW9uOiBvcGFjaXR5IDAuNXMgZWFzZSwgdHJhbnNmb3JtIDAuNXMgZWFzZTtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoMHB4LCAwcHgsIDEpO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGJvdHRvbTogMDtcbiAgdG9wOiA0cHg7XG4gIHotaW5kZXg6IDM7XG4gIGxlZnQ6IDNweDtcblxuICBzdmcge1xuICAgIGNvbG9yOiAjMjA1ODhmO1xuICB9XG5cbiAgJjpob3ZlciB7XG4gICAgYm94LXNoYWRvdzogMCAwIDRweCByZ2JhKDAsIDAsIDAsIDAuMjQpO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgfVxuXG4gICR7KHByb3BzKSA9PlxuICAgIHByb3BzLmhpZGUgJiZcbiAgICBgXG4gICAgICAgIG9wYWNpdHk6IDA7XG4gICAgICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlKC00MHB4LCAwcHgpO1xuICAgIGB9XG5cbiAgJHsocHJvcHMpID0+XG4gICAgcHJvcHMuYWxpZ25SaWdodCAmJlxuICAgIGBcbiAgICAgICAgcmlnaHQ6IDJweDtcbiAgICAgICAgbGVmdDogdW5zZXQ7XG4gICAgYH1cblxuICAgICR7KHByb3BzKSA9PlxuICAgIHByb3BzLmFsaWduUmlnaHQgJiZcbiAgICBwcm9wcy5oaWRlICYmXG4gICAgYFxuICAgICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSg0MHB4LCAwcHgpO1xuICAgIGB9XG5gO1xuXG5jb25zdCBoYW5kbGVyV3JhcHBlckNTUyA9IGNzc2BcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBtYXgtd2lkdGg6IDEwMCU7XG4gIG92ZXJmbG93LXg6IGhpZGRlbjtcbmA7XG5cbmNvbnN0IEZpbHRlckNhcm91c2VsID0gKHsgY2hpbGRyZW4gfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCBbaGlkZU5leHQsIHNldEhpZGVOZXh0XSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgY29uc3QgW3RyYW5zbGF0ZVgsIHNldFRyYW5zbGF0ZVhdID0gdXNlU3RhdGUoMCk7XG4gIGNvbnN0IGNhcm91c2VsUmVmOiB7IGN1cnJlbnQ6IEhUTUxEaXZFbGVtZW50IHwgbnVsbCB9ID0gdXNlUmVmKG51bGwpO1xuICBjb25zdCBpbm5lclJlZjogeyBjdXJyZW50OiBIVE1MRGl2RWxlbWVudCB8IG51bGwgfSA9IHVzZVJlZihudWxsKTtcblxuICAvLyBDaGVjayBpZiB3ZSBuZWVkIHRvIHNob3cgdGhlIG5hdiBidXR0b25zXG4gIHVzZUxheW91dEVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGNhcm91c2VsUmVmLmN1cnJlbnQgJiYgaW5uZXJSZWYuY3VycmVudCkge1xuICAgICAgY29uc3QgY2Fyb3VzZWxXaWR0aCA9IGNhcm91c2VsUmVmLmN1cnJlbnQub2Zmc2V0V2lkdGggfHwgMDtcbiAgICAgIGNvbnN0IGlubmVyV2lkdGggPSBpbm5lclJlZi5jdXJyZW50LnNjcm9sbFdpZHRoO1xuICAgICAgaWYgKGlubmVyV2lkdGggPD0gY2Fyb3VzZWxXaWR0aCkge1xuICAgICAgICBzZXRIaWRlTmV4dCh0cnVlKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHNldEhpZGVOZXh0KGZhbHNlKTtcbiAgICAgIH1cbiAgICB9IGVsc2Uge1xuICAgICAgc2V0SGlkZU5leHQodHJ1ZSk7XG4gICAgfVxuICB9LCBbY2hpbGRyZW5dKTtcblxuICBjb25zdCB1cGRhdGVJbmRleCA9IChkaXJlY3Rpb246IHN0cmluZykgPT4ge1xuICAgIGNvbnN0IGNhcm91c2VsID0gY2Fyb3VzZWxSZWYuY3VycmVudDtcbiAgICBjb25zdCBpbm5lciA9IGlubmVyUmVmLmN1cnJlbnQ7XG4gICAgaWYgKGNhcm91c2VsICYmIGlubmVyKSB7XG4gICAgICBjb25zdCBjYXJvdXNlbFdpZHRoID0gY2Fyb3VzZWwub2Zmc2V0V2lkdGg7XG4gICAgICBjb25zdCBpbm5lcldpZHRoID0gaW5uZXIuc2Nyb2xsV2lkdGg7XG4gICAgICBpZiAoZGlyZWN0aW9uID09PSAnTkVYVCcpIHtcbiAgICAgICAgLy8gSWYgd2UgY2Fubm90IG1vdmUgbW9yZSB0aGFuIG9uZSBjYXJvdXNlbFdpZHRoIHRoZW4ganVzdCBhZGp1c3QgdG8gc2hvdyBhbGwgb2YgdGhlIGNvbmNlYWxlZCBpdGVtc1xuICAgICAgICBpZiAoY2Fyb3VzZWxXaWR0aCArIHRyYW5zbGF0ZVggKyBjYXJvdXNlbFdpZHRoID4gaW5uZXJXaWR0aCkge1xuICAgICAgICAgIGNvbnN0IG5ld09mZnNldCA9IGlubmVyV2lkdGggLSBjYXJvdXNlbFdpZHRoO1xuICAgICAgICAgIHNldFRyYW5zbGF0ZVgodHJhbnNsYXRlWCArIG5ld09mZnNldCk7XG4gICAgICAgICAgc2V0SGlkZU5leHQodHJ1ZSk7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgaWYgKGhpZGVOZXh0KSB7XG4gICAgICAgICAgICBzZXRIaWRlTmV4dChmYWxzZSk7XG4gICAgICAgICAgfVxuICAgICAgICAgIHNldFRyYW5zbGF0ZVgodHJhbnNsYXRlWCArIGNhcm91c2VsV2lkdGgpO1xuICAgICAgICB9XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBpZiAodHJhbnNsYXRlWCAtIGNhcm91c2VsV2lkdGggPiAwKSB7XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCh0cmFuc2xhdGVYIC0gY2Fyb3VzZWxXaWR0aCk7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCgwKTtcbiAgICAgICAgfVxuICAgICAgICBpZiAoaGlkZU5leHQpIHtcbiAgICAgICAgICBzZXRIaWRlTmV4dChmYWxzZSk7XG4gICAgICAgIH1cbiAgICAgIH1cbiAgICB9XG4gIH07XG5cbiAgY29uc3QgaGFuZGxlcnMgPSB1c2VTd2lwZWFibGUoe1xuICAgIG9uU3dpcGVkTGVmdDogKCkgPT4gdXBkYXRlSW5kZXgoJ05FWFQnKSxcbiAgICBvblN3aXBlZFJpZ2h0OiAoKSA9PiB1cGRhdGVJbmRleCgnUFJFVicpLFxuICAgIHByZXZlbnREZWZhdWx0VG91Y2htb3ZlRXZlbnQ6IGZhbHNlLFxuICAgIHRyYWNrTW91c2U6IHRydWUsXG4gIH0pO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdiB7Li4uaGFuZGxlcnN9IGNzcz17aGFuZGxlcldyYXBwZXJDU1N9PlxuICAgICAgPENhcm91c2VsIHJlZj17Y2Fyb3VzZWxSZWZ9PlxuICAgICAgICA8SW5uZXIgcmVmPXtpbm5lclJlZn0gc3R5bGU9e3sgdHJhbnNmb3JtOiBgdHJhbnNsYXRlWCgtJHt0cmFuc2xhdGVYfXB4KWAgfX0+XG4gICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICA8L0lubmVyPlxuICAgICAgPC9DYXJvdXNlbD5cbiAgICAgIDxOYXZCdXR0b24gdGl0bGU9e3QoJ2Nhcm91c2VsLmJhY2snKX0gb25DbGljaz17KCkgPT4gdXBkYXRlSW5kZXgoJ1BSRVYnKX0gaGlkZT17dHJhbnNsYXRlWCA8IDF9PlxuICAgICAgICA8Q2hldnJvbkxlZnQgc3R5bGU9e3sgd2lkdGg6ICcxOHB4JywgaGVpZ2h0OiAnMThweCcgfX0gYXJpYS1oaWRkZW4gdGl0bGU9XCJcIiAvPlxuICAgICAgPC9OYXZCdXR0b24+XG4gICAgICA8TmF2QnV0dG9uIHRpdGxlPXt0KCdjYXJvdXNlbC5mb3J3YXJkJyl9IG9uQ2xpY2s9eygpID0+IHVwZGF0ZUluZGV4KCdORVhUJyl9IGFsaWduUmlnaHQgaGlkZT17aGlkZU5leHR9PlxuICAgICAgICA8Q2hldnJvblJpZ2h0IHN0eWxlPXt7IHdpZHRoOiAnMThweCcsIGhlaWdodDogJzE4cHgnIH19IGFyaWEtaGlkZGVuIHRpdGxlPVwiXCIgLz5cbiAgICAgIDwvTmF2QnV0dG9uPlxuICAgIDwvZGl2PlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgRmlsdGVyQ2Fyb3VzZWw7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+
+var NavButton = /*#__PURE__*/_styled('button', {
+  target: "e3ylyeu2",
+  label: "NavButton"
+})("box-sizing:border-box;width:48px;height:48px;background-color:#fff;border:none;box-shadow:none;border-radius:100px;transition:opacity 0.5s ease,transform 0.5s ease;transform:translate(0px,0px,1);position:absolute;bottom:0;top:4px;z-index:3;left:3px;svg{color:#20588f;}&:hover{box-shadow:0 0 4px rgba(0,0,0,0.24);cursor:pointer;}", function (props) {
+  return props.hide && "\n        opacity: 0;\n        transform: translate(-40px, 0px);\n    ";
+}, " ", function (props) {
+  return props.alignRight && "\n        right: 2px;\n        left: unset;\n    ";
+}, " ", function (props) {
+  return props.alignRight && props.hide && "\n        transform: translate(40px, 0px);\n    ";
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpbHRlckNhcm91c2VsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQ0UiLCJmaWxlIjoiRmlsdGVyQ2Fyb3VzZWwudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjEtcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgUmVhY3QsIHsgUmVhY3RDaGlsZCwgdXNlTGF5b3V0RWZmZWN0LCB1c2VSZWYsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL2NvcmUnO1xuaW1wb3J0IHsgQ2hldnJvbkxlZnQsIENoZXZyb25SaWdodCB9IGZyb20gJ0BuZGxhL2ljb25zL2NvbW1vbic7XG5pbXBvcnQgeyB1c2VTd2lwZWFibGUgfSBmcm9tICdyZWFjdC1zd2lwZWFibGUnO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBjaGlsZHJlbjogUmVhY3RDaGlsZFtdO1xufVxuXG5jb25zdCBDYXJvdXNlbCA9IHN0eWxlZC5kaXZgXG4gIG92ZXJmbG93LXg6IGhpZGRlbjtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBtYXJnaW46IDAgMTNweDtcbmA7XG5cbmNvbnN0IElubmVyID0gc3R5bGVkLmRpdmBcbiAgZmxleC13cmFwOiBub3dyYXA7XG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjNzO1xuICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgcGFkZGluZzogOHB4IDA7XG5gO1xuXG5jb25zdCBOYXZCdXR0b24gPSBzdHlsZWQoJ2J1dHRvbicpPHtcbiAgaGlkZT86IGJvb2xlYW47XG4gIGFsaWduUmlnaHQ/OiBib29sZWFuO1xufT5gXG4gIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gIHdpZHRoOiA0OHB4O1xuICBoZWlnaHQ6IDQ4cHg7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIGJvcmRlcjogbm9uZTtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogMTAwcHg7XG4gIHRyYW5zaXRpb246IG9wYWNpdHkgMC41cyBlYXNlLCB0cmFuc2Zvcm0gMC41cyBlYXNlO1xuICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgwcHgsIDBweCwgMSk7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgYm90dG9tOiAwO1xuICB0b3A6IDRweDtcbiAgei1pbmRleDogMztcbiAgbGVmdDogM3B4O1xuXG4gIHN2ZyB7XG4gICAgY29sb3I6ICMyMDU4OGY7XG4gIH1cblxuICAmOmhvdmVyIHtcbiAgICBib3gtc2hhZG93OiAwIDAgNHB4IHJnYmEoMCwgMCwgMCwgMC4yNCk7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICB9XG5cbiAgJHsocHJvcHMpID0+XG4gICAgcHJvcHMuaGlkZSAmJlxuICAgIGBcbiAgICAgICAgb3BhY2l0eTogMDtcbiAgICAgICAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoLTQwcHgsIDBweCk7XG4gICAgYH1cblxuICAkeyhwcm9wcykgPT5cbiAgICBwcm9wcy5hbGlnblJpZ2h0ICYmXG4gICAgYFxuICAgICAgICByaWdodDogMnB4O1xuICAgICAgICBsZWZ0OiB1bnNldDtcbiAgICBgfVxuXG4gICAgJHsocHJvcHMpID0+XG4gICAgcHJvcHMuYWxpZ25SaWdodCAmJlxuICAgIHByb3BzLmhpZGUgJiZcbiAgICBgXG4gICAgICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlKDQwcHgsIDBweCk7XG4gICAgYH1cbmA7XG5cbmNvbnN0IGhhbmRsZXJXcmFwcGVyQ1NTID0gY3NzYFxuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIG1heC13aWR0aDogMTAwJTtcbiAgb3ZlcmZsb3cteDogaGlkZGVuO1xuYDtcblxuY29uc3QgRmlsdGVyQ2Fyb3VzZWwgPSAoeyBjaGlsZHJlbiB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IFtoaWRlTmV4dCwgc2V0SGlkZU5leHRdID0gdXNlU3RhdGUoZmFsc2UpO1xuICBjb25zdCBbdHJhbnNsYXRlWCwgc2V0VHJhbnNsYXRlWF0gPSB1c2VTdGF0ZSgwKTtcbiAgY29uc3QgY2Fyb3VzZWxSZWY6IHsgY3VycmVudDogSFRNTERpdkVsZW1lbnQgfCBudWxsIH0gPSB1c2VSZWYobnVsbCk7XG4gIGNvbnN0IGlubmVyUmVmOiB7IGN1cnJlbnQ6IEhUTUxEaXZFbGVtZW50IHwgbnVsbCB9ID0gdXNlUmVmKG51bGwpO1xuXG4gIC8vIENoZWNrIGlmIHdlIG5lZWQgdG8gc2hvdyB0aGUgbmF2IGJ1dHRvbnNcbiAgdXNlTGF5b3V0RWZmZWN0KCgpID0+IHtcbiAgICBpZiAoY2Fyb3VzZWxSZWYuY3VycmVudCAmJiBpbm5lclJlZi5jdXJyZW50KSB7XG4gICAgICBjb25zdCBjYXJvdXNlbFdpZHRoID0gY2Fyb3VzZWxSZWYuY3VycmVudC5vZmZzZXRXaWR0aCB8fCAwO1xuICAgICAgY29uc3QgaW5uZXJXaWR0aCA9IGlubmVyUmVmLmN1cnJlbnQuc2Nyb2xsV2lkdGg7XG4gICAgICBpZiAoaW5uZXJXaWR0aCA8PSBjYXJvdXNlbFdpZHRoKSB7XG4gICAgICAgIHNldEhpZGVOZXh0KHRydWUpO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgc2V0SGlkZU5leHQoZmFsc2UpO1xuICAgICAgfVxuICAgIH0gZWxzZSB7XG4gICAgICBzZXRIaWRlTmV4dCh0cnVlKTtcbiAgICB9XG4gIH0sIFtjaGlsZHJlbl0pO1xuXG4gIGNvbnN0IHVwZGF0ZUluZGV4ID0gKGRpcmVjdGlvbjogc3RyaW5nKSA9PiB7XG4gICAgY29uc3QgY2Fyb3VzZWwgPSBjYXJvdXNlbFJlZi5jdXJyZW50O1xuICAgIGNvbnN0IGlubmVyID0gaW5uZXJSZWYuY3VycmVudDtcbiAgICBpZiAoY2Fyb3VzZWwgJiYgaW5uZXIpIHtcbiAgICAgIGNvbnN0IGNhcm91c2VsV2lkdGggPSBjYXJvdXNlbC5vZmZzZXRXaWR0aDtcbiAgICAgIGNvbnN0IGlubmVyV2lkdGggPSBpbm5lci5zY3JvbGxXaWR0aDtcbiAgICAgIGlmIChkaXJlY3Rpb24gPT09ICdORVhUJykge1xuICAgICAgICAvLyBJZiB3ZSBjYW5ub3QgbW92ZSBtb3JlIHRoYW4gb25lIGNhcm91c2VsV2lkdGggdGhlbiBqdXN0IGFkanVzdCB0byBzaG93IGFsbCBvZiB0aGUgY29uY2VhbGVkIGl0ZW1zXG4gICAgICAgIGlmIChjYXJvdXNlbFdpZHRoICsgdHJhbnNsYXRlWCArIGNhcm91c2VsV2lkdGggPiBpbm5lcldpZHRoKSB7XG4gICAgICAgICAgY29uc3QgbmV3T2Zmc2V0ID0gaW5uZXJXaWR0aCAtIGNhcm91c2VsV2lkdGg7XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCh0cmFuc2xhdGVYICsgbmV3T2Zmc2V0KTtcbiAgICAgICAgICBzZXRIaWRlTmV4dCh0cnVlKTtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICBpZiAoaGlkZU5leHQpIHtcbiAgICAgICAgICAgIHNldEhpZGVOZXh0KGZhbHNlKTtcbiAgICAgICAgICB9XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCh0cmFuc2xhdGVYICsgY2Fyb3VzZWxXaWR0aCk7XG4gICAgICAgIH1cbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGlmICh0cmFuc2xhdGVYIC0gY2Fyb3VzZWxXaWR0aCA+IDApIHtcbiAgICAgICAgICBzZXRUcmFuc2xhdGVYKHRyYW5zbGF0ZVggLSBjYXJvdXNlbFdpZHRoKTtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICBzZXRUcmFuc2xhdGVYKDApO1xuICAgICAgICB9XG4gICAgICAgIGlmIChoaWRlTmV4dCkge1xuICAgICAgICAgIHNldEhpZGVOZXh0KGZhbHNlKTtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVycyA9IHVzZVN3aXBlYWJsZSh7XG4gICAgb25Td2lwZWRMZWZ0OiAoKSA9PiB1cGRhdGVJbmRleCgnTkVYVCcpLFxuICAgIG9uU3dpcGVkUmlnaHQ6ICgpID0+IHVwZGF0ZUluZGV4KCdQUkVWJyksXG4gICAgcHJldmVudERlZmF1bHRUb3VjaG1vdmVFdmVudDogZmFsc2UsXG4gICAgdHJhY2tNb3VzZTogdHJ1ZSxcbiAgfSk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IHsuLi5oYW5kbGVyc30gY3NzPXtoYW5kbGVyV3JhcHBlckNTU30+XG4gICAgICA8Q2Fyb3VzZWwgcmVmPXtjYXJvdXNlbFJlZn0+XG4gICAgICAgIDxJbm5lciByZWY9e2lubmVyUmVmfSBzdHlsZT17eyB0cmFuc2Zvcm06IGB0cmFuc2xhdGVYKC0ke3RyYW5zbGF0ZVh9cHgpYCB9fT5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvSW5uZXI+XG4gICAgICA8L0Nhcm91c2VsPlxuICAgICAgPE5hdkJ1dHRvbiB0aXRsZT17dCgnY2Fyb3VzZWwuYmFjaycpfSBvbkNsaWNrPXsoKSA9PiB1cGRhdGVJbmRleCgnUFJFVicpfSBoaWRlPXt0cmFuc2xhdGVYIDwgMX0+XG4gICAgICAgIDxDaGV2cm9uTGVmdCBzdHlsZT17eyB3aWR0aDogJzE4cHgnLCBoZWlnaHQ6ICcxOHB4JyB9fSBhcmlhLWhpZGRlbiB0aXRsZT1cIlwiIC8+XG4gICAgICA8L05hdkJ1dHRvbj5cbiAgICAgIDxOYXZCdXR0b24gdGl0bGU9e3QoJ2Nhcm91c2VsLmZvcndhcmQnKX0gb25DbGljaz17KCkgPT4gdXBkYXRlSW5kZXgoJ05FWFQnKX0gYWxpZ25SaWdodCBoaWRlPXtoaWRlTmV4dH0+XG4gICAgICAgIDxDaGV2cm9uUmlnaHQgc3R5bGU9e3sgd2lkdGg6ICcxOHB4JywgaGVpZ2h0OiAnMThweCcgfX0gYXJpYS1oaWRkZW4gdGl0bGU9XCJcIiAvPlxuICAgICAgPC9OYXZCdXR0b24+XG4gICAgPC9kaXY+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBGaWx0ZXJDYXJvdXNlbDtcbiJdfQ== */");
+
+var handlerWrapperCSS = process.env.NODE_ENV === "production" ? {
+  name: "1w3ckq1-handlerWrapperCSS",
+  styles: "position:relative;max-width:100%;overflow-x:hidden;;label:handlerWrapperCSS;"
+} : {
+  name: "1w3ckq1-handlerWrapperCSS",
+  styles: "position:relative;max-width:100%;overflow-x:hidden;;label:handlerWrapperCSS;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpbHRlckNhcm91c2VsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrRjZCIiwiZmlsZSI6IkZpbHRlckNhcm91c2VsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIxLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Q2hpbGQsIHVzZUxheW91dEVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcbmltcG9ydCB7IENoZXZyb25MZWZ0LCBDaGV2cm9uUmlnaHQgfSBmcm9tICdAbmRsYS9pY29ucy9jb21tb24nO1xuaW1wb3J0IHsgdXNlU3dpcGVhYmxlIH0gZnJvbSAncmVhY3Qtc3dpcGVhYmxlJztcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgY2hpbGRyZW46IFJlYWN0Q2hpbGRbXTtcbn1cblxuY29uc3QgQ2Fyb3VzZWwgPSBzdHlsZWQuZGl2YFxuICBvdmVyZmxvdy14OiBoaWRkZW47XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgbWFyZ2luOiAwIDEzcHg7XG5gO1xuXG5jb25zdCBJbm5lciA9IHN0eWxlZC5kaXZgXG4gIGZsZXgtd3JhcDogbm93cmFwO1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4zcztcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIHBhZGRpbmc6IDhweCAwO1xuYDtcblxuY29uc3QgTmF2QnV0dG9uID0gc3R5bGVkKCdidXR0b24nKTx7XG4gIGhpZGU/OiBib29sZWFuO1xuICBhbGlnblJpZ2h0PzogYm9vbGVhbjtcbn0+YFxuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICB3aWR0aDogNDhweDtcbiAgaGVpZ2h0OiA0OHB4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBib3JkZXI6IG5vbmU7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGJvcmRlci1yYWRpdXM6IDEwMHB4O1xuICB0cmFuc2l0aW9uOiBvcGFjaXR5IDAuNXMgZWFzZSwgdHJhbnNmb3JtIDAuNXMgZWFzZTtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoMHB4LCAwcHgsIDEpO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGJvdHRvbTogMDtcbiAgdG9wOiA0cHg7XG4gIHotaW5kZXg6IDM7XG4gIGxlZnQ6IDNweDtcblxuICBzdmcge1xuICAgIGNvbG9yOiAjMjA1ODhmO1xuICB9XG5cbiAgJjpob3ZlciB7XG4gICAgYm94LXNoYWRvdzogMCAwIDRweCByZ2JhKDAsIDAsIDAsIDAuMjQpO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgfVxuXG4gICR7KHByb3BzKSA9PlxuICAgIHByb3BzLmhpZGUgJiZcbiAgICBgXG4gICAgICAgIG9wYWNpdHk6IDA7XG4gICAgICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlKC00MHB4LCAwcHgpO1xuICAgIGB9XG5cbiAgJHsocHJvcHMpID0+XG4gICAgcHJvcHMuYWxpZ25SaWdodCAmJlxuICAgIGBcbiAgICAgICAgcmlnaHQ6IDJweDtcbiAgICAgICAgbGVmdDogdW5zZXQ7XG4gICAgYH1cblxuICAgICR7KHByb3BzKSA9PlxuICAgIHByb3BzLmFsaWduUmlnaHQgJiZcbiAgICBwcm9wcy5oaWRlICYmXG4gICAgYFxuICAgICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSg0MHB4LCAwcHgpO1xuICAgIGB9XG5gO1xuXG5jb25zdCBoYW5kbGVyV3JhcHBlckNTUyA9IGNzc2BcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBtYXgtd2lkdGg6IDEwMCU7XG4gIG92ZXJmbG93LXg6IGhpZGRlbjtcbmA7XG5cbmNvbnN0IEZpbHRlckNhcm91c2VsID0gKHsgY2hpbGRyZW4gfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCBbaGlkZU5leHQsIHNldEhpZGVOZXh0XSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgY29uc3QgW3RyYW5zbGF0ZVgsIHNldFRyYW5zbGF0ZVhdID0gdXNlU3RhdGUoMCk7XG4gIGNvbnN0IGNhcm91c2VsUmVmOiB7IGN1cnJlbnQ6IEhUTUxEaXZFbGVtZW50IHwgbnVsbCB9ID0gdXNlUmVmKG51bGwpO1xuICBjb25zdCBpbm5lclJlZjogeyBjdXJyZW50OiBIVE1MRGl2RWxlbWVudCB8IG51bGwgfSA9IHVzZVJlZihudWxsKTtcblxuICAvLyBDaGVjayBpZiB3ZSBuZWVkIHRvIHNob3cgdGhlIG5hdiBidXR0b25zXG4gIHVzZUxheW91dEVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGNhcm91c2VsUmVmLmN1cnJlbnQgJiYgaW5uZXJSZWYuY3VycmVudCkge1xuICAgICAgY29uc3QgY2Fyb3VzZWxXaWR0aCA9IGNhcm91c2VsUmVmLmN1cnJlbnQub2Zmc2V0V2lkdGggfHwgMDtcbiAgICAgIGNvbnN0IGlubmVyV2lkdGggPSBpbm5lclJlZi5jdXJyZW50LnNjcm9sbFdpZHRoO1xuICAgICAgaWYgKGlubmVyV2lkdGggPD0gY2Fyb3VzZWxXaWR0aCkge1xuICAgICAgICBzZXRIaWRlTmV4dCh0cnVlKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHNldEhpZGVOZXh0KGZhbHNlKTtcbiAgICAgIH1cbiAgICB9IGVsc2Uge1xuICAgICAgc2V0SGlkZU5leHQodHJ1ZSk7XG4gICAgfVxuICB9LCBbY2hpbGRyZW5dKTtcblxuICBjb25zdCB1cGRhdGVJbmRleCA9IChkaXJlY3Rpb246IHN0cmluZykgPT4ge1xuICAgIGNvbnN0IGNhcm91c2VsID0gY2Fyb3VzZWxSZWYuY3VycmVudDtcbiAgICBjb25zdCBpbm5lciA9IGlubmVyUmVmLmN1cnJlbnQ7XG4gICAgaWYgKGNhcm91c2VsICYmIGlubmVyKSB7XG4gICAgICBjb25zdCBjYXJvdXNlbFdpZHRoID0gY2Fyb3VzZWwub2Zmc2V0V2lkdGg7XG4gICAgICBjb25zdCBpbm5lcldpZHRoID0gaW5uZXIuc2Nyb2xsV2lkdGg7XG4gICAgICBpZiAoZGlyZWN0aW9uID09PSAnTkVYVCcpIHtcbiAgICAgICAgLy8gSWYgd2UgY2Fubm90IG1vdmUgbW9yZSB0aGFuIG9uZSBjYXJvdXNlbFdpZHRoIHRoZW4ganVzdCBhZGp1c3QgdG8gc2hvdyBhbGwgb2YgdGhlIGNvbmNlYWxlZCBpdGVtc1xuICAgICAgICBpZiAoY2Fyb3VzZWxXaWR0aCArIHRyYW5zbGF0ZVggKyBjYXJvdXNlbFdpZHRoID4gaW5uZXJXaWR0aCkge1xuICAgICAgICAgIGNvbnN0IG5ld09mZnNldCA9IGlubmVyV2lkdGggLSBjYXJvdXNlbFdpZHRoO1xuICAgICAgICAgIHNldFRyYW5zbGF0ZVgodHJhbnNsYXRlWCArIG5ld09mZnNldCk7XG4gICAgICAgICAgc2V0SGlkZU5leHQodHJ1ZSk7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgaWYgKGhpZGVOZXh0KSB7XG4gICAgICAgICAgICBzZXRIaWRlTmV4dChmYWxzZSk7XG4gICAgICAgICAgfVxuICAgICAgICAgIHNldFRyYW5zbGF0ZVgodHJhbnNsYXRlWCArIGNhcm91c2VsV2lkdGgpO1xuICAgICAgICB9XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBpZiAodHJhbnNsYXRlWCAtIGNhcm91c2VsV2lkdGggPiAwKSB7XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCh0cmFuc2xhdGVYIC0gY2Fyb3VzZWxXaWR0aCk7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgc2V0VHJhbnNsYXRlWCgwKTtcbiAgICAgICAgfVxuICAgICAgICBpZiAoaGlkZU5leHQpIHtcbiAgICAgICAgICBzZXRIaWRlTmV4dChmYWxzZSk7XG4gICAgICAgIH1cbiAgICAgIH1cbiAgICB9XG4gIH07XG5cbiAgY29uc3QgaGFuZGxlcnMgPSB1c2VTd2lwZWFibGUoe1xuICAgIG9uU3dpcGVkTGVmdDogKCkgPT4gdXBkYXRlSW5kZXgoJ05FWFQnKSxcbiAgICBvblN3aXBlZFJpZ2h0OiAoKSA9PiB1cGRhdGVJbmRleCgnUFJFVicpLFxuICAgIHByZXZlbnREZWZhdWx0VG91Y2htb3ZlRXZlbnQ6IGZhbHNlLFxuICAgIHRyYWNrTW91c2U6IHRydWUsXG4gIH0pO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdiB7Li4uaGFuZGxlcnN9IGNzcz17aGFuZGxlcldyYXBwZXJDU1N9PlxuICAgICAgPENhcm91c2VsIHJlZj17Y2Fyb3VzZWxSZWZ9PlxuICAgICAgICA8SW5uZXIgcmVmPXtpbm5lclJlZn0gc3R5bGU9e3sgdHJhbnNmb3JtOiBgdHJhbnNsYXRlWCgtJHt0cmFuc2xhdGVYfXB4KWAgfX0+XG4gICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICA8L0lubmVyPlxuICAgICAgPC9DYXJvdXNlbD5cbiAgICAgIDxOYXZCdXR0b24gdGl0bGU9e3QoJ2Nhcm91c2VsLmJhY2snKX0gb25DbGljaz17KCkgPT4gdXBkYXRlSW5kZXgoJ1BSRVYnKX0gaGlkZT17dHJhbnNsYXRlWCA8IDF9PlxuICAgICAgICA8Q2hldnJvbkxlZnQgc3R5bGU9e3sgd2lkdGg6ICcxOHB4JywgaGVpZ2h0OiAnMThweCcgfX0gYXJpYS1oaWRkZW4gdGl0bGU9XCJcIiAvPlxuICAgICAgPC9OYXZCdXR0b24+XG4gICAgICA8TmF2QnV0dG9uIHRpdGxlPXt0KCdjYXJvdXNlbC5mb3J3YXJkJyl9IG9uQ2xpY2s9eygpID0+IHVwZGF0ZUluZGV4KCdORVhUJyl9IGFsaWduUmlnaHQgaGlkZT17aGlkZU5leHR9PlxuICAgICAgICA8Q2hldnJvblJpZ2h0IHN0eWxlPXt7IHdpZHRoOiAnMThweCcsIGhlaWdodDogJzE4cHgnIH19IGFyaWEtaGlkZGVuIHRpdGxlPVwiXCIgLz5cbiAgICAgIDwvTmF2QnV0dG9uPlxuICAgIDwvZGl2PlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgRmlsdGVyQ2Fyb3VzZWw7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+var FilterCarousel = function FilterCarousel(_ref) {
+  var children = _ref.children;
+
+  var _useTranslation = useTranslation(),
+      t = _useTranslation.t;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      hideNext = _useState2[0],
+      setHideNext = _useState2[1];
+
+  var _useState3 = useState(0),
+      _useState4 = _slicedToArray(_useState3, 2),
+      translateX = _useState4[0],
+      setTranslateX = _useState4[1];
+
+  var carouselRef = useRef(null);
+  var innerRef = useRef(null); // Check if we need to show the nav buttons
+
+  useLayoutEffect(function () {
+    if (carouselRef.current && innerRef.current) {
+      var carouselWidth = carouselRef.current.offsetWidth || 0;
+      var innerWidth = innerRef.current.scrollWidth;
+
+      if (innerWidth <= carouselWidth) {
+        setHideNext(true);
+      } else {
+        setHideNext(false);
+      }
+    } else {
+      setHideNext(true);
+    }
+  }, [children]);
+
+  var updateIndex = function updateIndex(direction) {
+    var carousel = carouselRef.current;
+    var inner = innerRef.current;
+
+    if (carousel && inner) {
+      var carouselWidth = carousel.offsetWidth;
+      var innerWidth = inner.scrollWidth;
+
+      if (direction === 'NEXT') {
+        // If we cannot move more than one carouselWidth then just adjust to show all of the concealed items
+        if (carouselWidth + translateX + carouselWidth > innerWidth) {
+          var newOffset = innerWidth - carouselWidth;
+          setTranslateX(translateX + newOffset);
+          setHideNext(true);
+        } else {
+          if (hideNext) {
+            setHideNext(false);
+          }
+
+          setTranslateX(translateX + carouselWidth);
+        }
+      } else {
+        if (translateX - carouselWidth > 0) {
+          setTranslateX(translateX - carouselWidth);
+        } else {
+          setTranslateX(0);
+        }
+
+        if (hideNext) {
+          setHideNext(false);
+        }
+      }
+    }
+  };
+
+  var handlers = useSwipeable({
+    onSwipedLeft: function onSwipedLeft() {
+      return updateIndex('NEXT');
+    },
+    onSwipedRight: function onSwipedRight() {
+      return updateIndex('PREV');
+    },
+    preventDefaultTouchmoveEvent: false,
+    trackMouse: true
+  });
+  return ___EmotionJSX("div", _extends({}, handlers, {
+    css: handlerWrapperCSS
+  }), ___EmotionJSX(Carousel, {
+    ref: carouselRef
+  }, ___EmotionJSX(Inner, {
+    ref: innerRef,
+    style: {
+      transform: "translateX(-".concat(translateX, "px)")
+    }
+  }, children)), ___EmotionJSX(NavButton, {
+    title: t('carousel.back'),
+    onClick: function onClick() {
+      return updateIndex('PREV');
+    },
+    hide: translateX < 1
+  }, ___EmotionJSX(ChevronLeft, {
+    style: {
+      width: '18px',
+      height: '18px'
+    },
+    "aria-hidden": true,
+    title: ""
+  })), ___EmotionJSX(NavButton, {
+    title: t('carousel.forward'),
+    onClick: function onClick() {
+      return updateIndex('NEXT');
+    },
+    alignRight: true,
+    hide: hideNext
+  }, ___EmotionJSX(ChevronRight, {
+    style: {
+      width: '18px',
+      height: '18px'
+    },
+    "aria-hidden": true,
+    title: ""
+  })));
+};
+
+export default FilterCarousel;

package/es/Masthead/Masthead.js

@@ -7,10 +7,11 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
  * LICENSE file in the root directory of this source tree.
  *
  */
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
 import BEMHelper from 'react-bem-helper';
 import { withTranslation } from 'react-i18next';
 import { DisplayOnPageYOffset } from '../Animation';
+import { MessageBox, MessageBoxType } from '../MessageBox';
 import { jsx as ___EmotionJSX } from "@emotion/core";
 var classes = new BEMHelper({
   name: 'masthead',
@@ -39,21 +40,43 @@ export var Masthead = function Masthead(_ref3) {
   var children = _ref3.children,
       fixed = _ref3.fixed,
       infoContent = _ref3.infoContent,
-      _ref3$showLoaderWhenN = _ref3.showLoaderWhenNeeded,
-      showLoaderWhenNeeded = _ref3$showLoaderWhenN === void 0 ? true : _ref3$showLoaderWhenN,
       ndlaFilm = _ref3.ndlaFilm,
       skipToMainContentId = _ref3.skipToMainContentId,
+      messages = _ref3.messages,
       t = _ref3.t;
+  var mastheadRef = useRef(null);
+
+  var focusHandler = function focusHandler(evt) {
+    var mastheadHeight = mastheadRef.current && mastheadRef.current.offsetHeight || 0;
+    var target = evt.target;
+    var rect = target.getBoundingClientRect(); // Focused target is hidden behind Masthead
+
+    if (rect.y < mastheadHeight) {
+      window.scrollTo(window.scrollX, window.scrollY - (mastheadHeight + 10));
+    }
+  };
+
+  useEffect(function () {
+    if (fixed) {
+      document.addEventListener('focusin', focusHandler);
+      return function () {
+        document.removeEventListener('focusin', focusHandler);
+      };
+    }
+  }, [fixed]);
   return ___EmotionJSX(React.Fragment, null, skipToMainContentId && ___EmotionJSX("a", _extends({
     tabIndex: 0,
     href: "#".concat(skipToMainContentId)
-  }, classes('skip-to-main-content')), t('masthead.skipToContent')), ___EmotionJSX("div", classes('placeholder', {
-    infoContent: !!infoContent
-  })), ___EmotionJSX("div", classes('', {
+  }, classes('skip-to-main-content')), t('masthead.skipToContent')), ___EmotionJSX("div", _extends({
+    id: "masthead"
+  }, classes('', {
     fixed: !!fixed,
     infoContent: !!infoContent,
-    showLoaderWhenNeeded: showLoaderWhenNeeded,
     ndlaFilm: !!ndlaFilm
+  })), messages === null || messages === void 0 ? void 0 : messages.map(function (message) {
+    return ___EmotionJSX(MessageBox, {
+      type: MessageBoxType.masthead
+    }, message);
   }), infoContent && ___EmotionJSX(DisplayOnPageYOffset, {
     yOffsetMin: 0,
     yOffsetMax: 90

package/es/Masthead/index.js

@@ -6,5 +6,6 @@
  *
  */
 import Masthead, { MastheadItem } from './Masthead';
-export { MastheadItem };
+import { getMastheadHeight } from './utils';
+export { MastheadItem, getMastheadHeight };
 export default Masthead;

package/es/Masthead/utils.js

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export var getMastheadHeight = function getMastheadHeight() {
+  var masthead = document.getElementById('masthead');
+  return masthead === null || masthead === void 0 ? void 0 : masthead.getBoundingClientRect().height;
+};