@micromag/screen-share 0.3.420 → 0.3.429
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/assets/css/styles.css +1 -1
- package/es/index.js +1 -2
- package/lib/index.js +32 -49
- package/package.json +20 -12
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-share-container .micromag-screen-share-background{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-share-container{height:100%;overflow:hidden;position:relative;width:100%}.micromag-screen-share-disabled.micromag-screen-share-container{overflow:hidden;pointer-events:none}.micromag-screen-share-hidden.micromag-screen-share-container{display:none;visibility:hidden}.micromag-screen-share-placeholder.micromag-screen-share-container .micromag-screen-share-content{padding:6px;position:relative}.micromag-screen-share-emptyHeading,.micromag-screen-share-emptyOptions{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-share-container .micromag-screen-share-background{z-index:0}.micromag-screen-share-container .micromag-screen-share-content{z-index:1}.micromag-screen-share-container .micromag-screen-share-heading{margin-bottom:10px}.micromag-screen-share-layout{overflow-x:hidden;overflow-y:auto;padding:10px}.micromag-screen-share-shareOptions.micromag-screen-share-isCentered{-ms-flex-pack:center;justify-content:center}.micromag-screen-share-shareButton{display:-ms-flexbox;display:flex;width:100%}.micromag-screen-share-emptyHeading,.micromag-screen-share-emptyOptions{margin:10px auto;padding:10px;width:100%}.micromag-screen-share-emptyOptions{padding:40px}.micromag-screen-share-header{left:0;margin-top:0;position:absolute;top:0;width:100%;z-index:1}.micromag-screen-share-footer{bottom:0;left:0;margin-top:0;position:absolute;width:100%}
|
|
1
|
+
.micromag-screen-share-container .micromag-screen-share-background{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-share-container{height:100%;overflow:hidden;position:relative;width:100%}.micromag-screen-share-disabled.micromag-screen-share-container{overflow:hidden;pointer-events:none}.micromag-screen-share-hidden.micromag-screen-share-container{display:none;visibility:hidden}.micromag-screen-share-placeholder.micromag-screen-share-container .micromag-screen-share-content{padding:6px;position:relative}.micromag-screen-share-emptyHeading,.micromag-screen-share-emptyOptions{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-share-container .micromag-screen-share-background{z-index:0}.micromag-screen-share-container .micromag-screen-share-content{z-index:1}.micromag-screen-share-container .micromag-screen-share-heading{margin-bottom:10px}.micromag-screen-share-layout{overflow-x:hidden;overflow-y:auto;padding:10px}.micromag-screen-share-shareOptions.micromag-screen-share-isCentered{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.micromag-screen-share-shareButton{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}.micromag-screen-share-emptyHeading,.micromag-screen-share-emptyOptions{margin:10px auto;padding:10px;width:100%}.micromag-screen-share-emptyOptions{padding:40px}.micromag-screen-share-header{left:0;margin-top:0;position:absolute;top:0;width:100%;z-index:1}.micromag-screen-share-footer{bottom:0;left:0;margin-top:0;position:absolute;width:100%}
|
package/es/index.js
CHANGED
|
@@ -58,7 +58,6 @@ var defaultProps = {
|
|
|
58
58
|
className: null
|
|
59
59
|
};
|
|
60
60
|
var ShareScreen = function ShareScreen(_ref) {
|
|
61
|
-
var _ref3;
|
|
62
61
|
var layout = _ref.layout,
|
|
63
62
|
heading = _ref.heading,
|
|
64
63
|
shareUrl = _ref.shareUrl,
|
|
@@ -153,7 +152,7 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
153
152
|
}
|
|
154
153
|
}, [trackEvent]);
|
|
155
154
|
return /*#__PURE__*/React.createElement("div", {
|
|
156
|
-
className: classNames([styles.container, (
|
|
155
|
+
className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.isPlaceholder, isPlaceholder)]),
|
|
157
156
|
"data-screen-ready": true
|
|
158
157
|
}, /*#__PURE__*/React.createElement(Container, {
|
|
159
158
|
width: width,
|
package/lib/index.js
CHANGED
|
@@ -23,41 +23,25 @@ var ShareOptions = require('@micromag/element-share-options');
|
|
|
23
23
|
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
|
|
24
24
|
var appleNews = require('@micromag/transforms/apple-news');
|
|
25
25
|
|
|
26
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
27
|
-
|
|
28
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
29
|
-
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
|
|
30
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
31
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
32
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
33
|
-
var Background__default = /*#__PURE__*/_interopDefaultLegacy(Background);
|
|
34
|
-
var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
|
|
35
|
-
var Footer__default = /*#__PURE__*/_interopDefaultLegacy(Footer);
|
|
36
|
-
var Header__default = /*#__PURE__*/_interopDefaultLegacy(Header);
|
|
37
|
-
var Heading__default = /*#__PURE__*/_interopDefaultLegacy(Heading);
|
|
38
|
-
var Layout__default = /*#__PURE__*/_interopDefaultLegacy(Layout);
|
|
39
|
-
var ShareOptions__default = /*#__PURE__*/_interopDefaultLegacy(ShareOptions);
|
|
40
|
-
var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
|
41
|
-
|
|
42
26
|
var styles = {"container":"micromag-screen-share-container","background":"micromag-screen-share-background","disabled":"micromag-screen-share-disabled","hidden":"micromag-screen-share-hidden","placeholder":"micromag-screen-share-placeholder","content":"micromag-screen-share-content","emptyHeading":"micromag-screen-share-emptyHeading","emptyOptions":"micromag-screen-share-emptyOptions","heading":"micromag-screen-share-heading","layout":"micromag-screen-share-layout","shareOptions":"micromag-screen-share-shareOptions","isCentered":"micromag-screen-share-isCentered","shareButton":"micromag-screen-share-shareButton","header":"micromag-screen-share-header","footer":"micromag-screen-share-footer"};
|
|
43
27
|
|
|
44
28
|
var propTypes = {
|
|
45
|
-
layout:
|
|
29
|
+
layout: PropTypes.oneOf(['top', 'middle', 'bottom']),
|
|
46
30
|
heading: core.PropTypes.headingElement,
|
|
47
|
-
shareUrl:
|
|
48
|
-
options:
|
|
31
|
+
shareUrl: PropTypes.string,
|
|
32
|
+
options: PropTypes.objectOf(PropTypes.bool),
|
|
49
33
|
buttonsStyle: core.PropTypes.boxStyle,
|
|
50
34
|
buttonsTextStyle: core.PropTypes.textStyle,
|
|
51
|
-
centered:
|
|
52
|
-
spacing:
|
|
35
|
+
centered: PropTypes.bool,
|
|
36
|
+
spacing: PropTypes.number,
|
|
53
37
|
background: core.PropTypes.backgroundElement,
|
|
54
38
|
header: core.PropTypes.header,
|
|
55
39
|
footer: core.PropTypes.footer,
|
|
56
|
-
id:
|
|
57
|
-
index:
|
|
58
|
-
current:
|
|
59
|
-
active:
|
|
60
|
-
className:
|
|
40
|
+
id: PropTypes.string,
|
|
41
|
+
index: PropTypes.number,
|
|
42
|
+
current: PropTypes.bool,
|
|
43
|
+
active: PropTypes.bool,
|
|
44
|
+
className: PropTypes.string
|
|
61
45
|
};
|
|
62
46
|
var defaultProps = {
|
|
63
47
|
layout: 'top',
|
|
@@ -78,7 +62,6 @@ var defaultProps = {
|
|
|
78
62
|
className: null
|
|
79
63
|
};
|
|
80
64
|
var ShareScreen = function ShareScreen(_ref) {
|
|
81
|
-
var _ref3;
|
|
82
65
|
var layout = _ref.layout,
|
|
83
66
|
heading = _ref.heading,
|
|
84
67
|
shareUrl = _ref.shareUrl,
|
|
@@ -161,7 +144,7 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
161
144
|
var defaultOptions = options !== null ? ['email', 'facebook', 'twitter', 'linkedin', 'whatsapp'] : [];
|
|
162
145
|
var selectedOptions = options !== null ? Object.keys(options).reduce(function (acc, key) {
|
|
163
146
|
if (!options[key]) return acc;
|
|
164
|
-
return [].concat(
|
|
147
|
+
return [].concat(_toConsumableArray(acc), [key]);
|
|
165
148
|
}, []) : defaultOptions;
|
|
166
149
|
var trackingEnabled = isView;
|
|
167
150
|
var trackEvent = hooks.useTrackScreenEvent('share');
|
|
@@ -172,14 +155,14 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
172
155
|
});
|
|
173
156
|
}
|
|
174
157
|
}, [trackEvent]);
|
|
175
|
-
return /*#__PURE__*/
|
|
176
|
-
className:
|
|
158
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
159
|
+
className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.isPlaceholder, isPlaceholder)]),
|
|
177
160
|
"data-screen-ready": true
|
|
178
|
-
}, /*#__PURE__*/
|
|
161
|
+
}, /*#__PURE__*/React.createElement(Container, {
|
|
179
162
|
width: width,
|
|
180
163
|
height: height,
|
|
181
164
|
className: styles.content
|
|
182
|
-
}, /*#__PURE__*/
|
|
165
|
+
}, /*#__PURE__*/React.createElement(Layout, {
|
|
183
166
|
className: styles.layout,
|
|
184
167
|
verticalAlign: layout,
|
|
185
168
|
fullscreen: true,
|
|
@@ -188,7 +171,7 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
188
171
|
paddingTop: (!isPreview ? viewerTopHeight : 0) + (headerHeight || spacing),
|
|
189
172
|
paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + (footerHeight || spacing)
|
|
190
173
|
} : null
|
|
191
|
-
}, !isPlaceholder && hasHeader ? /*#__PURE__*/
|
|
174
|
+
}, !isPlaceholder && hasHeader ? /*#__PURE__*/React.createElement("div", {
|
|
192
175
|
className: styles.header,
|
|
193
176
|
ref: headerRef,
|
|
194
177
|
style: {
|
|
@@ -198,10 +181,10 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
198
181
|
paddingRight: spacing,
|
|
199
182
|
transform: "translate(0px, ".concat(viewerTopHeight, "px)")
|
|
200
183
|
}
|
|
201
|
-
}, /*#__PURE__*/
|
|
184
|
+
}, /*#__PURE__*/React.createElement(Header, header)) : null, /*#__PURE__*/React.createElement(components.ScreenElement, {
|
|
202
185
|
key: "title",
|
|
203
186
|
placeholder: "title",
|
|
204
|
-
emptyLabel: /*#__PURE__*/
|
|
187
|
+
emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
205
188
|
id: "X7kRRa",
|
|
206
189
|
defaultMessage: [{
|
|
207
190
|
"type": 0,
|
|
@@ -210,15 +193,15 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
210
193
|
}),
|
|
211
194
|
emptyClassName: styles.emptyHeading,
|
|
212
195
|
isEmpty: !heading || (heading === null || heading === void 0 ? void 0 : heading.body) === ''
|
|
213
|
-
}, heading ? /*#__PURE__*/
|
|
214
|
-
className:
|
|
215
|
-
}, heading)) : null), /*#__PURE__*/
|
|
196
|
+
}, heading ? /*#__PURE__*/React.createElement(Heading, Object.assign({
|
|
197
|
+
className: classNames([styles.heading])
|
|
198
|
+
}, heading)) : null), /*#__PURE__*/React.createElement(Layout.Spacer, {
|
|
216
199
|
key: "spacer",
|
|
217
200
|
size: 5
|
|
218
|
-
}), /*#__PURE__*/
|
|
201
|
+
}), /*#__PURE__*/React.createElement(components.ScreenElement, {
|
|
219
202
|
key: "share-options",
|
|
220
203
|
placeholder: "share-options",
|
|
221
|
-
emptyLabel: /*#__PURE__*/
|
|
204
|
+
emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
222
205
|
id: "RucIeL",
|
|
223
206
|
defaultMessage: [{
|
|
224
207
|
"type": 0,
|
|
@@ -227,15 +210,15 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
227
210
|
}),
|
|
228
211
|
emptyClassName: styles.emptyOptions,
|
|
229
212
|
isEmpty: !options
|
|
230
|
-
}, /*#__PURE__*/
|
|
231
|
-
className:
|
|
213
|
+
}, /*#__PURE__*/React.createElement(ShareOptions, {
|
|
214
|
+
className: classNames([styles.shareOptions, _defineProperty({}, styles.isCentered, centered)]),
|
|
232
215
|
buttonClassName: styles.shareButton,
|
|
233
216
|
url: finalShareURL,
|
|
234
217
|
options: selectedOptions,
|
|
235
218
|
onShare: onClickShare,
|
|
236
219
|
buttonsStyle: buttonsStyle,
|
|
237
220
|
buttonsTextStyle: buttonsTextStyle
|
|
238
|
-
})), !isPlaceholder && hasFooter ? /*#__PURE__*/
|
|
221
|
+
})), !isPlaceholder && hasFooter ? /*#__PURE__*/React.createElement("div", {
|
|
239
222
|
className: styles.footer,
|
|
240
223
|
ref: footerRef,
|
|
241
224
|
style: {
|
|
@@ -244,7 +227,7 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
244
227
|
paddingLeft: Math.max(viewerBottomSidesWidth - spacing, 0),
|
|
245
228
|
paddingRight: Math.max(viewerBottomSidesWidth - spacing, 0)
|
|
246
229
|
}
|
|
247
|
-
}, /*#__PURE__*/
|
|
230
|
+
}, /*#__PURE__*/React.createElement(Footer, footerProps)) : null)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
248
231
|
background: background,
|
|
249
232
|
width: width,
|
|
250
233
|
height: height,
|
|
@@ -259,7 +242,7 @@ var ShareScreen = function ShareScreen(_ref) {
|
|
|
259
242
|
};
|
|
260
243
|
ShareScreen.propTypes = propTypes;
|
|
261
244
|
ShareScreen.defaultProps = defaultProps;
|
|
262
|
-
var ShareScreen$1 = /*#__PURE__*/
|
|
245
|
+
var ShareScreen$1 = /*#__PURE__*/React.memo(ShareScreen);
|
|
263
246
|
|
|
264
247
|
var transform = function transform(newStory, _ref) {
|
|
265
248
|
var text = _ref.text,
|
|
@@ -270,11 +253,11 @@ var transform = function transform(newStory, _ref) {
|
|
|
270
253
|
var _Text = appleNews.Text(titleStory, text),
|
|
271
254
|
textStory = _Text.story,
|
|
272
255
|
textComponent = _Text.component;
|
|
273
|
-
var _Container = appleNews.Container(textStory, [].concat(
|
|
256
|
+
var _Container = appleNews.Container(textStory, [].concat(_toConsumableArray(titleComponent ? [titleComponent] : []), _toConsumableArray(textComponent ? [textComponent] : []))),
|
|
274
257
|
containerStory = _Container.story,
|
|
275
258
|
containerComponent = _Container.component;
|
|
276
|
-
return
|
|
277
|
-
components: [].concat(
|
|
259
|
+
return _objectSpread(_objectSpread({}, containerStory), {}, {
|
|
260
|
+
components: [].concat(_toConsumableArray(newStory.components || []), _toConsumableArray(containerComponent ? [containerComponent] : []))
|
|
278
261
|
});
|
|
279
262
|
};
|
|
280
263
|
|
|
@@ -518,4 +501,4 @@ var definition = {
|
|
|
518
501
|
};
|
|
519
502
|
|
|
520
503
|
exports.ShareScreen = ShareScreen$1;
|
|
521
|
-
exports
|
|
504
|
+
exports.default = definition;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-share",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.429",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [
|
|
@@ -36,6 +36,14 @@
|
|
|
36
36
|
"license": "ISC",
|
|
37
37
|
"main": "lib/index.js",
|
|
38
38
|
"module": "es/index.js",
|
|
39
|
+
"style": "assets/css/styles.css",
|
|
40
|
+
"exports": {
|
|
41
|
+
".": {
|
|
42
|
+
"require": "./lib/index.js",
|
|
43
|
+
"import": "./es/index.js"
|
|
44
|
+
},
|
|
45
|
+
"./assets/css/*.css": "./assets/css/*.css"
|
|
46
|
+
},
|
|
39
47
|
"files": [
|
|
40
48
|
"lib",
|
|
41
49
|
"es",
|
|
@@ -54,16 +62,16 @@
|
|
|
54
62
|
},
|
|
55
63
|
"dependencies": {
|
|
56
64
|
"@babel/runtime": "^7.13.10",
|
|
57
|
-
"@micromag/core": "^0.3.
|
|
58
|
-
"@micromag/element-background": "^0.3.
|
|
59
|
-
"@micromag/element-container": "^0.3.
|
|
60
|
-
"@micromag/element-footer": "^0.3.
|
|
61
|
-
"@micromag/element-header": "^0.3.
|
|
62
|
-
"@micromag/element-heading": "^0.3.
|
|
63
|
-
"@micromag/element-layout": "^0.3.
|
|
64
|
-
"@micromag/element-share-options": "^0.3.
|
|
65
|
-
"@micromag/element-text": "^0.3.
|
|
66
|
-
"@micromag/transforms": "^0.3.
|
|
65
|
+
"@micromag/core": "^0.3.429",
|
|
66
|
+
"@micromag/element-background": "^0.3.429",
|
|
67
|
+
"@micromag/element-container": "^0.3.429",
|
|
68
|
+
"@micromag/element-footer": "^0.3.429",
|
|
69
|
+
"@micromag/element-header": "^0.3.429",
|
|
70
|
+
"@micromag/element-heading": "^0.3.429",
|
|
71
|
+
"@micromag/element-layout": "^0.3.429",
|
|
72
|
+
"@micromag/element-share-options": "^0.3.429",
|
|
73
|
+
"@micromag/element-text": "^0.3.429",
|
|
74
|
+
"@micromag/transforms": "^0.3.429",
|
|
67
75
|
"classnames": "^2.2.6",
|
|
68
76
|
"lodash": "^4.17.21",
|
|
69
77
|
"prop-types": "^15.7.2",
|
|
@@ -74,5 +82,5 @@
|
|
|
74
82
|
"access": "public",
|
|
75
83
|
"registry": "https://registry.npmjs.org/"
|
|
76
84
|
},
|
|
77
|
-
"gitHead": "
|
|
85
|
+
"gitHead": "f15e72b88ecfda4c54b87626513149b58572c52b"
|
|
78
86
|
}
|