sanity-plugin-mux-input 1.1.0

package/build/components/Video.js

@@ -0,0 +1,360 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _ui = require("@sanity/ui");
+
+var _hls = _interopRequireDefault(require("hls.js"));
+
+require("media-chrome");
+
+var _default2 = _interopRequireDefault(require("part:@sanity/components/buttons/default"));
+
+var _bar = _interopRequireDefault(require("part:@sanity/components/progress/bar"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _assets = require("../actions/assets");
+
+var _secrets = require("../actions/secrets");
+
+var _getPosterSrc = _interopRequireDefault(require("../util/getPosterSrc"));
+
+var _getStoryboardSrc = _interopRequireDefault(require("../util/getStoryboardSrc"));
+
+var _getVideoSrc = _interopRequireDefault(require("../util/getVideoSrc"));
+
+var _Video = _interopRequireDefault(require("./Video.css"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var NOOP = () => {
+  /* intentional noop */
+};
+
+var propTypes = {
+  // eslint-disable-next-line react/forbid-prop-types
+  assetDocument: _propTypes.default.object.isRequired,
+  autoload: _propTypes.default.bool,
+  onCancel: _propTypes.default.func,
+  onReady: _propTypes.default.func
+};
+
+class MuxVideo extends _react.Component {
+  constructor(props) {
+    super(props);
+
+    _defineProperty(this, "videoContainer", /*#__PURE__*/_react.default.createRef());
+
+    _defineProperty(this, "hls", null);
+
+    _defineProperty(this, "handleVideoClick", event => {
+      this.setState({
+        showControls: true
+      });
+      this.hls.startLoad(0);
+
+      if (this.props.onReady) {
+        this.props.onReady(event);
+      }
+    });
+
+    _defineProperty(this, "handleCancelButtonClicked", event => {
+      if (this.props.onCancel) {
+        this.props.onCancel(event);
+      }
+    });
+
+    this.state = {
+      storyboardUrl: null,
+      posterUrl: null,
+      source: null,
+      isLoading: true,
+      error: null,
+      isDeletedOnMux: false,
+      isPreparingStaticRenditions: false,
+      secrets: null
+    };
+    this.playRef = /*#__PURE__*/_react.default.createRef();
+    this.muteRef = /*#__PURE__*/_react.default.createRef();
+  } // eslint-disable-next-line complexity
+
+
+  static getDerivedStateFromProps(nextProps) {
+    var _assetDocument$data, _assetDocument$data$s, _assetDocument$data2, _assetDocument$data2$;
+
+    var isLoading = true;
+    var isPreparingStaticRenditions = false;
+    var assetDocument = nextProps.assetDocument;
+
+    if (assetDocument && assetDocument.status === 'preparing') {
+      isLoading = 'Preparing the video';
+    }
+
+    if (assetDocument && assetDocument.status === 'waiting_for_upload') {
+      isLoading = 'Waiting for upload to start';
+    }
+
+    if (assetDocument && assetDocument.status === 'waiting') {
+      isLoading = 'Processing upload';
+    }
+
+    if (assetDocument && assetDocument.status === 'ready') {
+      isLoading = false;
+    }
+
+    if (assetDocument && typeof assetDocument.status === 'undefined') {
+      isLoading = false;
+    }
+
+    if ((assetDocument === null || assetDocument === void 0 ? void 0 : (_assetDocument$data = assetDocument.data) === null || _assetDocument$data === void 0 ? void 0 : (_assetDocument$data$s = _assetDocument$data.static_renditions) === null || _assetDocument$data$s === void 0 ? void 0 : _assetDocument$data$s.status) === 'preparing') {
+      isPreparingStaticRenditions = true;
+    }
+
+    if ((assetDocument === null || assetDocument === void 0 ? void 0 : (_assetDocument$data2 = assetDocument.data) === null || _assetDocument$data2 === void 0 ? void 0 : (_assetDocument$data2$ = _assetDocument$data2.static_renditions) === null || _assetDocument$data2$ === void 0 ? void 0 : _assetDocument$data2$.status) === 'ready') {
+      isPreparingStaticRenditions = false;
+    }
+
+    return {
+      isLoading,
+      isPreparingStaticRenditions
+    };
+  }
+
+  componentDidMount() {
+    var _this$playRef, _this$playRef$current, _this$muteRef, _this$muteRef$current;
+
+    this.video = /*#__PURE__*/_react.default.createRef();
+    var style = document.createElement('style');
+    style.innerHTML = 'button svg { vertical-align: middle; }';
+
+    if ((_this$playRef = this.playRef) !== null && _this$playRef !== void 0 && (_this$playRef$current = _this$playRef.current) !== null && _this$playRef$current !== void 0 && _this$playRef$current.shadowRoot) {
+      this.playRef.current.shadowRoot.appendChild(style);
+    }
+
+    if ((_this$muteRef = this.muteRef) !== null && _this$muteRef !== void 0 && (_this$muteRef$current = _this$muteRef.current) !== null && _this$muteRef$current !== void 0 && _this$muteRef$current.shadowRoot) {
+      this.muteRef.current.shadowRoot.appendChild(style.cloneNode(true));
+    }
+
+    this.setState(MuxVideo.getDerivedStateFromProps(this.props));
+    (0, _secrets.fetchSecrets)().then(_ref => {
+      var secrets = _ref.secrets;
+      return this.setState({
+        secrets
+      });
+    });
+  }
+
+  componentDidUpdate(prevProps, prevState) {
+    var previousVideo = prevProps.assetDocument.playbackId;
+    var newVideo = this.props.assetDocument.playbackId;
+
+    if (!this.state.isLoading && this.state.secrets && (this.state.source === null || previousVideo !== newVideo)) {
+      this.resolveSourceAndPoster(this.props.assetDocument);
+    }
+
+    if (this.state.source !== null && this.video.current && !this.video.current.src) {
+      // eslint-disable-next-line react/no-did-update-set-state
+      this.setState({
+        error: null
+      });
+      this.attachVideo();
+    }
+
+    if (this.state.source !== null && this.state.source !== prevState.source) {
+      // eslint-disable-next-line react/no-did-update-set-state
+      this.setState({
+        error: null,
+        showControls: false
+      });
+
+      if (this.hls) {
+        this.hls.destroy();
+      }
+
+      this.attachVideo();
+    }
+  }
+
+  resolveSourceAndPoster(assetDocument) {
+    var playbackId = assetDocument.playbackId;
+    var options = {
+      isSigned: assetDocument.data.playback_ids[0].policy === 'signed',
+      signingKeyId: this.state.secrets.signingKeyId || null,
+      signingKeyPrivate: this.state.secrets.signingKeyPrivate || null
+    };
+    var source = (0, _getVideoSrc.default)(playbackId, options);
+    var posterUrl = (0, _getPosterSrc.default)(playbackId, options);
+    var storyboardUrl = (0, _getStoryboardSrc.default)(playbackId, options);
+    this.setState({
+      source,
+      posterUrl,
+      storyboardUrl
+    });
+  }
+
+  getVideoElement() {
+    return this.video && this.video.current;
+  }
+
+  attachVideo() {
+    var _this$props = this.props,
+        assetDocument = _this$props.assetDocument,
+        autoload = _this$props.autoload;
+
+    if (_hls.default.isSupported()) {
+      this.hls = new _hls.default({
+        autoStartLoad: autoload
+      });
+      this.hls.loadSource(this.state.source);
+      this.hls.attachMedia(this.video.current);
+      this.hls.on(_hls.default.Events.MANIFEST_PARSED, e => {
+        if (this.videoContainer.current) {
+          this.videoContainer.current.style.display = 'block';
+        }
+
+        if (this.props.onReady) {
+          this.props.onReady();
+        }
+      });
+      this.hls.on(_hls.default.Events.ERROR, (event, data) => {
+        switch (data.type) {
+          case _hls.default.ErrorTypes.NETWORK_ERROR:
+            if (this.videoContainer.current) {
+              this.videoContainer.current.style.display = 'none';
+            }
+
+            this.setState({
+              error: data
+            });
+            (0, _assets.getAsset)(assetDocument.assetId).then(response => {
+              this.setState({
+                isDeletedOnMux: false
+              });
+            }).catch(err => {
+              if (err.message.match(/404/)) {
+                this.setState({
+                  isDeletedOnMux: true
+                });
+                return;
+              }
+
+              console.error(data, err); // eslint-disable-line no-console
+            });
+            break;
+
+          default:
+            console.error(data);
+          // eslint-disable-line no-console
+        }
+      });
+    } else if (this.video.current.canPlayType('application/vnd.apple.mpegurl')) {
+      this.video.current.src = this.state.source;
+      this.video.current.addEventListener('loadedmetadata', () => {
+        this.hls.loadSource(this.state.source);
+        this.hls.attachMedia(this.video.current);
+      });
+    }
+  }
+
+  // eslint-disable-next-line complexity
+  render() {
+    var _this$state = this.state,
+        posterUrl = _this$state.posterUrl,
+        isLoading = _this$state.isLoading,
+        error = _this$state.error;
+    var _this$props2 = this.props,
+        assetDocument = _this$props2.assetDocument,
+        autoload = _this$props2.autoload;
+
+    if (!assetDocument || !assetDocument.status) {
+      return null;
+    }
+
+    if (isLoading) {
+      return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
+        className: _Video.default.progressBar
+      }, /*#__PURE__*/_react.default.createElement(_bar.default, {
+        percent: 100,
+        text: isLoading !== true && isLoading || 'Waiting for Mux to complete the file',
+        isInProgress: true,
+        showPercent: true,
+        animation: true,
+        color: "primary"
+      })), /*#__PURE__*/_react.default.createElement("div", {
+        className: _Video.default.uploadCancelButton
+      }, /*#__PURE__*/_react.default.createElement(_default2.default, {
+        onClick: this.handleCancelButtonClicked
+      }, "Cancel")));
+    }
+
+    var showControls = autoload || this.state.showControls;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      ref: this.videoContainer,
+      className: _Video.default.videoContainer
+    }, /*#__PURE__*/_react.default.createElement("media-controller", null, /*#__PURE__*/_react.default.createElement("video", {
+      onClick: autoload ? NOOP : this.handleVideoClick,
+      ref: this.video,
+      poster: posterUrl,
+      slot: "media",
+      crossOrigin: "anonomous"
+    }, this.state.storyboardUrl && /*#__PURE__*/_react.default.createElement("track", {
+      label: "thumbnails",
+      default: true,
+      kind: "metadata",
+      src: this.state.storyboardUrl
+    })), showControls && /*#__PURE__*/_react.default.createElement("media-control-bar", null, /*#__PURE__*/_react.default.createElement("media-play-button", {
+      ref: this.playRef
+    }), /*#__PURE__*/_react.default.createElement("media-mute-button", {
+      ref: this.muteRef
+    }), /*#__PURE__*/_react.default.createElement("media-progress-range", null))), error && /*#__PURE__*/_react.default.createElement(_ui.Card, {
+      padding: 3,
+      radius: 2,
+      shadow: 1,
+      tone: "critical",
+      marginTop: 2
+    }, /*#__PURE__*/_react.default.createElement(_ui.Stack, {
+      space: 2
+    }, /*#__PURE__*/_react.default.createElement(_ui.Text, {
+      size: 1
+    }, "There was an error loading this video (", error.type, ")."), this.state.isDeletedOnMux && /*#__PURE__*/_react.default.createElement(_ui.Text, {
+      size: 1
+    }, "The video is deleted on Mux"))), this.state.isPreparingStaticRenditions && /*#__PURE__*/_react.default.createElement(_ui.Card, {
+      padding: 2,
+      radius: 1,
+      style: {
+        background: 'var(--card-fg-color)',
+        position: 'absolute',
+        top: '0.5em',
+        left: '0.5em'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_ui.Text, {
+      size: 1,
+      style: {
+        color: 'var(--card-bg-color)'
+      }
+    }, "MUX is preparing static renditions, please stand by")));
+  }
+
+}
+
+MuxVideo.propTypes = propTypes;
+MuxVideo.defaultProps = {
+  autoload: true,
+  onCancel: undefined,
+  onReady: undefined
+};
+var _default = MuxVideo;
+exports.default = _default;
+//# sourceMappingURL=Video.js.map

package/build/components/Video.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Video.js"],"names":["NOOP","propTypes","assetDocument","PropTypes","object","isRequired","autoload","bool","onCancel","func","onReady","MuxVideo","Component","constructor","props","React","createRef","event","setState","showControls","hls","startLoad","state","storyboardUrl","posterUrl","source","isLoading","error","isDeletedOnMux","isPreparingStaticRenditions","secrets","playRef","muteRef","getDerivedStateFromProps","nextProps","status","data","static_renditions","componentDidMount","video","style","document","createElement","innerHTML","current","shadowRoot","appendChild","cloneNode","then","componentDidUpdate","prevProps","prevState","previousVideo","playbackId","newVideo","resolveSourceAndPoster","src","attachVideo","destroy","options","isSigned","playback_ids","policy","signingKeyId","signingKeyPrivate","getVideoElement","Hls","isSupported","autoStartLoad","loadSource","attachMedia","on","Events","MANIFEST_PARSED","e","videoContainer","display","ERROR","type","ErrorTypes","NETWORK_ERROR","assetId","response","catch","err","message","match","console","canPlayType","addEventListener","render","styles","progressBar","uploadCancelButton","handleCancelButtonClicked","handleVideoClick","background","position","top","left","color","defaultProps","undefined"],"mappings":"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","sourcesContent":["import {Box, Card, Stack, Text} from '@sanity/ui'\r\nimport Hls from 'hls.js'\r\nimport 'media-chrome'\r\nimport Button from 'part:@sanity/components/buttons/default'\r\nimport ProgressBar from 'part:@sanity/components/progress/bar'\r\nimport PropTypes from 'prop-types'\r\nimport React, {Component} from 'react'\r\nimport {getAsset} from '../actions/assets'\r\nimport {fetchSecrets} from '../actions/secrets'\r\nimport getPosterSrc from '../util/getPosterSrc'\r\nimport getStoryboardSrc from '../util/getStoryboardSrc'\r\nimport getVideoSrc from '../util/getVideoSrc'\r\nimport styles from './Video.css'\r\n\r\nconst NOOP = () => {\r\n  /* intentional noop */\r\n}\r\n\r\nconst propTypes = {\r\n  // eslint-disable-next-line react/forbid-prop-types\r\n  assetDocument: PropTypes.object.isRequired,\r\n  autoload: PropTypes.bool,\r\n  onCancel: PropTypes.func,\r\n  onReady: PropTypes.func,\r\n}\r\n\r\nclass MuxVideo extends Component {\r\n  videoContainer = React.createRef()\r\n  hls = null\r\n\r\n  constructor(props) {\r\n    super(props)\r\n    this.state = {\r\n      storyboardUrl: null,\r\n      posterUrl: null,\r\n      source: null,\r\n      isLoading: true,\r\n      error: null,\r\n      isDeletedOnMux: false,\r\n      isPreparingStaticRenditions: false,\r\n      secrets: null,\r\n    }\r\n    this.playRef = React.createRef()\r\n    this.muteRef = React.createRef()\r\n  }\r\n\r\n  // eslint-disable-next-line complexity\r\n  static getDerivedStateFromProps(nextProps) {\r\n    let isLoading = true\r\n    let isPreparingStaticRenditions = false\r\n    const {assetDocument} = nextProps\r\n\r\n    if (assetDocument && assetDocument.status === 'preparing') {\r\n      isLoading = 'Preparing the video'\r\n    }\r\n    if (assetDocument && assetDocument.status === 'waiting_for_upload') {\r\n      isLoading = 'Waiting for upload to start'\r\n    }\r\n    if (assetDocument && assetDocument.status === 'waiting') {\r\n      isLoading = 'Processing upload'\r\n    }\r\n    if (assetDocument && assetDocument.status === 'ready') {\r\n      isLoading = false\r\n    }\r\n    if (assetDocument && typeof assetDocument.status === 'undefined') {\r\n      isLoading = false\r\n    }\r\n    if (assetDocument?.data?.static_renditions?.status === 'preparing') {\r\n      isPreparingStaticRenditions = true\r\n    }\r\n    if (assetDocument?.data?.static_renditions?.status === 'ready') {\r\n      isPreparingStaticRenditions = false\r\n    }\r\n    return {\r\n      isLoading,\r\n      isPreparingStaticRenditions,\r\n    }\r\n  }\r\n\r\n  componentDidMount() {\r\n    this.video = React.createRef()\r\n\r\n    const style = document.createElement('style')\r\n    style.innerHTML = 'button svg { vertical-align: middle; }'\r\n\r\n    if (this.playRef?.current?.shadowRoot) {\r\n      this.playRef.current.shadowRoot.appendChild(style)\r\n    }\r\n    if (this.muteRef?.current?.shadowRoot) {\r\n      this.muteRef.current.shadowRoot.appendChild(style.cloneNode(true))\r\n    }\r\n\r\n    this.setState(MuxVideo.getDerivedStateFromProps(this.props))\r\n    fetchSecrets().then(({secrets}) => this.setState({secrets}))\r\n  }\r\n\r\n  componentDidUpdate(prevProps, prevState) {\r\n    const previousVideo = prevProps.assetDocument.playbackId\r\n    const newVideo = this.props.assetDocument.playbackId\r\n\r\n    if (\r\n      !this.state.isLoading &&\r\n      this.state.secrets &&\r\n      (this.state.source === null || previousVideo !== newVideo)\r\n    ) {\r\n      this.resolveSourceAndPoster(this.props.assetDocument)\r\n    }\r\n\r\n    if (this.state.source !== null && this.video.current && !this.video.current.src) {\r\n      // eslint-disable-next-line react/no-did-update-set-state\r\n      this.setState({error: null})\r\n      this.attachVideo()\r\n    }\r\n\r\n    if (this.state.source !== null && this.state.source !== prevState.source) {\r\n      // eslint-disable-next-line react/no-did-update-set-state\r\n      this.setState({error: null, showControls: false})\r\n      if (this.hls) {\r\n        this.hls.destroy()\r\n      }\r\n      this.attachVideo()\r\n    }\r\n  }\r\n\r\n  resolveSourceAndPoster(assetDocument) {\r\n    const playbackId = assetDocument.playbackId\r\n    const options = {\r\n      isSigned: assetDocument.data.playback_ids[0].policy === 'signed',\r\n      signingKeyId: this.state.secrets.signingKeyId || null,\r\n      signingKeyPrivate: this.state.secrets.signingKeyPrivate || null,\r\n    }\r\n\r\n    const source = getVideoSrc(playbackId, options)\r\n    const posterUrl = getPosterSrc(playbackId, options)\r\n    const storyboardUrl = getStoryboardSrc(playbackId, options)\r\n    this.setState({source, posterUrl, storyboardUrl})\r\n  }\r\n\r\n  getVideoElement() {\r\n    return this.video && this.video.current\r\n  }\r\n\r\n  attachVideo() {\r\n    const {assetDocument, autoload} = this.props\r\n\r\n    if (Hls.isSupported()) {\r\n      this.hls = new Hls({autoStartLoad: autoload})\r\n      this.hls.loadSource(this.state.source)\r\n      this.hls.attachMedia(this.video.current)\r\n      this.hls.on(Hls.Events.MANIFEST_PARSED, (e) => {\r\n        if (this.videoContainer.current) {\r\n          this.videoContainer.current.style.display = 'block'\r\n        }\r\n        if (this.props.onReady) {\r\n          this.props.onReady()\r\n        }\r\n      })\r\n      this.hls.on(Hls.Events.ERROR, (event, data) => {\r\n        switch (data.type) {\r\n          case Hls.ErrorTypes.NETWORK_ERROR:\r\n            if (this.videoContainer.current) {\r\n              this.videoContainer.current.style.display = 'none'\r\n            }\r\n            this.setState({error: data})\r\n            getAsset(assetDocument.assetId)\r\n              .then((response) => {\r\n                this.setState({isDeletedOnMux: false})\r\n              })\r\n              .catch((err) => {\r\n                if (err.message.match(/404/)) {\r\n                  this.setState({isDeletedOnMux: true})\r\n                  return\r\n                }\r\n                console.error(data, err) // eslint-disable-line no-console\r\n              })\r\n            break\r\n          default:\r\n            console.error(data) // eslint-disable-line no-console\r\n        }\r\n      })\r\n    } else if (this.video.current.canPlayType('application/vnd.apple.mpegurl')) {\r\n      this.video.current.src = this.state.source\r\n      this.video.current.addEventListener('loadedmetadata', () => {\r\n        this.hls.loadSource(this.state.source)\r\n        this.hls.attachMedia(this.video.current)\r\n      })\r\n    }\r\n  }\r\n\r\n  handleVideoClick = (event) => {\r\n    this.setState({showControls: true})\r\n    this.hls.startLoad(0)\r\n    if (this.props.onReady) {\r\n      this.props.onReady(event)\r\n    }\r\n  }\r\n\r\n  handleCancelButtonClicked = (event) => {\r\n    if (this.props.onCancel) {\r\n      this.props.onCancel(event)\r\n    }\r\n  }\r\n\r\n  // eslint-disable-next-line complexity\r\n  render() {\r\n    const {posterUrl, isLoading, error} = this.state\r\n    const {assetDocument, autoload} = this.props\r\n    if (!assetDocument || !assetDocument.status) {\r\n      return null\r\n    }\r\n\r\n    if (isLoading) {\r\n      return (\r\n        <div>\r\n          <div className={styles.progressBar}>\r\n            <ProgressBar\r\n              percent={100}\r\n              text={(isLoading !== true && isLoading) || 'Waiting for Mux to complete the file'}\r\n              isInProgress\r\n              showPercent\r\n              animation\r\n              color=\"primary\"\r\n            />\r\n          </div>\r\n          <div className={styles.uploadCancelButton}>\r\n            <Button onClick={this.handleCancelButtonClicked}>Cancel</Button>\r\n          </div>\r\n        </div>\r\n      )\r\n    }\r\n\r\n    const showControls = autoload || this.state.showControls\r\n\r\n    return (\r\n      <div ref={this.videoContainer} className={styles.videoContainer}>\r\n        <media-controller>\r\n          <video\r\n            onClick={autoload ? NOOP : this.handleVideoClick}\r\n            ref={this.video}\r\n            poster={posterUrl}\r\n            slot=\"media\"\r\n            crossOrigin=\"anonomous\"\r\n          >\r\n            {this.state.storyboardUrl && (\r\n              <track label=\"thumbnails\" default kind=\"metadata\" src={this.state.storyboardUrl} />\r\n            )}\r\n          </video>\r\n\r\n          {showControls && (\r\n            <media-control-bar>\r\n              <media-play-button ref={this.playRef} />\r\n              <media-mute-button ref={this.muteRef} />\r\n              {/* The media volume range is causing an error to be logged in the studio: Failed to construct 'CustomElement': The result must not have attributes */}\r\n              {/* <media-volume-range /> */}\r\n              <media-progress-range />\r\n            </media-control-bar>\r\n          )}\r\n        </media-controller>\r\n        {error && (\r\n          <Card padding={3} radius={2} shadow={1} tone=\"critical\" marginTop={2}>\r\n            <Stack space={2}>\r\n              <Text size={1}>There was an error loading this video ({error.type}).</Text>\r\n              {this.state.isDeletedOnMux && <Text size={1}>The video is deleted on Mux</Text>}\r\n            </Stack>\r\n          </Card>\r\n        )}\r\n\r\n        {this.state.isPreparingStaticRenditions && (\r\n          <Card\r\n            padding={2}\r\n            radius={1}\r\n            style={{\r\n              background: 'var(--card-fg-color)',\r\n              position: 'absolute',\r\n              top: '0.5em',\r\n              left: '0.5em',\r\n            }}\r\n          >\r\n            <Text size={1} style={{color: 'var(--card-bg-color)'}}>\r\n              MUX is preparing static renditions, please stand by\r\n            </Text>\r\n          </Card>\r\n        )}\r\n      </div>\r\n    )\r\n  }\r\n}\r\n\r\nMuxVideo.propTypes = propTypes\r\n\r\nMuxVideo.defaultProps = {\r\n  autoload: true,\r\n  onCancel: undefined,\r\n  onReady: undefined,\r\n}\r\n\r\nexport default MuxVideo\r\n"],"file":"Video.js"}

package/build/config.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _configMuxInput = _interopRequireDefault(require("config:mux-input"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/* eslint-disable camelcase */
+var _default = {
+  mp4_support: (_configMuxInput.default === null || _configMuxInput.default === void 0 ? void 0 : _configMuxInput.default.mp4_support) || 'none'
+};
+exports.default = _default;
+//# sourceMappingURL=config.js.map

package/build/config.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/config.js"],"names":["mp4_support"],"mappings":";;;;;;;AACA;;;;AADA;eAGe;AACbA,EAAAA,WAAW,EAAE,2GAAQA,WAAR,KAAuB;AADvB,C","sourcesContent":["/* eslint-disable camelcase */\r\nimport config from 'config:mux-input'\r\n\r\nexport default {\r\n  mp4_support: config?.mp4_support || 'none',\r\n}\r\n"],"file":"config.js"}

package/build/index.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _Input = _interopRequireDefault(require("./components/Input"));
+
+var _Preview = _interopRequireDefault(require("./components/Preview"));
+
+var _Video = _interopRequireDefault(require("./components/Video"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = {
+  Input: _Input.default,
+  Preview: _Preview.default,
+  Player: _Video.default
+};
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/build/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.js"],"names":["Input","Preview","Player"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;eACe;AACbA,EAAAA,KAAK,EAALA,cADa;AAEbC,EAAAA,OAAO,EAAPA,gBAFa;AAGbC,EAAAA,MAAM,EAANA;AAHa,C","sourcesContent":["import Input from './components/Input'\r\nimport Preview from './components/Preview'\r\nimport Player from './components/Video'\r\nexport default {\r\n  Input,\r\n  Preview,\r\n  Player,\r\n}\r\n"],"file":"index.js"}

package/build/schema/mux.video.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _Input = _interopRequireDefault(require("../components/Input"));
+
+var _Preview = _interopRequireDefault(require("../components/Preview"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = {
+  name: 'mux.video',
+  type: 'object',
+  title: 'Video asset reference',
+  fields: [{
+    title: 'Video',
+    name: 'asset',
+    type: 'reference',
+    weak: true,
+    to: [{
+      type: 'mux.videoAsset'
+    }]
+  }],
+  inputComponent: _Input.default,
+  preview: {
+    select: {
+      playbackId: 'asset.playbackId',
+      status: 'asset.status',
+      duration: 'asset.data.duration',
+      thumbTime: 'asset.thumbTime',
+      filename: 'asset.filename',
+      playbackIds: 'asset.data.playback_ids'
+    },
+    component: _Preview.default
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=mux.video.js.map

package/build/schema/mux.video.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/schema/mux.video.js"],"names":["name","type","title","fields","weak","to","inputComponent","Input","preview","select","playbackId","status","duration","thumbTime","filename","playbackIds","component","Preview"],"mappings":";;;;;;;AAAA;;AACA;;;;eAEe;AACbA,EAAAA,IAAI,EAAE,WADO;AAEbC,EAAAA,IAAI,EAAE,QAFO;AAGbC,EAAAA,KAAK,EAAE,uBAHM;AAIbC,EAAAA,MAAM,EAAE,CACN;AACED,IAAAA,KAAK,EAAE,OADT;AAEEF,IAAAA,IAAI,EAAE,OAFR;AAGEC,IAAAA,IAAI,EAAE,WAHR;AAIEG,IAAAA,IAAI,EAAE,IAJR;AAKEC,IAAAA,EAAE,EAAE,CAAC;AAACJ,MAAAA,IAAI,EAAE;AAAP,KAAD;AALN,GADM,CAJK;AAabK,EAAAA,cAAc,EAAEC,cAbH;AAcbC,EAAAA,OAAO,EAAE;AACPC,IAAAA,MAAM,EAAE;AACNC,MAAAA,UAAU,EAAE,kBADN;AAENC,MAAAA,MAAM,EAAE,cAFF;AAGNC,MAAAA,QAAQ,EAAE,qBAHJ;AAINC,MAAAA,SAAS,EAAE,iBAJL;AAKNC,MAAAA,QAAQ,EAAE,gBALJ;AAMNC,MAAAA,WAAW,EAAE;AANP,KADD;AASPC,IAAAA,SAAS,EAAEC;AATJ;AAdI,C","sourcesContent":["import Input from '../components/Input'\r\nimport Preview from '../components/Preview'\r\n\r\nexport default {\r\n  name: 'mux.video',\r\n  type: 'object',\r\n  title: 'Video asset reference',\r\n  fields: [\r\n    {\r\n      title: 'Video',\r\n      name: 'asset',\r\n      type: 'reference',\r\n      weak: true,\r\n      to: [{type: 'mux.videoAsset'}]\r\n    }\r\n  ],\r\n  inputComponent: Input,\r\n  preview: {\r\n    select: {\r\n      playbackId: 'asset.playbackId',\r\n      status: 'asset.status',\r\n      duration: 'asset.data.duration',\r\n      thumbTime: 'asset.thumbTime',\r\n      filename: 'asset.filename',\r\n      playbackIds: 'asset.data.playback_ids'\r\n    },\r\n    component: Preview\r\n  }\r\n}\r\n"],"file":"mux.video.js"}

package/build/schema/mux.videoAsset.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  name: 'mux.videoAsset',
+  type: 'object',
+  title: 'Video asset',
+  fields: [{
+    type: 'string',
+    name: 'status'
+  }, {
+    type: 'string',
+    name: 'assetId'
+  }, {
+    type: 'string',
+    name: 'playbackId'
+  }, {
+    type: 'string',
+    name: 'filename'
+  }, {
+    type: 'number',
+    name: 'thumbTime'
+  }]
+};
+exports.default = _default;
+//# sourceMappingURL=mux.videoAsset.js.map

package/build/schema/mux.videoAsset.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/schema/mux.videoAsset.js"],"names":["name","type","title","fields"],"mappings":";;;;;;eAAe;AACbA,EAAAA,IAAI,EAAE,gBADO;AAEbC,EAAAA,IAAI,EAAE,QAFO;AAGbC,EAAAA,KAAK,EAAE,aAHM;AAIbC,EAAAA,MAAM,EAAE,CACN;AACEF,IAAAA,IAAI,EAAE,QADR;AAEED,IAAAA,IAAI,EAAE;AAFR,GADM,EAKN;AACEC,IAAAA,IAAI,EAAE,QADR;AAEED,IAAAA,IAAI,EAAE;AAFR,GALM,EASN;AACEC,IAAAA,IAAI,EAAE,QADR;AAEED,IAAAA,IAAI,EAAE;AAFR,GATM,EAaN;AACEC,IAAAA,IAAI,EAAE,QADR;AAEED,IAAAA,IAAI,EAAE;AAFR,GAbM,EAiBN;AACEC,IAAAA,IAAI,EAAE,QADR;AAEED,IAAAA,IAAI,EAAE;AAFR,GAjBM;AAJK,C","sourcesContent":["export default {\r\n  name: 'mux.videoAsset',\r\n  type: 'object',\r\n  title: 'Video asset',\r\n  fields: [\r\n    {\r\n      type: 'string',\r\n      name: 'status',\r\n    },\r\n    {\r\n      type: 'string',\r\n      name: 'assetId',\r\n    },\r\n    {\r\n      type: 'string',\r\n      name: 'playbackId',\r\n    },\r\n    {\r\n      type: 'string',\r\n      name: 'filename',\r\n    },\r\n    {\r\n      type: 'number',\r\n      name: 'thumbTime',\r\n    },\r\n  ],\r\n}\r\n"],"file":"mux.videoAsset.js"}

package/build/util/extractFiles.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.extractDroppedFiles = extractDroppedFiles;
+
+var _lodash = require("lodash");
+
+/**
+ * Utilities for extracting files from dataTransfer in a predictable cross-browser fashion.
+ * Also recursively extracts files from a directory
+ * Inspired by https://github.com/component/normalized-upload
+ */
+function extractDroppedFiles(dataTransfer) {
+  var files = Array.from(dataTransfer.files || []);
+  var items = Array.from(dataTransfer.items || []);
+
+  if (files && files.length > 0) {
+    return Promise.resolve(files);
+  }
+
+  return normalizeItems(items).then(_lodash.flatten);
+}
+
+function normalizeItems(items) {
+  return Promise.all(items.map(item => {
+    // directory
+    if (item.kind === 'file' && item.webkitGetAsEntry) {
+      var entry; // Edge throws
+
+      try {
+        entry = item.webkitGetAsEntry();
+      } catch (err) {
+        return [item.getAsFile()];
+      }
+
+      if (!entry) {
+        return [];
+      }
+
+      return entry.isDirectory ? walk(entry) : [item.getAsFile()];
+    } // file
+
+
+    if (item.kind === 'file') {
+      var file = item.getAsFile();
+      return Promise.resolve(file ? [file] : []);
+    } // others
+
+
+    return new Promise(resolve => item.getAsString(resolve)).then(str => str ? [new File([str], 'unknown.txt', {
+      type: item.type
+    })] : []);
+  }));
+}
+
+function walk(entry) {
+  if (entry.isFile) {
+    return new Promise(resolve => entry.file(resolve)).then(file => [file]);
+  }
+
+  if (entry.isDirectory) {
+    var dir = entry.createReader();
+    return new Promise(resolve => dir.readEntries(resolve)).then(entries => entries.filter(entr => !entr.name.startsWith('.'))).then(entries => Promise.all(entries.map(walk)).then(_lodash.flatten));
+  }
+
+  return Promise.resolve([]);
+}
+//# sourceMappingURL=extractFiles.js.map

package/build/util/extractFiles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/util/extractFiles.js"],"names":["extractDroppedFiles","dataTransfer","files","Array","from","items","length","Promise","resolve","normalizeItems","then","flatten","all","map","item","kind","webkitGetAsEntry","entry","err","getAsFile","isDirectory","walk","file","getAsString","str","File","type","isFile","dir","createReader","readEntries","entries","filter","entr","name","startsWith"],"mappings":"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","sourcesContent":["/**\r\n * Utilities for extracting files from dataTransfer in a predictable cross-browser fashion.\r\n * Also recursively extracts files from a directory\r\n * Inspired by https://github.com/component/normalized-upload\r\n */\r\n\r\nimport {flatten} from 'lodash'\r\n\r\nexport function extractDroppedFiles(dataTransfer) {\r\n  const files = Array.from(dataTransfer.files || [])\r\n  const items = Array.from(dataTransfer.items || [])\r\n  if (files && files.length > 0) {\r\n    return Promise.resolve(files)\r\n  }\r\n  return normalizeItems(items).then(flatten)\r\n}\r\n\r\nfunction normalizeItems(items) {\r\n  return Promise.all(\r\n    items.map((item) => {\r\n      // directory\r\n      if (item.kind === 'file' && item.webkitGetAsEntry) {\r\n        let entry\r\n        // Edge throws\r\n        try {\r\n          entry = item.webkitGetAsEntry()\r\n        } catch (err) {\r\n          return [item.getAsFile()]\r\n        }\r\n        if (!entry) {\r\n          return []\r\n        }\r\n        return entry.isDirectory ? walk(entry) : [item.getAsFile()]\r\n      }\r\n\r\n      // file\r\n      if (item.kind === 'file') {\r\n        const file = item.getAsFile()\r\n        return Promise.resolve(file ? [file] : [])\r\n      }\r\n\r\n      // others\r\n      return new Promise((resolve) => item.getAsString(resolve)).then((str) =>\r\n        str ? [new File([str], 'unknown.txt', {type: item.type})] : []\r\n      )\r\n    })\r\n  )\r\n}\r\n\r\nfunction walk(entry) {\r\n  if (entry.isFile) {\r\n    return new Promise((resolve) => entry.file(resolve)).then((file) => [file])\r\n  }\r\n\r\n  if (entry.isDirectory) {\r\n    const dir = entry.createReader()\r\n    return new Promise((resolve) => dir.readEntries(resolve))\r\n      .then((entries) => entries.filter((entr) => !entr.name.startsWith('.')))\r\n      .then((entries) => Promise.all(entries.map(walk)).then(flatten))\r\n  }\r\n  return Promise.resolve([])\r\n}\r\n"],"file":"extractFiles.js"}

package/build/util/formatTime.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = formatTime;
+
+function formatTime(duration) {
+  var secNum = parseInt(duration, 10);
+  var hours = Math.floor(secNum / 3600);
+  var minutes = Math.floor((secNum - hours * 3600) / 60);
+  var seconds = secNum - hours * 3600 - minutes * 60;
+
+  if (hours < 10) {
+    hours = "0".concat(hours);
+  }
+
+  if (minutes < 10) {
+    minutes = "0".concat(minutes);
+  }
+
+  if (seconds < 10) {
+    seconds = "0".concat(seconds);
+  }
+
+  return "".concat(hours, ":").concat(minutes, ":").concat(seconds);
+}
+//# sourceMappingURL=formatTime.js.map

package/build/util/formatTime.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/util/formatTime.js"],"names":["formatTime","duration","secNum","parseInt","hours","Math","floor","minutes","seconds"],"mappings":";;;;;;;AAAe,SAASA,UAAT,CAAoBC,QAApB,EAA8B;AAC3C,MAAMC,MAAM,GAAGC,QAAQ,CAACF,QAAD,EAAW,EAAX,CAAvB;AACA,MAAIG,KAAK,GAAGC,IAAI,CAACC,KAAL,CAAWJ,MAAM,GAAG,IAApB,CAAZ;AACA,MAAIK,OAAO,GAAGF,IAAI,CAACC,KAAL,CAAW,CAACJ,MAAM,GAAGE,KAAK,GAAG,IAAlB,IAA0B,EAArC,CAAd;AACA,MAAII,OAAO,GAAGN,MAAM,GAAGE,KAAK,GAAG,IAAjB,GAAwBG,OAAO,GAAG,EAAhD;;AAEA,MAAIH,KAAK,GAAG,EAAZ,EAAgB;AACdA,IAAAA,KAAK,cAAOA,KAAP,CAAL;AACD;;AACD,MAAIG,OAAO,GAAG,EAAd,EAAkB;AAChBA,IAAAA,OAAO,cAAOA,OAAP,CAAP;AACD;;AACD,MAAIC,OAAO,GAAG,EAAd,EAAkB;AAChBA,IAAAA,OAAO,cAAOA,OAAP,CAAP;AACD;;AACD,mBAAUJ,KAAV,cAAmBG,OAAnB,cAA8BC,OAA9B;AACD","sourcesContent":["export default function formatTime(duration) {\r\n  const secNum = parseInt(duration, 10)\r\n  let hours = Math.floor(secNum / 3600)\r\n  let minutes = Math.floor((secNum - hours * 3600) / 60)\r\n  let seconds = secNum - hours * 3600 - minutes * 60\r\n\r\n  if (hours < 10) {\r\n    hours = `0${hours}`\r\n  }\r\n  if (minutes < 10) {\r\n    minutes = `0${minutes}`\r\n  }\r\n  if (seconds < 10) {\r\n    seconds = `0${seconds}`\r\n  }\r\n  return `${hours}:${minutes}:${seconds}`\r\n}\r\n"],"file":"formatTime.js"}