@twreporter/react-article-components 1.13.1 → 1.13.2-rc.0

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.13.2-rc.0](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-article-components@1.13.1...@twreporter/react-article-components@1.13.2-rc.0) (2024-04-17)
+
+**Note:** Version bump only for package @twreporter/react-article-components
+
+
+
+
+
 ## [1.13.1](https://github.com/twreporter/twreporter-npm-packages/compare/@twreporter/react-article-components@1.13.1-rc.1...@twreporter/react-article-components@1.13.1) (2024-04-08)
 
 **Note:** Version bump only for package @twreporter/react-article-components

package/lib/components/article-page.js

@@ -45,16 +45,10 @@ var _releaseBranch = _interopRequireDefault(require("@twreporter/core/lib/consta
 
 var _color = require("@twreporter/core/lib/constants/color");
 
-var _featureFlag = require("@twreporter/core/lib/constants/feature-flag");
-
 var _desktopTools = _interopRequireDefault(require("./aside/desktop-tools"));
 
-var _desktopToolsOld = _interopRequireDefault(require("./aside/desktop-tools-old"));
-
 var _mobileToolBar = _interopRequireDefault(require("./aside/mobile-tool-bar"));
 
-var _mobileToolBarOld = _interopRequireDefault(require("./aside/mobile-tool-bar-old"));
-
 var _get = _interopRequireDefault(require("lodash/get"));
 
 var _throttle = _interopRequireDefault(require("lodash/throttle"));
@@ -95,8 +89,6 @@ var _ = {
   get: _get["default"],
   throttle: _throttle["default"]
 };
-var Tools = _featureFlag.MY_READING ? _desktopTools["default"] : _desktopToolsOld["default"];
-var ToolBar = _featureFlag.MY_READING ? _mobileToolBar["default"] : _mobileToolBarOld["default"];
 var shiftLeftCss = /*#__PURE__*/(0, _styledComponents.css)(["position:relative;width:calc(100% + 20px);left:-10px;"]);
 
 var BorderBox = /*#__PURE__*/_styledComponents["default"].div.withConfig({
@@ -141,7 +133,7 @@ var DesktopToolsBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig
   componentId: "sc-1wuywdb-7"
 })(["", ""], _mediaQuery["default"].tabletAndBelow(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n    display: none;\n  "]))));
 
-var MobileToolBar = /*#__PURE__*/(0, _styledComponents["default"])(ToolBar).withConfig({
+var MobileToolBar = /*#__PURE__*/(0, _styledComponents["default"])(_mobileToolBar["default"]).withConfig({
   displayName: "article-page__MobileToolBar",
   componentId: "sc-1wuywdb-8"
 })(["", ""], _mediaQuery["default"].desktopAndAbove(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n    display: none;\n  "]))));
@@ -394,7 +386,7 @@ var Article = /*#__PURE__*/function (_PureComponent) {
         writers: post.writers,
         engineers: post.engineers,
         rawAutherText: post.extend_byline
-      }), /*#__PURE__*/_react["default"].createElement(DesktopToolsBlock, null, /*#__PURE__*/_react["default"].createElement(Tools, {
+      }), /*#__PURE__*/_react["default"].createElement(DesktopToolsBlock, null, /*#__PURE__*/_react["default"].createElement(_desktopTools["default"], {
         articleMetaForBookmark: articleMetaForBookmark,
         backToTopic: backToTopic,
         onFontLevelChange: this.changeFontLevel

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twreporter/react-article-components",
-  "version": "1.13.1",
+  "version": "1.13.2-rc.0",
   "description": "The Reporter react article components, which are used in article page",
   "main": "lib/components/article-page.js",
   "repository": "https://github.com/twreporter/twreporter-npm-packages.git",
@@ -24,10 +24,10 @@
     "webpack-dev-server": "^3.7.2"
   },
   "dependencies": {
-    "@twreporter/core": "^1.19.0",
-    "@twreporter/react-components": "^8.27.0",
-    "@twreporter/redux": "^7.11.2",
-    "@twreporter/universal-header": "^2.12.1",
+    "@twreporter/core": "^1.19.1-rc.0",
+    "@twreporter/react-components": "^8.27.1-rc.0",
+    "@twreporter/redux": "^7.11.3-rc.0",
+    "@twreporter/universal-header": "^2.12.2-rc.0",
     "howler": "^2.2.3",
     "lodash": "^4.17.11",
     "memoize-one": "^5.0.5",
@@ -40,5 +40,5 @@
   "files": [
     "lib"
   ],
-  "gitHead": "1830217a1fe0e48d9b170037426dc36253441470"
+  "gitHead": "2ccfeb87fefdcc4fc6c267c01987f41da353b65a"
 }

package/lib/components/aside/desktop-tools-old.js

@@ -1,245 +0,0 @@
-"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); }
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _dynamicComponentsContext = _interopRequireDefault(require("../../contexts/dynamic-components-context"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
-var _theme = _interopRequireDefault(require("../../constants/theme"));
-
-var _aside = _interopRequireDefault(require("../../constants/prop-types/aside"));
-
-var _icon = require("@twreporter/react-components/lib/icon");
-
-var _bookmarkWidget = _interopRequireDefault(require("@twreporter/react-components/lib/bookmark-widget"));
-
-var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
-
-var _color = require("@twreporter/core/lib/constants/color");
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
-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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-function changeFontSizeOffsetToPct(fontSizeOffset) {
-  switch (fontSizeOffset) {
-    case 2:
-      {
-        return '110%';
-      }
-
-    case 4:
-      {
-        return '120%';
-      }
-
-    case 0:
-    default:
-      {
-        return '100%';
-      }
-  }
-}
-
-var iconBlockCSS = /*#__PURE__*/(0, _styledComponents.css)(["position:relative;cursor:pointer;line-height:1;padding:6px;svg{width:18px;height:18px;background-color:", ";}&::after{position:absolute;top:10px;left:34px;color:", ";font-size:10px;visibility:hidden;width:100px;}&:hover{svg{background-color:", ";}&::after{visibility:visible;}}", ""], _color.colorGrayscale.gray600, _color.colorGrayscale.gray800, _color.colorGrayscale.gray800, _mediaQuery["default"].tabletAndBelow(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    &::after {\n      top: 100%;\n      left: 50%;\n      transform: translateX(-50%);\n      text-align: center;\n    }\n  "]))));
-
-var TextIconBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "desktop-tools-old__TextIconBlock",
-  componentId: "sc-14dm8uk-0"
-})(["", " &::after{content:'\u5B57\u7D1A\u5927\u5C0F", "';}"], iconBlockCSS, function (props) {
-  return changeFontSizeOffsetToPct(props.theme.fontSizeOffset);
-});
-
-var BackToTopicBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "desktop-tools-old__BackToTopicBlock",
-  componentId: "sc-14dm8uk-1"
-})(["", " &::after{content:'\u56DE\u5230\u5C08\u984C';}"], iconBlockCSS);
-
-var PrintIconBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "desktop-tools-old__PrintIconBlock",
-  componentId: "sc-14dm8uk-2"
-})(["", " &::after{content:'\u5217\u5370';}"], iconBlockCSS);
-
-var BookmarkIconBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "desktop-tools-old__BookmarkIconBlock",
-  componentId: "sc-14dm8uk-3"
-})(["", " &::after{content:'", "';}"], iconBlockCSS, function (props) {
-  return props.isBookmarked ? '取消書籤' : '加入書籤';
-});
-
-var ShareIconBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "desktop-tools-old__ShareIconBlock",
-  componentId: "sc-14dm8uk-4"
-})(["svg{width:18px;height:18px;background-color:", ";}background-color:", ";border-radius:50%;padding:6px;cursor:pointer;display:flex;"], _color.colorGrayscale.gray800, _color.colorGrayscale.white);
-
-var ToolsBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "desktop-tools-old__ToolsBlock",
-  componentId: "sc-14dm8uk-5"
-})(["display:flex;", " ", " ", " ", " ", ""], _mediaQuery["default"].mobileOnly(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    width: calc(300/375*100%);\n    margin-left: auto;\n    margin-right: auto;\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    width: calc(453/768*100%);\n    max-width: 453px;\n    margin-left: auto;\n    margin-right: auto;\n    > svg, > div, > a {\n      margin-right: 30px;\n    }\n  "]))), _mediaQuery["default"].tabletAndBelow(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    justify-content: space-between;\n  "]))), _mediaQuery["default"].desktopAndAbove(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    width: 36px;\n    height: ", ";\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: center;\n  "])), function (props) {
-  return props.height || 'auto';
-}), function (props) {
-  switch (props.theme.name) {
-    case _theme["default"].article.v2.photo:
-      return (0, _styledComponents.css)(["", "{background-color:", ";svg{background-color:", ";}}", ",", ",", ",", "{svg{background-color:", ";}&::after{color:", ";}&:hover svg{background-color:", ";}}"], ShareIconBlock, _color.colorPhoto.heavy, _color.colorGrayscale.gray100, TextIconBlock, BackToTopicBlock, PrintIconBlock, BookmarkIconBlock, _color.colorGrayscale.gray100, _color.colorSupportive.pastel, _color.colorSupportive.pastel);
-
-    default:
-      return '';
-  }
-});
-
-function FBShareBT(props) {
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var releaseBranch = themeContext.releaseBranch;
-
-  var handleClick = function handleClick() {
-    var currentURL = window.location.href;
-    var location = 'https://www.facebook.com/dialog/feed?' + 'display=page' + "&app_id=".concat(props.appID) + "&link=".concat(encodeURIComponent(currentURL)) + "&redirect_uri=".concat(encodeURIComponent('https://www.facebook.com/'));
-    window.open(location, '_blank');
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(ShareIconBlock, {
-    id: "fb-share"
-  }, /*#__PURE__*/_react["default"].createElement(_icon.Facebook, {
-    onClick: handleClick,
-    releaseBranch: releaseBranch
-  }));
-}
-
-FBShareBT.propTypes = {
-  appID: _propTypes["default"].string.isRequired
-};
-
-function TwitterShareBT(props) {
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var releaseBranch = themeContext.releaseBranch;
-
-  var handleClick = function handleClick() {
-    var currentURL = window.location.href;
-    var location = 'https://twitter.com/intent/tweet?' + "url=".concat(encodeURIComponent(currentURL), "&text=").concat(encodeURIComponent(document.title + ' #報導者'));
-    window.open(location, '_blank');
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(ShareIconBlock, {
-    id: "twitter-share"
-  }, /*#__PURE__*/_react["default"].createElement(_icon.Twitter, {
-    onClick: handleClick,
-    releaseBranch: releaseBranch
-  }));
-}
-
-function LineShareBT(props) {
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var releaseBranch = themeContext.releaseBranch;
-
-  var handleClick = function handleClick() {
-    var currentURL = window.location.href;
-    var location = "https://social-plugins.line.me/lineit/share?url=".concat(encodeURIComponent(currentURL));
-    window.open(location, '_blank');
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(ShareIconBlock, {
-    id: "line-share"
-  }, /*#__PURE__*/_react["default"].createElement(_icon.Line, {
-    onClick: handleClick,
-    releaseBranch: releaseBranch
-  }));
-}
-
-var BookmarkBlock = function BookmarkBlock(_ref) {
-  var articleMeta = _ref.articleMeta;
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var releaseBranch = themeContext.releaseBranch;
-
-  var renderIcon = function renderIcon(isBookmarked, addAction, removeAction) {
-    var iconType = isBookmarked ? 'saved' : 'add';
-    var id = isBookmarked ? 'remove-bookmark' : 'add-bookmark';
-    return /*#__PURE__*/_react["default"].createElement(BookmarkIconBlock, {
-      onClick: isBookmarked ? removeAction : addAction,
-      isBookmarked: isBookmarked,
-      id: id
-    }, /*#__PURE__*/_react["default"].createElement(_icon.Bookmark, {
-      type: iconType,
-      releaseBranch: releaseBranch
-    }));
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(_bookmarkWidget["default"], {
-    toAutoCheck: true,
-    articleMeta: articleMeta,
-    renderIcon: renderIcon
-  });
-};
-
-BookmarkBlock.propTypes = {
-  articleMeta: _aside["default"].tools.articleMetaForBookmark
-};
-
-var BackToTopic = function BackToTopic(_ref2) {
-  var backToTopic = _ref2.backToTopic;
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var releaseBranch = themeContext.releaseBranch;
-  return /*#__PURE__*/_react["default"].createElement(_dynamicComponentsContext["default"].Consumer, null, function (components) {
-    return /*#__PURE__*/_react["default"].createElement(components.Link, {
-      to: backToTopic,
-      target: "_self"
-    }, /*#__PURE__*/_react["default"].createElement(BackToTopicBlock, null, /*#__PURE__*/_react["default"].createElement(_icon.Topic, {
-      releaseBranch: releaseBranch
-    })));
-  });
-};
-
-BackToTopic.propTypes = {
-  backToTopic: _aside["default"].tools.backToTopic
-};
-var defaultFbAppID = '962589903815787';
-
-var Tools = function Tools(_ref3) {
-  var backToTopic = _ref3.backToTopic,
-      fbAppID = _ref3.fbAppID,
-      height = _ref3.height,
-      onFontLevelChange = _ref3.onFontLevelChange,
-      articleMetaForBookmark = _ref3.articleMetaForBookmark;
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var releaseBranch = themeContext.releaseBranch;
-  var backToTopicJSX = backToTopic ? /*#__PURE__*/_react["default"].createElement(BackToTopic, {
-    backToTopic: backToTopic
-  }) : null;
-
-  var onPrinterClick = function onPrinterClick() {
-    return window.print();
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(ToolsBlock, {
-    height: height
-  }, backToTopicJSX, /*#__PURE__*/_react["default"].createElement(BookmarkBlock, {
-    articleMeta: articleMetaForBookmark
-  }), /*#__PURE__*/_react["default"].createElement(TextIconBlock, null, /*#__PURE__*/_react["default"].createElement(_icon.Text, {
-    onClick: onFontLevelChange,
-    releaseBranch: releaseBranch
-  })), /*#__PURE__*/_react["default"].createElement(PrintIconBlock, null, /*#__PURE__*/_react["default"].createElement(_icon.Printer, {
-    onClick: onPrinterClick,
-    releaseBranch: releaseBranch
-  })), /*#__PURE__*/_react["default"].createElement(FBShareBT, {
-    appID: fbAppID || defaultFbAppID
-  }), /*#__PURE__*/_react["default"].createElement(TwitterShareBT, null), /*#__PURE__*/_react["default"].createElement(LineShareBT, null));
-};
-
-Tools.propTypes = _aside["default"].tools;
-var _default = Tools;
-exports["default"] = _default;

package/lib/components/aside/mobile-tool-bar-old.js

@@ -1,529 +0,0 @@
-"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); }
-
-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 _dynamicComponentsContext = _interopRequireDefault(require("../../contexts/dynamic-components-context"));
-
-var _aside = _interopRequireDefault(require("../../constants/prop-types/aside"));
-
-var _theme = _interopRequireDefault(require("../../constants/theme"));
-
-var _anchor = require("../../constants/anchor");
-
-var _theme2 = require("./utils/theme");
-
-var _hook = require("@twreporter/react-components/lib/hook");
-
-var _bookmarkWidget = _interopRequireDefault(require("@twreporter/react-components/lib/bookmark-widget"));
-
-var _icon = require("@twreporter/react-components/lib/icon");
-
-var _button = require("@twreporter/react-components/lib/button");
-
-var _snackBar = require("@twreporter/react-components/lib/snack-bar");
-
-var _zIndex = _interopRequireDefault(require("@twreporter/core/lib/constants/z-index"));
-
-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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-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 asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
-
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-
-// global var
-var ToolBarContext = /*#__PURE__*/(0, _react.createContext)();
-var defaultFbAppID = '962589903815787';
-
-var defaultFunc = function defaultFunc() {};
-
-var ButtonContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "mobile-tool-bar-old__ButtonContainer",
-  componentId: "sc-12vlkqc-0"
-})(["display:flex;flex-direction:column;align-items:center;width:50px;margin-right:8px;&:last-child{margin-right:0;}"]);
-
-var ShareContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "mobile-tool-bar-old__ShareContainer",
-  componentId: "sc-12vlkqc-1"
-})(["display:flex;align-items:center;padding:8px;border-radius:50%;margin-right:8px;&:last-child{margin-right:0;}"]);
-
-var OptionContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "mobile-tool-bar-old__OptionContainer",
-  componentId: "sc-12vlkqc-2"
-})(["z-index:6;opacity:", ";transition:opacity 100ms;position:absolute;top:-55px;left:50%;transform:translateX(-50%);display:flex;"], function (props) {
-  return props.isShow ? '1' : '0';
-});
-
-var SnackBarContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "mobile-tool-bar-old__SnackBarContainer",
-  componentId: "sc-12vlkqc-3"
-})(["z-index:5;position:absolute;left:50%;transform:translateX(-50%);transition:opacity 100ms;opacity:", ";"], function (props) {
-  return props.showSnackBar ? 1 : 0;
-});
-
-var ToolBarWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "mobile-tool-bar-old__ToolBarWrapper",
-  componentId: "sc-12vlkqc-4"
-})(["display:flex;width:100%;justify-content:center;padding:8px;position:fixed;left:0px;bottom:env(safe-area-inset-bottom,0);height:", ";transform:", ";transition:height 200ms,transform 200ms ease-in-out;background-color:", ";border-top:1px solid ", ";z-index:", ";", "{background-color:", ";box-shadow:", ";}", "{bottom:", ";}"], function (props) {
-  return props.hideText ? '40px' : '55px';
-}, function (props) {
-  return props.isHidden ? 'translateY(200%)' : 'tanslateY(0%)';
-}, function (props) {
-  return props.bgColor;
-}, function (props) {
-  return props.borderColor;
-}, _zIndex["default"].mobileToolBar, ShareContainer, function (props) {
-  return props.shareByBgColor;
-}, function (props) {
-  return props.shadow;
-}, SnackBarContainer, function (props) {
-  return props.hideText ? '48px' : '62px';
-});
-
-var ToolBarContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  displayName: "mobile-tool-bar-old__ToolBarContainer",
-  componentId: "sc-12vlkqc-5"
-})(["display:flex;width:100%;max-width:560px;justify-content:space-evenly;align-items:center;"]);
-
-var FbShare = function FbShare(_ref) {
-  var appID = _ref.appID;
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-
-  var shareToFb = function shareToFb() {
-    var currentURL = window.location.href;
-    var location = 'https://www.facebook.com/dialog/feed?' + 'display=page' + "&app_id=".concat(appID) + "&link=".concat(encodeURIComponent(currentURL)) + "&redirect_uri=".concat(encodeURIComponent('https://www.facebook.com/'));
-    window.open(location, '_blank');
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(ShareContainer, {
-    id: "fb-share",
-    onClick: shareToFb
-  }, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
-    iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Facebook, {
-      releaseBranch: releaseBranch
-    }),
-    theme: theme
-  }));
-};
-
-FbShare.propTypes = {
-  appID: _aside["default"].tools.fbAppID
-};
-
-var LineShare = function LineShare() {
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-
-  var shareToLine = function shareToLine() {
-    var currentURL = window.location.href;
-    var location = "https://social-plugins.line.me/lineit/share?url=".concat(encodeURIComponent(currentURL));
-    window.open(location, '_blank');
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(ShareContainer, {
-    id: "line-share",
-    onClick: shareToLine
-  }, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
-    iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Line, {
-      releaseBranch: releaseBranch
-    }),
-    theme: theme
-  }));
-};
-
-var TwitterShare = function TwitterShare() {
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-
-  var shareToTwitter = function shareToTwitter() {
-    var currentURL = window.location.href;
-    var location = 'https://twitter.com/intent/tweet?' + "url=".concat(encodeURIComponent(currentURL), "&text=").concat(encodeURIComponent(document.title + ' #報導者'));
-    window.open(location, '_blank');
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(ShareContainer, {
-    id: "twitter-share",
-    onClick: shareToTwitter
-  }, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
-    iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Twitter, {
-      releaseBranch: releaseBranch
-    }),
-    theme: theme
-  }));
-};
-
-var CopyUrl = function CopyUrl(_ref2) {
-  var _ref2$onclick = _ref2.onclick,
-      onclick = _ref2$onclick === void 0 ? defaultFunc : _ref2$onclick;
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-
-  var copyUrl = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-      var currentURL;
-      return regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              _context.prev = 0;
-              currentURL = window.location.href;
-              _context.next = 4;
-              return navigator.clipboard.writeText(currentURL);
-
-            case 4:
-              onclick(true);
-              _context.next = 10;
-              break;
-
-            case 7:
-              _context.prev = 7;
-              _context.t0 = _context["catch"](0);
-              onclick(false);
-
-            case 10:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee, null, [[0, 7]]);
-    }));
-
-    return function copyUrl() {
-      return _ref3.apply(this, arguments);
-    };
-  }();
-
-  return /*#__PURE__*/_react["default"].createElement(ShareContainer, {
-    onClick: copyUrl
-  }, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
-    iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Copy, {
-      releaseBranch: releaseBranch
-    }),
-    theme: theme
-  }));
-};
-
-CopyUrl.propTypes = {
-  onclick: _propTypes["default"].func
-};
-
-var ShareBy = function ShareBy(_ref4) {
-  var fbAppID = _ref4.fbAppID;
-
-  var _useState = (0, _react.useState)(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      showOption = _useState2[0],
-      setShowState = _useState2[1];
-
-  var _useContext = (0, _react.useContext)(ToolBarContext),
-      hideText = _useContext.hideText,
-      toastr = _useContext.toastr;
-
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-
-  var onCopyUrl = function onCopyUrl(isCopied) {
-    if (!isCopied) {
-      return;
-    }
-
-    toastr({
-      text: '已複製',
-      timeout: 3000
-    });
-  };
-
-  var onButtonClick = function onButtonClick() {
-    return setShowState(function (prevValue) {
-      return !prevValue;
-    });
-  };
-
-  var onClickOutside = function onClickOutside() {
-    return setShowState(false);
-  };
-
-  var ref = (0, _hook.useOutsideClick)(onClickOutside);
-  return /*#__PURE__*/_react["default"].createElement(ButtonContainer, {
-    ref: ref,
-    onClick: onButtonClick
-  }, /*#__PURE__*/_react["default"].createElement(_button.IconWithTextButton, {
-    text: "\u5206\u4EAB",
-    iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Share, {
-      releaseBranch: releaseBranch
-    }),
-    theme: theme,
-    hideText: hideText
-  }), /*#__PURE__*/_react["default"].createElement(OptionContainer, {
-    isShow: showOption
-  }, /*#__PURE__*/_react["default"].createElement(FbShare, {
-    appID: fbAppID
-  }), /*#__PURE__*/_react["default"].createElement(LineShare, null), /*#__PURE__*/_react["default"].createElement(TwitterShare, null), /*#__PURE__*/_react["default"].createElement(CopyUrl, {
-    onclick: onCopyUrl
-  })));
-};
-
-ShareBy.propTypes = {
-  fbAppID: _aside["default"].tools.fbAppID
-};
-
-var FontLevel = function FontLevel(_ref5) {
-  var changeFontLevel = _ref5.changeFontLevel;
-
-  var _useContext2 = (0, _react.useContext)(ToolBarContext),
-      hideText = _useContext2.hideText;
-
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-  return /*#__PURE__*/_react["default"].createElement(ButtonContainer, {
-    onClick: changeFontLevel
-  }, /*#__PURE__*/_react["default"].createElement(_button.IconWithTextButton, {
-    text: "\u6587\u5B57\u5927\u5C0F",
-    iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Text, {
-      releaseBranch: releaseBranch
-    }),
-    theme: theme,
-    hideText: hideText
-  }));
-};
-
-FontLevel.propTypes = {
-  changeFontLevel: _aside["default"].tools.onFontLevelChange
-};
-
-var BookmarkBlock = function BookmarkBlock(_ref6) {
-  var articleMeta = _ref6.articleMeta;
-
-  var _useContext3 = (0, _react.useContext)(ToolBarContext),
-      hideText = _useContext3.hideText,
-      toastr = _useContext3.toastr;
-
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-
-  var renderIcon = function renderIcon(isBookmarked, addAction, removeAction) {
-    var iconType = isBookmarked ? 'saved' : 'add';
-    var text = isBookmarked ? '已儲存' : '加入書籤';
-    var id = isBookmarked ? 'remove-bookmark' : 'add-bookmark';
-
-    var handleClick = /*#__PURE__*/function () {
-      var _ref7 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
-        var action;
-        return regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                action = isBookmarked ? removeAction : addAction;
-                _context2.prev = 1;
-                _context2.next = 4;
-                return action();
-
-              case 4:
-                _context2.next = 9;
-                break;
-
-              case 6:
-                _context2.prev = 6;
-                _context2.t0 = _context2["catch"](1);
-                console.error('add bookmark fail', _context2.t0);
-
-              case 9:
-                onClickButton(isBookmarked);
-
-              case 10:
-              case "end":
-                return _context2.stop();
-            }
-          }
-        }, _callee2, null, [[1, 6]]);
-      }));
-
-      return function handleClick() {
-        return _ref7.apply(this, arguments);
-      };
-    }();
-
-    return /*#__PURE__*/_react["default"].createElement(ButtonContainer, {
-      onClick: handleClick,
-      id: id
-    }, /*#__PURE__*/_react["default"].createElement(_button.IconWithTextButton, {
-      text: text,
-      iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Bookmark, {
-        type: iconType,
-        releaseBranch: releaseBranch
-      }),
-      theme: theme,
-      hideText: hideText
-    }));
-  };
-
-  var onClickButton = function onClickButton(isBookmarked) {
-    var text = isBookmarked ? '已取消書籤' : '已儲存';
-    toastr({
-      text: text,
-      timeout: 3000
-    });
-  };
-
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_bookmarkWidget["default"], {
-    toAutoCheck: true,
-    articleMeta: articleMeta,
-    renderIcon: renderIcon
-  }));
-};
-
-BookmarkBlock.propTypes = {
-  articleMeta: _aside["default"].tools.articleMetaForBookmark
-};
-
-var BackToTopic = function BackToTopic(_ref8) {
-  var backToTopic = _ref8.backToTopic;
-
-  var _useContext4 = (0, _react.useContext)(ToolBarContext),
-      hideText = _useContext4.hideText;
-
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-  return /*#__PURE__*/_react["default"].createElement(_dynamicComponentsContext["default"].Consumer, null, function (components) {
-    return /*#__PURE__*/_react["default"].createElement(components.Link, {
-      to: backToTopic,
-      target: "_self"
-    }, /*#__PURE__*/_react["default"].createElement(ButtonContainer, null, /*#__PURE__*/_react["default"].createElement(_button.IconWithTextButton, {
-      text: "\u524D\u5F80\u5C08\u984C",
-      iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Topic, {
-        releaseBranch: releaseBranch
-      }),
-      theme: theme,
-      hideText: hideText
-    })));
-  });
-};
-
-BackToTopic.propTypes = {
-  backToTopic: _aside["default"].tools.backToTopic
-};
-
-var RelatedPost = function RelatedPost() {
-  var _useContext5 = (0, _react.useContext)(ToolBarContext),
-      hideText = _useContext5.hideText;
-
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-  var releaseBranch = themeContext.releaseBranch;
-
-  var anchorScrollAttr = _defineProperty({}, _anchor.ARTICLE_ANCHOR_SCROLL, 'true');
-
-  return /*#__PURE__*/_react["default"].createElement(ButtonContainer, null, /*#__PURE__*/_react["default"].createElement("a", _extends({
-    href: "#".concat(_anchor.RELATED_POST_ANCHOR_ID)
-  }, anchorScrollAttr), /*#__PURE__*/_react["default"].createElement(_button.IconWithTextButton, {
-    text: "\u76F8\u95DC\u6587\u7AE0",
-    iconComponent: /*#__PURE__*/_react["default"].createElement(_icon.Article, {
-      releaseBranch: releaseBranch
-    }),
-    theme: theme,
-    hideText: hideText
-  })));
-};
-
-var ToolBar = function ToolBar(_ref9) {
-  var backToTopic = _ref9.backToTopic,
-      _ref9$fbAppID = _ref9.fbAppID,
-      fbAppID = _ref9$fbAppID === void 0 ? defaultFbAppID : _ref9$fbAppID,
-      articleMetaForBookmark = _ref9.articleMetaForBookmark,
-      onFontLevelChange = _ref9.onFontLevelChange,
-      className = _ref9.className,
-      scrollStage = _ref9.scrollStage;
-  var themeContext = (0, _react.useContext)(_styledComponents.ThemeContext);
-  var theme = themeContext.name === _theme["default"].article.v2.photo ? 'photography' : 'normal';
-
-  var _getToolBarTheme = (0, _theme2.getToolBarTheme)(themeContext.name),
-      bgColor = _getToolBarTheme.bgColor,
-      borderColor = _getToolBarTheme.borderColor,
-      shareByBgColor = _getToolBarTheme.shareByBgColor;
-
-  var _useSnackBar = (0, _snackBar.useSnackBar)(),
-      showSnackBar = _useSnackBar.showSnackBar,
-      snackBarText = _useSnackBar.snackBarText,
-      toastr = _useSnackBar.toastr;
-
-  var backToTopicJSX = backToTopic ? /*#__PURE__*/_react["default"].createElement(BackToTopic, {
-    backToTopic: backToTopic
-  }) : null;
-  var hideText = scrollStage >= 2;
-  var hideToolBar = scrollStage >= 3;
-  var contextValue = {
-    hideText: hideText,
-    toastr: toastr
-  };
-  return /*#__PURE__*/_react["default"].createElement(ToolBarContext.Provider, {
-    value: contextValue
-  }, /*#__PURE__*/_react["default"].createElement(ToolBarWrapper, {
-    bgColor: bgColor,
-    shareByBgColor: shareByBgColor,
-    borderColor: borderColor,
-    hideText: hideText,
-    className: className,
-    isHidden: hideToolBar,
-    id: "mobile-tool-bar"
-  }, /*#__PURE__*/_react["default"].createElement(ToolBarContainer, null, /*#__PURE__*/_react["default"].createElement(FontLevel, {
-    changeFontLevel: onFontLevelChange
-  }), /*#__PURE__*/_react["default"].createElement(ShareBy, {
-    fbAppID: fbAppID
-  }), /*#__PURE__*/_react["default"].createElement(BookmarkBlock, {
-    articleMeta: articleMetaForBookmark
-  }), /*#__PURE__*/_react["default"].createElement(RelatedPost, null), backToTopicJSX), /*#__PURE__*/_react["default"].createElement(SnackBarContainer, {
-    showSnackBar: showSnackBar
-  }, /*#__PURE__*/_react["default"].createElement(_snackBar.SnackBar, {
-    text: snackBarText,
-    theme: theme
-  }))));
-};
-
-ToolBar.propTypes = _objectSpread(_objectSpread({}, _aside["default"].tools), {}, {
-  scrollStage: _propTypes["default"].number
-});
-var _default = ToolBar;
-exports["default"] = _default;