@micromag/element-video 0.4.49 → 0.4.50

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.
Files changed (2) hide show
  1. package/es/index.js +54 -52
  2. package/package.json +4 -4
package/es/index.js CHANGED
@@ -1,13 +1,15 @@
1
+ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
1
2
  import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
2
3
  import _defineProperty from '@babel/runtime/helpers/defineProperty';
3
4
  import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
4
5
  import classNames from 'classnames';
5
6
  import isFunction from 'lodash/isFunction';
6
- import React, { useMemo, useState, useEffect, useRef, useCallback } from 'react';
7
+ import { useMemo, useState, useEffect, useRef, useCallback } from 'react';
7
8
  import { Spinner } from '@micromag/core/components';
8
9
  import { useMediaThumbnail, useMediaCurrentTime, useMediaDuration, useMediaReady, useProgressSteps } from '@micromag/core/hooks';
9
10
  import { useSetting } from '@micromag/core/contexts';
10
11
  import { getMediaFilesAsArray, getVideoSupportedMimes } from '@micromag/core/utils';
12
+ import { jsx, jsxs } from 'react/jsx-runtime';
11
13
 
12
14
  // Disabled webm for now
13
15
  // const defaultPossibleMimes = ['video/mp4', 'video/webm', 'video/ogg', 'application/vnd.apple.mpegurl'];
@@ -266,65 +268,65 @@ function Video(_ref) {
266
268
  disabled: paused,
267
269
  onStep: onProgressStep
268
270
  });
269
- return /*#__PURE__*/React.createElement("div", {
271
+ return /*#__PURE__*/jsxs("div", {
270
272
  className: classNames([styles.container, _defineProperty({}, styles.withSize, withSize), className]),
271
273
  style: withSize ? {
272
274
  width: width,
273
275
  height: height
274
- } : null
275
- }, isImageWithoutSourceFile && shouldLoad ? /*#__PURE__*/React.createElement("img", {
276
- src: mediaUrl,
277
- alt: description,
278
- tabIndex: "-1",
279
- className: classNames([styles.media, innerClassName])
280
- }) : null, !isImageWithoutSourceFile ? /*#__PURE__*/React.createElement("video", {
281
- key: mediaUrl,
282
- ref: function ref(newRef) {
283
- _ref6.current = newRef;
284
- if (mediaRef !== null && isFunction(mediaRef)) {
285
- mediaRef(newRef);
286
- } else if (mediaRef !== null) {
287
- mediaRef.current = newRef;
288
- }
289
- },
290
- src: sources === null && shouldLoad ? "".concat(mediaUrl, "#t=0.001") : null,
291
- autoPlay: autoPlay && !paused,
292
- loop: loop,
293
- muted: muted,
294
- poster: shouldLoad && withPoster && finalThumbnail !== null ? finalThumbnail.url || null : null,
295
- preload: finalPreload,
296
- playsInline: playsInline,
297
- crossOrigin: withoutCors ? 'anonymous' : null,
298
- disablePictureInPicture: disablePictureInPicture,
299
- tabIndex: focusable ? '0' : '-1',
300
- className: classNames([styles.media, innerClassName]),
301
- onPlay: onPlay,
302
- onPlaying: onPlaying,
303
- onPause: onPause,
304
- onEnded: onEnded,
305
- onSeeked: onSeeked,
306
- onVolumeChange: onVolumeChange,
307
- onTimeUpdate: onTimeUpdate,
308
- onSuspend: onSuspend,
309
- "data-has-audio": hasAudio,
310
- "data-is-suspended": isSuspended,
311
- "aria-hidden": true
312
- }, (shouldLoad && sources !== null ? sources : []).map(function (_ref5) {
313
- var sourceUrl = _ref5.url,
314
- sourceMime = _ref5.mime;
315
- return /*#__PURE__*/React.createElement("source", {
316
- key: "source-".concat(sourceUrl, "-").concat(sourceMime),
317
- src: sourceUrl !== null ? "".concat(sourceUrl, "#t=0.001") : null,
318
- type: sourceMime
319
- });
320
- })) : null, !isImageWithoutSourceFile && !ready && showLoading ? /*#__PURE__*/React.createElement(Spinner, {
321
- className: styles.spinner
322
- }) : null);
276
+ } : null,
277
+ children: [isImageWithoutSourceFile && shouldLoad ? /*#__PURE__*/jsx("img", {
278
+ src: mediaUrl,
279
+ alt: description,
280
+ tabIndex: "-1",
281
+ className: classNames([styles.media, innerClassName])
282
+ }) : null, !isImageWithoutSourceFile ? /*#__PURE__*/jsx("video", {
283
+ ref: function ref(newRef) {
284
+ _ref6.current = newRef;
285
+ if (mediaRef !== null && isFunction(mediaRef)) {
286
+ mediaRef(newRef);
287
+ } else if (mediaRef !== null) {
288
+ mediaRef.current = newRef;
289
+ }
290
+ },
291
+ src: sources === null && shouldLoad ? "".concat(mediaUrl, "#t=0.001") : null,
292
+ autoPlay: autoPlay && !paused,
293
+ loop: loop,
294
+ muted: muted,
295
+ poster: shouldLoad && withPoster && finalThumbnail !== null ? finalThumbnail.url || null : null,
296
+ preload: finalPreload,
297
+ playsInline: playsInline,
298
+ crossOrigin: withoutCors ? 'anonymous' : null,
299
+ disablePictureInPicture: disablePictureInPicture,
300
+ tabIndex: focusable ? '0' : '-1',
301
+ className: classNames([styles.media, innerClassName]),
302
+ onPlay: onPlay,
303
+ onPlaying: onPlaying,
304
+ onPause: onPause,
305
+ onEnded: onEnded,
306
+ onSeeked: onSeeked,
307
+ onVolumeChange: onVolumeChange,
308
+ onTimeUpdate: onTimeUpdate,
309
+ onSuspend: onSuspend,
310
+ "data-has-audio": hasAudio,
311
+ "data-is-suspended": isSuspended,
312
+ "aria-hidden": true,
313
+ children: (shouldLoad && sources !== null ? sources : []).map(function (_ref5) {
314
+ var sourceUrl = _ref5.url,
315
+ sourceMime = _ref5.mime;
316
+ return /*#__PURE__*/jsx("source", {
317
+ src: sourceUrl !== null ? "".concat(sourceUrl, "#t=0.001") : null,
318
+ type: sourceMime
319
+ }, "source-".concat(sourceUrl, "-").concat(sourceMime));
320
+ })
321
+ }, mediaUrl) : null, !isImageWithoutSourceFile && !ready && showLoading ? /*#__PURE__*/jsx(Spinner, {
322
+ className: styles.spinner
323
+ }) : null]
324
+ });
323
325
  }
324
326
  var Video_default = (function (_ref7) {
325
327
  var ref = _ref7.ref,
326
328
  props = _objectWithoutProperties(_ref7, _excluded);
327
- return /*#__PURE__*/React.createElement(Video, Object.assign({
329
+ return /*#__PURE__*/jsx(Video, _objectSpread({
328
330
  mediaRef: ref
329
331
  }, props));
330
332
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/element-video",
3
- "version": "0.4.49",
3
+ "version": "0.4.50",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -60,8 +60,8 @@
60
60
  },
61
61
  "dependencies": {
62
62
  "@babel/runtime": "^7.28.6",
63
- "@micromag/core": "^0.4.49",
64
- "@micromag/element-closed-captions": "^0.4.49",
63
+ "@micromag/core": "^0.4.50",
64
+ "@micromag/element-closed-captions": "^0.4.50",
65
65
  "classnames": "^2.2.6",
66
66
  "hls.js": "^1.5.15",
67
67
  "lodash": "^4.17.23",
@@ -72,6 +72,6 @@
72
72
  "access": "public",
73
73
  "registry": "https://registry.npmjs.org/"
74
74
  },
75
- "gitHead": "0a225ff29387217cccb0fcc5a731e23c74bd202e",
75
+ "gitHead": "940d5ca98f8f448b79eaa3e2fa685c3ee95185b8",
76
76
  "types": "es/index.d.ts"
77
77
  }