@twreporter/index-page 2.0.2 → 2.0.3-rc.1

package/lib/components/infographic-section.js

@@ -4,73 +4,45 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _post = _interopRequireDefault(require("./prop-types/post"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _styleUtils = require("../utils/style-utils");
-
 var _getHref = require("../utils/getHref");
-
 var _bottomLink = _interopRequireDefault(require("./common-utils/bottom-link"));
-
 var _categoryName = _interopRequireDefault(require("./common-utils/category-name"));
-
 var _imgWrapper = _interopRequireDefault(require("./common-utils/img-wrapper"));
-
 var _section = _interopRequireDefault(require("./common-utils/section"));
-
 var _sectionAnimationWrapper = _interopRequireDefault(require("./animations/section-animation-wrapper"));
-
 var _sectionName = _interopRequireDefault(require("./common-utils/section-name"));
-
 var _twreporterLink = _interopRequireDefault(require("./common-utils/twreporter-link"));
-
 var _mobileSwiperList = _interopRequireDefault(require("./mobile-swiper-list"));
-
 var _sectionStrings = _interopRequireDefault(require("../constants/section-strings"));
-
 var _font = require("@twreporter/core/lib/constants/font");
-
 var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
-
 var _color = require("@twreporter/core/lib/constants/color");
-
 var _get = _interopRequireDefault(require("lodash/get"));
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
-
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15; // utils
+// components
+// constants
+// @twreporter
+// lodash
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-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); }
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 var _ = {
   get: _get["default"]
 };
@@ -83,42 +55,34 @@ var mockup = {
     }
   }
 };
-
 var Container = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "infographic-section__Container",
   componentId: "sc-2fohll-0"
 })(["background-color:", ";"], _color.colorGrayscale.gray100);
-
 var UpperList = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "infographic-section__UpperList",
   componentId: "sc-2fohll-1"
 })(["list-style-type:none;display:flex;flex-wrap:nowrap;justify-content:center;align-items:flex-start;", ""], _mediaQuery["default"].mobileOnly(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: none;\n  "]))));
-
 var LowerList = /*#__PURE__*/(0, _styledComponents["default"])(UpperList).withConfig({
   displayName: "infographic-section__LowerList",
   componentId: "sc-2fohll-2"
 })(["align-items:flex-end;margin-top:-282px;margin-bottom:59px;", " ", ""], _mediaQuery["default"].desktopOnly(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    margin-top: -170px;\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    margin-top: -130px;\n    margin-bottom: 51px;\n  "]))));
-
 var MobileList = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "infographic-section__MobileList",
   componentId: "sc-2fohll-3"
 })(["margin-bottom:39px;"]);
-
 var Item = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "infographic-section__Item",
   componentId: "sc-2fohll-4"
 })(["max-width:430px;transition:300ms all linear;&:first-child{margin-right:30px;}&:last-child{margin-left:30px;}", " ", " ", " ", ""], _mediaQuery["default"].desktopOnly(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    max-width: 290px;\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    max-width: 220px;\n    &:first-child {\n      margin-right: 20px;\n    }\n\n    &:last-child {\n      margin-left: 20px;\n    }\n  "]))), _mediaQuery["default"].mobileOnly(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    max-width: 100%;\n    &:first-child {\n      margin-left: 0;\n    }\n    &:last-child {\n      margin-right: 0;\n    }\n  "]))), _mediaQuery["default"].tabletAndAbove(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    &:hover {\n      opacity: 0.7;\n    }\n  "]))));
-
 var WordBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "infographic-section__WordBlock",
   componentId: "sc-2fohll-5"
 })(["background-color:", ";width:430px;min-height:115px;padding:8px 20px 15px 12px;", " ", " ", ""], _color.colorGrayscale.white, _mediaQuery["default"].desktopOnly(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    width: 290px;\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    margin: 0 auto;\n    width: 220px;\n  "]))), _mediaQuery["default"].mobileOnly(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    width: 100%;\n    height: 100%;\n  "]))));
-
 var Title = /*#__PURE__*/_styledComponents["default"].h3.withConfig({
   displayName: "infographic-section__Title",
   componentId: "sc-2fohll-6"
 })(["margin:0;font-weight:", ";font-family:", ";font-size:20px;color:", ";", " ", ""], _font.fontWeight.bold, _font.fontFamily.title, _color.colorGrayscale.gray800, _mediaQuery["default"].desktopAndAbove(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    ", ";\n  "])), (0, _styleUtils.truncate)('relative', 1.4, 2, _color.colorGrayscale.white)), _mediaQuery["default"].tabletOnly(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n    font-size: 16px;\n    ", ";\n  "])), (0, _styleUtils.truncate)('relative', 1.4, 3, _color.colorGrayscale.white)));
-
 var ImgFrame = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "infographic-section__ImgFrame",
   componentId: "sc-2fohll-7"
@@ -129,32 +93,26 @@ var ImgFrame = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 }), _mediaQuery["default"].tabletOnly(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n    margin: 0 auto;\n    width: 220px;\n    height: ", ";\n  "])), function (props) {
   return props.$isPortrait ? '290px' : '145px';
 }), _mediaQuery["default"].mobileOnly(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n    width: 100%;\n    height: 186px;\n  "]))));
-
 var More = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "infographic-section__More",
   componentId: "sc-2fohll-8"
 })(["text-align:center;"]);
-
 var Infographic = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(Infographic, _React$PureComponent);
-
   var _super = _createSuper(Infographic);
-
   function Infographic() {
     _classCallCheck(this, Infographic);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(Infographic, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          title = _this$props.title,
-          imgObj = _this$props.imgObj,
-          isPortrait = _this$props.isPortrait,
-          slug = _this$props.slug,
-          isExternal = _this$props.isExternal;
+        title = _this$props.title,
+        imgObj = _this$props.imgObj,
+        isPortrait = _this$props.isPortrait,
+        slug = _this$props.slug,
+        isExternal = _this$props.isExternal;
       var href = (0, _getHref.getHref)(slug, isExternal);
       return /*#__PURE__*/_react["default"].createElement(Item, null, /*#__PURE__*/_react["default"].createElement(_twreporterLink["default"], {
         href: href,
@@ -169,10 +127,8 @@ var Infographic = /*#__PURE__*/function (_React$PureComponent) {
       })), /*#__PURE__*/_react["default"].createElement(WordBlock, null, /*#__PURE__*/_react["default"].createElement(_categoryName["default"], null, _sectionStrings["default"].infographic), /*#__PURE__*/_react["default"].createElement(Title, null, title))));
     }
   }]);
-
   return Infographic;
 }(_react["default"].PureComponent);
-
 Infographic.defaultProps = {
   title: '',
   imgObj: {},
@@ -187,37 +143,29 @@ Infographic.propTypes = {
   isPortrait: _propTypes["default"].bool,
   slug: _propTypes["default"].string
 };
-
 var InfographicSection = /*#__PURE__*/function (_React$PureComponent2) {
   _inherits(InfographicSection, _React$PureComponent2);
-
   var _super2 = _createSuper(InfographicSection);
-
   function InfographicSection() {
     _classCallCheck(this, InfographicSection);
-
     return _super2.apply(this, arguments);
   }
-
   _createClass(InfographicSection, [{
     key: "render",
     value: function render() {
       var _this$props2 = this.props,
-          data = _this$props2.data,
-          moreURI = _this$props2.moreURI,
-          useTinyImg = _this$props2.useTinyImg;
+        data = _this$props2.data,
+        moreURI = _this$props2.moreURI,
+        useTinyImg = _this$props2.useTinyImg;
       var listNumber = 3;
       var postComps = data.slice(0, 6).map(function (item, index) {
         var portraitImg = _.get(item, 'leading_image_portrait');
-
         var imgObj = _.get(item, 'hero_image') || _.get(item, 'og_image');
-
         if (index === 0 || index === 4 || index === 5) {
           if (_typeof(_.get(portraitImg, 'resized_targets')) === 'object') {
             imgObj = portraitImg;
           }
         }
-
         return /*#__PURE__*/_react["default"].createElement(Infographic, {
           key: _.get(item, 'id'),
           category: _.get(item, 'categories.[0].name'),
@@ -239,10 +187,8 @@ var InfographicSection = /*#__PURE__*/function (_React$PureComponent2) {
       }))));
     }
   }]);
-
   return InfographicSection;
 }(_react["default"].PureComponent);
-
 InfographicSection.defaultProps = {
   data: [],
   moreURI: 'categories/infographic',
@@ -253,7 +199,4 @@ InfographicSection.propTypes = {
   data: _propTypes["default"].arrayOf((0, _post["default"])()),
   useTinyImg: _propTypes["default"].bool
 };
-
-var _default = (0, _sectionAnimationWrapper["default"])(InfographicSection);
-
-exports["default"] = _default;
+var _default = exports["default"] = (0, _sectionAnimationWrapper["default"])(InfographicSection);

package/lib/components/junior-box-section.js

@@ -1,54 +1,33 @@
 "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 = _interopRequireDefault(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _app = _interopRequireDefault(require("../constants/app"));
-
 var _juniorLink = _interopRequireDefault(require("@twreporter/react-components/lib/junior-link"));
-
 var _font = require("@twreporter/core/lib/constants/font");
-
 var _releaseBranch = require("@twreporter/core/lib/constants/release-branch");
-
 var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
-
 var _color = require("@twreporter/core/lib/constants/color");
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
-
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9; // constants
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 // assets
 var ArrowIcon = function ArrowIcon(props) {
   return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("title", null, "ic/chevron_right"), /*#__PURE__*/_react["default"].createElement("defs", null, /*#__PURE__*/_react["default"].createElement("path", {
@@ -69,7 +48,6 @@ var ArrowIcon = function ArrowIcon(props) {
     d: "M-8-6h24v24H-8z"
   }))));
 };
-
 ArrowIcon.defaultProps = {
   width: "8",
   height: "12",
@@ -77,13 +55,11 @@ ArrowIcon.defaultProps = {
   xmlns: "http://www.w3.org/2000/svg",
   xmlnsXlink: "http://www.w3.org/1999/xlink"
 }; // @twreporter
-
 var mockup = {
   defaultWidth: 320,
   contentWidth: 238
 };
 var mobileContentWidthPct = mockup.contentWidth / mockup.defaultWidth * 100;
-
 var Container = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "junior-box-section__Container",
   componentId: "sc-1yjyxv7-0"
@@ -96,38 +72,29 @@ var Container = /*#__PURE__*/_styledComponents["default"].div.withConfig({
 }), _mediaQuery["default"].hdOnly(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    background-image: ", ";\n  "])), function (props) {
   return "url(".concat(_app["default"].assetsPath, "/").concat(props.$releaseBranch, "/KidsReporter_DesktopHD.jpg)");
 }));
-
 var ContentContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "junior-box-section__ContentContainer",
   componentId: "sc-1yjyxv7-1"
 })(["display:flex;justify-content:space-between;align-items:center;max-width:1024px;margin:0 auto;padding:0 100px;color:", ";font-family:", ";h3{margin:0;font-size:32px;font-weight:", ";font-family:", ";line-height:1.63;}p{margin-top:10px;font-size:14px;line-height:1.57;text-align:left;}", " ", " ", ""], _color.colorGrayscale.black, _font.fontFamily["default"], _font.fontWeight.bold, _font.fontFamily.title, _mediaQuery["default"].hdOnly(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    max-width: 1440px;\n    padding: 0 219px;\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    position: relative;\n    padding: 0 110px;\n    p{\n      margin-top: 17px;\n    }\n  "]))), _mediaQuery["default"].mobileOnly(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    max-width: ", "%;\n    display: block;\n    text-align: center;\n    padding: 0;\n    h3{\n      font-size: 24px;\n      line-height: 2.17;\n    }\n    p{\n      margin-top: 0;\n    }\n  "])), mobileContentWidthPct));
-
 var CTAButton = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "junior-box-section__CTAButton",
   componentId: "sc-1yjyxv7-2"
 })(["a{width:116px;height:40px;border-radius:20px;background:", ";border:none;color:", ";font-size:16px;cursor:pointer;display:table;", " ", " span{display:table-cell;vertical-align:middle;text-align:center;font-weight:", ";}}"], _color.colorSupportive.heavy, _color.colorGrayscale.white, _mediaQuery["default"].tabletOnly(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      position: absolute;\n      right: 110px;\n      top: 9px;\n    "]))), _mediaQuery["default"].mobileOnly(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      margin: 40px auto 0 auto;\n    "]))), _font.fontWeight.bold);
-
 var TextColumn = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "junior-box-section__TextColumn",
   componentId: "sc-1yjyxv7-3"
 })(["", ""], _mediaQuery["default"].desktopOnly(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    max-width: 608px;\n  "]))));
-
 var Icon = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "junior-box-section__Icon",
   componentId: "sc-1yjyxv7-4"
 })(["display:inline-block;margin-left:8.6px;width:7px;height:12px;"]);
-
 var JuniorBoxSection = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(JuniorBoxSection, _React$PureComponent);
-
   var _super = _createSuper(JuniorBoxSection);
-
   function JuniorBoxSection() {
     _classCallCheck(this, JuniorBoxSection);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(JuniorBoxSection, [{
     key: "render",
     value: function render() {
@@ -137,15 +104,12 @@ var JuniorBoxSection = /*#__PURE__*/function (_React$PureComponent) {
       }, /*#__PURE__*/_react["default"].createElement(ContentContainer, null, /*#__PURE__*/_react["default"].createElement(TextColumn, null, /*#__PURE__*/_react["default"].createElement("h3", null, "\u770B\u5152\u5C11\u65B0\u805E\uFF0C\u8207\u5B69\u5B50\u5C0D\u8A71"), /*#__PURE__*/_react["default"].createElement("p", null, "\u5411\u5B69\u5B50\u89E3\u91CB\u91CD\u8981\u7684\u4E8B\u4EF6\u3001\u56B4\u8085\u7684\u8B70\u984C\uFF0C\u662F\u6C11\u4E3B\u793E\u6703\u5F88\u91CD\u8981\u7684\u4E8B\uFF0C\u4E5F\u662F\u300A\u5831\u5C0E\u8005\u300B\u8EAB\u70BA\u975E\u71DF\u5229\u5A92\u9AD4\u7684\u91CD\u8981\u8CAC\u4EFB\uFF0C\u8B93\u6211\u5011\u548C\u4F60\u4E00\u8D77\u5C0B\u627E\u5C0D\u8A71\u7684\u5951\u6A5F\u3002")), /*#__PURE__*/_react["default"].createElement(CTAButton, null, /*#__PURE__*/_react["default"].createElement(_juniorLink["default"], null, /*#__PURE__*/_react["default"].createElement("span", null, "\u524D\u5F80\u95B1\u8B80", /*#__PURE__*/_react["default"].createElement(Icon, null, /*#__PURE__*/_react["default"].createElement(ArrowIcon, null)))))));
     }
   }]);
-
   return JuniorBoxSection;
 }(_react["default"].PureComponent);
-
 JuniorBoxSection.propTypes = {
   releaseBranch: _releaseBranch.BRANCH_PROP_TYPES
 };
 JuniorBoxSection.defaultProps = {
   releaseBranch: _releaseBranch.BRANCH.master
 };
-var _default = JuniorBoxSection;
-exports["default"] = _default;
+var _default = exports["default"] = JuniorBoxSection;

package/lib/components/latest-section.js

@@ -1,66 +1,42 @@
 "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 = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _post = _interopRequireDefault(require("./prop-types/post"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _getHref = require("../utils/getHref");
-
 var _styleUtils = require("../utils/style-utils");
-
 var _categoryName = _interopRequireDefault(require("./common-utils/category-name"));
-
 var _imgWrapper = _interopRequireDefault(require("./common-utils/img-wrapper"));
-
 var _sectionContentWrapper = _interopRequireDefault(require("./common-utils/section-content-wrapper"));
-
 var _twreporterLink = _interopRequireDefault(require("./common-utils/twreporter-link"));
-
 var _font = require("@twreporter/core/lib/constants/font");
-
 var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
-
 var _color = require("@twreporter/core/lib/constants/color");
-
 var _get = _interopRequireDefault(require("lodash/get"));
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
-
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11; // utils
+// components
+// @twreporter
+// lodash
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 var _ = {
   get: _get["default"]
 };
@@ -82,65 +58,49 @@ var headerPadding = {
   tablet: '34px',
   mobile: '16px'
 };
-
 var Container = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "latest-section__Container",
   componentId: "hzxpx3-0"
 })(["background-color:", ";position:relative;", ""], _color.colorGrayscale.gray100, _mediaQuery["default"].mobileOnly(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    padding: 0;\n  "]))));
-
 var ContentContainer = /*#__PURE__*/(0, _styledComponents["default"])(_sectionContentWrapper["default"]).withConfig({
   displayName: "latest-section__ContentContainer",
   componentId: "hzxpx3-1"
 })(["display:flex;padding:30px 0;overflow-x:hidden;justify-content:center;", " ", " ", " ", ""], _mediaQuery["default"].hdOnly(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    max-width: 1280px;\n    transform: translateX(8px); // side-bar width / 2\n  "]))), _mediaQuery["default"].desktopOnly(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    padding: 30px 32px 30px 48px; // side-bar width 16px\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    padding: 30px ", ";\n  "])), headerPadding.tablet), _mediaQuery["default"].mobileOnly(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    padding: 30px ", ";\n  "])), headerPadding.mobile));
-
 var ItemFrame = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "latest-section__ItemFrame",
   componentId: "hzxpx3-2"
 })(["width:199px;padding:0;margin-left:30px;&:first-child{margin:0;}", " ", " ", " @media (max-width:", "){&:nth-child(4){display:none;}}@media (max-width:", "){&:nth-child(3){display:none;}}@media (max-width:", "){width:136px;margin-left:16px;}"], _mediaQuery["default"].desktopOnly(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    width: 130px;\n  "]))), _mediaQuery["default"].tabletAndBelow(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    &:nth-child(6) {\n      display: none;\n    }\n    &:nth-child(5) {\n      display: none;\n    }\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    width: 160px;\n    margin-left: 20px;\n  "]))), mobileMidWidth, mobileSemiMidWidth, mobileMinWidth);
-
 var ImageFrame = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "latest-section__ImageFrame",
   componentId: "hzxpx3-3"
 })(["width:100%;height:128px;background-size:cover;background-position:center;display:block;", " ", " ", " @media (max-width:", "){height:93px;}@media (max-width:", "){height:88px;}"], _mediaQuery["default"].desktopOnly(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    height: 90px;\n  "]))), _mediaQuery["default"].tabletOnly(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    height: 110px;\n  "]))), _mediaQuery["default"].mobileOnly(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    height: 100px;\n  "]))), mobileSemiMidWidth, mobileMinWidth);
-
 var ContentFrame = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "latest-section__ContentFrame",
   componentId: "hzxpx3-4"
 })(["margin:0 auto;"]);
-
 var Category = /*#__PURE__*/(0, _styledComponents["default"])(_categoryName["default"]).withConfig({
   displayName: "latest-section__Category",
   componentId: "hzxpx3-5"
 })(["height:16px;line-height:1.33;margin-top:12px;margin-bottom:4px;"]);
-
 var Title = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   displayName: "latest-section__Title",
   componentId: "hzxpx3-6"
 })(["height:auto;font-size:16px;font-weight:", ";font-family:", ";color:", ";"], _font.fontWeight.bold, _font.fontFamily.title, _color.colorGrayscale.gray800);
-
 var LatestSection = /*#__PURE__*/function (_React$Component) {
   _inherits(LatestSection, _React$Component);
-
   var _super = _createSuper(LatestSection);
-
   function LatestSection() {
     _classCallCheck(this, LatestSection);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(LatestSection, [{
     key: "render",
     value: function render() {
       var latestItems = this.props.data.map(function (item) {
         var isExternal = _.get(item, 'is_external', false);
-
         var href = (0, _getHref.getHref)(_.get(item, 'slug', 'error'), isExternal);
-
         var imgObj = _.get(item, 'hero_image') || _.get(item, 'og_image');
-
         var categoryName = _.get(item, 'category_set[0].category.name', '基金會新聞');
-
         return /*#__PURE__*/_react["default"].createElement(ItemFrame, {
           key: _.get(item, 'id')
         }, /*#__PURE__*/_react["default"].createElement(_twreporterLink["default"], {
@@ -156,10 +116,8 @@ var LatestSection = /*#__PURE__*/function (_React$Component) {
       return /*#__PURE__*/_react["default"].createElement(Container, null, /*#__PURE__*/_react["default"].createElement(ContentContainer, null, latestItems));
     }
   }]);
-
   return LatestSection;
 }(_react["default"].Component);
-
 LatestSection.defaultProps = {
   data: [],
   moduleMap: {}
@@ -167,5 +125,4 @@ LatestSection.defaultProps = {
 LatestSection.propTypes = {
   data: _propTypes["default"].arrayOf((0, _post["default"])())
 };
-var _default = LatestSection;
-exports["default"] = _default;
+var _default = exports["default"] = LatestSection;