@micromag/screen-text 0.3.348 → 0.3.354
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 +88 -76
- package/lib/index.js +88 -75
- 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 { isTextFilled, isHeaderFilled, isFooterFilled, getFooterProps } 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 Heading from '@micromag/element-heading';
|
|
14
15
|
import Layout, { Spacer } from '@micromag/element-layout';
|
|
15
16
|
import Text from '@micromag/element-text';
|
|
@@ -27,12 +28,11 @@ var propTypes = {
|
|
|
27
28
|
title: PropTypes$1.headingElement,
|
|
28
29
|
withTitle: PropTypes.bool,
|
|
29
30
|
spacing: PropTypes.number,
|
|
31
|
+
header: PropTypes$1.header,
|
|
32
|
+
footer: PropTypes$1.footer,
|
|
30
33
|
background: PropTypes$1.backgroundElement,
|
|
31
|
-
callToAction: PropTypes$1.callToAction,
|
|
32
34
|
current: PropTypes.bool,
|
|
33
35
|
active: PropTypes.bool,
|
|
34
|
-
transitions: PropTypes$1.transitions,
|
|
35
|
-
transitionStagger: PropTypes.number,
|
|
36
36
|
className: PropTypes.string
|
|
37
37
|
};
|
|
38
38
|
var defaultProps = {
|
|
@@ -41,27 +41,25 @@ var defaultProps = {
|
|
|
41
41
|
title: null,
|
|
42
42
|
withTitle: false,
|
|
43
43
|
spacing: 20,
|
|
44
|
+
header: null,
|
|
45
|
+
footer: null,
|
|
44
46
|
background: null,
|
|
45
|
-
callToAction: null,
|
|
46
47
|
current: true,
|
|
47
48
|
active: true,
|
|
48
|
-
transitions: null,
|
|
49
|
-
transitionStagger: 100,
|
|
50
49
|
className: null
|
|
51
50
|
};
|
|
52
51
|
var TextScreen = function TextScreen(_ref) {
|
|
53
|
-
var
|
|
52
|
+
var _ref2;
|
|
54
53
|
var layout = _ref.layout,
|
|
55
54
|
text = _ref.text,
|
|
56
55
|
title = _ref.title,
|
|
57
56
|
withTitle = _ref.withTitle,
|
|
58
57
|
spacing = _ref.spacing,
|
|
58
|
+
header = _ref.header,
|
|
59
|
+
footer = _ref.footer,
|
|
59
60
|
background = _ref.background,
|
|
60
|
-
callToAction = _ref.callToAction,
|
|
61
61
|
current = _ref.current,
|
|
62
62
|
active = _ref.active,
|
|
63
|
-
transitions = _ref.transitions,
|
|
64
|
-
transitionStagger = _ref.transitionStagger,
|
|
65
63
|
className = _ref.className;
|
|
66
64
|
var _useScreenSize = useScreenSize(),
|
|
67
65
|
width = _useScreenSize.width,
|
|
@@ -71,9 +69,7 @@ var TextScreen = function TextScreen(_ref) {
|
|
|
71
69
|
isView = _useScreenRenderConte.isView,
|
|
72
70
|
isPreview = _useScreenRenderConte.isPreview,
|
|
73
71
|
isPlaceholder = _useScreenRenderConte.isPlaceholder,
|
|
74
|
-
isEdit = _useScreenRenderConte.isEdit
|
|
75
|
-
isStatic = _useScreenRenderConte.isStatic,
|
|
76
|
-
isCapture = _useScreenRenderConte.isCapture;
|
|
72
|
+
isEdit = _useScreenRenderConte.isEdit;
|
|
77
73
|
var _useViewerContext = useViewerContext(),
|
|
78
74
|
viewerTopHeight = _useViewerContext.topHeight,
|
|
79
75
|
viewerBottomHeight = _useViewerContext.bottomHeight,
|
|
@@ -88,18 +84,44 @@ var TextScreen = function TextScreen(_ref) {
|
|
|
88
84
|
var isSplitted = layout === 'split';
|
|
89
85
|
var isTopLayout = layout === 'top';
|
|
90
86
|
var isMiddleLayout = layout === 'middle';
|
|
87
|
+
var isBottomLayout = layout === 'bottom';
|
|
91
88
|
var verticalAlign = isSplitted ? null : layout;
|
|
92
89
|
var titleWithMargin = hasTitle && hasText && !isSplitted;
|
|
93
|
-
var transitionPlaying = current;
|
|
94
|
-
var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
|
|
95
90
|
var backgroundPlaying = current && (isView || isEdit);
|
|
96
91
|
var backgroundShouldLoad = current || active;
|
|
97
|
-
var
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
92
|
+
var hasHeader = isHeaderFilled(header);
|
|
93
|
+
var hasFooter = isFooterFilled(footer);
|
|
94
|
+
var footerProps = getFooterProps(footer, {
|
|
95
|
+
isView: isView,
|
|
96
|
+
current: current,
|
|
97
|
+
openWebView: openWebView,
|
|
98
|
+
isPreview: isPreview
|
|
99
|
+
});
|
|
100
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
101
|
+
className: classNames([styles.container, (_ref2 = {}, _defineProperty(_ref2, className, className !== null), _defineProperty(_ref2, styles.isPlaceholder, isPlaceholder), _ref2)]),
|
|
102
|
+
"data-screen-ready": true
|
|
103
|
+
}, /*#__PURE__*/React.createElement(Container, {
|
|
104
|
+
width: width,
|
|
105
|
+
height: height,
|
|
106
|
+
className: styles.content
|
|
107
|
+
}, /*#__PURE__*/React.createElement(Layout, {
|
|
108
|
+
className: styles.layout,
|
|
109
|
+
fullscreen: true,
|
|
110
|
+
verticalAlign: verticalAlign,
|
|
111
|
+
style: !isPlaceholder ? {
|
|
112
|
+
padding: spacing,
|
|
113
|
+
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
114
|
+
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
115
|
+
} : null
|
|
116
|
+
}, !isPlaceholder && hasHeader ? /*#__PURE__*/React.createElement("div", {
|
|
117
|
+
style: {
|
|
118
|
+
paddingBottom: spacing
|
|
119
|
+
}
|
|
120
|
+
}, /*#__PURE__*/React.createElement(Header, header)) : null, !isPlaceholder && hasFooter && isMiddleLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
121
|
+
key: "spacer-cta-top"
|
|
122
|
+
}) : null, !isPlaceholder && hasHeader && isBottomLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
123
|
+
key: "spacer-cta-top"
|
|
124
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
103
125
|
key: "spacer-cta-top"
|
|
104
126
|
}) : null, withTitle ? /*#__PURE__*/React.createElement(ScreenElement, {
|
|
105
127
|
key: "title",
|
|
@@ -131,44 +153,18 @@ var TextScreen = function TextScreen(_ref) {
|
|
|
131
153
|
isEmpty: !hasText
|
|
132
154
|
}, hasText ? /*#__PURE__*/React.createElement(Text, Object.assign({
|
|
133
155
|
className: styles.text
|
|
134
|
-
}, text)) : null), !isPlaceholder &&
|
|
156
|
+
}, text)) : null), !isPlaceholder && hasFooter && (isTopLayout || isMiddleLayout) ? /*#__PURE__*/React.createElement(Spacer, {
|
|
157
|
+
key: "spacer-cta-bottom"
|
|
158
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React.createElement(Spacer, {
|
|
135
159
|
key: "spacer-cta-bottom"
|
|
136
|
-
}) : null, !isPlaceholder &&
|
|
137
|
-
|
|
160
|
+
}) : null, !isPlaceholder && hasFooter ? /*#__PURE__*/React.createElement("div", {
|
|
161
|
+
className: styles.footer,
|
|
138
162
|
style: {
|
|
139
163
|
paddingTop: spacing,
|
|
140
164
|
paddingLeft: Math.max(0, viewerBottomSidesWidth - spacing),
|
|
141
165
|
paddingRight: Math.max(0, viewerBottomSidesWidth - spacing)
|
|
142
166
|
}
|
|
143
|
-
}, /*#__PURE__*/React.createElement(
|
|
144
|
-
animationDisabled: isPreview,
|
|
145
|
-
focusable: current && isView,
|
|
146
|
-
openWebView: openWebView
|
|
147
|
-
}))) : null].filter(function (el) {
|
|
148
|
-
return el !== null;
|
|
149
|
-
});
|
|
150
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
151
|
-
className: classNames([styles.container, (_ref4 = {}, _defineProperty(_ref4, className, className !== null), _defineProperty(_ref4, styles.isPlaceholder, isPlaceholder), _ref4)]),
|
|
152
|
-
"data-screen-ready": true
|
|
153
|
-
}, /*#__PURE__*/React.createElement(Container, {
|
|
154
|
-
width: width,
|
|
155
|
-
height: height,
|
|
156
|
-
className: styles.content
|
|
157
|
-
}, /*#__PURE__*/React.createElement(Layout, {
|
|
158
|
-
className: styles.layout,
|
|
159
|
-
fullscreen: true,
|
|
160
|
-
verticalAlign: verticalAlign,
|
|
161
|
-
style: !isPlaceholder ? {
|
|
162
|
-
padding: spacing,
|
|
163
|
-
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
164
|
-
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
165
|
-
} : null
|
|
166
|
-
}, /*#__PURE__*/React.createElement(TransitionsStagger, {
|
|
167
|
-
transitions: transitions,
|
|
168
|
-
stagger: transitionStagger,
|
|
169
|
-
disabled: transitionDisabled,
|
|
170
|
-
playing: transitionPlaying
|
|
171
|
-
}, items))), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
167
|
+
}, /*#__PURE__*/React.createElement(Footer, footerProps)) : null)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
172
168
|
background: background,
|
|
173
169
|
width: width,
|
|
174
170
|
height: height,
|
|
@@ -274,17 +270,25 @@ var definition = [{
|
|
|
274
270
|
}]
|
|
275
271
|
})
|
|
276
272
|
}, {
|
|
277
|
-
name: '
|
|
278
|
-
type: '
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
273
|
+
name: 'header',
|
|
274
|
+
type: 'header',
|
|
275
|
+
label: defineMessage({
|
|
276
|
+
id: "rhuDxI",
|
|
277
|
+
defaultMessage: [{
|
|
278
|
+
"type": 0,
|
|
279
|
+
"value": "Header"
|
|
280
|
+
}]
|
|
281
|
+
})
|
|
285
282
|
}, {
|
|
286
|
-
name: '
|
|
287
|
-
type: '
|
|
283
|
+
name: 'footer',
|
|
284
|
+
type: 'footer',
|
|
285
|
+
label: defineMessage({
|
|
286
|
+
id: "g4nybp",
|
|
287
|
+
defaultMessage: [{
|
|
288
|
+
"type": 0,
|
|
289
|
+
"value": "Footer"
|
|
290
|
+
}]
|
|
291
|
+
})
|
|
288
292
|
}]
|
|
289
293
|
}, {
|
|
290
294
|
id: 'text-title',
|
|
@@ -358,17 +362,25 @@ var definition = [{
|
|
|
358
362
|
}]
|
|
359
363
|
})
|
|
360
364
|
}, {
|
|
361
|
-
name: '
|
|
362
|
-
type: '
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
365
|
+
name: 'header',
|
|
366
|
+
type: 'header',
|
|
367
|
+
label: defineMessage({
|
|
368
|
+
id: "rhuDxI",
|
|
369
|
+
defaultMessage: [{
|
|
370
|
+
"type": 0,
|
|
371
|
+
"value": "Header"
|
|
372
|
+
}]
|
|
373
|
+
})
|
|
369
374
|
}, {
|
|
370
|
-
name: '
|
|
371
|
-
type: '
|
|
375
|
+
name: 'footer',
|
|
376
|
+
type: 'footer',
|
|
377
|
+
label: defineMessage({
|
|
378
|
+
id: "g4nybp",
|
|
379
|
+
defaultMessage: [{
|
|
380
|
+
"type": 0,
|
|
381
|
+
"value": "Footer"
|
|
382
|
+
}]
|
|
383
|
+
})
|
|
372
384
|
}]
|
|
373
385
|
}];
|
|
374
386
|
|
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 Heading = require('@micromag/element-heading');
|
|
18
19
|
var Layout = require('@micromag/element-layout');
|
|
19
20
|
var Text = require('@micromag/element-text');
|
|
@@ -30,8 +31,9 @@ var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
|
30
31
|
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
31
32
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
32
33
|
var Background__default = /*#__PURE__*/_interopDefaultLegacy(Background);
|
|
33
|
-
var CallToAction__default = /*#__PURE__*/_interopDefaultLegacy(CallToAction);
|
|
34
34
|
var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
|
|
35
|
+
var Footer__default = /*#__PURE__*/_interopDefaultLegacy(Footer);
|
|
36
|
+
var Header__default = /*#__PURE__*/_interopDefaultLegacy(Header);
|
|
35
37
|
var Heading__default = /*#__PURE__*/_interopDefaultLegacy(Heading);
|
|
36
38
|
var Layout__default = /*#__PURE__*/_interopDefaultLegacy(Layout);
|
|
37
39
|
var Text__default = /*#__PURE__*/_interopDefaultLegacy(Text);
|
|
@@ -48,12 +50,11 @@ var propTypes = {
|
|
|
48
50
|
title: core.PropTypes.headingElement,
|
|
49
51
|
withTitle: PropTypes__default["default"].bool,
|
|
50
52
|
spacing: PropTypes__default["default"].number,
|
|
53
|
+
header: core.PropTypes.header,
|
|
54
|
+
footer: core.PropTypes.footer,
|
|
51
55
|
background: core.PropTypes.backgroundElement,
|
|
52
|
-
callToAction: core.PropTypes.callToAction,
|
|
53
56
|
current: PropTypes__default["default"].bool,
|
|
54
57
|
active: PropTypes__default["default"].bool,
|
|
55
|
-
transitions: core.PropTypes.transitions,
|
|
56
|
-
transitionStagger: PropTypes__default["default"].number,
|
|
57
58
|
className: PropTypes__default["default"].string
|
|
58
59
|
};
|
|
59
60
|
var defaultProps = {
|
|
@@ -62,27 +63,25 @@ var defaultProps = {
|
|
|
62
63
|
title: null,
|
|
63
64
|
withTitle: false,
|
|
64
65
|
spacing: 20,
|
|
66
|
+
header: null,
|
|
67
|
+
footer: null,
|
|
65
68
|
background: null,
|
|
66
|
-
callToAction: null,
|
|
67
69
|
current: true,
|
|
68
70
|
active: true,
|
|
69
|
-
transitions: null,
|
|
70
|
-
transitionStagger: 100,
|
|
71
71
|
className: null
|
|
72
72
|
};
|
|
73
73
|
var TextScreen = function TextScreen(_ref) {
|
|
74
|
-
var
|
|
74
|
+
var _ref2;
|
|
75
75
|
var layout = _ref.layout,
|
|
76
76
|
text = _ref.text,
|
|
77
77
|
title = _ref.title,
|
|
78
78
|
withTitle = _ref.withTitle,
|
|
79
79
|
spacing = _ref.spacing,
|
|
80
|
+
header = _ref.header,
|
|
81
|
+
footer = _ref.footer,
|
|
80
82
|
background = _ref.background,
|
|
81
|
-
callToAction = _ref.callToAction,
|
|
82
83
|
current = _ref.current,
|
|
83
84
|
active = _ref.active,
|
|
84
|
-
transitions = _ref.transitions,
|
|
85
|
-
transitionStagger = _ref.transitionStagger,
|
|
86
85
|
className = _ref.className;
|
|
87
86
|
var _useScreenSize = contexts.useScreenSize(),
|
|
88
87
|
width = _useScreenSize.width,
|
|
@@ -92,9 +91,7 @@ var TextScreen = function TextScreen(_ref) {
|
|
|
92
91
|
isView = _useScreenRenderConte.isView,
|
|
93
92
|
isPreview = _useScreenRenderConte.isPreview,
|
|
94
93
|
isPlaceholder = _useScreenRenderConte.isPlaceholder,
|
|
95
|
-
isEdit = _useScreenRenderConte.isEdit
|
|
96
|
-
isStatic = _useScreenRenderConte.isStatic,
|
|
97
|
-
isCapture = _useScreenRenderConte.isCapture;
|
|
94
|
+
isEdit = _useScreenRenderConte.isEdit;
|
|
98
95
|
var _useViewerContext = contexts.useViewerContext(),
|
|
99
96
|
viewerTopHeight = _useViewerContext.topHeight,
|
|
100
97
|
viewerBottomHeight = _useViewerContext.bottomHeight,
|
|
@@ -109,18 +106,44 @@ var TextScreen = function TextScreen(_ref) {
|
|
|
109
106
|
var isSplitted = layout === 'split';
|
|
110
107
|
var isTopLayout = layout === 'top';
|
|
111
108
|
var isMiddleLayout = layout === 'middle';
|
|
109
|
+
var isBottomLayout = layout === 'bottom';
|
|
112
110
|
var verticalAlign = isSplitted ? null : layout;
|
|
113
111
|
var titleWithMargin = hasTitle && hasText && !isSplitted;
|
|
114
|
-
var transitionPlaying = current;
|
|
115
|
-
var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
|
|
116
112
|
var backgroundPlaying = current && (isView || isEdit);
|
|
117
113
|
var backgroundShouldLoad = current || active;
|
|
118
|
-
var
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
114
|
+
var hasHeader = utils.isHeaderFilled(header);
|
|
115
|
+
var hasFooter = utils.isFooterFilled(footer);
|
|
116
|
+
var footerProps = utils.getFooterProps(footer, {
|
|
117
|
+
isView: isView,
|
|
118
|
+
current: current,
|
|
119
|
+
openWebView: openWebView,
|
|
120
|
+
isPreview: isPreview
|
|
121
|
+
});
|
|
122
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
123
|
+
className: classNames__default["default"]([styles.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, className, className !== null), _defineProperty__default["default"](_ref2, styles.isPlaceholder, isPlaceholder), _ref2)]),
|
|
124
|
+
"data-screen-ready": true
|
|
125
|
+
}, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
126
|
+
width: width,
|
|
127
|
+
height: height,
|
|
128
|
+
className: styles.content
|
|
129
|
+
}, /*#__PURE__*/React__default["default"].createElement(Layout__default["default"], {
|
|
130
|
+
className: styles.layout,
|
|
131
|
+
fullscreen: true,
|
|
132
|
+
verticalAlign: verticalAlign,
|
|
133
|
+
style: !isPlaceholder ? {
|
|
134
|
+
padding: spacing,
|
|
135
|
+
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
136
|
+
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
137
|
+
} : null
|
|
138
|
+
}, !isPlaceholder && hasHeader ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
139
|
+
style: {
|
|
140
|
+
paddingBottom: spacing
|
|
141
|
+
}
|
|
142
|
+
}, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], header)) : null, !isPlaceholder && hasFooter && isMiddleLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
143
|
+
key: "spacer-cta-top"
|
|
144
|
+
}) : null, !isPlaceholder && hasHeader && isBottomLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
145
|
+
key: "spacer-cta-top"
|
|
146
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
124
147
|
key: "spacer-cta-top"
|
|
125
148
|
}) : null, withTitle ? /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
126
149
|
key: "title",
|
|
@@ -152,44 +175,18 @@ var TextScreen = function TextScreen(_ref) {
|
|
|
152
175
|
isEmpty: !hasText
|
|
153
176
|
}, hasText ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({
|
|
154
177
|
className: styles.text
|
|
155
|
-
}, text)) : null), !isPlaceholder &&
|
|
178
|
+
}, text)) : null), !isPlaceholder && hasFooter && (isTopLayout || isMiddleLayout) ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
179
|
+
key: "spacer-cta-bottom"
|
|
180
|
+
}) : null, !isPlaceholder && hasHeader && !hasFooter && isMiddleLayout ? /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
|
|
156
181
|
key: "spacer-cta-bottom"
|
|
157
|
-
}) : null, !isPlaceholder &&
|
|
158
|
-
|
|
182
|
+
}) : null, !isPlaceholder && hasFooter ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
183
|
+
className: styles.footer,
|
|
159
184
|
style: {
|
|
160
185
|
paddingTop: spacing,
|
|
161
186
|
paddingLeft: Math.max(0, viewerBottomSidesWidth - spacing),
|
|
162
187
|
paddingRight: Math.max(0, viewerBottomSidesWidth - spacing)
|
|
163
188
|
}
|
|
164
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
165
|
-
animationDisabled: isPreview,
|
|
166
|
-
focusable: current && isView,
|
|
167
|
-
openWebView: openWebView
|
|
168
|
-
}))) : null].filter(function (el) {
|
|
169
|
-
return el !== null;
|
|
170
|
-
});
|
|
171
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
172
|
-
className: classNames__default["default"]([styles.container, (_ref4 = {}, _defineProperty__default["default"](_ref4, className, className !== null), _defineProperty__default["default"](_ref4, styles.isPlaceholder, isPlaceholder), _ref4)]),
|
|
173
|
-
"data-screen-ready": true
|
|
174
|
-
}, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
175
|
-
width: width,
|
|
176
|
-
height: height,
|
|
177
|
-
className: styles.content
|
|
178
|
-
}, /*#__PURE__*/React__default["default"].createElement(Layout__default["default"], {
|
|
179
|
-
className: styles.layout,
|
|
180
|
-
fullscreen: true,
|
|
181
|
-
verticalAlign: verticalAlign,
|
|
182
|
-
style: !isPlaceholder ? {
|
|
183
|
-
padding: spacing,
|
|
184
|
-
paddingTop: (!isPreview ? viewerTopHeight : 0) + spacing,
|
|
185
|
-
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
|
|
186
|
-
} : null
|
|
187
|
-
}, /*#__PURE__*/React__default["default"].createElement(components.TransitionsStagger, {
|
|
188
|
-
transitions: transitions,
|
|
189
|
-
stagger: transitionStagger,
|
|
190
|
-
disabled: transitionDisabled,
|
|
191
|
-
playing: transitionPlaying
|
|
192
|
-
}, items))), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
189
|
+
}, /*#__PURE__*/React__default["default"].createElement(Footer__default["default"], footerProps)) : null)), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
193
190
|
background: background,
|
|
194
191
|
width: width,
|
|
195
192
|
height: height,
|
|
@@ -295,17 +292,25 @@ var definition = [{
|
|
|
295
292
|
}]
|
|
296
293
|
})
|
|
297
294
|
}, {
|
|
298
|
-
name: '
|
|
299
|
-
type: '
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
295
|
+
name: 'header',
|
|
296
|
+
type: 'header',
|
|
297
|
+
label: reactIntl.defineMessage({
|
|
298
|
+
id: "rhuDxI",
|
|
299
|
+
defaultMessage: [{
|
|
300
|
+
"type": 0,
|
|
301
|
+
"value": "Header"
|
|
302
|
+
}]
|
|
303
|
+
})
|
|
306
304
|
}, {
|
|
307
|
-
name: '
|
|
308
|
-
type: '
|
|
305
|
+
name: 'footer',
|
|
306
|
+
type: 'footer',
|
|
307
|
+
label: reactIntl.defineMessage({
|
|
308
|
+
id: "g4nybp",
|
|
309
|
+
defaultMessage: [{
|
|
310
|
+
"type": 0,
|
|
311
|
+
"value": "Footer"
|
|
312
|
+
}]
|
|
313
|
+
})
|
|
309
314
|
}]
|
|
310
315
|
}, {
|
|
311
316
|
id: 'text-title',
|
|
@@ -379,17 +384,25 @@ var definition = [{
|
|
|
379
384
|
}]
|
|
380
385
|
})
|
|
381
386
|
}, {
|
|
382
|
-
name: '
|
|
383
|
-
type: '
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
387
|
+
name: 'header',
|
|
388
|
+
type: 'header',
|
|
389
|
+
label: reactIntl.defineMessage({
|
|
390
|
+
id: "rhuDxI",
|
|
391
|
+
defaultMessage: [{
|
|
392
|
+
"type": 0,
|
|
393
|
+
"value": "Header"
|
|
394
|
+
}]
|
|
395
|
+
})
|
|
390
396
|
}, {
|
|
391
|
-
name: '
|
|
392
|
-
type: '
|
|
397
|
+
name: 'footer',
|
|
398
|
+
type: 'footer',
|
|
399
|
+
label: reactIntl.defineMessage({
|
|
400
|
+
id: "g4nybp",
|
|
401
|
+
defaultMessage: [{
|
|
402
|
+
"type": 0,
|
|
403
|
+
"value": "Footer"
|
|
404
|
+
}]
|
|
405
|
+
})
|
|
393
406
|
}]
|
|
394
407
|
}];
|
|
395
408
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-text",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.354",
|
|
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.354",
|
|
57
|
+
"@micromag/element-heading": "^0.3.354",
|
|
58
|
+
"@micromag/element-layout": "^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": "ccf852d0a7df8f222365088e7de3843492e720e7"
|
|
70
71
|
}
|