@uncinc/uncinc-react-kitchen-sink 2.16.15 → 2.17.0

package/dist/components/MediaPlayer/index.d.ts

@@ -1,8 +1,4 @@
 import React from 'react';
-import 'videojs-vimeo-tech';
-import 'videojs-youtube';
 import { MediaPlayerProps } from './types';
-import 'video.js/dist/video-js.css';
-import './style.scss';
 declare const MediaPlayer: React.FC<MediaPlayerProps>;
 export default MediaPlayer;

package/dist/components/MediaPlayer/index.js

@@ -1,153 +1,8 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-import React, { useEffect, useMemo } from 'react';
-import c from 'classnames';
-import { useVideoJS } from 'react-hook-videojs';
-import { useTranslation } from 'react-i18next';
-// VideoJS plugins:
-import 'videojs-vimeo-tech';
-import 'videojs-youtube';
-import 'video.js/dist/video-js.css';
-import './style.scss';
-var MediaPlayer = function MediaPlayer(_ref) {
-  var src = _ref.src,
-    type = _ref.type,
-    controls = _ref.controls,
-    posterUrl = _ref.posterUrl,
-    customOptions = _ref.options,
-    captions = _ref.captions,
-    audioOnly = _ref.audioOnly,
-    notSupportedMessage = _ref.notSupportedMessage,
-    className = _ref.className,
-    onPlay = _ref.onPlay,
-    _ref$autoPlay = _ref.autoPlay,
-    autoPlay = _ref$autoPlay === void 0 ? false : _ref$autoPlay,
-    onPause = _ref.onPause,
-    onEnded = _ref.onEnded,
-    onSeeking = _ref.onSeeking,
-    onVolumeChange = _ref.onVolumeChange,
-    onFullscreenChange = _ref.onFullscreenChange,
-    onError = _ref.onError;
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var classNames = c('MediaPlayer', 'video-js', 'vjs-default-skin', 'vjs-big-play-centered', className);
-  var audioOnlyMode = useMemo(function () {
-    return audioOnly || type.startsWith('audio');
-  }, [type, audioOnly]);
-  var controlBar = useMemo(function () {
-    var videoJSControls = {
-      play: 'playToggle',
-      currentTime: 'currentTimeDisplay',
-      timeDivider: 'timeDivider',
-      duration: 'durationDisplay',
-      seekbar: 'progressControl',
-      captions: 'subsCapsButton',
-      volume: 'volumePanel',
-      fullscreen: 'fullscreenToggle'
-    };
-    var controlMapped = function controlMapped(control) {
-      return {
-        name: videoJSControls[control],
-        className: "MediaPlayer__control MediaPlayer__control--".concat(control)
-      };
-    };
-    if (controls === false || _typeof(controls) === 'object' && controls.length === 0) {
-      return false;
-    }
-    if (_typeof(controls) === 'object' && controls.length > 0) {
-      return {
-        children: controls.map(controlMapped)
-      };
-    }
-    var controlKeys = Object.keys(videoJSControls);
-    return {
-      children: controlKeys.map(controlMapped)
-    };
-  }, [controls]);
-
-  // Can be overridden by the custom options prop.
-  var defaultOptions = {
-    controls: true,
-    aspectRatio: '16:9',
-    audioOnlyMode: audioOnlyMode,
-    fluid: true,
-    notSupportedMessage: notSupportedMessage || t('organisms.media_player.not_supported_message'),
-    techOrder: ['html5', 'youtube', 'vimeo'],
-    poster: posterUrl,
-    controlBar: controlBar,
-    autoplay: autoPlay,
-    sources: [{
-      src: src,
-      type: type
-    }]
-  };
-  var options = _objectSpread(_objectSpread({}, defaultOptions), customOptions);
-  var videoJS = useVideoJS(options);
-  var _ref2 = videoJS,
-    Video = _ref2.Video,
-    player = _ref2.player,
-    ready = _ref2.ready;
-
-  // Passing down the VideoJS events.
-  useEffect(function () {
-    if (ready) {
-      if (autoPlay && onPlay) {
-        player.one('play', function (event) {
-          return onPlay(player, event);
-        });
-      } else if (!autoPlay && onPlay) {
-        player.on('play', function (event) {
-          return onPlay(player, event);
-        });
-      }
-      if (onPause) {
-        player.one('pause', function (event) {
-          return onPause(player, event);
-        });
-      }
-      if (onEnded) {
-        player.one('ended', function (event) {
-          return onEnded(player, event);
-        });
-      }
-      if (onSeeking) {
-        player.one('seeking', function (event) {
-          return onSeeking(player, event);
-        });
-      }
-      if (onVolumeChange) {
-        player.one('volumechange', function (event) {
-          return onVolumeChange(player, event);
-        });
-      }
-      if (onFullscreenChange) {
-        player.one('fullscreenchange', function (event) {
-          return onFullscreenChange(player, event);
-        });
-      }
-      if (onError) {
-        player.one('error', function (event) {
-          return onError(player, event);
-        });
-      }
-    }
-    // eslint-disable-next-line max-len
-  }, [onEnded, onError, onFullscreenChange, onPause, onPlay, onSeeking, onVolumeChange, player, ready]);
-  return /*#__PURE__*/React.createElement(Video, {
-    className: classNames
-  }, !audioOnlyMode && captions && captions.map(function (caption) {
-    return /*#__PURE__*/React.createElement("track", {
-      key: "caption:".concat(caption.language),
-      kind: "captions",
-      src: caption.src,
-      srcLang: caption.language,
-      label: caption.label || caption.language,
-      default: caption.default
-    });
-  }));
+import React, { lazy, Suspense } from 'react';
+var MediaPlayerLazy = /*#__PURE__*/lazy(function () {
+  return import('./index.lazy');
+});
+var MediaPlayer = function MediaPlayer(props) {
+  return /*#__PURE__*/React.createElement(Suspense, null, /*#__PURE__*/React.createElement(MediaPlayerLazy, props));
 };
 export default MediaPlayer;

package/dist/components/MediaPlayer/index.lazy.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import 'videojs-vimeo-tech';
+import 'videojs-youtube';
+import { MediaPlayerProps } from './types';
+import 'video.js/dist/video-js.css';
+import './style.scss';
+declare const MediaPlayer: React.FC<MediaPlayerProps>;
+export default MediaPlayer;

package/dist/components/MediaPlayer/index.lazy.js

@@ -0,0 +1,153 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+import React, { useEffect, useMemo } from 'react';
+import c from 'classnames';
+import { useVideoJS } from 'react-hook-videojs';
+import { useTranslation } from 'react-i18next';
+// VideoJS plugins:
+import 'videojs-vimeo-tech';
+import 'videojs-youtube';
+import 'video.js/dist/video-js.css';
+import './style.scss';
+var MediaPlayer = function MediaPlayer(_ref) {
+  var src = _ref.src,
+    type = _ref.type,
+    controls = _ref.controls,
+    posterUrl = _ref.posterUrl,
+    customOptions = _ref.options,
+    captions = _ref.captions,
+    audioOnly = _ref.audioOnly,
+    notSupportedMessage = _ref.notSupportedMessage,
+    className = _ref.className,
+    onPlay = _ref.onPlay,
+    _ref$autoPlay = _ref.autoPlay,
+    autoPlay = _ref$autoPlay === void 0 ? false : _ref$autoPlay,
+    onPause = _ref.onPause,
+    onEnded = _ref.onEnded,
+    onSeeking = _ref.onSeeking,
+    onVolumeChange = _ref.onVolumeChange,
+    onFullscreenChange = _ref.onFullscreenChange,
+    onError = _ref.onError;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var classNames = c('MediaPlayer', 'video-js', 'vjs-default-skin', 'vjs-big-play-centered', className);
+  var audioOnlyMode = useMemo(function () {
+    return audioOnly || type.startsWith('audio');
+  }, [type, audioOnly]);
+  var controlBar = useMemo(function () {
+    var videoJSControls = {
+      play: 'playToggle',
+      currentTime: 'currentTimeDisplay',
+      timeDivider: 'timeDivider',
+      duration: 'durationDisplay',
+      seekbar: 'progressControl',
+      captions: 'subsCapsButton',
+      volume: 'volumePanel',
+      fullscreen: 'fullscreenToggle'
+    };
+    var controlMapped = function controlMapped(control) {
+      return {
+        name: videoJSControls[control],
+        className: "MediaPlayer__control MediaPlayer__control--".concat(control)
+      };
+    };
+    if (controls === false || _typeof(controls) === 'object' && controls.length === 0) {
+      return false;
+    }
+    if (_typeof(controls) === 'object' && controls.length > 0) {
+      return {
+        children: controls.map(controlMapped)
+      };
+    }
+    var controlKeys = Object.keys(videoJSControls);
+    return {
+      children: controlKeys.map(controlMapped)
+    };
+  }, [controls]);
+
+  // Can be overridden by the custom options prop.
+  var defaultOptions = {
+    controls: true,
+    aspectRatio: '16:9',
+    audioOnlyMode: audioOnlyMode,
+    fluid: true,
+    notSupportedMessage: notSupportedMessage || t('organisms.media_player.not_supported_message'),
+    techOrder: ['html5', 'youtube', 'vimeo'],
+    poster: posterUrl,
+    controlBar: controlBar,
+    autoplay: autoPlay,
+    sources: [{
+      src: src,
+      type: type
+    }]
+  };
+  var options = _objectSpread(_objectSpread({}, defaultOptions), customOptions);
+  var videoJS = useVideoJS(options);
+  var _ref2 = videoJS,
+    Video = _ref2.Video,
+    player = _ref2.player,
+    ready = _ref2.ready;
+
+  // Passing down the VideoJS events.
+  useEffect(function () {
+    if (ready) {
+      if (autoPlay && onPlay) {
+        player.one('play', function (event) {
+          return onPlay(player, event);
+        });
+      } else if (!autoPlay && onPlay) {
+        player.on('play', function (event) {
+          return onPlay(player, event);
+        });
+      }
+      if (onPause) {
+        player.one('pause', function (event) {
+          return onPause(player, event);
+        });
+      }
+      if (onEnded) {
+        player.one('ended', function (event) {
+          return onEnded(player, event);
+        });
+      }
+      if (onSeeking) {
+        player.one('seeking', function (event) {
+          return onSeeking(player, event);
+        });
+      }
+      if (onVolumeChange) {
+        player.one('volumechange', function (event) {
+          return onVolumeChange(player, event);
+        });
+      }
+      if (onFullscreenChange) {
+        player.one('fullscreenchange', function (event) {
+          return onFullscreenChange(player, event);
+        });
+      }
+      if (onError) {
+        player.one('error', function (event) {
+          return onError(player, event);
+        });
+      }
+    }
+    // eslint-disable-next-line max-len
+  }, [onEnded, onError, onFullscreenChange, onPause, onPlay, onSeeking, onVolumeChange, player, ready]);
+  return /*#__PURE__*/React.createElement(Video, {
+    className: classNames
+  }, !audioOnlyMode && captions && captions.map(function (caption) {
+    return /*#__PURE__*/React.createElement("track", {
+      key: "caption:".concat(caption.language),
+      kind: "captions",
+      src: caption.src,
+      srcLang: caption.language,
+      label: caption.label || caption.language,
+      default: caption.default
+    });
+  }));
+};
+export default MediaPlayer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uncinc/uncinc-react-kitchen-sink",
-  "version": "2.16.15",
+  "version": "2.17.0",
   "description": "Default React components that are easily extended.",
   "author": "uncinc",
   "license": "MIT",