@micromag/element-video 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/es/index.js +1 -2
- package/lib/index.js +42 -53
- package/package.json +10 -4
package/es/index.js
CHANGED
|
@@ -77,7 +77,6 @@ var defaultProps = {
|
|
|
77
77
|
withLoading: false
|
|
78
78
|
};
|
|
79
79
|
var Video = function Video(_ref) {
|
|
80
|
-
var _ref7;
|
|
81
80
|
var media = _ref.media,
|
|
82
81
|
thumbnail = _ref.thumbnail,
|
|
83
82
|
width = _ref.width,
|
|
@@ -260,7 +259,7 @@ var Video = function Video(_ref) {
|
|
|
260
259
|
onStep: onProgressStep
|
|
261
260
|
});
|
|
262
261
|
return /*#__PURE__*/React.createElement("div", {
|
|
263
|
-
className: classNames([styles.container, (
|
|
262
|
+
className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.withSize, withSize)]),
|
|
264
263
|
style: withSize ? {
|
|
265
264
|
width: width,
|
|
266
265
|
height: height
|
package/lib/index.js
CHANGED
|
@@ -12,50 +12,40 @@ var components = require('@micromag/core/components');
|
|
|
12
12
|
var hooks = require('@micromag/core/hooks');
|
|
13
13
|
var utils = require('@micromag/core/utils');
|
|
14
14
|
|
|
15
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
|
-
|
|
17
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
18
|
-
var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
|
19
|
-
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
|
20
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
21
|
-
var isFunction__default = /*#__PURE__*/_interopDefaultLegacy(isFunction);
|
|
22
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
23
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
24
|
-
|
|
25
15
|
var styles = {"container":"micromag-element-video-container","withSize":"micromag-element-video-withSize","video":"micromag-element-video-video","spinner":"micromag-element-video-spinner"};
|
|
26
16
|
|
|
27
17
|
var propTypes = {
|
|
28
18
|
media: core.PropTypes.videoMedia,
|
|
29
|
-
thumbnail:
|
|
30
|
-
width:
|
|
31
|
-
height:
|
|
32
|
-
mediaRef:
|
|
33
|
-
current:
|
|
19
|
+
thumbnail: PropTypes.oneOf([PropTypes.string, core.PropTypes.imageMedia]),
|
|
20
|
+
width: PropTypes.number,
|
|
21
|
+
height: PropTypes.number,
|
|
22
|
+
mediaRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
|
|
23
|
+
current: PropTypes.any
|
|
34
24
|
})]),
|
|
35
|
-
muted:
|
|
36
|
-
autoPlay:
|
|
37
|
-
paused:
|
|
38
|
-
loop:
|
|
39
|
-
playsInline:
|
|
40
|
-
preload:
|
|
41
|
-
disablePictureInPicture:
|
|
42
|
-
shouldLoad:
|
|
43
|
-
withoutCors:
|
|
44
|
-
className:
|
|
45
|
-
onReady:
|
|
46
|
-
onPlay:
|
|
47
|
-
onPause:
|
|
48
|
-
onEnded:
|
|
49
|
-
onSeeked:
|
|
50
|
-
onTimeUpdate:
|
|
51
|
-
onProgressStep:
|
|
52
|
-
onDurationChange:
|
|
53
|
-
onVolumeChange:
|
|
54
|
-
onSuspend:
|
|
55
|
-
onSuspended:
|
|
56
|
-
focusable:
|
|
57
|
-
withPoster:
|
|
58
|
-
withLoading:
|
|
25
|
+
muted: PropTypes.bool,
|
|
26
|
+
autoPlay: PropTypes.bool,
|
|
27
|
+
paused: PropTypes.bool,
|
|
28
|
+
loop: PropTypes.bool,
|
|
29
|
+
playsInline: PropTypes.bool,
|
|
30
|
+
preload: PropTypes.oneOf(['auto', 'metadata', 'none', null]),
|
|
31
|
+
disablePictureInPicture: PropTypes.bool,
|
|
32
|
+
shouldLoad: PropTypes.bool,
|
|
33
|
+
withoutCors: PropTypes.bool,
|
|
34
|
+
className: PropTypes.string,
|
|
35
|
+
onReady: PropTypes.func,
|
|
36
|
+
onPlay: PropTypes.func,
|
|
37
|
+
onPause: PropTypes.func,
|
|
38
|
+
onEnded: PropTypes.func,
|
|
39
|
+
onSeeked: PropTypes.func,
|
|
40
|
+
onTimeUpdate: PropTypes.func,
|
|
41
|
+
onProgressStep: PropTypes.func,
|
|
42
|
+
onDurationChange: PropTypes.func,
|
|
43
|
+
onVolumeChange: PropTypes.func,
|
|
44
|
+
onSuspend: PropTypes.func,
|
|
45
|
+
onSuspended: PropTypes.func,
|
|
46
|
+
focusable: PropTypes.bool,
|
|
47
|
+
withPoster: PropTypes.bool,
|
|
48
|
+
withLoading: PropTypes.bool
|
|
59
49
|
};
|
|
60
50
|
var defaultProps = {
|
|
61
51
|
media: null,
|
|
@@ -89,7 +79,6 @@ var defaultProps = {
|
|
|
89
79
|
withLoading: false
|
|
90
80
|
};
|
|
91
81
|
var Video = function Video(_ref) {
|
|
92
|
-
var _ref7;
|
|
93
82
|
var media = _ref.media,
|
|
94
83
|
thumbnail = _ref.thumbnail,
|
|
95
84
|
width = _ref.width,
|
|
@@ -146,7 +135,7 @@ var Video = function Video(_ref) {
|
|
|
146
135
|
id: mediaUrl
|
|
147
136
|
});
|
|
148
137
|
var _useState = React.useState(false),
|
|
149
|
-
_useState2 =
|
|
138
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
150
139
|
showLoading = _useState2[0],
|
|
151
140
|
setShowLoading = _useState2[1];
|
|
152
141
|
var ready = hooks.useMediaReady(_ref9.current, {
|
|
@@ -183,7 +172,7 @@ var Video = function Video(_ref) {
|
|
|
183
172
|
var _ref4 = currentMimeFile || {},
|
|
184
173
|
_ref4$id = _ref4.id,
|
|
185
174
|
currentMimeId = _ref4$id === void 0 ? null : _ref4$id;
|
|
186
|
-
return currentMimeFile === null || currentMimeId !== 'original' ?
|
|
175
|
+
return currentMimeFile === null || currentMimeId !== 'original' ? _objectSpread(_objectSpread({}, filesMap), {}, _defineProperty({}, mime, file)) : filesMap;
|
|
187
176
|
}, {});
|
|
188
177
|
return Object.keys(sourceFilesMap).map(function (mime) {
|
|
189
178
|
return sourceFilesMap[mime];
|
|
@@ -220,7 +209,7 @@ var Video = function Video(_ref) {
|
|
|
220
209
|
|
|
221
210
|
// Manage suspend
|
|
222
211
|
var _useState3 = React.useState(false),
|
|
223
|
-
_useState4 =
|
|
212
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
224
213
|
isSuspended = _useState4[0],
|
|
225
214
|
setIsSuspended = _useState4[1];
|
|
226
215
|
var onPlay = React.useCallback(function (e) {
|
|
@@ -271,21 +260,21 @@ var Video = function Video(_ref) {
|
|
|
271
260
|
disabled: paused,
|
|
272
261
|
onStep: onProgressStep
|
|
273
262
|
});
|
|
274
|
-
return /*#__PURE__*/
|
|
275
|
-
className:
|
|
263
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
264
|
+
className: classNames([styles.container, _defineProperty(_defineProperty({}, className, className !== null), styles.withSize, withSize)]),
|
|
276
265
|
style: withSize ? {
|
|
277
266
|
width: width,
|
|
278
267
|
height: height
|
|
279
268
|
} : null
|
|
280
|
-
}, isImageWithoutSourceFile && shouldLoad ? /*#__PURE__*/
|
|
269
|
+
}, isImageWithoutSourceFile && shouldLoad ? /*#__PURE__*/React.createElement("img", {
|
|
281
270
|
src: mediaUrl,
|
|
282
271
|
alt: description,
|
|
283
272
|
className: styles.video
|
|
284
|
-
}) : null, !isImageWithoutSourceFile ? /*#__PURE__*/
|
|
273
|
+
}) : null, !isImageWithoutSourceFile ? /*#__PURE__*/React.createElement("video", {
|
|
285
274
|
key: mediaUrl,
|
|
286
275
|
ref: function ref(newRef) {
|
|
287
276
|
_ref9.current = newRef;
|
|
288
|
-
if (mediaRef !== null &&
|
|
277
|
+
if (mediaRef !== null && isFunction(mediaRef)) {
|
|
289
278
|
mediaRef(newRef);
|
|
290
279
|
} else if (mediaRef !== null) {
|
|
291
280
|
mediaRef.current = newRef;
|
|
@@ -301,7 +290,7 @@ var Video = function Video(_ref) {
|
|
|
301
290
|
crossOrigin: withoutCors ? 'anonymous' : null,
|
|
302
291
|
disablePictureInPicture: disablePictureInPicture,
|
|
303
292
|
tabIndex: focusable ? '0' : '-1',
|
|
304
|
-
className:
|
|
293
|
+
className: classNames(styles.video),
|
|
305
294
|
onPlay: onPlay,
|
|
306
295
|
onPlaying: onPlaying,
|
|
307
296
|
onPause: onPause,
|
|
@@ -315,19 +304,19 @@ var Video = function Video(_ref) {
|
|
|
315
304
|
}, (sourceFiles || []).map(function (_ref8) {
|
|
316
305
|
var sourceUrl = _ref8.url,
|
|
317
306
|
sourceMime = _ref8.mime;
|
|
318
|
-
return /*#__PURE__*/
|
|
307
|
+
return /*#__PURE__*/React.createElement("source", {
|
|
319
308
|
key: "".concat(sourceUrl, "-").concat(sourceMime),
|
|
320
309
|
src: sourceUrl !== null ? "".concat(sourceUrl, "#t=0.1") : null,
|
|
321
310
|
type: sourceMime
|
|
322
311
|
});
|
|
323
|
-
})) : null, !isImageWithoutSourceFile && !ready && showLoading ? /*#__PURE__*/
|
|
312
|
+
})) : null, !isImageWithoutSourceFile && !ready && showLoading ? /*#__PURE__*/React.createElement(components.Spinner, {
|
|
324
313
|
className: styles.spinner
|
|
325
314
|
}) : null);
|
|
326
315
|
};
|
|
327
316
|
Video.propTypes = propTypes;
|
|
328
317
|
Video.defaultProps = defaultProps;
|
|
329
|
-
var Video$1 = /*#__PURE__*/
|
|
330
|
-
return /*#__PURE__*/
|
|
318
|
+
var Video$1 = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
319
|
+
return /*#__PURE__*/React.createElement(Video, Object.assign({
|
|
331
320
|
mediaRef: ref
|
|
332
321
|
}, props));
|
|
333
322
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/element-video",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.429",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [
|
|
@@ -32,6 +32,12 @@
|
|
|
32
32
|
"license": "ISC",
|
|
33
33
|
"main": "lib/index.js",
|
|
34
34
|
"module": "es/index.js",
|
|
35
|
+
"exports": {
|
|
36
|
+
".": {
|
|
37
|
+
"require": "./lib/index.js",
|
|
38
|
+
"import": "./es/index.js"
|
|
39
|
+
}
|
|
40
|
+
},
|
|
35
41
|
"files": [
|
|
36
42
|
"lib",
|
|
37
43
|
"es",
|
|
@@ -53,8 +59,8 @@
|
|
|
53
59
|
"@fortawesome/fontawesome-svg-core": "^1.2.32",
|
|
54
60
|
"@fortawesome/free-solid-svg-icons": "^5.15.1",
|
|
55
61
|
"@fortawesome/react-fontawesome": "^0.1.13",
|
|
56
|
-
"@micromag/core": "^0.3.
|
|
57
|
-
"@micromag/element-closed-captions": "^0.3.
|
|
62
|
+
"@micromag/core": "^0.3.429",
|
|
63
|
+
"@micromag/element-closed-captions": "^0.3.429",
|
|
58
64
|
"classnames": "^2.2.6",
|
|
59
65
|
"lodash": "^4.17.21",
|
|
60
66
|
"prop-types": "^15.7.2",
|
|
@@ -65,5 +71,5 @@
|
|
|
65
71
|
"access": "public",
|
|
66
72
|
"registry": "https://registry.npmjs.org/"
|
|
67
73
|
},
|
|
68
|
-
"gitHead": "
|
|
74
|
+
"gitHead": "f15e72b88ecfda4c54b87626513149b58572c52b"
|
|
69
75
|
}
|