@micromag/screen-quote 0.3.348 → 0.3.356
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/es/index.js +74 -67
- package/lib/index.js +74 -66
- package/package.json +11 -10
package/es/index.js
CHANGED
|
@@ -4,12 +4,13 @@ import classNames from 'classnames';
|
|
|
4
4
|
import PropTypes from 'prop-types';
|
|
5
5
|
import React from 'react';
|
|
6
6
|
import { PropTypes as PropTypes$1 } from '@micromag/core';
|
|
7
|
-
import { ScreenElement
|
|
7
|
+
import { ScreenElement } from '@micromag/core/components';
|
|
8
8
|
import { useScreenSize, useScreenRenderContext, useViewerContext, useViewerWebView, usePlaybackContext, usePlaybackMediaRef } from '@micromag/core/contexts';
|
|
9
|
-
import { isTextFilled } from '@micromag/core/utils';
|
|
9
|
+
import { isHeaderFilled, isFooterFilled, getFooterProps, isTextFilled } from '@micromag/core/utils';
|
|
10
10
|
import Background from '@micromag/element-background';
|
|
11
|
-
import CallToAction from '@micromag/element-call-to-action';
|
|
12
11
|
import Container from '@micromag/element-container';
|
|
12
|
+
import Footer from '@micromag/element-footer';
|
|
13
|
+
import Header from '@micromag/element-header';
|
|
13
14
|
import Layout, { Spacer } from '@micromag/element-layout';
|
|
14
15
|
import Quote from '@micromag/element-quote';
|
|
15
16
|
import Text from '@micromag/element-text';
|
|
@@ -19,17 +20,18 @@ import { Quote as Quote$1, Author, Container as Container$1 } from '@micromag/tr
|
|
|
19
20
|
|
|
20
21
|
var styles = {"container":"micromag-screen-quote-container","background":"micromag-screen-quote-background","disabled":"micromag-screen-quote-disabled","hidden":"micromag-screen-quote-hidden","placeholder":"micromag-screen-quote-placeholder","content":"micromag-screen-quote-content","emptyQuote":"micromag-screen-quote-emptyQuote","emptyAuthor":"micromag-screen-quote-emptyAuthor","quote":"micromag-screen-quote-quote","withMargin":"micromag-screen-quote-withMargin","isPlaceholder":"micromag-screen-quote-isPlaceholder","layout":"micromag-screen-quote-layout"};
|
|
21
22
|
|
|
23
|
+
// NOTE: this might be better with a scroll
|
|
24
|
+
|
|
22
25
|
var propTypes = {
|
|
23
26
|
layout: PropTypes.oneOf(['top', 'middle', 'bottom', 'split']),
|
|
24
27
|
quote: PropTypes$1.textElement,
|
|
25
28
|
author: PropTypes$1.textElement,
|
|
26
29
|
spacing: PropTypes.number,
|
|
27
30
|
background: PropTypes$1.backgroundElement,
|
|
28
|
-
|
|
31
|
+
header: PropTypes$1.header,
|
|
32
|
+
footer: PropTypes$1.footer,
|
|
29
33
|
current: PropTypes.bool,
|
|
30
34
|
active: PropTypes.bool,
|
|
31
|
-
transitions: PropTypes$1.transitions,
|
|
32
|
-
transitionStagger: PropTypes.number,
|
|
33
35
|
className: PropTypes.string
|
|
34
36
|
};
|
|
35
37
|
var defaultProps = {
|
|
@@ -38,25 +40,23 @@ var defaultProps = {
|
|
|
38
40
|
author: null,
|
|
39
41
|
spacing: 20,
|
|
40
42
|
background: null,
|
|
41
|
-
|
|
43
|
+
header: null,
|
|
44
|
+
footer: null,
|
|
42
45
|
current: true,
|
|
43
46
|
active: true,
|
|
44
|
-
transitions: null,
|
|
45
|
-
transitionStagger: 100,
|
|
46
47
|
className: null
|
|
47
48
|
};
|
|
48
49
|
var QuoteScreen = function QuoteScreen(_ref) {
|
|
49
|
-
var
|
|
50
|
+
var _ref2;
|
|
50
51
|
var layout = _ref.layout,
|
|
51
52
|
quote = _ref.quote,
|
|
52
53
|
author = _ref.author,
|
|
53
54
|
spacing = _ref.spacing,
|
|
54
55
|
background = _ref.background,
|
|
55
|
-
|
|
56
|
+
header = _ref.header,
|
|
57
|
+
footer = _ref.footer,
|
|
56
58
|
current = _ref.current,
|
|
57
59
|
active = _ref.active,
|
|
58
|
-
transitions = _ref.transitions,
|
|
59
|
-
transitionStagger = _ref.transitionStagger,
|
|
60
60
|
className = _ref.className;
|
|
61
61
|
var _useScreenSize = useScreenSize(),
|
|
62
62
|
width = _useScreenSize.width,
|
|
@@ -66,9 +66,7 @@ var QuoteScreen = function QuoteScreen(_ref) {
|
|
|
66
66
|
isView = _useScreenRenderConte.isView,
|
|
67
67
|
isPreview = _useScreenRenderConte.isPreview,
|
|
68
68
|
isPlaceholder = _useScreenRenderConte.isPlaceholder,
|
|
69
|
-
isEdit = _useScreenRenderConte.isEdit
|
|
70
|
-
isStatic = _useScreenRenderConte.isStatic,
|
|
71
|
-
isCapture = _useScreenRenderConte.isCapture;
|
|
69
|
+
isEdit = _useScreenRenderConte.isEdit;
|
|
72
70
|
var _useViewerContext = useViewerContext(),
|
|
73
71
|
viewerTopHeight = _useViewerContext.topHeight,
|
|
74
72
|
viewerBottomHeight = _useViewerContext.bottomHeight,
|
|
@@ -78,21 +76,49 @@ var QuoteScreen = function QuoteScreen(_ref) {
|
|
|
78
76
|
var _usePlaybackContext = usePlaybackContext(),
|
|
79
77
|
muted = _usePlaybackContext.muted;
|
|
80
78
|
var mediaRef = usePlaybackMediaRef(current);
|
|
81
|
-
var hasQuote = isTextFilled(quote);
|
|
82
|
-
var hasAuthor = isTextFilled(author);
|
|
83
79
|
var isSplitted = layout === 'split';
|
|
84
80
|
var isTopLayout = layout === 'top';
|
|
85
81
|
var isMiddleLayout = layout === 'middle';
|
|
82
|
+
var isBottomLayout = layout === 'bottom';
|
|
86
83
|
var verticalAlign = isSplitted ? null : layout;
|
|
84
|
+
var hasHeader = isHeaderFilled(header);
|
|
85
|
+
var hasFooter = isFooterFilled(footer);
|
|
86
|
+
var footerProps = getFooterProps(footer, {
|
|
87
|
+
isView: isView,
|
|
88
|
+
current: current,
|
|
89
|
+
openWebView: openWebView,
|
|
90
|
+
isPreview: isPreview
|
|
91
|
+
});
|
|
92
|
+
var hasQuote = isTextFilled(quote);
|
|
93
|
+
var hasAuthor = isTextFilled(author);
|
|
87
94
|
var quoteWithMargin = hasQuote && hasAuthor && !isSplitted;
|
|
88
|
-
var transitionPlaying = current;
|
|
89
|
-
var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
|
|
90
95
|
var backgroundPlaying = current && (isView || isEdit);
|
|
91
96
|
var mediaShouldLoad = current || active;
|
|
92
|
-
|
|
93
|
-
_ref2
|
|
94
|
-
|
|
95
|
-
|
|
97
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
98
|
+
className: classNames([styles.container, (_ref2 = {}, _defineProperty(_ref2, className, className), _defineProperty(_ref2, styles.isPlaceholder, isPlaceholder), _ref2)]),
|
|
99
|
+
"data-screen-ready": true
|
|
100
|
+
}, /*#__PURE__*/React.createElement(Container, {
|
|
101
|
+
width: width,
|
|
102
|
+
height: height,
|
|
103
|
+
className: styles.content
|
|
104
|
+
}, /*#__PURE__*/React.createElement(Layout, {
|
|
105
|
+
className: styles.layout,
|
|
106
|
+
fullscreen: true,
|
|
107
|
+
verticalAlign: verticalAlign,
|
|
108
|
+
style: !isPlaceholder ? {
|
|
109
|
+
padding: spacing,
|
|
110
|
+
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
111
|
+
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
112
|
+
} : null
|
|
113
|
+
}, !isPlaceholder && hasHeader ? /*#__PURE__*/React.createElement("div", {
|
|
114
|
+
style: {
|
|
115
|
+
paddingBottom: spacing
|
|
116
|
+
}
|
|
117
|
+
}, /*#__PURE__*/React.createElement(Header, header)) : null, !isPlaceholder && hasFooter && isMiddleLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
118
|
+
key: "spacer-cta-top"
|
|
119
|
+
}) : null, !isPlaceholder && hasHeader && isBottomLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
120
|
+
key: "spacer-cta-top"
|
|
121
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
96
122
|
key: "spacer-cta-top"
|
|
97
123
|
}) : null, /*#__PURE__*/React.createElement(ScreenElement, {
|
|
98
124
|
key: "quote",
|
|
@@ -124,44 +150,17 @@ var QuoteScreen = function QuoteScreen(_ref) {
|
|
|
124
150
|
isEmpty: !hasAuthor
|
|
125
151
|
}, hasAuthor ? /*#__PURE__*/React.createElement(Text, Object.assign({
|
|
126
152
|
className: styles.author
|
|
127
|
-
}, author)) : null), !isPlaceholder &&
|
|
153
|
+
}, author)) : null), !isPlaceholder && hasFooter && (isTopLayout || isMiddleLayout) ? /*#__PURE__*/React.createElement(Spacer, {
|
|
128
154
|
key: "spacer-cta-bottom"
|
|
129
|
-
}) : null, !isPlaceholder &&
|
|
155
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
156
|
+
key: "spacer-cta-bottom"
|
|
157
|
+
}) : null, !isPlaceholder && hasFooter ? /*#__PURE__*/React.createElement("div", {
|
|
130
158
|
style: {
|
|
131
159
|
paddingTop: spacing,
|
|
132
160
|
paddingLeft: Math.max(viewerBottomSidesWidth - spacing, 0),
|
|
133
161
|
paddingRight: Math.max(viewerBottomSidesWidth - spacing, 0)
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
}, /*#__PURE__*/React.createElement(CallToAction, Object.assign({}, callToAction, {
|
|
137
|
-
animationDisabled: isPreview,
|
|
138
|
-
focusable: current && isView,
|
|
139
|
-
openWebView: openWebView
|
|
140
|
-
}))) : null].filter(function (el) {
|
|
141
|
-
return el !== null;
|
|
142
|
-
});
|
|
143
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
144
|
-
className: classNames([styles.container, (_ref4 = {}, _defineProperty(_ref4, className, className), _defineProperty(_ref4, styles.isPlaceholder, isPlaceholder), _ref4)]),
|
|
145
|
-
"data-screen-ready": true
|
|
146
|
-
}, /*#__PURE__*/React.createElement(Container, {
|
|
147
|
-
width: width,
|
|
148
|
-
height: height,
|
|
149
|
-
className: styles.content
|
|
150
|
-
}, /*#__PURE__*/React.createElement(Layout, {
|
|
151
|
-
className: styles.layout,
|
|
152
|
-
fullscreen: true,
|
|
153
|
-
verticalAlign: verticalAlign,
|
|
154
|
-
style: !isPlaceholder ? {
|
|
155
|
-
padding: spacing,
|
|
156
|
-
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
157
|
-
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
158
|
-
} : null
|
|
159
|
-
}, /*#__PURE__*/React.createElement(TransitionsStagger, {
|
|
160
|
-
transitions: transitions,
|
|
161
|
-
stagger: transitionStagger,
|
|
162
|
-
disabled: transitionDisabled,
|
|
163
|
-
playing: transitionPlaying
|
|
164
|
-
}, items))), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
162
|
+
}
|
|
163
|
+
}, /*#__PURE__*/React.createElement(Footer, footerProps)) : null)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
165
164
|
background: background,
|
|
166
165
|
width: width,
|
|
167
166
|
height: height,
|
|
@@ -274,17 +273,25 @@ var definition = {
|
|
|
274
273
|
}]
|
|
275
274
|
})
|
|
276
275
|
}, {
|
|
277
|
-
name: '
|
|
278
|
-
type: '
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
276
|
+
name: 'header',
|
|
277
|
+
type: 'header',
|
|
278
|
+
label: defineMessage({
|
|
279
|
+
id: "rhuDxI",
|
|
280
|
+
defaultMessage: [{
|
|
281
|
+
"type": 0,
|
|
282
|
+
"value": "Header"
|
|
283
|
+
}]
|
|
284
|
+
})
|
|
285
285
|
}, {
|
|
286
|
-
name: '
|
|
287
|
-
type: '
|
|
286
|
+
name: 'footer',
|
|
287
|
+
type: 'footer',
|
|
288
|
+
label: defineMessage({
|
|
289
|
+
id: "g4nybp",
|
|
290
|
+
defaultMessage: [{
|
|
291
|
+
"type": 0,
|
|
292
|
+
"value": "Footer"
|
|
293
|
+
}]
|
|
294
|
+
})
|
|
288
295
|
}]
|
|
289
296
|
};
|
|
290
297
|
|
package/lib/index.js
CHANGED
|
@@ -12,8 +12,9 @@ var components = require('@micromag/core/components');
|
|
|
12
12
|
var contexts = require('@micromag/core/contexts');
|
|
13
13
|
var utils = require('@micromag/core/utils');
|
|
14
14
|
var Background = require('@micromag/element-background');
|
|
15
|
-
var CallToAction = require('@micromag/element-call-to-action');
|
|
16
15
|
var Container = require('@micromag/element-container');
|
|
16
|
+
var Footer = require('@micromag/element-footer');
|
|
17
|
+
var Header = require('@micromag/element-header');
|
|
17
18
|
var Layout = require('@micromag/element-layout');
|
|
18
19
|
var Quote = require('@micromag/element-quote');
|
|
19
20
|
var Text = require('@micromag/element-text');
|
|
@@ -28,8 +29,9 @@ var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
|
28
29
|
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
29
30
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
30
31
|
var Background__default = /*#__PURE__*/_interopDefaultLegacy(Background);
|
|
31
|
-
var CallToAction__default = /*#__PURE__*/_interopDefaultLegacy(CallToAction);
|
|
32
32
|
var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
|
|
33
|
+
var Footer__default = /*#__PURE__*/_interopDefaultLegacy(Footer);
|
|
34
|
+
var Header__default = /*#__PURE__*/_interopDefaultLegacy(Header);
|
|
33
35
|
var Layout__default = /*#__PURE__*/_interopDefaultLegacy(Layout);
|
|
34
36
|
var Quote__default = /*#__PURE__*/_interopDefaultLegacy(Quote);
|
|
35
37
|
var Text__default = /*#__PURE__*/_interopDefaultLegacy(Text);
|
|
@@ -38,17 +40,18 @@ var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumab
|
|
|
38
40
|
|
|
39
41
|
var styles = {"container":"micromag-screen-quote-container","background":"micromag-screen-quote-background","disabled":"micromag-screen-quote-disabled","hidden":"micromag-screen-quote-hidden","placeholder":"micromag-screen-quote-placeholder","content":"micromag-screen-quote-content","emptyQuote":"micromag-screen-quote-emptyQuote","emptyAuthor":"micromag-screen-quote-emptyAuthor","quote":"micromag-screen-quote-quote","withMargin":"micromag-screen-quote-withMargin","isPlaceholder":"micromag-screen-quote-isPlaceholder","layout":"micromag-screen-quote-layout"};
|
|
40
42
|
|
|
43
|
+
// NOTE: this might be better with a scroll
|
|
44
|
+
|
|
41
45
|
var propTypes = {
|
|
42
46
|
layout: PropTypes__default["default"].oneOf(['top', 'middle', 'bottom', 'split']),
|
|
43
47
|
quote: core.PropTypes.textElement,
|
|
44
48
|
author: core.PropTypes.textElement,
|
|
45
49
|
spacing: PropTypes__default["default"].number,
|
|
46
50
|
background: core.PropTypes.backgroundElement,
|
|
47
|
-
|
|
51
|
+
header: core.PropTypes.header,
|
|
52
|
+
footer: core.PropTypes.footer,
|
|
48
53
|
current: PropTypes__default["default"].bool,
|
|
49
54
|
active: PropTypes__default["default"].bool,
|
|
50
|
-
transitions: core.PropTypes.transitions,
|
|
51
|
-
transitionStagger: PropTypes__default["default"].number,
|
|
52
55
|
className: PropTypes__default["default"].string
|
|
53
56
|
};
|
|
54
57
|
var defaultProps = {
|
|
@@ -57,25 +60,23 @@ var defaultProps = {
|
|
|
57
60
|
author: null,
|
|
58
61
|
spacing: 20,
|
|
59
62
|
background: null,
|
|
60
|
-
|
|
63
|
+
header: null,
|
|
64
|
+
footer: null,
|
|
61
65
|
current: true,
|
|
62
66
|
active: true,
|
|
63
|
-
transitions: null,
|
|
64
|
-
transitionStagger: 100,
|
|
65
67
|
className: null
|
|
66
68
|
};
|
|
67
69
|
var QuoteScreen = function QuoteScreen(_ref) {
|
|
68
|
-
var
|
|
70
|
+
var _ref2;
|
|
69
71
|
var layout = _ref.layout,
|
|
70
72
|
quote = _ref.quote,
|
|
71
73
|
author = _ref.author,
|
|
72
74
|
spacing = _ref.spacing,
|
|
73
75
|
background = _ref.background,
|
|
74
|
-
|
|
76
|
+
header = _ref.header,
|
|
77
|
+
footer = _ref.footer,
|
|
75
78
|
current = _ref.current,
|
|
76
79
|
active = _ref.active,
|
|
77
|
-
transitions = _ref.transitions,
|
|
78
|
-
transitionStagger = _ref.transitionStagger,
|
|
79
80
|
className = _ref.className;
|
|
80
81
|
var _useScreenSize = contexts.useScreenSize(),
|
|
81
82
|
width = _useScreenSize.width,
|
|
@@ -85,9 +86,7 @@ var QuoteScreen = function QuoteScreen(_ref) {
|
|
|
85
86
|
isView = _useScreenRenderConte.isView,
|
|
86
87
|
isPreview = _useScreenRenderConte.isPreview,
|
|
87
88
|
isPlaceholder = _useScreenRenderConte.isPlaceholder,
|
|
88
|
-
isEdit = _useScreenRenderConte.isEdit
|
|
89
|
-
isStatic = _useScreenRenderConte.isStatic,
|
|
90
|
-
isCapture = _useScreenRenderConte.isCapture;
|
|
89
|
+
isEdit = _useScreenRenderConte.isEdit;
|
|
91
90
|
var _useViewerContext = contexts.useViewerContext(),
|
|
92
91
|
viewerTopHeight = _useViewerContext.topHeight,
|
|
93
92
|
viewerBottomHeight = _useViewerContext.bottomHeight,
|
|
@@ -97,21 +96,49 @@ var QuoteScreen = function QuoteScreen(_ref) {
|
|
|
97
96
|
var _usePlaybackContext = contexts.usePlaybackContext(),
|
|
98
97
|
muted = _usePlaybackContext.muted;
|
|
99
98
|
var mediaRef = contexts.usePlaybackMediaRef(current);
|
|
100
|
-
var hasQuote = utils.isTextFilled(quote);
|
|
101
|
-
var hasAuthor = utils.isTextFilled(author);
|
|
102
99
|
var isSplitted = layout === 'split';
|
|
103
100
|
var isTopLayout = layout === 'top';
|
|
104
101
|
var isMiddleLayout = layout === 'middle';
|
|
102
|
+
var isBottomLayout = layout === 'bottom';
|
|
105
103
|
var verticalAlign = isSplitted ? null : layout;
|
|
104
|
+
var hasHeader = utils.isHeaderFilled(header);
|
|
105
|
+
var hasFooter = utils.isFooterFilled(footer);
|
|
106
|
+
var footerProps = utils.getFooterProps(footer, {
|
|
107
|
+
isView: isView,
|
|
108
|
+
current: current,
|
|
109
|
+
openWebView: openWebView,
|
|
110
|
+
isPreview: isPreview
|
|
111
|
+
});
|
|
112
|
+
var hasQuote = utils.isTextFilled(quote);
|
|
113
|
+
var hasAuthor = utils.isTextFilled(author);
|
|
106
114
|
var quoteWithMargin = hasQuote && hasAuthor && !isSplitted;
|
|
107
|
-
var transitionPlaying = current;
|
|
108
|
-
var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
|
|
109
115
|
var backgroundPlaying = current && (isView || isEdit);
|
|
110
116
|
var mediaShouldLoad = current || active;
|
|
111
|
-
|
|
112
|
-
_ref2
|
|
113
|
-
|
|
114
|
-
|
|
117
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
118
|
+
className: classNames__default["default"]([styles.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, className, className), _defineProperty__default["default"](_ref2, styles.isPlaceholder, isPlaceholder), _ref2)]),
|
|
119
|
+
"data-screen-ready": true
|
|
120
|
+
}, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
121
|
+
width: width,
|
|
122
|
+
height: height,
|
|
123
|
+
className: styles.content
|
|
124
|
+
}, /*#__PURE__*/React__default["default"].createElement(Layout__default["default"], {
|
|
125
|
+
className: styles.layout,
|
|
126
|
+
fullscreen: true,
|
|
127
|
+
verticalAlign: verticalAlign,
|
|
128
|
+
style: !isPlaceholder ? {
|
|
129
|
+
padding: spacing,
|
|
130
|
+
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
131
|
+
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
132
|
+
} : null
|
|
133
|
+
}, !isPlaceholder && hasHeader ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
134
|
+
style: {
|
|
135
|
+
paddingBottom: spacing
|
|
136
|
+
}
|
|
137
|
+
}, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], header)) : null, !isPlaceholder && hasFooter && isMiddleLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
138
|
+
key: "spacer-cta-top"
|
|
139
|
+
}) : null, !isPlaceholder && hasHeader && isBottomLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
140
|
+
key: "spacer-cta-top"
|
|
141
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
115
142
|
key: "spacer-cta-top"
|
|
116
143
|
}) : null, /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
117
144
|
key: "quote",
|
|
@@ -143,44 +170,17 @@ var QuoteScreen = function QuoteScreen(_ref) {
|
|
|
143
170
|
isEmpty: !hasAuthor
|
|
144
171
|
}, hasAuthor ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({
|
|
145
172
|
className: styles.author
|
|
146
|
-
}, author)) : null), !isPlaceholder &&
|
|
173
|
+
}, author)) : null), !isPlaceholder && hasFooter && (isTopLayout || isMiddleLayout) ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
147
174
|
key: "spacer-cta-bottom"
|
|
148
|
-
}) : null, !isPlaceholder &&
|
|
175
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
176
|
+
key: "spacer-cta-bottom"
|
|
177
|
+
}) : null, !isPlaceholder && hasFooter ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
149
178
|
style: {
|
|
150
179
|
paddingTop: spacing,
|
|
151
180
|
paddingLeft: Math.max(viewerBottomSidesWidth - spacing, 0),
|
|
152
181
|
paddingRight: Math.max(viewerBottomSidesWidth - spacing, 0)
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
}, /*#__PURE__*/React__default["default"].createElement(CallToAction__default["default"], Object.assign({}, callToAction, {
|
|
156
|
-
animationDisabled: isPreview,
|
|
157
|
-
focusable: current && isView,
|
|
158
|
-
openWebView: openWebView
|
|
159
|
-
}))) : null].filter(function (el) {
|
|
160
|
-
return el !== null;
|
|
161
|
-
});
|
|
162
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
163
|
-
className: classNames__default["default"]([styles.container, (_ref4 = {}, _defineProperty__default["default"](_ref4, className, className), _defineProperty__default["default"](_ref4, styles.isPlaceholder, isPlaceholder), _ref4)]),
|
|
164
|
-
"data-screen-ready": true
|
|
165
|
-
}, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
166
|
-
width: width,
|
|
167
|
-
height: height,
|
|
168
|
-
className: styles.content
|
|
169
|
-
}, /*#__PURE__*/React__default["default"].createElement(Layout__default["default"], {
|
|
170
|
-
className: styles.layout,
|
|
171
|
-
fullscreen: true,
|
|
172
|
-
verticalAlign: verticalAlign,
|
|
173
|
-
style: !isPlaceholder ? {
|
|
174
|
-
padding: spacing,
|
|
175
|
-
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
176
|
-
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
177
|
-
} : null
|
|
178
|
-
}, /*#__PURE__*/React__default["default"].createElement(components.TransitionsStagger, {
|
|
179
|
-
transitions: transitions,
|
|
180
|
-
stagger: transitionStagger,
|
|
181
|
-
disabled: transitionDisabled,
|
|
182
|
-
playing: transitionPlaying
|
|
183
|
-
}, items))), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
182
|
+
}
|
|
183
|
+
}, /*#__PURE__*/React__default["default"].createElement(Footer__default["default"], footerProps)) : null)), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
184
184
|
background: background,
|
|
185
185
|
width: width,
|
|
186
186
|
height: height,
|
|
@@ -293,17 +293,25 @@ var definition = {
|
|
|
293
293
|
}]
|
|
294
294
|
})
|
|
295
295
|
}, {
|
|
296
|
-
name: '
|
|
297
|
-
type: '
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
296
|
+
name: 'header',
|
|
297
|
+
type: 'header',
|
|
298
|
+
label: reactIntl.defineMessage({
|
|
299
|
+
id: "rhuDxI",
|
|
300
|
+
defaultMessage: [{
|
|
301
|
+
"type": 0,
|
|
302
|
+
"value": "Header"
|
|
303
|
+
}]
|
|
304
|
+
})
|
|
304
305
|
}, {
|
|
305
|
-
name: '
|
|
306
|
-
type: '
|
|
306
|
+
name: 'footer',
|
|
307
|
+
type: 'footer',
|
|
308
|
+
label: reactIntl.defineMessage({
|
|
309
|
+
id: "g4nybp",
|
|
310
|
+
defaultMessage: [{
|
|
311
|
+
"type": 0,
|
|
312
|
+
"value": "Footer"
|
|
313
|
+
}]
|
|
314
|
+
})
|
|
307
315
|
}]
|
|
308
316
|
};
|
|
309
317
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-quote",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.356",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -49,14 +49,15 @@
|
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@babel/runtime": "^7.13.10",
|
|
52
|
-
"@micromag/core": "^0.3.
|
|
53
|
-
"@micromag/element-background": "^0.3.
|
|
54
|
-
"@micromag/element-
|
|
55
|
-
"@micromag/element-
|
|
56
|
-
"@micromag/element-
|
|
57
|
-
"@micromag/element-
|
|
58
|
-
"@micromag/element-
|
|
59
|
-
"@micromag/
|
|
52
|
+
"@micromag/core": "^0.3.354",
|
|
53
|
+
"@micromag/element-background": "^0.3.354",
|
|
54
|
+
"@micromag/element-container": "^0.3.354",
|
|
55
|
+
"@micromag/element-footer": "^0.3.354",
|
|
56
|
+
"@micromag/element-header": "^0.3.356",
|
|
57
|
+
"@micromag/element-layout": "^0.3.354",
|
|
58
|
+
"@micromag/element-quote": "^0.3.354",
|
|
59
|
+
"@micromag/element-text": "^0.3.354",
|
|
60
|
+
"@micromag/transforms": "^0.3.354",
|
|
60
61
|
"classnames": "^2.2.6",
|
|
61
62
|
"lodash": "^4.17.21",
|
|
62
63
|
"prop-types": "^15.7.2",
|
|
@@ -66,5 +67,5 @@
|
|
|
66
67
|
"publishConfig": {
|
|
67
68
|
"access": "public"
|
|
68
69
|
},
|
|
69
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "683c410d9fc568658e5907fb0a8fa470cb04f6eb"
|
|
70
71
|
}
|