@twreporter/react-article-components 2.2.0-rc.0 → 2.2.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (64) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/lib/components/article-page.js +39 -108
  3. package/lib/components/aside/desktop-aside.js +25 -65
  4. package/lib/components/aside/desktop-tools.js +11 -57
  5. package/lib/components/aside/metadata.js +22 -89
  6. package/lib/components/aside/mobile-tool-bar.js +79 -175
  7. package/lib/components/aside/utils/theme.js +5 -11
  8. package/lib/components/body/annotation.js +15 -73
  9. package/lib/components/body/audio/audio-contexts.js +4 -16
  10. package/lib/components/body/audio/audio-provider.js +13 -48
  11. package/lib/components/body/audio/control-button.js +4 -28
  12. package/lib/components/body/audio/index.js +10 -56
  13. package/lib/components/body/audio/seek-bar.js +6 -23
  14. package/lib/components/body/audio/time.js +0 -6
  15. package/lib/components/body/blockquote.js +11 -52
  16. package/lib/components/body/brief.js +10 -55
  17. package/lib/components/body/centered-quote.js +10 -52
  18. package/lib/components/body/embedded-code.js +22 -101
  19. package/lib/components/body/headings.js +6 -23
  20. package/lib/components/body/image-diff.js +13 -66
  21. package/lib/components/body/image.js +11 -46
  22. package/lib/components/body/index.js +21 -118
  23. package/lib/components/body/infobox.js +13 -58
  24. package/lib/components/body/list.js +8 -29
  25. package/lib/components/body/multimedia.js +10 -29
  26. package/lib/components/body/paragraph.js +5 -23
  27. package/lib/components/body/slider/index.js +28 -96
  28. package/lib/components/body/slideshow/index.js +36 -107
  29. package/lib/components/body/tracking-section.js +7 -46
  30. package/lib/components/body/youtube.js +8 -41
  31. package/lib/components/donation-box.js +10 -44
  32. package/lib/components/img-with-placeholder/index.js +34 -106
  33. package/lib/components/leading/extend.js +6 -25
  34. package/lib/components/leading/fullscreen.js +17 -63
  35. package/lib/components/leading/index.js +2 -10
  36. package/lib/components/leading/normal.js +19 -64
  37. package/lib/components/leading/pink.js +20 -59
  38. package/lib/components/leading/small.js +6 -25
  39. package/lib/components/license.js +9 -40
  40. package/lib/components/link.js +8 -37
  41. package/lib/components/related/card.js +20 -73
  42. package/lib/components/related/index.js +25 -71
  43. package/lib/components/related/list.js +16 -70
  44. package/lib/components/related/mockup.js +10 -12
  45. package/lib/components/separation-curve.js +0 -15
  46. package/lib/components/table-of-contents/index.js +17 -46
  47. package/lib/components/table-of-contents/styled.js +10 -38
  48. package/lib/constants/anchor.js +4 -8
  49. package/lib/constants/css.js +2 -15
  50. package/lib/constants/element-alignment.js +2 -3
  51. package/lib/constants/prop-types/article-page.js +2 -7
  52. package/lib/constants/prop-types/aside.js +2 -8
  53. package/lib/constants/prop-types/body.js +4 -9
  54. package/lib/constants/prop-types/img-with-placeholder.js +2 -7
  55. package/lib/constants/prop-types/leading.js +8 -13
  56. package/lib/constants/prop-types/related.js +2 -7
  57. package/lib/constants/theme.js +2 -3
  58. package/lib/constants/typography.js +2 -5
  59. package/lib/contexts/dynamic-components-context.js +2 -8
  60. package/lib/managers/layout-manager.js +13 -28
  61. package/lib/managers/theme-manager.js +13 -32
  62. package/lib/managers/ui-manager.js +14 -26
  63. package/lib/utils/image.js +5 -14
  64. package/package.json +6 -6
@@ -1,46 +1,30 @@
1
1
  "use strict";
2
2
 
3
- 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); }
4
-
3
+ 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); }
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
7
6
  });
8
7
  exports["default"] = void 0;
9
-
10
8
  var _normal = _interopRequireDefault(require("./normal"));
11
-
12
9
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
13
-
14
- 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); } }
15
-
10
+ 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); } }
16
11
  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
17
-
12
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
13
+ 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); }
18
14
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
19
-
20
15
  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); }
21
-
22
16
  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
23
-
24
17
  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); }; }
25
-
26
18
  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); }
27
-
28
19
  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
29
-
30
20
  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; } }
31
-
32
21
  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
33
-
34
- var ExtendLeading = /*#__PURE__*/function (_NormalLeading) {
22
+ var ExtendLeading = exports["default"] = /*#__PURE__*/function (_NormalLeading) {
35
23
  _inherits(ExtendLeading, _NormalLeading);
36
-
37
24
  var _super = _createSuper(ExtendLeading);
38
-
39
25
  function ExtendLeading(props) {
40
26
  var _this;
41
-
42
27
  _classCallCheck(this, ExtendLeading);
43
-
44
28
  _this = _super.call(this, props);
45
29
  _this.figureWidth = {
46
30
  tablet: 768,
@@ -49,8 +33,5 @@ var ExtendLeading = /*#__PURE__*/function (_NormalLeading) {
49
33
  };
50
34
  return _this;
51
35
  }
52
-
53
36
  return _createClass(ExtendLeading);
54
- }(_normal["default"]);
55
-
56
- exports["default"] = ExtendLeading;
37
+ }(_normal["default"]);
@@ -1,147 +1,108 @@
1
1
  "use strict";
2
2
 
3
- 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); }
4
-
3
+ 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); }
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
7
6
  });
8
7
  exports["default"] = void 0;
9
-
10
8
  var _dynamicComponentsContext = _interopRequireDefault(require("../../contexts/dynamic-components-context"));
11
-
12
9
  var _react = _interopRequireDefault(require("react"));
13
-
14
10
  var _styledComponents = _interopRequireDefault(require("styled-components"));
15
-
16
11
  var _imgWithPlaceholder = _interopRequireDefault(require("../img-with-placeholder"));
17
-
18
12
  var _leading = _interopRequireDefault(require("../../constants/prop-types/leading"));
19
-
20
13
  var _typography = _interopRequireDefault(require("../../constants/typography"));
21
-
22
14
  var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
23
-
24
15
  var _color = require("@twreporter/core/lib/constants/color");
25
-
26
16
  var _zIndex = _interopRequireDefault(require("@twreporter/core/lib/constants/z-index"));
27
-
28
17
  var _get = _interopRequireDefault(require("lodash/get"));
29
-
30
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
31
-
18
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7; // components
19
+ // constants
20
+ // @twerporter
21
+ // lodash
32
22
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
33
-
34
23
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
35
-
36
- 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); } }
37
-
24
+ 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); } }
38
25
  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
39
-
40
26
  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); }
41
-
42
27
  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
43
-
44
28
  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); }; }
45
-
46
29
  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); }
47
-
48
30
  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
49
-
50
31
  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; } }
51
-
52
32
  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
53
-
54
- 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; }
55
-
33
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
34
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
35
+ 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); }
56
36
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
57
-
58
37
  var _ = {
59
38
  get: _get["default"]
60
39
  };
61
-
62
40
  var FullScreenBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
63
41
  displayName: "fullscreen__FullScreenBlock",
64
42
  componentId: "sc-63dapi-0"
65
43
  })(["width:100%;height:100vh;position:relative;z-index:", ";"], _zIndex["default"].articleFullScreenHeroImage);
66
-
67
44
  var TextBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
68
45
  displayName: "fullscreen__TextBlock",
69
46
  componentId: "sc-63dapi-1"
70
47
  })(["position:absolute;left:65px;", " ", " ", " ", " > div:first-child{margin-bottom:25px;}> div:last-child{margin-top:20px;}"], _mediaQuery["default"].hdOnly(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n bottom: 100px;\n width: 45%;\n "]))), _mediaQuery["default"].desktopOnly(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n bottom: 85px;\n width: 55%;\n "]))), _mediaQuery["default"].tabletOnly(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n left: 35px;\n bottom: 37px;\n width: 70%;\n "]))), _mediaQuery["default"].mobileOnly(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n width: 80%;\n bottom: 60px;\n left: 30px;\n "]))));
71
-
72
48
  var Title = /*#__PURE__*/_styledComponents["default"].h1.withConfig({
73
49
  displayName: "fullscreen__Title",
74
50
  componentId: "sc-63dapi-2"
75
51
  })(["margin:0;font-weight:", ";font-family:", ";line-height:1.4;color:", ";font-size:50px;text-shadow:0 2px 4px ", ";", ""], _typography["default"].font.weight.bold, _typography["default"].font.family.title, _color.colorGrayscale.white, _color.colorOpacity['black_0.5'], _mediaQuery["default"].mobileOnly(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n font-size: 32px;\n "]))));
76
-
77
52
  var Subtitle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
78
53
  displayName: "fullscreen__Subtitle",
79
54
  componentId: "sc-63dapi-3"
80
55
  })(["color:", ";text-shadow:0 2px 4px ", ";font-size:40px;font-weight:", ";", " ", ""], _color.colorGrayscale.white, _color.colorOpacity['black_0.5'], _typography["default"].font.weight.normal, _mediaQuery["default"].tabletAndAbove(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n font-size: 40px;\n "]))), _mediaQuery["default"].mobileOnly(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n font-size: 26px;\n "]))));
81
-
82
56
  var Topic = /*#__PURE__*/_styledComponents["default"].div.withConfig({
83
57
  displayName: "fullscreen__Topic",
84
58
  componentId: "sc-63dapi-4"
85
59
  })(["display:inline-block;padding:5px;background-color:", "7f;color:", ";font-size:16px;font-weight:", ";"], _color.colorSupportive.heavy, _color.colorGrayscale.white, _typography["default"].font.weight.bold);
86
-
87
60
  var RightArrow = /*#__PURE__*/_styledComponents["default"].div.withConfig({
88
61
  displayName: "fullscreen__RightArrow",
89
62
  componentId: "sc-63dapi-5"
90
63
  })(["border:solid ", ";border-width:0 2px 2px 0;display:inline-block;padding:4px;transform:rotate(-45deg);margin:0 10px 1px 3px;"], _color.colorGrayscale.white);
91
-
92
64
  var FigureBlock = /*#__PURE__*/_styledComponents["default"].figure.withConfig({
93
65
  displayName: "fullscreen__FigureBlock",
94
66
  componentId: "sc-63dapi-6"
95
67
  })(["margin:0;position:absolute;width:100%;height:100%;> .leading-image{position:absolute;}"]);
96
-
97
68
  var FigureOverlayMask = /*#__PURE__*/_styledComponents["default"].div.withConfig({
98
69
  displayName: "fullscreen__FigureOverlayMask",
99
70
  componentId: "sc-63dapi-7"
100
71
  })(["position:absolute;height:50%;width:100%;bottom:0;background-image:linear-gradient( to bottom,transparent,", " );"], _color.colorGrayscale.black);
101
-
102
72
  var DisplayOnPortrait = /*#__PURE__*/_styledComponents["default"].div.withConfig({
103
73
  displayName: "fullscreen__DisplayOnPortrait",
104
74
  componentId: "sc-63dapi-8"
105
75
  })(["display:none;@media (orientation:portrait){display:block;}"]);
106
-
107
76
  var DisplayOnLandscape = /*#__PURE__*/_styledComponents["default"].div.withConfig({
108
77
  displayName: "fullscreen__DisplayOnLandscape",
109
78
  componentId: "sc-63dapi-9"
110
79
  })(["display:none;@media (orientation:landscape){display:block;}"]);
111
-
112
- var FullScreenLeading = /*#__PURE__*/function (_React$PureComponent) {
80
+ var FullScreenLeading = exports["default"] = /*#__PURE__*/function (_React$PureComponent) {
113
81
  _inherits(FullScreenLeading, _React$PureComponent);
114
-
115
82
  var _super = _createSuper(FullScreenLeading);
116
-
117
83
  function FullScreenLeading() {
118
84
  _classCallCheck(this, FullScreenLeading);
119
-
120
85
  return _super.apply(this, arguments);
121
86
  }
122
-
123
87
  _createClass(FullScreenLeading, [{
124
88
  key: "isEmptyPortraitPoster",
125
89
  value: function isEmptyPortraitPoster(portraitPoster) {
126
90
  var tinyURL = _.get(portraitPoster, 'tiny.url');
127
-
128
91
  var mobileURL = _.get(portraitPoster, 'mobile.url');
129
-
130
92
  return !tinyURL || !mobileURL;
131
93
  }
132
94
  }, {
133
95
  key: "render",
134
96
  value: function render() {
135
97
  var _this$props = this.props,
136
- portraitPoster = _this$props.portraitPoster,
137
- poster = _this$props.poster,
138
- subtitle = _this$props.subtitle,
139
- title = _this$props.title,
140
- topicHref = _this$props.topicHref,
141
- shortTitle = _this$props.shortTitle,
142
- isTopicPublished = _this$props.isTopicPublished;
98
+ portraitPoster = _this$props.portraitPoster,
99
+ poster = _this$props.poster,
100
+ subtitle = _this$props.subtitle,
101
+ title = _this$props.title,
102
+ topicHref = _this$props.topicHref,
103
+ shortTitle = _this$props.shortTitle,
104
+ isTopicPublished = _this$props.isTopicPublished;
143
105
  var portraitPosterJSX = null;
144
-
145
106
  var posterJSX = /*#__PURE__*/_react["default"].createElement(FigureBlock, null, /*#__PURE__*/_react["default"].createElement(_imgWithPlaceholder["default"], {
146
107
  className: "leading-image",
147
108
  imgPlaceholderSrc: _.get(poster, 'tiny.url', ''),
@@ -152,7 +113,6 @@ var FullScreenLeading = /*#__PURE__*/function (_React$PureComponent) {
152
113
  sizes: "(max-width: 800px) 800px, (max-width: 1200px) 1200px, 2000px",
153
114
  clickable: true
154
115
  }));
155
-
156
116
  if (!this.isEmptyPortraitPoster(portraitPoster)) {
157
117
  portraitPosterJSX = /*#__PURE__*/_react["default"].createElement(DisplayOnPortrait, null, /*#__PURE__*/_react["default"].createElement(FigureBlock, null, /*#__PURE__*/_react["default"].createElement(_imgWithPlaceholder["default"], {
158
118
  className: "leading-image",
@@ -164,7 +124,6 @@ var FullScreenLeading = /*#__PURE__*/function (_React$PureComponent) {
164
124
  clickable: true
165
125
  })));
166
126
  }
167
-
168
127
  return /*#__PURE__*/_react["default"].createElement(FullScreenBlock, null, portraitPosterJSX ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, portraitPosterJSX, /*#__PURE__*/_react["default"].createElement(DisplayOnLandscape, null, posterJSX)) : posterJSX, /*#__PURE__*/_react["default"].createElement(FigureOverlayMask, null), /*#__PURE__*/_react["default"].createElement(TextBlock, null, isTopicPublished && shortTitle ? /*#__PURE__*/_react["default"].createElement(_dynamicComponentsContext["default"].Consumer, null, function (components) {
169
128
  return /*#__PURE__*/_react["default"].createElement(components.Link, {
170
129
  to: topicHref
@@ -172,14 +131,9 @@ var FullScreenLeading = /*#__PURE__*/function (_React$PureComponent) {
172
131
  }) : null, /*#__PURE__*/_react["default"].createElement(Title, null, title), subtitle ? /*#__PURE__*/_react["default"].createElement(Subtitle, null, subtitle) : null));
173
132
  }
174
133
  }]);
175
-
176
134
  return FullScreenLeading;
177
135
  }(_react["default"].PureComponent);
178
-
179
- exports["default"] = FullScreenLeading;
180
-
181
136
  _defineProperty(FullScreenLeading, "propTypes", _leading["default"].fullscreen);
182
-
183
137
  _defineProperty(FullScreenLeading, "defaultProps", {
184
138
  poster: {},
185
139
  portraitPoster: {},
@@ -4,24 +4,16 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports["default"] = void 0;
7
-
8
7
  var _extend = _interopRequireDefault(require("./extend"));
9
-
10
8
  var _fullscreen = _interopRequireDefault(require("./fullscreen"));
11
-
12
9
  var _normal = _interopRequireDefault(require("./normal"));
13
-
14
10
  var _pink = _interopRequireDefault(require("./pink"));
15
-
16
11
  var _small = _interopRequireDefault(require("./small"));
17
-
18
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
19
-
20
- var _default = {
13
+ var _default = exports["default"] = {
21
14
  Extend: _extend["default"],
22
15
  Fullscreen: _fullscreen["default"],
23
16
  Normal: _normal["default"],
24
17
  Pink: _pink["default"],
25
18
  Small: _small["default"]
26
- };
27
- exports["default"] = _default;
19
+ };
@@ -1,135 +1,96 @@
1
1
  "use strict";
2
2
 
3
- 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); }
4
-
3
+ 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); }
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
7
6
  });
8
7
  exports["default"] = void 0;
9
-
10
8
  var _dynamicComponentsContext = _interopRequireDefault(require("../../contexts/dynamic-components-context"));
11
-
12
9
  var _react = _interopRequireDefault(require("react"));
13
-
14
10
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
15
-
16
11
  var _imgWithPlaceholder = _interopRequireDefault(require("../img-with-placeholder"));
17
-
18
12
  var _leading = _interopRequireDefault(require("../../constants/prop-types/leading"));
19
-
20
13
  var _theme = _interopRequireDefault(require("../../constants/theme"));
21
-
22
14
  var _typography = _interopRequireDefault(require("../../constants/typography"));
23
-
24
15
  var _mediaQuery = _interopRequireDefault(require("@twreporter/core/lib/utils/media-query"));
25
-
26
16
  var _color = require("@twreporter/core/lib/constants/color");
27
-
28
17
  var _headline = require("@twreporter/react-components/lib/text/headline");
29
-
30
18
  var _get = _interopRequireDefault(require("lodash/get"));
31
-
32
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
33
-
34
- 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); }
35
-
36
- 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; }
37
-
19
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21; // components
20
+ // constants
21
+ // @twreporter
22
+ // lodash
23
+ 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); }
24
+ 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; }
38
25
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
39
-
40
26
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
41
-
42
- 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); } }
43
-
27
+ 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); } }
44
28
  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
45
-
46
29
  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); }
47
-
48
30
  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
49
-
50
31
  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); }; }
51
-
52
32
  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); }
53
-
54
33
  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
55
-
56
34
  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; } }
57
-
58
35
  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
59
-
60
- 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; }
61
-
36
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
37
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
38
+ 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); }
62
39
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
63
-
64
40
  var _ = {
65
41
  get: _get["default"]
66
42
  };
67
-
68
43
  var ContentBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
69
44
  displayName: "normal__ContentBlock",
70
45
  componentId: "qpgeb2-0"
71
46
  })(["letter-spacing:0.4px;", ""], _mediaQuery["default"].mobileOnly(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n line-height: 1.43;\n "]))));
72
-
73
47
  var TextBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
74
48
  displayName: "normal__TextBlock",
75
49
  componentId: "qpgeb2-1"
76
50
  })(["margin:0 auto;", " ", " ", ""], _mediaQuery["default"].mobileOnly(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding-left: 24px;\n padding-right: 24px;\n "]))), _mediaQuery["default"].tabletOnly(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n width: calc(513/768*100%);\n "]))), _mediaQuery["default"].desktopAndAbove(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n width: 718px;\n "]))));
77
-
78
51
  var Title = /*#__PURE__*/(0, _styledComponents["default"])(_headline.H1).withConfig({
79
52
  displayName: "normal__Title",
80
53
  componentId: "qpgeb2-2"
81
54
  })(["margin:0 0 40px 0;", " ", ""], _mediaQuery["default"].desktopAndAbove(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n font-size: 40px;\n "]))), _mediaQuery["default"].mobileOnly(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n margin-bottom: 38px;\n "]))));
82
-
83
55
  var Subtitle = /*#__PURE__*/_styledComponents["default"].h2.withConfig({
84
56
  displayName: "normal__Subtitle",
85
57
  componentId: "qpgeb2-3"
86
58
  })(["font-weight:", ";margin:0 0 10px 0;", " ", ""], _typography["default"].font.weight.bold, _mediaQuery["default"].mobileOnly(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n font-size: 16px;\n "]))), _mediaQuery["default"].tabletAndAbove(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n line-height: 2.1;\n font-size: 20px;\n "]))));
87
-
88
59
  var Topic = /*#__PURE__*/_styledComponents["default"].div.withConfig({
89
60
  displayName: "normal__Topic",
90
61
  componentId: "qpgeb2-4"
91
62
  })(["font-size:14px;display:inline-block;border-width:1px;border-style:solid;padding:10px;margin-bottom:15px;"]);
92
-
93
63
  var Figure = /*#__PURE__*/_styledComponents["default"].figure.withConfig({
94
64
  displayName: "normal__Figure",
95
65
  componentId: "qpgeb2-5"
96
66
  })(["margin:0;", ""], function (props) {
97
67
  return props.$css;
98
68
  });
99
-
100
69
  var FigCaption = /*#__PURE__*/_styledComponents["default"].figcaption.withConfig({
101
70
  displayName: "normal__FigCaption",
102
71
  componentId: "qpgeb2-6"
103
72
  })(["margin-top:15px;", " ", " ", " ", ""], _mediaQuery["default"].tabletAndBelow(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n font-size: 14px;\n "]))), _mediaQuery["default"].mobileOnly(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n margin-left: calc(6/375*100%);\n margin-right: calc(6/375*100%);\n "]))), _mediaQuery["default"].tabletAndAbove(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n margin-left: calc(15/768*100%);\n margin-right: calc(15/768*100%);\n "]))), _mediaQuery["default"].hdOnly(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n margin-top: 20px;\n "]))));
104
-
105
73
  var BackgroundBlock = /*#__PURE__*/_styledComponents["default"].div.withConfig({
106
74
  displayName: "normal__BackgroundBlock",
107
75
  componentId: "qpgeb2-7"
108
76
  })(["", " ", " ", " ", " ", ""], function (props) {
109
77
  return getBackgroundBlockStyles(props.theme.name);
110
78
  }, _mediaQuery["default"].hdOnly(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n padding-top: 100px;\n "]))), _mediaQuery["default"].desktopOnly(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n padding-top: 48px;\n "]))), _mediaQuery["default"].tabletOnly(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n padding-top: 32px;\n "]))), _mediaQuery["default"].mobileOnly(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n padding-top: 30px;\n "]))));
111
-
112
79
  function getBackgroundBlockStyles(themeName) {
113
80
  switch (themeName) {
114
81
  case _theme["default"].article.v2.photo:
115
82
  return (0, _styledComponents.css)(["background-color:", ";", "{color:", ";}", "{color:", ";border-color:", ";}", ",", "{color:", ";}"], _color.COLOR_PINK_ARTICLE.darkBlue, FigCaption, _color.colorGrayscale.gray600, Topic, _color.colorSupportive.main, _color.colorSupportive.heavy, Subtitle, Title, _color.colorGrayscale.gray300);
116
-
117
83
  case _theme["default"].article.v2["default"]:
118
84
  default:
119
85
  return (0, _styledComponents.css)(["background-color:", ";", "{color:", ";}", "{color:", ";border-color:", ";}", ",", "{color:", ";}"], _color.colorGrayscale.gray100, FigCaption, _color.colorGrayscale.gray600, Topic, _color.colorSupportive.heavy, _color.colorSupportive.main, Subtitle, Title, _color.colorGrayscale.gray800);
120
86
  }
121
87
  }
122
-
123
- var NormalLeading = /*#__PURE__*/function (_React$PureComponent) {
88
+ var NormalLeading = exports["default"] = /*#__PURE__*/function (_React$PureComponent) {
124
89
  _inherits(NormalLeading, _React$PureComponent);
125
-
126
90
  var _super = _createSuper(NormalLeading);
127
-
128
91
  function NormalLeading(props) {
129
92
  var _this;
130
-
131
93
  _classCallCheck(this, NormalLeading);
132
-
133
94
  _this = _super.call(this, props);
134
95
  _this.figureWidth = {
135
96
  tablet: 567,
@@ -138,7 +99,6 @@ var NormalLeading = /*#__PURE__*/function (_React$PureComponent) {
138
99
  };
139
100
  return _this;
140
101
  }
141
-
142
102
  _createClass(NormalLeading, [{
143
103
  key: "getFigureCSS",
144
104
  value: function getFigureCSS() {
@@ -148,13 +108,13 @@ var NormalLeading = /*#__PURE__*/function (_React$PureComponent) {
148
108
  key: "render",
149
109
  value: function render() {
150
110
  var _this$props = this.props,
151
- figureCaption = _this$props.figureCaption,
152
- poster = _this$props.poster,
153
- subtitle = _this$props.subtitle,
154
- title = _this$props.title,
155
- topicHref = _this$props.topicHref,
156
- shortTitle = _this$props.shortTitle,
157
- isTopicPublished = _this$props.isTopicPublished;
111
+ figureCaption = _this$props.figureCaption,
112
+ poster = _this$props.poster,
113
+ subtitle = _this$props.subtitle,
114
+ title = _this$props.title,
115
+ topicHref = _this$props.topicHref,
116
+ shortTitle = _this$props.shortTitle,
117
+ isTopicPublished = _this$props.isTopicPublished;
158
118
  return /*#__PURE__*/_react["default"].createElement(BackgroundBlock, null, /*#__PURE__*/_react["default"].createElement(ContentBlock, null, /*#__PURE__*/_react["default"].createElement(TextBlock, null, isTopicPublished && shortTitle ? /*#__PURE__*/_react["default"].createElement(_dynamicComponentsContext["default"].Consumer, null, function (components) {
159
119
  return /*#__PURE__*/_react["default"].createElement(components.Link, {
160
120
  to: topicHref
@@ -173,14 +133,9 @@ var NormalLeading = /*#__PURE__*/function (_React$PureComponent) {
173
133
  }), figureCaption ? /*#__PURE__*/_react["default"].createElement(FigCaption, null, figureCaption) : null)));
174
134
  }
175
135
  }]);
176
-
177
136
  return NormalLeading;
178
137
  }(_react["default"].PureComponent);
179
-
180
- exports["default"] = NormalLeading;
181
-
182
138
  _defineProperty(NormalLeading, "propTypes", _leading["default"]["default"]);
183
-
184
139
  _defineProperty(NormalLeading, "defaultProps", {
185
140
  figureCaption: '',
186
141
  poster: {},