@quintype/components 3.0.3-test-react18.1 → 3.0.3-url-decode.0
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.
- package/dist/cjs/index.js +1047 -334
- package/dist/es/components/access-type.js +229 -51
- package/dist/es/components/adbutler-ad.js +14 -10
- package/dist/es/components/api-client.js +6 -4
- package/dist/es/components/breaking-news-item.js +3 -2
- package/dist/es/components/breaking-news.js +15 -1
- package/dist/es/components/client-side-only.js +26 -14
- package/dist/es/components/collection.js +5 -5
- package/dist/es/components/dfp-ad.js +30 -23
- package/dist/es/components/eager-load-images.js +9 -1
- package/dist/es/components/hamburger-button.js +5 -2
- package/dist/es/components/image-gallery.js +13 -10
- package/dist/es/components/impl/collection-impl.js +8 -2
- package/dist/es/components/impl/gumlet-image.js +15 -8
- package/dist/es/components/impl/image-utils.js +3 -3
- package/dist/es/components/impl/load-more-stories-manager.js +11 -0
- package/dist/es/components/impl/thumbor-image.js +15 -0
- package/dist/es/components/infinite-scroll.js +51 -3
- package/dist/es/components/infinite-story-base.js +16 -1
- package/dist/es/components/lazy-collection.js +8 -8
- package/dist/es/components/lazy-load-images.js +66 -36
- package/dist/es/components/link-base.js +19 -11
- package/dist/es/components/link.js +4 -1
- package/dist/es/components/load-more-collection-stories.js +10 -1
- package/dist/es/components/load-more-stories-base.js +12 -0
- package/dist/es/components/loading-indicator.js +5 -1
- package/dist/es/components/menu-item.js +10 -6
- package/dist/es/components/menu.js +9 -6
- package/dist/es/components/responsive-hero-image.js +3 -1
- package/dist/es/components/responsive-image.js +5 -0
- package/dist/es/components/responsive-source.js +1 -1
- package/dist/es/components/review-rating/review-rating.js +27 -21
- package/dist/es/components/review-rating/star-icon.js +5 -3
- package/dist/es/components/search-box.js +15 -1
- package/dist/es/components/search-page-base.js +10 -1
- package/dist/es/components/social-logins/with-facebook-login.js +20 -10
- package/dist/es/components/social-logins/with-google-login.js +18 -8
- package/dist/es/components/social-logins/with-linkedin-login.js +12 -7
- package/dist/es/components/social-logins/with-social-login.js +13 -1
- package/dist/es/components/social-logins/with-twitter-login.js +7 -7
- package/dist/es/components/social-share.js +15 -1
- package/dist/es/components/story-element.js +66 -27
- package/dist/es/components/story-elements/dailymotion.js +30 -2
- package/dist/es/components/story-elements/jsembed.js +19 -2
- package/dist/es/components/story-elements/polltype.js +12 -0
- package/dist/es/components/story-elements/table.js +20 -4
- package/dist/es/components/story-elements/youtube.js +45 -9
- package/dist/es/components/update-on-interval.js +18 -1
- package/dist/es/components/with-client-side-only.js +4 -3
- package/dist/es/components/with-error.js +12 -1
- package/dist/es/components/with-host-url.js +9 -4
- package/dist/es/components/with-lazy.js +13 -1
- package/dist/es/components/with-member.js +23 -7
- package/dist/es/components/with-preview.js +12 -1
- package/dist/es/components/wrap-collection-layout.js +16 -4
- package/dist/es/store/reducers.js +45 -1
- package/dist/es/utils.js +12 -7
- package/package.json +6 -9
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { WithSocialLogin } from './with-social-login';
|
|
3
|
-
|
|
4
3
|
/**
|
|
5
4
|
* @see {@link WithSocialLogin}
|
|
6
5
|
* @component
|
|
7
6
|
* @category Login
|
|
8
7
|
*/
|
|
8
|
+
|
|
9
9
|
export function WithFacebookLogin(_ref) {
|
|
10
10
|
var appId = _ref.appId,
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
11
|
+
children = _ref.children,
|
|
12
|
+
scope = _ref.scope,
|
|
13
|
+
emailMandatory = _ref.emailMandatory,
|
|
14
|
+
redirectUrl = _ref.redirectUrl,
|
|
15
|
+
sso = _ref.sso,
|
|
16
|
+
isBridgekeeperLogin = _ref.isBridgekeeperLogin;
|
|
17
17
|
return /*#__PURE__*/React.createElement(WithSocialLogin, {
|
|
18
18
|
provider: 'facebook',
|
|
19
19
|
initialize: function initialize() {
|
|
@@ -31,10 +31,12 @@ export function WithFacebookLogin(_ref) {
|
|
|
31
31
|
isBridgekeeperLogin: isBridgekeeperLogin
|
|
32
32
|
});
|
|
33
33
|
}
|
|
34
|
+
|
|
34
35
|
function loadFacebookSDK(appId) {
|
|
35
36
|
if (global.FB) {
|
|
36
37
|
return;
|
|
37
38
|
}
|
|
39
|
+
|
|
38
40
|
global.fbAsyncInit = global.fbAsyncInit || function () {
|
|
39
41
|
global.FB.init({
|
|
40
42
|
appId: appId,
|
|
@@ -42,18 +44,22 @@ function loadFacebookSDK(appId) {
|
|
|
42
44
|
version: 'v3.1'
|
|
43
45
|
});
|
|
44
46
|
};
|
|
47
|
+
|
|
45
48
|
(function (d, s, id) {
|
|
46
49
|
var js,
|
|
47
|
-
|
|
50
|
+
fjs = d.getElementsByTagName(s)[0];
|
|
51
|
+
|
|
48
52
|
if (d.getElementById(id)) {
|
|
49
53
|
return;
|
|
50
54
|
}
|
|
55
|
+
|
|
51
56
|
js = d.createElement(s);
|
|
52
57
|
js.id = id;
|
|
53
58
|
js.src = "https://connect.facebook.net/en_US/sdk.js";
|
|
54
59
|
fjs.parentNode.insertBefore(js, fjs);
|
|
55
60
|
})(document, 'script', 'facebook-jssdk');
|
|
56
61
|
}
|
|
62
|
+
|
|
57
63
|
function fbLogin(params) {
|
|
58
64
|
return new Promise(function (resolve, reject) {
|
|
59
65
|
return global.FB.login(function (response) {
|
|
@@ -63,6 +69,7 @@ function fbLogin(params) {
|
|
|
63
69
|
}, params);
|
|
64
70
|
});
|
|
65
71
|
}
|
|
72
|
+
|
|
66
73
|
function fbVerifyEmailExists(token) {
|
|
67
74
|
return new Promise(function (resolve, reject) {
|
|
68
75
|
return global.FB.api('/me', {
|
|
@@ -72,13 +79,16 @@ function fbVerifyEmailExists(token) {
|
|
|
72
79
|
});
|
|
73
80
|
});
|
|
74
81
|
}
|
|
82
|
+
|
|
75
83
|
function loginWithFacebook() {
|
|
76
84
|
var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
77
|
-
|
|
78
|
-
|
|
85
|
+
scope = _ref2.scope,
|
|
86
|
+
emailMandatory = _ref2.emailMandatory;
|
|
87
|
+
|
|
79
88
|
if (!global.FB) {
|
|
80
89
|
return Promise.reject('NOT_LOADED');
|
|
81
90
|
}
|
|
91
|
+
|
|
82
92
|
return fbLogin({
|
|
83
93
|
scope: scope
|
|
84
94
|
}).then(function (token) {
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { WithSocialLogin } from './with-social-login';
|
|
3
|
-
|
|
4
3
|
/**
|
|
5
4
|
* @see {@link WithSocialLogin}
|
|
6
5
|
* @component
|
|
7
6
|
* @category Login
|
|
8
7
|
*/
|
|
8
|
+
|
|
9
9
|
export function WithGoogleLogin(_ref) {
|
|
10
10
|
var clientId = _ref.clientId,
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
11
|
+
children = _ref.children,
|
|
12
|
+
scope = _ref.scope,
|
|
13
|
+
emailMandatory = _ref.emailMandatory,
|
|
14
|
+
redirectUrl = _ref.redirectUrl,
|
|
15
|
+
sso = _ref.sso,
|
|
16
|
+
isBridgekeeperLogin = _ref.isBridgekeeperLogin;
|
|
17
17
|
return /*#__PURE__*/React.createElement(WithSocialLogin, {
|
|
18
18
|
provider: 'google',
|
|
19
19
|
initialize: function initialize() {
|
|
@@ -30,6 +30,7 @@ export function WithGoogleLogin(_ref) {
|
|
|
30
30
|
isBridgekeeperLogin: isBridgekeeperLogin
|
|
31
31
|
});
|
|
32
32
|
}
|
|
33
|
+
|
|
33
34
|
var onScriptLoaded = function onScriptLoaded(clientId, scope) {
|
|
34
35
|
global.gapi.load('client:auth2', function () {
|
|
35
36
|
return global.gapi.client.init({
|
|
@@ -38,16 +39,21 @@ var onScriptLoaded = function onScriptLoaded(clientId, scope) {
|
|
|
38
39
|
});
|
|
39
40
|
});
|
|
40
41
|
};
|
|
42
|
+
|
|
41
43
|
var loginWithGoogle = function loginWithGoogle() {
|
|
42
44
|
var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
43
|
-
|
|
45
|
+
emailMandatory = _ref2.emailMandatory;
|
|
46
|
+
|
|
44
47
|
if (!global.gapi || !global.gapi.client) {
|
|
45
48
|
return Promise.reject("NOT_LOADED");
|
|
46
49
|
}
|
|
50
|
+
|
|
47
51
|
var GoogleAuth = global.gapi.auth2.getAuthInstance();
|
|
52
|
+
|
|
48
53
|
if (!GoogleAuth) {
|
|
49
54
|
return Promise.reject("NOT_LOADED");
|
|
50
55
|
}
|
|
56
|
+
|
|
51
57
|
return GoogleAuth.signIn().then(function (response) {
|
|
52
58
|
return emailMandatory && !response.getBasicProfile().getEmail() ? Promise.reject('NO_EMAIL') : {
|
|
53
59
|
'access-token': response.getAuthResponse().access_token
|
|
@@ -56,16 +62,20 @@ var loginWithGoogle = function loginWithGoogle() {
|
|
|
56
62
|
return Promise.reject('NOT_GRANTED');
|
|
57
63
|
});
|
|
58
64
|
};
|
|
65
|
+
|
|
59
66
|
var loadGoogleSDK = function loadGoogleSDK(clientId, scope) {
|
|
60
67
|
if (global.gapi) {
|
|
61
68
|
return;
|
|
62
69
|
}
|
|
70
|
+
|
|
63
71
|
var script = document.createElement('script');
|
|
64
72
|
script.src = 'https://apis.google.com/js/api.js';
|
|
65
73
|
script.async = true;
|
|
66
74
|
script.defer = true;
|
|
75
|
+
|
|
67
76
|
script.onload = function () {
|
|
68
77
|
return onScriptLoaded(clientId, scope);
|
|
69
78
|
};
|
|
79
|
+
|
|
70
80
|
document.getElementsByTagName('body')[0].appendChild(script);
|
|
71
81
|
};
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { WithSocialLogin } from './with-social-login';
|
|
3
|
-
|
|
4
3
|
/**
|
|
5
4
|
* @see {@link WithSocialLogin}
|
|
6
5
|
* @component
|
|
7
6
|
* @category Login
|
|
8
7
|
*/
|
|
8
|
+
|
|
9
9
|
export function WithLinkedInLogin(_ref) {
|
|
10
10
|
var clientKey = _ref.clientKey,
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
11
|
+
children = _ref.children,
|
|
12
|
+
scope = _ref.scope,
|
|
13
|
+
emailMandatory = _ref.emailMandatory,
|
|
14
|
+
redirectUrl = _ref.redirectUrl,
|
|
15
|
+
sso = _ref.sso,
|
|
16
|
+
isBridgekeeperLogin = _ref.isBridgekeeperLogin;
|
|
17
17
|
return /*#__PURE__*/React.createElement(WithSocialLogin, {
|
|
18
18
|
provider: 'linkedin',
|
|
19
19
|
initialize: function initialize() {
|
|
@@ -30,10 +30,12 @@ export function WithLinkedInLogin(_ref) {
|
|
|
30
30
|
isBridgekeeperLogin: isBridgekeeperLogin
|
|
31
31
|
});
|
|
32
32
|
}
|
|
33
|
+
|
|
33
34
|
var loadLinkedInSdk = function loadLinkedInSdk(clientKey, scope) {
|
|
34
35
|
if (global.IN) {
|
|
35
36
|
return;
|
|
36
37
|
}
|
|
38
|
+
|
|
37
39
|
var script = document.createElement('script');
|
|
38
40
|
script.src = '//platform.linkedin.com/in.js';
|
|
39
41
|
script.type = 'text/javascript';
|
|
@@ -42,11 +44,14 @@ var loadLinkedInSdk = function loadLinkedInSdk(clientKey, scope) {
|
|
|
42
44
|
script.innerHTML = "\n api_key: ".concat(clientKey, "\n");
|
|
43
45
|
document.getElementsByTagName('body')[0].appendChild(script);
|
|
44
46
|
};
|
|
47
|
+
|
|
45
48
|
var loginWithLinkedIn = function loginWithLinkedIn(_ref2) {
|
|
46
49
|
var emailMandatory = _ref2.emailMandatory;
|
|
50
|
+
|
|
47
51
|
if (!global.IN || !global.IN.User) {
|
|
48
52
|
return Promise.reject("NOT_LOADED");
|
|
49
53
|
}
|
|
54
|
+
|
|
50
55
|
return new Promise(function (resolve, reject) {
|
|
51
56
|
global.IN.User.authorize(function (e) {
|
|
52
57
|
if (global.IN.User.isAuthorized()) {
|
|
@@ -3,12 +3,14 @@ import _createClass from "@babel/runtime/helpers/createClass";
|
|
|
3
3
|
import _inherits from "@babel/runtime/helpers/inherits";
|
|
4
4
|
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
5
5
|
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
6
|
+
|
|
6
7
|
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); }; }
|
|
8
|
+
|
|
7
9
|
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; } }
|
|
10
|
+
|
|
8
11
|
import { bool, func, string } from 'prop-types';
|
|
9
12
|
import React from 'react';
|
|
10
13
|
import { postRequest } from '../api-client';
|
|
11
|
-
|
|
12
14
|
/**
|
|
13
15
|
* This is an abstract render props component for logging in with social accounts. The component adds two items to scope: `serverSideLoginPath` for redirecting to server side, and `login` for doing a client side login. Calling `login()` returns a promise which can be used to handle success and failure cases.
|
|
14
16
|
*
|
|
@@ -56,12 +58,17 @@ import { postRequest } from '../api-client';
|
|
|
56
58
|
* @hideconstructor
|
|
57
59
|
* @category Login
|
|
58
60
|
*/
|
|
61
|
+
|
|
59
62
|
export var WithSocialLogin = /*#__PURE__*/function (_React$Component) {
|
|
60
63
|
_inherits(WithSocialLogin, _React$Component);
|
|
64
|
+
|
|
61
65
|
var _super = /*#__PURE__*/_createSuper(WithSocialLogin);
|
|
66
|
+
|
|
62
67
|
function WithSocialLogin(props) {
|
|
63
68
|
var _this;
|
|
69
|
+
|
|
64
70
|
_classCallCheck(this, WithSocialLogin);
|
|
71
|
+
|
|
65
72
|
_this = _super.call(this, props);
|
|
66
73
|
_this.bridgekeeperServerLoginPath = "/api/auth/v1/login?auth-provider=".concat(_this.props.provider, "&redirect-url=").concat(_this.props.redirectUrl ? _this.props.redirectUrl : global.location && global.location.origin);
|
|
67
74
|
_this.defaultServerLoginPath = "/login?auth-provider=".concat(_this.props.provider, "&remote-host=").concat(global.location && global.location.origin);
|
|
@@ -69,6 +76,7 @@ export var WithSocialLogin = /*#__PURE__*/function (_React$Component) {
|
|
|
69
76
|
_this.serverSideSSOLoginPath = "/login?auth-provider=".concat(_this.props.provider, "&redirect-url=").concat(_this.props.sso && _this.props.redirectUrl ? _this.props.redirectUrl : global.location && global.location.origin);
|
|
70
77
|
return _this;
|
|
71
78
|
}
|
|
79
|
+
|
|
72
80
|
_createClass(WithSocialLogin, [{
|
|
73
81
|
key: "componentDidMount",
|
|
74
82
|
value: function componentDidMount() {
|
|
@@ -78,6 +86,7 @@ export var WithSocialLogin = /*#__PURE__*/function (_React$Component) {
|
|
|
78
86
|
key: "render",
|
|
79
87
|
value: function render() {
|
|
80
88
|
var _this2 = this;
|
|
89
|
+
|
|
81
90
|
return this.props.children({
|
|
82
91
|
login: function login(props) {
|
|
83
92
|
return _this2.props.socialLogin.call(_this2, props).then(function (token) {
|
|
@@ -88,8 +97,10 @@ export var WithSocialLogin = /*#__PURE__*/function (_React$Component) {
|
|
|
88
97
|
});
|
|
89
98
|
}
|
|
90
99
|
}]);
|
|
100
|
+
|
|
91
101
|
return WithSocialLogin;
|
|
92
102
|
}(React.Component);
|
|
103
|
+
|
|
93
104
|
function createSession(provider, token) {
|
|
94
105
|
return postRequest("/api/login/".concat(provider), {
|
|
95
106
|
token: token,
|
|
@@ -98,6 +109,7 @@ function createSession(provider, token) {
|
|
|
98
109
|
return r;
|
|
99
110
|
});
|
|
100
111
|
}
|
|
112
|
+
|
|
101
113
|
WithSocialLogin.defaultProps = {
|
|
102
114
|
initialize: function initialize() {},
|
|
103
115
|
// function is rebound in WithSocialLogin
|
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { WithSocialLogin } from './with-social-login';
|
|
3
|
-
|
|
4
3
|
/**
|
|
5
4
|
* @see {@link WithSocialLogin}
|
|
6
5
|
* @component
|
|
7
6
|
* @category Login
|
|
8
7
|
*/
|
|
8
|
+
|
|
9
9
|
export function WithTwitterLogin(_ref) {
|
|
10
10
|
var clientId = _ref.clientId,
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
11
|
+
children = _ref.children,
|
|
12
|
+
scope = _ref.scope,
|
|
13
|
+
emailMandatory = _ref.emailMandatory,
|
|
14
|
+
redirectUrl = _ref.redirectUrl,
|
|
15
|
+
sso = _ref.sso,
|
|
16
|
+
isBridgekeeperLogin = _ref.isBridgekeeperLogin;
|
|
17
17
|
return /*#__PURE__*/React.createElement(WithSocialLogin, {
|
|
18
18
|
provider: 'twitter',
|
|
19
19
|
children: children,
|
|
@@ -3,15 +3,20 @@ import _createClass from "@babel/runtime/helpers/createClass";
|
|
|
3
3
|
import _inherits from "@babel/runtime/helpers/inherits";
|
|
4
4
|
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
5
5
|
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
6
|
+
|
|
6
7
|
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); }; }
|
|
8
|
+
|
|
7
9
|
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; } }
|
|
10
|
+
|
|
8
11
|
import React from "react";
|
|
9
12
|
import { connect } from "react-redux";
|
|
10
13
|
import { withError } from './with-error';
|
|
14
|
+
|
|
11
15
|
function getNativeShareHandler(canNativeShare, title, fullUrl) {
|
|
12
16
|
if (!canNativeShare) {
|
|
13
17
|
return null;
|
|
14
18
|
}
|
|
19
|
+
|
|
15
20
|
return function handleShare() {
|
|
16
21
|
window.navigator.share({
|
|
17
22
|
title: title,
|
|
@@ -19,18 +24,24 @@ function getNativeShareHandler(canNativeShare, title, fullUrl) {
|
|
|
19
24
|
})["catch"](console.error);
|
|
20
25
|
};
|
|
21
26
|
}
|
|
27
|
+
|
|
22
28
|
var SocialShareBase = /*#__PURE__*/function (_React$Component) {
|
|
23
29
|
_inherits(SocialShareBase, _React$Component);
|
|
30
|
+
|
|
24
31
|
var _super = /*#__PURE__*/_createSuper(SocialShareBase);
|
|
32
|
+
|
|
25
33
|
function SocialShareBase(props) {
|
|
26
34
|
var _this;
|
|
35
|
+
|
|
27
36
|
_classCallCheck(this, SocialShareBase);
|
|
37
|
+
|
|
28
38
|
_this = _super.call(this, props);
|
|
29
39
|
_this.state = {
|
|
30
40
|
canNativeShare: false
|
|
31
41
|
};
|
|
32
42
|
return _this;
|
|
33
43
|
}
|
|
44
|
+
|
|
34
45
|
_createClass(SocialShareBase, [{
|
|
35
46
|
key: "componentDidMount",
|
|
36
47
|
value: function componentDidMount() {
|
|
@@ -54,14 +65,15 @@ var SocialShareBase = /*#__PURE__*/function (_React$Component) {
|
|
|
54
65
|
}, this.props));
|
|
55
66
|
}
|
|
56
67
|
}]);
|
|
68
|
+
|
|
57
69
|
return SocialShareBase;
|
|
58
70
|
}(React.Component);
|
|
71
|
+
|
|
59
72
|
function mapStateToProps(state) {
|
|
60
73
|
return {
|
|
61
74
|
publisherUrl: state.qt.config["sketches-host"]
|
|
62
75
|
};
|
|
63
76
|
}
|
|
64
|
-
|
|
65
77
|
/**
|
|
66
78
|
* This component renders social share component to front end app.
|
|
67
79
|
*
|
|
@@ -99,4 +111,6 @@ function mapStateToProps(state) {
|
|
|
99
111
|
* @component
|
|
100
112
|
* @category Story Page
|
|
101
113
|
*/
|
|
114
|
+
|
|
115
|
+
|
|
102
116
|
export var SocialShare = /*#__PURE__*/connect(mapStateToProps, {})( /*#__PURE__*/withError(SocialShareBase));
|
|
@@ -7,10 +7,15 @@ import _inherits from "@babel/runtime/helpers/inherits";
|
|
|
7
7
|
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
8
8
|
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
9
9
|
var _excluded = ["renderTemplates"];
|
|
10
|
-
|
|
11
|
-
function
|
|
10
|
+
|
|
11
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
12
|
+
|
|
13
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
14
|
+
|
|
12
15
|
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); }; }
|
|
16
|
+
|
|
13
17
|
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; } }
|
|
18
|
+
|
|
14
19
|
import classNames from "classnames";
|
|
15
20
|
import get from "lodash/get";
|
|
16
21
|
import React from "react";
|
|
@@ -22,7 +27,6 @@ import JSEmbed from "./story-elements/jsembed";
|
|
|
22
27
|
import Polltype from "./story-elements/polltype";
|
|
23
28
|
import { Table } from "./story-elements/table";
|
|
24
29
|
import StoryElementYoutube from "./story-elements/youtube";
|
|
25
|
-
|
|
26
30
|
/**
|
|
27
31
|
* This component renders different types of [story elements](https://developers.quintype.com/malibu/terminology#story-elements)
|
|
28
32
|
|
|
@@ -48,18 +52,24 @@ import StoryElementYoutube from "./story-elements/youtube";
|
|
|
48
52
|
* @hideconstructor
|
|
49
53
|
* @category Story Page
|
|
50
54
|
*/
|
|
55
|
+
|
|
51
56
|
export var StoryElement = /*#__PURE__*/function (_React$Component) {
|
|
52
57
|
_inherits(StoryElement, _React$Component);
|
|
58
|
+
|
|
53
59
|
var _super = /*#__PURE__*/_createSuper(StoryElement);
|
|
60
|
+
|
|
54
61
|
function StoryElement(props) {
|
|
55
62
|
var _this;
|
|
63
|
+
|
|
56
64
|
_classCallCheck(this, StoryElement);
|
|
65
|
+
|
|
57
66
|
_this = _super.call(this, props);
|
|
58
67
|
_this.state = {
|
|
59
68
|
crashed: false
|
|
60
69
|
};
|
|
61
70
|
return _this;
|
|
62
71
|
}
|
|
72
|
+
|
|
63
73
|
_createClass(StoryElement, [{
|
|
64
74
|
key: "componentDidCatch",
|
|
65
75
|
value: function componentDidCatch(error, stack) {
|
|
@@ -81,27 +91,32 @@ export var StoryElement = /*#__PURE__*/function (_React$Component) {
|
|
|
81
91
|
}
|
|
82
92
|
}
|
|
83
93
|
}]);
|
|
94
|
+
|
|
84
95
|
return StoryElement;
|
|
85
96
|
}(React.Component);
|
|
97
|
+
|
|
86
98
|
function StoryElementText(_ref) {
|
|
87
99
|
var _ref$element = _ref.element,
|
|
88
|
-
|
|
89
|
-
|
|
100
|
+
element = _ref$element === void 0 ? {} : _ref$element,
|
|
101
|
+
externalLink = _ref.externalLink;
|
|
90
102
|
var text = element.text || "";
|
|
103
|
+
|
|
91
104
|
if (externalLink) {
|
|
92
105
|
text = element.text.replace(/<a/g, '<a target="_blank"');
|
|
93
106
|
}
|
|
107
|
+
|
|
94
108
|
return /*#__PURE__*/React.createElement("div", {
|
|
95
109
|
dangerouslySetInnerHTML: {
|
|
96
110
|
__html: text
|
|
97
111
|
}
|
|
98
112
|
});
|
|
99
113
|
}
|
|
114
|
+
|
|
100
115
|
function StoryElementAlsoRead(_ref2) {
|
|
101
116
|
var element = _ref2.element,
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
117
|
+
story = _ref2.story,
|
|
118
|
+
_ref2$alsoreadText = _ref2.alsoreadText,
|
|
119
|
+
alsoreadText = _ref2$alsoreadText === void 0 ? "Also Read: " : _ref2$alsoreadText;
|
|
105
120
|
var linkedStories = get(story, ["linked-stories"]);
|
|
106
121
|
var linkedStoryId = get(element, ["metadata", "linked-story-id"]);
|
|
107
122
|
var linkedStorySlug = get(linkedStories, [linkedStoryId, "slug"]);
|
|
@@ -114,14 +129,15 @@ function StoryElementAlsoRead(_ref2) {
|
|
|
114
129
|
className: "story-element-text-also-read__label"
|
|
115
130
|
}, alsoreadText), /*#__PURE__*/React.createElement(Link, linkProps, element.text));
|
|
116
131
|
}
|
|
132
|
+
|
|
117
133
|
function StoryElementImage(_ref3) {
|
|
118
134
|
var element = _ref3.element,
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
135
|
+
_ref3$story = _ref3.story,
|
|
136
|
+
story = _ref3$story === void 0 ? {} : _ref3$story,
|
|
137
|
+
imageWidths = _ref3.imageWidths,
|
|
138
|
+
imageDefaultWidth = _ref3.imageDefaultWidth,
|
|
139
|
+
_ref3$onClick = _ref3.onClick,
|
|
140
|
+
onClick = _ref3$onClick === void 0 ? function () {} : _ref3$onClick;
|
|
125
141
|
return /*#__PURE__*/React.createElement("figure", {}, /*#__PURE__*/React.createElement(ResponsiveImage, {
|
|
126
142
|
slug: element["image-s3-key"],
|
|
127
143
|
metadata: element["metadata"],
|
|
@@ -147,10 +163,12 @@ function StoryElementImage(_ref3) {
|
|
|
147
163
|
className: "story-element-image-attribution"
|
|
148
164
|
}) : undefined));
|
|
149
165
|
}
|
|
166
|
+
|
|
150
167
|
function StoryElementTitle(_ref4) {
|
|
151
168
|
var element = _ref4.element;
|
|
152
169
|
return /*#__PURE__*/React.createElement("h2", {}, element.text);
|
|
153
170
|
}
|
|
171
|
+
|
|
154
172
|
function StoryElementSoundCloud(_ref5) {
|
|
155
173
|
var element = _ref5.element;
|
|
156
174
|
return /*#__PURE__*/React.createElement("iframe", {
|
|
@@ -158,6 +176,7 @@ function StoryElementSoundCloud(_ref5) {
|
|
|
158
176
|
width: "100%"
|
|
159
177
|
});
|
|
160
178
|
}
|
|
179
|
+
|
|
161
180
|
function StoryElementJsembed(_ref6) {
|
|
162
181
|
var element = _ref6.element;
|
|
163
182
|
return /*#__PURE__*/React.createElement(JSEmbed, {
|
|
@@ -165,12 +184,14 @@ function StoryElementJsembed(_ref6) {
|
|
|
165
184
|
id: element["id"]
|
|
166
185
|
});
|
|
167
186
|
}
|
|
187
|
+
|
|
168
188
|
function StoryElementPolltype(_ref7) {
|
|
169
189
|
var element = _ref7.element;
|
|
170
190
|
return /*#__PURE__*/React.createElement(Polltype, {
|
|
171
191
|
id: element["polltype-id"]
|
|
172
192
|
});
|
|
173
193
|
}
|
|
194
|
+
|
|
174
195
|
function StoryElementTable(_ref8) {
|
|
175
196
|
var element = _ref8.element;
|
|
176
197
|
return /*#__PURE__*/React.createElement(Table, {
|
|
@@ -179,6 +200,7 @@ function StoryElementTable(_ref8) {
|
|
|
179
200
|
hasHeader: element.metadata["has-header"]
|
|
180
201
|
});
|
|
181
202
|
}
|
|
203
|
+
|
|
182
204
|
function StoryElementFile(_ref9) {
|
|
183
205
|
var element = _ref9.element;
|
|
184
206
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
@@ -188,11 +210,10 @@ function StoryElementFile(_ref9) {
|
|
|
188
210
|
href: element.url,
|
|
189
211
|
download: true
|
|
190
212
|
}, "download"));
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
// FIXME MISSING: composite
|
|
213
|
+
} // FIXME MISSING: composite
|
|
194
214
|
// TODO: Can also support various subtypes (though not needed potentially)
|
|
195
215
|
|
|
216
|
+
|
|
196
217
|
var DEFAULT_TEMPLATES = {
|
|
197
218
|
text: StoryElementText,
|
|
198
219
|
image: StoryElementImage,
|
|
@@ -206,13 +227,19 @@ var DEFAULT_TEMPLATES = {
|
|
|
206
227
|
"also-read": StoryElementAlsoRead,
|
|
207
228
|
file: StoryElementFile
|
|
208
229
|
};
|
|
230
|
+
|
|
209
231
|
var StoryElementBase = /*#__PURE__*/function (_React$Component2) {
|
|
210
232
|
_inherits(StoryElementBase, _React$Component2);
|
|
233
|
+
|
|
211
234
|
var _super2 = /*#__PURE__*/_createSuper(StoryElementBase);
|
|
235
|
+
|
|
212
236
|
function StoryElementBase(props) {
|
|
213
237
|
var _this2;
|
|
238
|
+
|
|
214
239
|
_classCallCheck(this, StoryElementBase);
|
|
240
|
+
|
|
215
241
|
_this2 = _super2.call(this, props);
|
|
242
|
+
|
|
216
243
|
_defineProperty(_assertThisInitialized(_this2), "initiateObserver", function () {
|
|
217
244
|
if (_this2.props.disableAnalytics === true) return false;
|
|
218
245
|
var options = {
|
|
@@ -221,11 +248,14 @@ var StoryElementBase = /*#__PURE__*/function (_React$Component2) {
|
|
|
221
248
|
threshold: 1.0
|
|
222
249
|
};
|
|
223
250
|
_this2.observer = new IntersectionObserver(_this2.observerCallback, options);
|
|
251
|
+
|
|
224
252
|
_this2.observer.observe(_this2.storyElementRef);
|
|
225
253
|
});
|
|
254
|
+
|
|
226
255
|
_defineProperty(_assertThisInitialized(_this2), "destroyObserver", function () {
|
|
227
256
|
_this2.observer && _this2.observer.disconnect();
|
|
228
257
|
});
|
|
258
|
+
|
|
229
259
|
_defineProperty(_assertThisInitialized(_this2), "observerCallback", function (entries) {
|
|
230
260
|
entries.forEach(function (entry) {
|
|
231
261
|
if (entry.isIntersecting) {
|
|
@@ -233,10 +263,12 @@ var StoryElementBase = /*#__PURE__*/function (_React$Component2) {
|
|
|
233
263
|
}
|
|
234
264
|
});
|
|
235
265
|
});
|
|
266
|
+
|
|
236
267
|
_this2.observer = null;
|
|
237
268
|
_this2.storyElementRef = null;
|
|
238
269
|
return _this2;
|
|
239
270
|
}
|
|
271
|
+
|
|
240
272
|
_createClass(StoryElementBase, [{
|
|
241
273
|
key: "componentDidMount",
|
|
242
274
|
value: function componentDidMount() {
|
|
@@ -258,18 +290,20 @@ var StoryElementBase = /*#__PURE__*/function (_React$Component2) {
|
|
|
258
290
|
key: "emitElementQlitics",
|
|
259
291
|
value: function emitElementQlitics() {
|
|
260
292
|
var _this$props = this.props,
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
293
|
+
_this$props$story = _this$props.story,
|
|
294
|
+
story = _this$props$story === void 0 ? {} : _this$props$story,
|
|
295
|
+
_this$props$card = _this$props.card,
|
|
296
|
+
card = _this$props$card === void 0 ? {} : _this$props$card,
|
|
297
|
+
_this$props$element = _this$props.element,
|
|
298
|
+
element = _this$props$element === void 0 ? {} : _this$props$element;
|
|
299
|
+
|
|
267
300
|
if (global.qlitics) {
|
|
268
301
|
global.qlitics("track", "story-element-view", getQliticsSchema(story, card, element));
|
|
269
302
|
} else {
|
|
270
303
|
global.qlitics = global.qlitics || function () {
|
|
271
304
|
(qlitics.q = qlitics.q || []).push(arguments);
|
|
272
305
|
};
|
|
306
|
+
|
|
273
307
|
global.qlitics("track", "story-element-view", getQliticsSchema(story, card, element));
|
|
274
308
|
}
|
|
275
309
|
}
|
|
@@ -282,15 +316,18 @@ var StoryElementBase = /*#__PURE__*/function (_React$Component2) {
|
|
|
282
316
|
key: "render",
|
|
283
317
|
value: function render() {
|
|
284
318
|
var _classNames,
|
|
285
|
-
|
|
319
|
+
_this3 = this;
|
|
320
|
+
|
|
286
321
|
var storyElement = this.props.element;
|
|
287
322
|
var typeClassName = "story-element-".concat(storyElement.type);
|
|
288
323
|
var subtypeClassName = "story-element-".concat(storyElement.type, "-").concat(storyElement.subtype);
|
|
289
324
|
var storyElementTemplate = this.template();
|
|
325
|
+
|
|
290
326
|
var _this$props2 = this.props,
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
327
|
+
_this$props2$renderTe = _this$props2.renderTemplates,
|
|
328
|
+
renderTemplates = _this$props2$renderTe === void 0 ? {} : _this$props2$renderTe,
|
|
329
|
+
elementProps = _objectWithoutProperties(_this$props2, _excluded);
|
|
330
|
+
|
|
294
331
|
var renderTemplate = renderTemplates[storyElement.subtype] || renderTemplates[storyElement.type];
|
|
295
332
|
return /*#__PURE__*/React.createElement("div", {
|
|
296
333
|
className: classNames((_classNames = {
|
|
@@ -302,6 +339,8 @@ var StoryElementBase = /*#__PURE__*/function (_React$Component2) {
|
|
|
302
339
|
}, renderTemplate ? /*#__PURE__*/React.createElement(renderTemplate, _objectSpread({}, elementProps), /*#__PURE__*/React.createElement(storyElementTemplate, Object.assign({}, elementProps))) : /*#__PURE__*/React.createElement(storyElementTemplate, Object.assign({}, elementProps)));
|
|
303
340
|
}
|
|
304
341
|
}]);
|
|
342
|
+
|
|
305
343
|
return StoryElementBase;
|
|
306
344
|
}(React.Component);
|
|
345
|
+
|
|
307
346
|
export var STORY_ELEMENT_TEMPLATES = DEFAULT_TEMPLATES;
|