@twreporter/universal-header 3.0.2 → 3.0.3-rc.1

package/lib/components/header.js

@@ -1,88 +1,53 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
 var _CSSTransition = _interopRequireDefault(require("react-transition-group/CSSTransition"));
-
 var _headerContext = _interopRequireWildcard(require("../contexts/header-context"));
-
 var _links = require("../utils/links");
-
 var _theme = require("../utils/theme");
-
 var _theme2 = _interopRequireDefault(require("../constants/theme"));
-
 var _hamburgerMenu = require("../constants/hamburger-menu");
-
 var _channels = _interopRequireDefault(require("./channels"));
-
 var _actionButton = require("./action-button");
-
 var _icons = _interopRequireWildcard(require("./icons"));
-
 var _slogan = _interopRequireDefault(require("./slogan"));
-
 var _hamburgerMenu2 = _interopRequireDefault(require("./hamburger-menu"));
-
 var _tabBar = _interopRequireDefault(require("./tab-bar"));
-
 var _customizedLink = _interopRequireDefault(require("@twreporter/react-components/lib/customized-link"));
-
 var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
-
 var _divider = _interopRequireDefault(require("@twreporter/react-components/lib/divider"));
-
 var _logo = require("@twreporter/react-components/lib/logo");
-
 var _button = require("@twreporter/react-components/lib/button");
-
 var _icon = require("@twreporter/react-components/lib/icon");
-
 var _hook = require("@twreporter/react-components/lib/hook");
-
 var _rwd = require("@twreporter/react-components/lib/rwd");
-
 var _entityPath = _interopRequireDefault(require("@twreporter/core/lib/constants/entity-path"));
-
 var _some = _interopRequireDefault(require("lodash/some"));
-
 var _includes = _interopRequireDefault(require("lodash/includes"));
-
 var _throttle = _interopRequireDefault(require("lodash/throttle"));
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
-
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11; // context
+// utils
+// constants
+// components
+// @twreporter
+// lodash
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 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) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_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 _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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 var _ = {
   some: _some["default"],
   includes: _includes["default"],
@@ -108,7 +73,6 @@ var zIndex = {
 var channelSlideIn = /*#__PURE__*/(0, _styledComponents.keyframes)(["from{transform:translateY(", "px);opacity:0;}to{transform:translateY(0);opacity:1;}"], -channelHeight);
 var channelSlideOut = /*#__PURE__*/(0, _styledComponents.keyframes)(["from{transform:translateY(0);}to{transform:translateY(", "px);}"], -channelHeight);
 var ChannelEffect = /*#__PURE__*/(0, _styledComponents.css)([".channel-effect-enter{opacity:0;}.channel-effect-enter-active{animation:", " ", " linear;animation-delay:150ms;}.channel-effect-exit-active{animation:", " ", " linear;animation-delay:0ms;}"], channelSlideIn, animation.step1Duration, channelSlideOut, animation.step1Duration);
-
 var HeaderContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__HeaderContainer",
   componentId: "sc-1krza7i-0"
@@ -123,32 +87,26 @@ var HeaderContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 }, _mediaQuery["default"].mobileOnly(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    ", "\n  "])), function (props) {
   return props.$forceShowOnMobile ? 'transform: translateY(0);' : '';
 }));
-
 var HeaderSection = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__HeaderSection",
   componentId: "sc-1krza7i-1"
 })(["display:flex;flex-direction:column;margin:auto;z-index:", ";", " ", " ", " ", ""], zIndex.header, _mediaQuery["default"].hdOnly(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    width: 1280px;\n  "]))), _mediaQuery["default"].desktopOnly(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    padding: 0 48px;\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    padding: 0 32px;\n  "]))), _mediaQuery["default"].mobileOnly(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    padding: 0 24px;\n  "]))));
-
 var LogoContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__LogoContainer",
   componentId: "sc-1krza7i-2"
 })(["display:flex;align-items:center;margin-right:16px;a{display:flex;}"]);
-
 var MobileLogoContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__MobileLogoContainer",
   componentId: "sc-1krza7i-3"
 })(["display:flex;align-items:center;img{height:21px;}a{display:flex;}"]);
-
 var HideWhenNarrow = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__HideWhenNarrow",
   componentId: "sc-1krza7i-4"
 })([""]);
-
 var ShowWhenNarrow = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__ShowWhenNarrow",
   componentId: "sc-1krza7i-5"
 })([""]);
-
 var TopRow = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__TopRow",
   componentId: "sc-1krza7i-6"
@@ -175,7 +133,6 @@ var TopRow = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 }, animation.step3Duration, function (props) {
   return props.$toUseNarrow ? animation.step3Delay : 0;
 }, _mediaQuery["default"].tabletAndBelow(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    padding: 16px 0;\n  "]))));
-
 var StyledDivider = /*#__PURE__*/(0, _styledComponents["default"])(_divider["default"]).withConfig({
   displayName: "header__StyledDivider",
   componentId: "sc-1krza7i-7"
@@ -184,22 +141,18 @@ var StyledDivider = /*#__PURE__*/(0, _styledComponents["default"])(_divider["def
 }, animation.step2Duration, function (props) {
   return props.$toUseNarrow ? animation.step2Delay : 0;
 });
-
 var IconContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__IconContainer",
   componentId: "sc-1krza7i-8"
 })(["margin-left:24px;", ""], _mediaQuery["default"].mobileOnly(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    margin-left: 16px;\n  "]))));
-
 var FlexGroup = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__FlexGroup",
   componentId: "sc-1krza7i-9"
 })(["display:flex;align-items:center;"]);
-
 var ChannelContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__ChannelContainer",
   componentId: "sc-1krza7i-10"
 })(["z-index:", ";", ""], zIndex.channel, ChannelEffect);
-
 var HamburgerContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__HamburgerContainer",
   componentId: "sc-1krza7i-11"
@@ -210,66 +163,54 @@ var HamburgerContainer = /*#__PURE__*/_styledComponents["default"].div.withConfi
 }), _mediaQuery["default"].mobileOnly(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    left: 0;\n    transform: none;\n    opacity: ", ";\n  "])), function (props) {
   return props.$showHamburger ? 1 : 0;
 }));
-
 var TabBarContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__TabBarContainer",
   componentId: "sc-1krza7i-12"
 })(["position:fixed;bottom:0;left:0;width:100%;", " ", ""], _mediaQuery["default"].tabletOnly(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    z-index: ", ";\n  "])), zIndex.tabBarTablet), _mediaQuery["default"].mobileOnly(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    z-index: ", ";\n  "])), zIndex.tabBarMobile));
-
 var HideOnArticle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__HideOnArticle",
   componentId: "sc-1krza7i-13"
 })(["", ""], function (props) {
   return props.$isOnArticlePage ? 'display: none;' : '';
 });
-
 var PrevButton = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "header__PrevButton",
   componentId: "sc-1krza7i-14"
 })(["", " margin-right:8px;padding:4px;transform:translateX(-8px);"], function (props) {
   return props.$isShow ? '' : 'display: none;';
 });
-
 var Header = function Header(_ref) {
   var _ref$hamburgerContext = _ref.hamburgerContext,
-      hamburgerContext = _ref$hamburgerContext === void 0 ? {} : _ref$hamburgerContext;
-
+    hamburgerContext = _ref$hamburgerContext === void 0 ? {} : _ref$hamburgerContext;
   var _useContext = (0, _react.useContext)(_headerContext["default"]),
-      releaseBranch = _useContext.releaseBranch,
-      isLinkExternal = _useContext.isLinkExternal,
-      theme = _useContext.theme,
-      toUseNarrow = _useContext.toUseNarrow,
-      hideHeader = _useContext.hideHeader,
-      pathname = _useContext.pathname,
-      referrerPath = _useContext.referrerPath;
-
+    releaseBranch = _useContext.releaseBranch,
+    isLinkExternal = _useContext.isLinkExternal,
+    theme = _useContext.theme,
+    toUseNarrow = _useContext.toUseNarrow,
+    hideHeader = _useContext.hideHeader,
+    pathname = _useContext.pathname,
+    referrerPath = _useContext.referrerPath;
   var _useState = (0, _react.useState)(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      defaultShowHamburger = _useState2[0],
-      setDefaultShowHamburger = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    defaultShowHamburger = _useState2[0],
+    setDefaultShowHamburger = _useState2[1];
   var showHamburger = (hamburgerContext === null || hamburgerContext === void 0 ? void 0 : hamburgerContext.showHamburger) || defaultShowHamburger;
   var setShowHamburger = (hamburgerContext === null || hamburgerContext === void 0 ? void 0 : hamburgerContext.setShowHamburger) || setDefaultShowHamburger;
   var logoLink = (0, _links.getLogoLink)(isLinkExternal, releaseBranch);
   var logoType = (0, _theme.selectLogoType)(theme);
-
   var HamburgerIcon = /*#__PURE__*/_react["default"].createElement(_icon.Hamburger, {
     releaseBranch: releaseBranch
   });
-
   var _selectHeaderTheme = (0, _theme.selectHeaderTheme)(theme),
-      bgColor = _selectHeaderTheme.bgColor,
-      topRowBgColor = _selectHeaderTheme.topRowBgColor;
-
+    bgColor = _selectHeaderTheme.bgColor,
+    topRowBgColor = _selectHeaderTheme.topRowBgColor;
   var toggleHamburger = function toggleHamburger(e) {
     e.stopPropagation();
     setShowHamburger(!showHamburger);
   };
-
   var closeHamburger = function closeHamburger() {
     return setShowHamburger(false);
   };
-
   var ref = (0, _hook.useOutsideClick)(closeHamburger);
   var contextValue = {
     toggleHamburger: toggleHamburger,
@@ -279,25 +220,19 @@ var Header = function Header(_ref) {
   (0, _react.useEffect)(function () {
     closeHamburger();
   }, [pathname]);
-
   var isOnArticlePage = _.includes(pathname, _entityPath["default"].article);
-
   var needPrevIconRoute = ["".concat(_entityPath["default"].account, "/donation-history"), "".concat(_entityPath["default"].account, "/email-subscription"), "".concat(_entityPath["default"].myReading, "/saved"), "".concat(_entityPath["default"].myReading, "/history")];
-
   var isOnNeedPrevIconPage = _.some(needPrevIconRoute, function (el) {
     return _.includes(pathname, el);
   });
-
   var _useState3 = (0, _react.useState)(0),
-      _useState4 = _slicedToArray(_useState3, 2),
-      currentClientWidth = _useState4[0],
-      setCurrentClientWidth = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    currentClientWidth = _useState4[0],
+    setCurrentClientWidth = _useState4[1];
   (0, _react.useEffect)(function () {
     var handleResize = _.throttle(function () {
       setCurrentClientWidth(document.body.clientWidth);
     });
-
     handleResize();
     window.addEventListener('resize', handleResize);
     return function () {
@@ -305,12 +240,10 @@ var Header = function Header(_ref) {
     };
   }, []);
   var showPrevIcon = isOnArticlePage || isOnNeedPrevIconPage && currentClientWidth < 768; // only show it on mobile
-
   var BackToPrevIcon = /*#__PURE__*/_react["default"].createElement(_icon.Arrow, {
     direction: "left",
     releaseBranch: releaseBranch
   });
-
   var gotoPrev = function gotoPrev() {
     if (referrerPath || (0, _links.checkReferrer)(document.referrer, releaseBranch)) {
       // go to previous page when referer is twreporter site
@@ -320,7 +253,6 @@ var Header = function Header(_ref) {
       window.location.href = '/';
     }
   };
-
   var DesktopHeaderJSX = /*#__PURE__*/_react["default"].createElement(HeaderSection, null, /*#__PURE__*/_react["default"].createElement(TopRow, {
     $toUseNarrow: toUseNarrow,
     $topRowBgColor: topRowBgColor
@@ -345,7 +277,6 @@ var Header = function Header(_ref) {
   }, /*#__PURE__*/_react["default"].createElement(_channels["default"], {
     onClickHambuger: toggleHamburger
   }))));
-
   var MobileHeaderJSX = /*#__PURE__*/_react["default"].createElement(HeaderSection, null, /*#__PURE__*/_react["default"].createElement(TopRow, {
     $toUseNarrow: toUseNarrow,
     $topRowBgColor: topRowBgColor
@@ -359,7 +290,6 @@ var Header = function Header(_ref) {
     type: logoType,
     releaseBranch: releaseBranch
   })))), /*#__PURE__*/_react["default"].createElement(FlexGroup, null, /*#__PURE__*/_react["default"].createElement(_actionButton.MobileHeaderAction, null), /*#__PURE__*/_react["default"].createElement(IconContainer, null, /*#__PURE__*/_react["default"].createElement(_icons.MobileIcons, null)))));
-
   return /*#__PURE__*/_react["default"].createElement(_headerContext.HamburgerContext.Provider, {
     value: contextValue
   }, /*#__PURE__*/_react["default"].createElement(HeaderContainer, {
@@ -385,9 +315,7 @@ var Header = function Header(_ref) {
     toggleHamburger: toggleHamburger
   })))));
 };
-
 Header.propTypes = {
   hamburgerContext: _propTypes["default"].object
 };
-var _default = Header;
-exports["default"] = _default;
+var _default = exports["default"] = Header;

package/lib/components/header.stories.js

@@ -4,21 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.universal = exports["default"] = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _header = _interopRequireDefault(require("./header"));
-
 var _headerContext = _interopRequireDefault(require("../contexts/header-context"));
-
 var _constants = require("../storybook/constants");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 /* eslint-disable react/prop-types */
-
 /* eslint react/display-name:0 */
-var _default = {
+var _default = exports["default"] = {
   title: 'Header/Universal',
   component: _header["default"],
   argTypes: {
@@ -44,14 +37,13 @@ var _default = {
     releaseBranch: _constants.BRANCH_STORYBOOK_ARG_TYPE
   }
 };
-exports["default"] = _default;
-var universal = {
+var universal = exports.universal = {
   render: function render(props) {
     var theme = props.theme,
-        releaseBranch = props.releaseBranch,
-        toUseNarrow = props.toUseNarrow,
-        hideHeader = props.hideHeader,
-        isAuthed = props.isAuthed;
+      releaseBranch = props.releaseBranch,
+      toUseNarrow = props.toUseNarrow,
+      hideHeader = props.hideHeader,
+      isAuthed = props.isAuthed;
     var context = {
       theme: theme,
       releaseBranch: releaseBranch,
@@ -69,5 +61,4 @@ var universal = {
       exclude: ['pathname']
     }
   }
-};
-exports.universal = universal;
+};

package/lib/components/icons.js

@@ -1,76 +1,51 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.MobileIcons = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _querystring = _interopRequireDefault(require("querystring"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _headerContext = _interopRequireDefault(require("../contexts/header-context"));
-
 var _links = require("../utils/links");
-
 var _customizedLink = _interopRequireDefault(require("@twreporter/react-components/lib/customized-link"));
-
 var _button = require("@twreporter/react-components/lib/button");
-
 var _icon = require("@twreporter/react-components/lib/icon");
-
 var _input = require("@twreporter/react-components/lib/input");
-
 var _hook = require("@twreporter/react-components/lib/hook");
-
 var _theme = require("@twreporter/core/lib/constants/theme");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 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) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_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 _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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // context
+// utils
+// @twreporter
 var IconsContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "icons__IconsContainer",
   componentId: "ay66zn-0"
 })(["display:flex;"]);
-
 var IconContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "icons__IconContainer",
   componentId: "ay66zn-1"
 })(["position:relative;margin-right:16px;&:last-child{margin-right:0;}a{display:flex;}"]);
-
 var Container = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "icons__Container",
   componentId: "ay66zn-2"
 })(["opacity:", ";transition:opacity 300ms ease;"], function (props) {
   return props.$isSearchOpened ? '0' : '1';
 });
-
 var LogContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "icons__LogContainer",
   componentId: "ay66zn-3"
 })(["display:flex;flex-direction:column;"]);
-
 var SearchContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "icons__SearchContainer",
   componentId: "ay66zn-4"
@@ -79,47 +54,36 @@ var SearchContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 }, function (props) {
   return props.$isSearchOpened ? 999 : -1;
 });
-
 var MemberButtonType = {
   ICON: 'icon',
   TEXT: 'text'
 };
-
 var MemberIcon = function MemberIcon(_ref) {
   var _ref$memberButtonType = _ref.memberButtonType,
-      memberButtonType = _ref$memberButtonType === void 0 ? MemberButtonType.ICON : _ref$memberButtonType,
-      _ref$isForHambuger = _ref.isForHambuger,
-      isForHambuger = _ref$isForHambuger === void 0 ? false : _ref$isForHambuger;
-
+    memberButtonType = _ref$memberButtonType === void 0 ? MemberButtonType.ICON : _ref$memberButtonType,
+    _ref$isForHambuger = _ref.isForHambuger,
+    isForHambuger = _ref$isForHambuger === void 0 ? false : _ref$isForHambuger;
   var _useContext = (0, _react.useContext)(_headerContext["default"]),
-      releaseBranch = _useContext.releaseBranch,
-      theme = _useContext.theme,
-      isAuthed = _useContext.isAuthed,
-      isLinkExternal = _useContext.isLinkExternal;
-
+    releaseBranch = _useContext.releaseBranch,
+    theme = _useContext.theme,
+    isAuthed = _useContext.isAuthed,
+    isLinkExternal = _useContext.isLinkExternal;
   var onClickIcon = function onClickIcon(e) {
     e.preventDefault();
-
     if (isAuthed) {
       window.location = (0, _links.getMemberLink)(isLinkExternal, releaseBranch).to;
       return;
     }
-
     var redirectURL = window.location.href;
-
     var query = _querystring["default"].stringify({
       destination: redirectURL
     });
-
     window.location = (0, _links.getLoginLink)(releaseBranch).to + '?' + query;
   };
-
   var Icon = /*#__PURE__*/_react["default"].createElement(_icon.Member, {
     releaseBranch: releaseBranch
   });
-
   var buttonTheme;
-
   if (isForHambuger) {
     if (theme === _theme.THEME.transparent) {
       buttonTheme = _theme.THEME.normal;
@@ -129,7 +93,6 @@ var MemberIcon = function MemberIcon(_ref) {
   } else {
     buttonTheme = theme;
   }
-
   var LoginButton = memberButtonType === MemberButtonType.ICON || isAuthed ? /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
     iconComponent: Icon,
     theme: buttonTheme
@@ -144,56 +107,43 @@ var MemberIcon = function MemberIcon(_ref) {
     onClick: onClickIcon
   }, LoginButton));
 };
-
 MemberIcon.propTypes = {
   memberButtonType: _propTypes["default"].oneOf(Object.values(MemberButtonType)),
   isForHambuger: _propTypes["default"].bool
 };
-
 var SearchIcon = function SearchIcon() {
   var _useState = (0, _react.useState)(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      isSearchOpened = _useState2[0],
-      setSearchOpened = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    isSearchOpened = _useState2[0],
+    setSearchOpened = _useState2[1];
   var _useContext2 = (0, _react.useContext)(_headerContext["default"]),
-      isLinkExternal = _useContext2.isLinkExternal,
-      releaseBranch = _useContext2.releaseBranch,
-      theme = _useContext2.theme;
-
+    isLinkExternal = _useContext2.isLinkExternal,
+    releaseBranch = _useContext2.releaseBranch,
+    theme = _useContext2.theme;
   var closeSearchBox = function closeSearchBox() {
     setSearchOpened(false);
   };
-
   var handleClickSearch = function handleClickSearch(e) {
     e.preventDefault();
     setSearchOpened(true);
-
     if (!ref.current) {
       return;
     }
-
     var input = ref.current.getElementsByTagName('INPUT')[0];
-
     if (input) {
       input.focus();
     }
   };
-
   var onSearch = function onSearch(keywords) {
     setSearchOpened(false);
-
     if (!window) {
       return;
     }
-
     window.location = "".concat((0, _links.getSearchLink)(isLinkExternal, releaseBranch).to, "?q=").concat(keywords);
   };
-
   var Icon = /*#__PURE__*/_react["default"].createElement(_icon.Search, {
     releaseBranch: releaseBranch
   });
-
   var ref = (0, _hook.useOutsideClick)(closeSearchBox);
   return /*#__PURE__*/_react["default"].createElement(IconContainer, {
     ref: ref,
@@ -213,19 +163,15 @@ var SearchIcon = function SearchIcon() {
     onSearch: onSearch
   })));
 };
-
 var MyReadingIcon = function MyReadingIcon() {
   var _useContext3 = (0, _react.useContext)(_headerContext["default"]),
-      releaseBranch = _useContext3.releaseBranch,
-      isLinkExternal = _useContext3.isLinkExternal,
-      theme = _useContext3.theme;
-
+    releaseBranch = _useContext3.releaseBranch,
+    isLinkExternal = _useContext3.isLinkExternal,
+    theme = _useContext3.theme;
   var link = (0, _links.getMyReadingLink)(isLinkExternal, releaseBranch);
-
   var Icon = /*#__PURE__*/_react["default"].createElement(_icon.KidStar, {
     releaseBranch: releaseBranch
   });
-
   return /*#__PURE__*/_react["default"].createElement(IconContainer, {
     key: "bookmark"
   }, /*#__PURE__*/_react["default"].createElement(_customizedLink["default"], link, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
@@ -233,23 +179,18 @@ var MyReadingIcon = function MyReadingIcon() {
     theme: theme
   })));
 };
-
 var Icons = function Icons() {
   return /*#__PURE__*/_react["default"].createElement(IconsContainer, null, /*#__PURE__*/_react["default"].createElement(SearchIcon, null), /*#__PURE__*/_react["default"].createElement(MyReadingIcon, null), /*#__PURE__*/_react["default"].createElement(MemberIcon, null));
 };
-
-var MobileIcons = function MobileIcons(_ref2) {
+var MobileIcons = exports.MobileIcons = function MobileIcons(_ref2) {
   var _ref2$isForHambuger = _ref2.isForHambuger,
-      isForHambuger = _ref2$isForHambuger === void 0 ? false : _ref2$isForHambuger;
+    isForHambuger = _ref2$isForHambuger === void 0 ? false : _ref2$isForHambuger;
   return /*#__PURE__*/_react["default"].createElement(IconsContainer, null, /*#__PURE__*/_react["default"].createElement(MemberIcon, {
     memberButtonType: MemberButtonType.TEXT,
     isForHambuger: isForHambuger
   }));
 };
-
-exports.MobileIcons = MobileIcons;
 MobileIcons.propTypes = {
   isForHambuger: _propTypes["default"].bool
 };
-var _default = Icons;
-exports["default"] = _default;
+var _default = exports["default"] = Icons;