@micromag/screen-video-360 0.3.423 → 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 +37 -73
- package/package.json +19 -11
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:inherit;cursor:pointer;display:inline-block;font-family:inherit;padding:0;position:relative}.micromag-screen-video-360-container .micromag-screen-video-360-background,.micromag-screen-video-360-container .micromag-screen-video-360-canvas,.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton,.micromag-screen-video-360-container .micromag-screen-video-360-inner,.micromag-screen-video-360-container .micromag-screen-video-360-placeholder,.micromag-screen-video-360-container .micromag-screen-video-360-video{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-video-360-container{height:100%;overflow:hidden;position:relative;width:100%}.micromag-screen-video-360-disabled.micromag-screen-video-360-container{overflow:hidden;pointer-events:none}.micromag-screen-video-360-hidden.micromag-screen-video-360-container{display:none;visibility:hidden}.micromag-screen-video-360-placeholder.micromag-screen-video-360-container .micromag-screen-video-360-content{padding:6px;position:relative}.micromag-screen-video-360-container .micromag-screen-video-360-empty{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-video-360-container .micromag-screen-video-360-background{z-index:0}.micromag-screen-video-360-container .micromag-screen-video-360-content{z-index:1}.micromag-screen-video-360-container .micromag-screen-video-360-empty{height:100%;margin:0}.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{-ms-touch-action:none;touch-action:none}.micromag-screen-video-360-container .micromag-screen-video-360-videoContainer{position:absolute}.micromag-screen-video-360-container .micromag-screen-video-360-video{visibility:hidden}.micromag-screen-video-360-container .micromag-screen-video-360-video video{height:100%}.micromag-screen-video-360-container .micromag-screen-video-360-mediaControls{padding:10px 20px 20px}.micromag-screen-video-360-container .micromag-screen-video-360-placeholder{-ms-flex-pack:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;justify-content:center}.micromag-screen-video-360-container .micromag-screen-video-360-header{top:0;z-index:1}.micromag-screen-video-360-container .micromag-screen-video-360-bottom,.micromag-screen-video-360-container .micromag-screen-video-360-header{left:0;position:absolute;-webkit-transition:padding .2s ease-out,-webkit-transform .2s ease-out;transition:padding .2s ease-out,-webkit-transform .2s ease-out
|
|
1
|
+
.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:inherit;cursor:pointer;display:inline-block;font-family:inherit;padding:0;position:relative}.micromag-screen-video-360-container .micromag-screen-video-360-background,.micromag-screen-video-360-container .micromag-screen-video-360-canvas,.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton,.micromag-screen-video-360-container .micromag-screen-video-360-inner,.micromag-screen-video-360-container .micromag-screen-video-360-placeholder,.micromag-screen-video-360-container .micromag-screen-video-360-video{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-video-360-container{height:100%;overflow:hidden;position:relative;width:100%}.micromag-screen-video-360-disabled.micromag-screen-video-360-container{overflow:hidden;pointer-events:none}.micromag-screen-video-360-hidden.micromag-screen-video-360-container{display:none;visibility:hidden}.micromag-screen-video-360-placeholder.micromag-screen-video-360-container .micromag-screen-video-360-content{padding:6px;position:relative}.micromag-screen-video-360-container .micromag-screen-video-360-empty{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-video-360-container .micromag-screen-video-360-background{z-index:0}.micromag-screen-video-360-container .micromag-screen-video-360-content{z-index:1}.micromag-screen-video-360-container .micromag-screen-video-360-empty{height:100%;margin:0}.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{-ms-touch-action:none;touch-action:none}.micromag-screen-video-360-container .micromag-screen-video-360-videoContainer{position:absolute}.micromag-screen-video-360-container .micromag-screen-video-360-video{visibility:hidden}.micromag-screen-video-360-container .micromag-screen-video-360-video video{height:100%}.micromag-screen-video-360-container .micromag-screen-video-360-mediaControls{padding:10px 20px 20px}.micromag-screen-video-360-container .micromag-screen-video-360-placeholder{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-box-pack:center;-ms-flex-pack:center;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;justify-content:center}.micromag-screen-video-360-container .micromag-screen-video-360-header{top:0;z-index:1}.micromag-screen-video-360-container .micromag-screen-video-360-bottom,.micromag-screen-video-360-container .micromag-screen-video-360-header{left:0;position:absolute;-webkit-transition:padding .2s ease-out,-webkit-transform .2s ease-out;transition:padding .2s ease-out,-webkit-transform .2s ease-out;transition:transform .2s ease-out,padding .2s ease-out;transition:transform .2s ease-out,padding .2s ease-out,-webkit-transform .2s ease-out;width:100%}.micromag-screen-video-360-container .micromag-screen-video-360-bottom{bottom:0}.micromag-screen-video-360-container .micromag-screen-video-360-bottom>*{margin-bottom:10px}.micromag-screen-video-360-container .micromag-screen-video-360-bottom>:last-child{margin-bottom:0}.micromag-screen-video-360-container.micromag-screen-video-360-showVideo .micromag-screen-video-360-video{visibility:visible}
|
package/es/index.js
CHANGED
|
@@ -102,7 +102,6 @@ var defaultProps = {
|
|
|
102
102
|
className: null
|
|
103
103
|
};
|
|
104
104
|
var Video360Screen = function Video360Screen(_ref) {
|
|
105
|
-
var _ref10;
|
|
106
105
|
_ref.layout;
|
|
107
106
|
var video = _ref.video,
|
|
108
107
|
header = _ref.header,
|
|
@@ -499,7 +498,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
499
498
|
pointerDown.current = false;
|
|
500
499
|
}, [gotoPreviousScreen, gotoNextScreen, landscape]);
|
|
501
500
|
return /*#__PURE__*/React.createElement("div", {
|
|
502
|
-
className: classNames([styles.container, (
|
|
501
|
+
className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.showVideo, isPreview || isStatic || isCapture)]),
|
|
503
502
|
"data-screen-ready": (isStatic || isCapture) && posterReady || ready
|
|
504
503
|
}, /*#__PURE__*/React.createElement(Container, {
|
|
505
504
|
width: width,
|
package/lib/index.js
CHANGED
|
@@ -26,41 +26,6 @@ var Video = require('@micromag/element-video');
|
|
|
26
26
|
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
|
|
27
27
|
var appleNews = require('@micromag/transforms/apple-news');
|
|
28
28
|
|
|
29
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
30
|
-
|
|
31
|
-
function _interopNamespace(e) {
|
|
32
|
-
if (e && e.__esModule) return e;
|
|
33
|
-
var n = Object.create(null);
|
|
34
|
-
if (e) {
|
|
35
|
-
Object.keys(e).forEach(function (k) {
|
|
36
|
-
if (k !== 'default') {
|
|
37
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
38
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
39
|
-
enumerable: true,
|
|
40
|
-
get: function () { return e[k]; }
|
|
41
|
-
});
|
|
42
|
-
}
|
|
43
|
-
});
|
|
44
|
-
}
|
|
45
|
-
n["default"] = e;
|
|
46
|
-
return Object.freeze(n);
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
50
|
-
var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
|
51
|
-
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
|
52
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
53
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
54
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
55
|
-
var Background__default = /*#__PURE__*/_interopDefaultLegacy(Background);
|
|
56
|
-
var ClosedCaptions__default = /*#__PURE__*/_interopDefaultLegacy(ClosedCaptions);
|
|
57
|
-
var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
|
|
58
|
-
var Footer__default = /*#__PURE__*/_interopDefaultLegacy(Footer);
|
|
59
|
-
var Header__default = /*#__PURE__*/_interopDefaultLegacy(Header);
|
|
60
|
-
var Image__default = /*#__PURE__*/_interopDefaultLegacy(Image);
|
|
61
|
-
var Video__default = /*#__PURE__*/_interopDefaultLegacy(Video);
|
|
62
|
-
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
|
|
63
|
-
|
|
64
29
|
/**
|
|
65
30
|
* Locale loader
|
|
66
31
|
*/
|
|
@@ -70,7 +35,7 @@ var useThree = function useThree() {
|
|
|
70
35
|
var _useState = React.useState({
|
|
71
36
|
"package": packageCache
|
|
72
37
|
}),
|
|
73
|
-
_useState2 =
|
|
38
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
74
39
|
loadedPackage = _useState2[0]["package"],
|
|
75
40
|
setLoadedPackage = _useState2[1];
|
|
76
41
|
React.useEffect(function () {
|
|
@@ -80,7 +45,7 @@ var useThree = function useThree() {
|
|
|
80
45
|
canceled = true;
|
|
81
46
|
};
|
|
82
47
|
}
|
|
83
|
-
|
|
48
|
+
import('three').then(function (_ref) {
|
|
84
49
|
var Scene = _ref.Scene,
|
|
85
50
|
PerspectiveCamera = _ref.PerspectiveCamera,
|
|
86
51
|
SphereBufferGeometry = _ref.SphereBufferGeometry,
|
|
@@ -115,17 +80,17 @@ var useThree = function useThree() {
|
|
|
115
80
|
var styles = {"container":"micromag-screen-video-360-container","canvasButton":"micromag-screen-video-360-canvasButton","placeholder":"micromag-screen-video-360-placeholder","inner":"micromag-screen-video-360-inner","canvas":"micromag-screen-video-360-canvas","video":"micromag-screen-video-360-video","background":"micromag-screen-video-360-background","disabled":"micromag-screen-video-360-disabled","hidden":"micromag-screen-video-360-hidden","content":"micromag-screen-video-360-content","empty":"micromag-screen-video-360-empty","videoContainer":"micromag-screen-video-360-videoContainer","mediaControls":"micromag-screen-video-360-mediaControls","header":"micromag-screen-video-360-header","bottom":"micromag-screen-video-360-bottom","showVideo":"micromag-screen-video-360-showVideo"};
|
|
116
81
|
|
|
117
82
|
var propTypes = {
|
|
118
|
-
layout:
|
|
83
|
+
layout: PropTypes.oneOf(['full']),
|
|
119
84
|
video: core.PropTypes.videoElement,
|
|
120
85
|
header: core.PropTypes.header,
|
|
121
86
|
footer: core.PropTypes.footer,
|
|
122
87
|
background: core.PropTypes.backgroundElement,
|
|
123
|
-
current:
|
|
124
|
-
active:
|
|
125
|
-
type:
|
|
126
|
-
spacing:
|
|
127
|
-
mediaRef:
|
|
128
|
-
className:
|
|
88
|
+
current: PropTypes.bool,
|
|
89
|
+
active: PropTypes.bool,
|
|
90
|
+
type: PropTypes.string,
|
|
91
|
+
spacing: PropTypes.number,
|
|
92
|
+
mediaRef: PropTypes.func,
|
|
93
|
+
className: PropTypes.string
|
|
129
94
|
};
|
|
130
95
|
var defaultProps = {
|
|
131
96
|
layout: 'full',
|
|
@@ -141,7 +106,6 @@ var defaultProps = {
|
|
|
141
106
|
className: null
|
|
142
107
|
};
|
|
143
108
|
var Video360Screen = function Video360Screen(_ref) {
|
|
144
|
-
var _ref10;
|
|
145
109
|
_ref.layout;
|
|
146
110
|
var video = _ref.video,
|
|
147
111
|
header = _ref.header,
|
|
@@ -263,11 +227,11 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
263
227
|
}, [activityDetected, showControls, hideControls]);
|
|
264
228
|
hooks.useDebounce(toggleControlsVisibility, activityDetected, 1000);
|
|
265
229
|
var _useState = React.useState(null),
|
|
266
|
-
_useState2 =
|
|
230
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
267
231
|
currentTime = _useState2[0],
|
|
268
232
|
setCurrentTime = _useState2[1];
|
|
269
233
|
var _useState3 = React.useState(null),
|
|
270
|
-
_useState4 =
|
|
234
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
271
235
|
duration = _useState4[0],
|
|
272
236
|
setDuration = _useState4[1];
|
|
273
237
|
var onTimeUpdate = React.useCallback(function (time) {
|
|
@@ -302,7 +266,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
302
266
|
|
|
303
267
|
var hasVideo = video !== null;
|
|
304
268
|
var _useState5 = React.useState(!hasVideo),
|
|
305
|
-
_useState6 =
|
|
269
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
306
270
|
ready = _useState6[0],
|
|
307
271
|
setReady = _useState6[1];
|
|
308
272
|
|
|
@@ -319,7 +283,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
319
283
|
enableInteraction: enableInteraction,
|
|
320
284
|
disableInteraction: disableInteraction
|
|
321
285
|
});
|
|
322
|
-
var finalVideo = hasVideo ?
|
|
286
|
+
var finalVideo = hasVideo ? _objectSpread(_objectSpread({}, video), {}, {
|
|
323
287
|
autoPlay: !isPreview && !isStatic && !isCapture && autoPlay && current
|
|
324
288
|
}) : null;
|
|
325
289
|
var _ref5 = videoMedia || {},
|
|
@@ -337,7 +301,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
337
301
|
videoHeight = _ref6$height === void 0 ? 0 : _ref6$height;
|
|
338
302
|
var hasThumbnail = thumbnailUrl !== null;
|
|
339
303
|
var _useState7 = React.useState(!hasThumbnail),
|
|
340
|
-
_useState8 =
|
|
304
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
341
305
|
posterReady = _useState8[0],
|
|
342
306
|
setPosterReady = _useState8[1];
|
|
343
307
|
var withVideoSphere = hasVideoUrl && (isView || isEdit) && !isCapture && !isStatic;
|
|
@@ -537,14 +501,14 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
537
501
|
}
|
|
538
502
|
pointerDown.current = false;
|
|
539
503
|
}, [gotoPreviousScreen, gotoNextScreen, landscape]);
|
|
540
|
-
return /*#__PURE__*/
|
|
541
|
-
className:
|
|
504
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
505
|
+
className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.showVideo, isPreview || isStatic || isCapture)]),
|
|
542
506
|
"data-screen-ready": (isStatic || isCapture) && posterReady || ready
|
|
543
|
-
}, /*#__PURE__*/
|
|
507
|
+
}, /*#__PURE__*/React.createElement(Container, {
|
|
544
508
|
width: width,
|
|
545
509
|
height: height,
|
|
546
510
|
className: styles.content
|
|
547
|
-
}, withVideoSphere ? /*#__PURE__*/
|
|
511
|
+
}, withVideoSphere ? /*#__PURE__*/React.createElement("div", {
|
|
548
512
|
ref: videoContainerRef,
|
|
549
513
|
className: styles.videoContainer,
|
|
550
514
|
style: {
|
|
@@ -553,7 +517,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
553
517
|
left: resizedVideoLeft,
|
|
554
518
|
top: resizedVideoTop
|
|
555
519
|
}
|
|
556
|
-
}, /*#__PURE__*/
|
|
520
|
+
}, /*#__PURE__*/React.createElement(Video, Object.assign({}, finalVideo, {
|
|
557
521
|
mediaRef: mediaRef,
|
|
558
522
|
className: styles.video,
|
|
559
523
|
paused: !current || !playing,
|
|
@@ -570,17 +534,17 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
570
534
|
onPosterLoaded: onPosterLoaded,
|
|
571
535
|
focusable: current && isView,
|
|
572
536
|
shouldLoad: mediaShouldLoad
|
|
573
|
-
}))) : null, /*#__PURE__*/
|
|
537
|
+
}))) : null, /*#__PURE__*/React.createElement("div", {
|
|
574
538
|
className: styles.inner
|
|
575
|
-
}, /*#__PURE__*/
|
|
539
|
+
}, /*#__PURE__*/React.createElement(components.ScreenElement, {
|
|
576
540
|
key: "video",
|
|
577
|
-
placeholder: /*#__PURE__*/
|
|
541
|
+
placeholder: /*#__PURE__*/React.createElement(components.PlaceholderVideo360, {
|
|
578
542
|
className: styles.placeholder,
|
|
579
543
|
width: "100%",
|
|
580
544
|
height: "100%"
|
|
581
545
|
}),
|
|
582
546
|
emptyClassName: styles.empty,
|
|
583
|
-
emptyLabel: /*#__PURE__*/
|
|
547
|
+
emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
584
548
|
id: "oLtEu6",
|
|
585
549
|
defaultMessage: [{
|
|
586
550
|
"type": 0,
|
|
@@ -588,7 +552,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
588
552
|
}]
|
|
589
553
|
}),
|
|
590
554
|
isEmpty: !withVideoSphere
|
|
591
|
-
}, !isPlaceholder && hasHeader ? /*#__PURE__*/
|
|
555
|
+
}, !isPlaceholder && hasHeader ? /*#__PURE__*/React.createElement("div", {
|
|
592
556
|
key: "header",
|
|
593
557
|
className: styles.header,
|
|
594
558
|
style: {
|
|
@@ -597,10 +561,10 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
597
561
|
paddingRight: spacing,
|
|
598
562
|
transform: !isPreview ? "translate(0, ".concat(viewerTopHeight, "px)") : null
|
|
599
563
|
}
|
|
600
|
-
}, /*#__PURE__*/
|
|
564
|
+
}, /*#__PURE__*/React.createElement(Header, header)) : null, withVideoSphere ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("canvas", {
|
|
601
565
|
ref: canvasRef,
|
|
602
566
|
className: styles.canvas
|
|
603
|
-
}), /*#__PURE__*/
|
|
567
|
+
}), /*#__PURE__*/React.createElement("button", {
|
|
604
568
|
className: styles.canvasButton,
|
|
605
569
|
type: "button",
|
|
606
570
|
"aria-label": "canvas-interaction",
|
|
@@ -608,7 +572,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
608
572
|
onPointerMove: onPointerMove,
|
|
609
573
|
onPointerUp: onPointerUp,
|
|
610
574
|
tabIndex: current && isView ? null : '-1'
|
|
611
|
-
})) : /*#__PURE__*/
|
|
575
|
+
})) : /*#__PURE__*/React.createElement("div", {
|
|
612
576
|
className: styles.videoContainer,
|
|
613
577
|
style: {
|
|
614
578
|
width: resizedVideoWidth,
|
|
@@ -616,7 +580,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
616
580
|
left: resizedVideoLeft,
|
|
617
581
|
top: resizedVideoTop
|
|
618
582
|
}
|
|
619
|
-
}, /*#__PURE__*/
|
|
583
|
+
}, /*#__PURE__*/React.createElement(Image, {
|
|
620
584
|
className: styles.video,
|
|
621
585
|
media: {
|
|
622
586
|
url: thumbnailUrl,
|
|
@@ -628,7 +592,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
628
592
|
width: resizedVideoWidth,
|
|
629
593
|
height: resizedVideoHeight,
|
|
630
594
|
resolution: resolution
|
|
631
|
-
}))), !isPlaceholder ? /*#__PURE__*/
|
|
595
|
+
}))), !isPlaceholder ? /*#__PURE__*/React.createElement("div", {
|
|
632
596
|
key: "bottom-content",
|
|
633
597
|
className: styles.bottom,
|
|
634
598
|
style: {
|
|
@@ -638,13 +602,13 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
638
602
|
paddingBottom: spacing / 2,
|
|
639
603
|
paddingTop: 0
|
|
640
604
|
}
|
|
641
|
-
}, closedCaptions !== null && !isPreview && !isCapture && !isStatic ? /*#__PURE__*/
|
|
605
|
+
}, closedCaptions !== null && !isPreview && !isCapture && !isStatic ? /*#__PURE__*/React.createElement(ClosedCaptions, {
|
|
642
606
|
className: styles.closedCaptions,
|
|
643
607
|
media: closedCaptions,
|
|
644
608
|
currentTime: currentTime
|
|
645
|
-
}) : null, hasFooter ? /*#__PURE__*/
|
|
609
|
+
}) : null, hasFooter ? /*#__PURE__*/React.createElement(Footer, Object.assign({}, footerProps, {
|
|
646
610
|
className: styles.callToAction
|
|
647
|
-
})) : null) : null)), !isPlaceholder ? /*#__PURE__*/
|
|
611
|
+
})) : null) : null)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
648
612
|
background: background,
|
|
649
613
|
width: width,
|
|
650
614
|
height: height,
|
|
@@ -657,7 +621,7 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
657
621
|
};
|
|
658
622
|
Video360Screen.propTypes = propTypes;
|
|
659
623
|
Video360Screen.defaultProps = defaultProps;
|
|
660
|
-
var Video360Screen$1 = /*#__PURE__*/
|
|
624
|
+
var Video360Screen$1 = /*#__PURE__*/React.memo(Video360Screen);
|
|
661
625
|
|
|
662
626
|
var transform = function transform(newStory, _ref) {
|
|
663
627
|
var video = _ref.video;
|
|
@@ -667,11 +631,11 @@ var transform = function transform(newStory, _ref) {
|
|
|
667
631
|
var _Video = appleNews.Video(newStory, media),
|
|
668
632
|
titleStory = _Video.story,
|
|
669
633
|
titleComponent = _Video.component;
|
|
670
|
-
var _Container = appleNews.Container(titleStory,
|
|
634
|
+
var _Container = appleNews.Container(titleStory, _toConsumableArray(titleComponent ? [titleComponent] : [])),
|
|
671
635
|
containerStory = _Container.story,
|
|
672
636
|
containerComponent = _Container.component;
|
|
673
|
-
return
|
|
674
|
-
components: [].concat(
|
|
637
|
+
return _objectSpread(_objectSpread({}, containerStory), {}, {
|
|
638
|
+
components: [].concat(_toConsumableArray(newStory.components || []), _toConsumableArray(containerComponent ? [containerComponent] : []))
|
|
675
639
|
});
|
|
676
640
|
};
|
|
677
641
|
|
|
@@ -771,4 +735,4 @@ var definition = {
|
|
|
771
735
|
};
|
|
772
736
|
|
|
773
737
|
exports.Video360Screen = Video360Screen$1;
|
|
774
|
-
exports
|
|
738
|
+
exports.default = definition;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-video-360",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.429",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [
|
|
@@ -32,6 +32,14 @@
|
|
|
32
32
|
"license": "ISC",
|
|
33
33
|
"main": "lib/index.js",
|
|
34
34
|
"module": "es/index.js",
|
|
35
|
+
"style": "assets/css/styles.css",
|
|
36
|
+
"exports": {
|
|
37
|
+
".": {
|
|
38
|
+
"require": "./lib/index.js",
|
|
39
|
+
"import": "./es/index.js"
|
|
40
|
+
},
|
|
41
|
+
"./assets/css/*.css": "./assets/css/*.css"
|
|
42
|
+
},
|
|
35
43
|
"files": [
|
|
36
44
|
"lib",
|
|
37
45
|
"es",
|
|
@@ -51,15 +59,15 @@
|
|
|
51
59
|
"dependencies": {
|
|
52
60
|
"@babel/runtime": "^7.13.10",
|
|
53
61
|
"@folklore/size": "^0.1.20",
|
|
54
|
-
"@micromag/core": "^0.3.
|
|
55
|
-
"@micromag/element-background": "^0.3.
|
|
56
|
-
"@micromag/element-closed-captions": "^0.3.
|
|
57
|
-
"@micromag/element-container": "^0.3.
|
|
58
|
-
"@micromag/element-footer": "^0.3.
|
|
59
|
-
"@micromag/element-header": "^0.3.
|
|
60
|
-
"@micromag/element-image": "^0.3.
|
|
61
|
-
"@micromag/element-video": "^0.3.
|
|
62
|
-
"@micromag/transforms": "^0.3.
|
|
62
|
+
"@micromag/core": "^0.3.429",
|
|
63
|
+
"@micromag/element-background": "^0.3.429",
|
|
64
|
+
"@micromag/element-closed-captions": "^0.3.429",
|
|
65
|
+
"@micromag/element-container": "^0.3.429",
|
|
66
|
+
"@micromag/element-footer": "^0.3.429",
|
|
67
|
+
"@micromag/element-header": "^0.3.429",
|
|
68
|
+
"@micromag/element-image": "^0.3.429",
|
|
69
|
+
"@micromag/element-video": "^0.3.429",
|
|
70
|
+
"@micromag/transforms": "^0.3.429",
|
|
63
71
|
"classnames": "^2.2.6",
|
|
64
72
|
"lodash": "^4.17.21",
|
|
65
73
|
"prop-types": "^15.7.2",
|
|
@@ -72,5 +80,5 @@
|
|
|
72
80
|
"access": "public",
|
|
73
81
|
"registry": "https://registry.npmjs.org/"
|
|
74
82
|
},
|
|
75
|
-
"gitHead": "
|
|
83
|
+
"gitHead": "f15e72b88ecfda4c54b87626513149b58572c52b"
|
|
76
84
|
}
|