@elice/material-video-file 1.240718.3 → 1.240719.0

package/cjs/_virtual/_rollupPluginBabelHelpers.js

@@ -0,0 +1,55 @@
+'use strict';
+
+function _iterableToArrayLimit(arr, i) {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
+    try {
+      if (_x = (_i = _i.call(arr)).next, 0 === i) ; else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
+    } catch (err) {
+      _d = !0, _e = err;
+    } finally {
+      try {
+        if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
+    }
+    return _arr;
+  }
+}
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+exports.arrayLikeToArray = _arrayLikeToArray;
+exports.arrayWithHoles = _arrayWithHoles;
+exports.iterableToArrayLimit = _iterableToArrayLimit;
+exports.nonIterableRest = _nonIterableRest;
+exports.slicedToArray = _slicedToArray;
+exports.unsupportedIterableToArray = _unsupportedIterableToArray;

package/cjs/components/material-video-file/MaterialVideoFile.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var apiClient = require('@elice/api-client');
 var intl = require('@elice/intl');
@@ -15,49 +16,53 @@ var MaterialVideoFilePlayer = require('./MaterialVideoFilePlayer.js');
 var useMaterialVideoFileApi = require('./useMaterialVideoFileApi.js');
 var MaterialVideoFile_styled = require('./MaterialVideoFile.styled.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var classnames__default = /*#__PURE__*/_interopDefaultCompat(classnames);
+
 //
 //
 //
-const MaterialVideoFile = _a => {
+var MaterialVideoFile = function MaterialVideoFile(_a) {
   var _b, _c, _d, _e;
-  var {
-      materialVideoFileId,
-      className,
-      eliceAccountApiConfiguration,
-      __intl
-    } = _a,
+  var materialVideoFileId = _a.materialVideoFileId,
+    className = _a.className,
+    eliceAccountApiConfiguration = _a.eliceAccountApiConfiguration,
+    __intl = _a.__intl,
     playerProps = tslib.__rest(_a, ["materialVideoFileId", "className", "eliceAccountApiConfiguration", "__intl"]);
-  const prefixCls = 'em-material-video-file';
-  const {
-    orgNameShort
-  } = materialSharedUtils.useMaterialConfig();
-  const {
-    accountApi
-  } = useMaterialVideoFileApi.useMaterialVideoFileApi({
-    eliceAccountApiConfiguration
-  });
-  const {
-    materialVideoFile,
-    status: materialVideoFileStatus
-  } = materialSharedUtils.useMaterialFetch(types.enums.LectureMaterialType.VideoFile, React.useCallback(signal => apiClient.getOrgMaterialVideoFileGet({
-    materialVideoFileId
-  }, {
-    signal
-  }), [materialVideoFileId]), apiClient.config.init);
+  var prefixCls = 'em-material-video-file';
+  var _useMaterialConfig = materialSharedUtils.useMaterialConfig(),
+    orgNameShort = _useMaterialConfig.orgNameShort;
+  var _useMaterialVideoFile = useMaterialVideoFileApi.useMaterialVideoFileApi({
+      eliceAccountApiConfiguration: eliceAccountApiConfiguration
+    }),
+    accountApi = _useMaterialVideoFile.accountApi;
+  var _useMaterialFetch = materialSharedUtils.useMaterialFetch(types.enums.LectureMaterialType.VideoFile, React__default.default.useCallback(function (signal) {
+      return apiClient.getOrgMaterialVideoFileGet({
+        materialVideoFileId: materialVideoFileId
+      }, {
+        signal: signal
+      });
+    }, [materialVideoFileId]), apiClient.config.init),
+    materialVideoFile = _useMaterialFetch.materialVideoFile,
+    materialVideoFileStatus = _useMaterialFetch.status;
   //
   //
   //
-  return React.createElement(intl.RawEliceIntlProvider, {
-    value: __intl
-  }, React.createElement(MaterialVideoFile_styled.StyledMaterialVideoFileWrap, {
-    className: classnames(prefixCls, className)
-  }, React.createElement(MaterialVideoFilePlayer.default, Object.assign({}, playerProps, {
-    orgNameShort: orgNameShort,
-    materialVideoFile: materialVideoFile !== null && materialVideoFile !== void 0 ? materialVideoFile : null,
-    materialVideoFileStatus: materialVideoFileStatus,
-    accountApi: accountApi,
-    title: (_e = (_c = (_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.cloudflareStream) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : (_d = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _d === void 0 ? void 0 : _d.videoAssetName) !== null && _e !== void 0 ? _e : undefined
-  }))));
+  return jsxRuntime.jsx(intl.RawEliceIntlProvider, {
+    value: __intl,
+    children: jsxRuntime.jsx(MaterialVideoFile_styled.StyledMaterialVideoFileWrap, {
+      className: classnames__default.default(prefixCls, className),
+      children: jsxRuntime.jsx(MaterialVideoFilePlayer.default, Object.assign({}, playerProps, {
+        orgNameShort: orgNameShort,
+        materialVideoFile: materialVideoFile !== null && materialVideoFile !== void 0 ? materialVideoFile : null,
+        materialVideoFileStatus: materialVideoFileStatus,
+        accountApi: accountApi,
+        title: (_e = (_c = (_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.cloudflareStream) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : (_d = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _d === void 0 ? void 0 : _d.videoAssetName) !== null && _e !== void 0 ? _e : undefined
+      }))
+    })
+  });
 };
 var MaterialVideoFile$1 = new intl.IntlComponentBuilder(MaterialVideoFile).add('en', en.default).add('ko', ko.default).addAsync('th', Promise.resolve().then(function () { return require('./locales/th.json.js'); })).addAsync('ja', Promise.resolve().then(function () { return require('./locales/ja.json.js'); })).build();
 

package/cjs/components/material-video-file/MaterialVideoFile.styled.js

@@ -3,7 +3,11 @@
 var designTokens = require('@elice/design-tokens');
 var styled = require('styled-components');
 
-const StyledMaterialVideoFileWrap = styled.div.withConfig({
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+var StyledMaterialVideoFileWrap = styled__default.default.div.withConfig({
   componentId: "sc-1a1otok-0"
 })(["display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;background:", ";"], designTokens.base.color.gray9);
 

package/cjs/components/material-video-file/MaterialVideoFilePlayer.js

@@ -2,6 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var blocks = require('@elice/blocks');
 var intl = require('@elice/intl');
@@ -9,6 +10,11 @@ var types = require('@elice/types');
 var classnames = require('classnames');
 var MaterialVideoFilePlayer_styled = require('./MaterialVideoFilePlayer.styled.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var classnames__default = /*#__PURE__*/_interopDefaultCompat(classnames);
+
 //
 //
 //
@@ -22,31 +28,38 @@ var VideoUploadStatus;
 //
 //
 //
-const MaterialVideoFilePlayer = ({
-  className,
-  materialVideoFile,
-  materialVideoFileStatus = 'idle',
-  materialVideoFileTrackerDisabled = false,
-  mainLecturePageId,
-  orgNameShort,
-  lms = false,
-  lmsOrganizationBusinessType = null,
-  autoPlay = false,
-  autoPlayNext = false,
-  endControl = false,
-  eliceVideoPlayerUrl,
-  emptyComponent = null,
-  onNavigatePreviousLecturePage,
-  onNavigateNextLecturePage,
-  accountApi
-}) => {
+var MaterialVideoFilePlayer = function MaterialVideoFilePlayer(_ref) {
+  var className = _ref.className,
+    materialVideoFile = _ref.materialVideoFile,
+    _ref$materialVideoFil = _ref.materialVideoFileStatus,
+    materialVideoFileStatus = _ref$materialVideoFil === void 0 ? 'idle' : _ref$materialVideoFil,
+    _ref$materialVideoFil2 = _ref.materialVideoFileTrackerDisabled,
+    materialVideoFileTrackerDisabled = _ref$materialVideoFil2 === void 0 ? false : _ref$materialVideoFil2,
+    mainLecturePageId = _ref.mainLecturePageId,
+    orgNameShort = _ref.orgNameShort,
+    _ref$lms = _ref.lms,
+    lms = _ref$lms === void 0 ? false : _ref$lms,
+    _ref$lmsOrganizationB = _ref.lmsOrganizationBusinessType,
+    lmsOrganizationBusinessType = _ref$lmsOrganizationB === void 0 ? null : _ref$lmsOrganizationB,
+    _ref$autoPlay = _ref.autoPlay,
+    autoPlay = _ref$autoPlay === void 0 ? false : _ref$autoPlay,
+    _ref$autoPlayNext = _ref.autoPlayNext,
+    autoPlayNext = _ref$autoPlayNext === void 0 ? false : _ref$autoPlayNext,
+    _ref$endControl = _ref.endControl,
+    endControl = _ref$endControl === void 0 ? false : _ref$endControl,
+    eliceVideoPlayerUrl = _ref.eliceVideoPlayerUrl,
+    _ref$emptyComponent = _ref.emptyComponent,
+    emptyComponent = _ref$emptyComponent === void 0 ? null : _ref$emptyComponent,
+    onNavigatePreviousLecturePage = _ref.onNavigatePreviousLecturePage,
+    onNavigateNextLecturePage = _ref.onNavigateNextLecturePage,
+    accountApi = _ref.accountApi;
   var _a;
-  const prefixCls = 'em-video-player';
-  const intl$1 = intl.useRawEliceIntl();
+  var prefixCls = 'em-video-player';
+  var intl$1 = intl.useRawEliceIntl();
   /**
    * Current video status.
    */
-  const materialVideoFileUploadStatus = React.useMemo(() => {
+  var materialVideoFileUploadStatus = React__default.default.useMemo(function () {
     var _a, _b, _c;
     // empty
     if (typeof ((_a = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.cloudflareStream) === null || _a === void 0 ? void 0 : _a.status) === 'undefined' && typeof ((_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _b === void 0 ? void 0 : _b.status) === 'undefined') {
@@ -86,39 +99,47 @@ const MaterialVideoFilePlayer = ({
   //
   // pending
   if (materialVideoFileStatus === 'idle' || materialVideoFileStatus === 'pending') {
-    return React.createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, null, React.createElement(blocks.Spinner, null));
+    return jsxRuntime.jsx(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, {
+      children: jsxRuntime.jsx(blocks.Spinner, {})
+    });
   }
   // rejected / empty video
   if (materialVideoFileStatus === 'rejected' || materialVideoFileUploadStatus === VideoUploadStatus.Empty) {
-    return React.createElement(React.Fragment, {
+    return jsxRuntime.jsx(React__default.default.Fragment, {
       children: emptyComponent
     });
   }
   // encoding
   if (materialVideoFileUploadStatus === VideoUploadStatus.Encoding) {
-    return React.createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, null, React.createElement(blocks.Spinner, null), React.createElement(blocks.Text, {
-      role: "gray3",
-      lineHeight: 1.5,
-      textAlign: "center",
-      preWrap: true
-    }, intl$1.formatMessage({
-      id: 'videoFile.player.encoding'
-    })));
+    return jsxRuntime.jsxs(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, {
+      children: [jsxRuntime.jsx(blocks.Spinner, {}), jsxRuntime.jsx(blocks.Text, {
+        role: "gray3",
+        lineHeight: 1.5,
+        textAlign: "center",
+        preWrap: true,
+        children: intl$1.formatMessage({
+          id: 'videoFile.player.encoding'
+        })
+      })]
+    });
   }
   // encoding failed
   if (materialVideoFileUploadStatus === VideoUploadStatus.EncodingFailed) {
-    return React.createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, null, React.createElement(blocks.Text, {
-      role: "gray3",
-      lineHeight: 1.5,
-      textAlign: "center",
-      preWrap: true
-    }, intl$1.formatMessage({
-      id: 'videoFile.player.encodingFailed'
-    })));
+    return jsxRuntime.jsx(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, {
+      children: jsxRuntime.jsx(blocks.Text, {
+        role: "gray3",
+        lineHeight: 1.5,
+        textAlign: "center",
+        preWrap: true,
+        children: intl$1.formatMessage({
+          id: 'videoFile.player.encodingFailed'
+        })
+      })
+    });
   }
   // resolved
-  return React.createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayer, {
-    className: classnames(prefixCls, className),
+  return jsxRuntime.jsx(MaterialVideoFilePlayer_styled.StyledVideoPlayer, {
+    className: classnames__default.default(prefixCls, className),
     orgNameShort: orgNameShort !== null && orgNameShort !== void 0 ? orgNameShort : '',
     materialVideoId: (_a = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.id) !== null && _a !== void 0 ? _a : 0,
     linkedMaterialId: mainLecturePageId,
@@ -128,8 +149,12 @@ const MaterialVideoFilePlayer = ({
     noEndControl: !endControl,
     noTracker: materialVideoFileTrackerDisabled,
     playerBaseUrl: eliceVideoPlayerUrl,
-    otp: () => accountApi.auth.authOtpPost().then(res => res.otp),
-    onLecturePageNavigate: dir => {
+    otp: function otp() {
+      return accountApi.auth.authOtpPost().then(function (res) {
+        return res.otp;
+      });
+    },
+    onLecturePageNavigate: function onLecturePageNavigate(dir) {
       if (dir === 'prev' && onNavigatePreviousLecturePage) {
         onNavigatePreviousLecturePage();
       } else if (dir === 'next' && onNavigateNextLecturePage) {

package/cjs/components/material-video-file/MaterialVideoFilePlayer.styled.js

@@ -3,10 +3,14 @@
 var videoplayerClient = require('@elice/videoplayer-client');
 var styled = require('styled-components');
 
-const StyledVideoPlayer = styled(videoplayerClient.EliceVideoplayer).withConfig({
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+var StyledVideoPlayer = styled__default.default(videoplayerClient.EliceVideoplayer).withConfig({
   componentId: "sc-1ocq3lp-0"
 })(["width:100%;height:100%;border:0;"]);
-const StyledVideoPlayerLoading = styled.div.withConfig({
+var StyledVideoPlayerLoading = styled__default.default.div.withConfig({
   componentId: "sc-1ocq3lp-1"
 })(["display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;"]);
 

package/cjs/components/material-video-file/index.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var MaterialVideoFile = require('./MaterialVideoFile.js');
+
+
+
+exports.MaterialVideoFile = MaterialVideoFile.default;

package/cjs/components/material-video-file/locales/index.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var en = require('./en.json.js');
+var ko = require('./ko.json.js');
+var th = require('./th.json.js');
+var ja = require('./ja.json.js');
+
+
+
+exports.messageEn = en.default;
+exports.messageKo = ko.default;
+exports.messageTh = th.default;
+exports.messageJa = ja.default;

package/cjs/components/material-video-file/useMaterialVideoFileApi.js

@@ -1,27 +1,35 @@
 'use strict';
 
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var openapiClientAccount = require('@elice/openapi-client-account');
 
 //
 //
 //
-const useMaterialVideoFileApi = props => {
-  const _return = React.useRef({});
+var useMaterialVideoFileApi = function useMaterialVideoFileApi(props) {
+  var _return = React.useRef({});
   //
   //
   //
-  const createAccountApi = () => Object.freeze({
-    auth: new openapiClientAccount.AuthApi(props.eliceAccountApiConfiguration)
-  });
+  var createAccountApi = function createAccountApi() {
+    return Object.freeze({
+      auth: new openapiClientAccount.AuthApi(props.eliceAccountApiConfiguration)
+    });
+  };
   //
   //
   //
-  const [accountApi, setAccountApi] = React.useState(createAccountApi);
+  var _useState = React.useState(createAccountApi),
+    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+    accountApi = _useState2[0],
+    setAccountApi = _useState2[1];
   //
   //
   //
-  React.useEffect(() => setAccountApi(createAccountApi),
+  React.useEffect(function () {
+    return setAccountApi(createAccountApi);
+  },
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [props.eliceAccountApiConfiguration]);
   //

package/es/_virtual/_rollupPluginBabelHelpers.js

@@ -0,0 +1,48 @@
+function _iterableToArrayLimit(arr, i) {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
+    try {
+      if (_x = (_i = _i.call(arr)).next, 0 === i) ; else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
+    } catch (err) {
+      _d = !0, _e = err;
+    } finally {
+      try {
+        if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
+    }
+    return _arr;
+  }
+}
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+export { _arrayLikeToArray as arrayLikeToArray, _arrayWithHoles as arrayWithHoles, _iterableToArrayLimit as iterableToArrayLimit, _nonIterableRest as nonIterableRest, _slicedToArray as slicedToArray, _unsupportedIterableToArray as unsupportedIterableToArray };

package/es/components/material-video-file/MaterialVideoFile.js

@@ -1,4 +1,5 @@
 import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { getOrgMaterialVideoFileGet, config } from '@elice/api-client';
 import { IntlComponentBuilder, RawEliceIntlProvider } from '@elice/intl';
@@ -14,46 +15,45 @@ import { StyledMaterialVideoFileWrap } from './MaterialVideoFile.styled.js';
 //
 //
 //
-const MaterialVideoFile = _a => {
+var MaterialVideoFile = function MaterialVideoFile(_a) {
   var _b, _c, _d, _e;
-  var {
-      materialVideoFileId,
-      className,
-      eliceAccountApiConfiguration,
-      __intl
-    } = _a,
+  var materialVideoFileId = _a.materialVideoFileId,
+    className = _a.className,
+    eliceAccountApiConfiguration = _a.eliceAccountApiConfiguration,
+    __intl = _a.__intl,
     playerProps = __rest(_a, ["materialVideoFileId", "className", "eliceAccountApiConfiguration", "__intl"]);
-  const prefixCls = 'em-material-video-file';
-  const {
-    orgNameShort
-  } = useMaterialConfig();
-  const {
-    accountApi
-  } = useMaterialVideoFileApi({
-    eliceAccountApiConfiguration
-  });
-  const {
-    materialVideoFile,
-    status: materialVideoFileStatus
-  } = useMaterialFetch(enums.LectureMaterialType.VideoFile, React.useCallback(signal => getOrgMaterialVideoFileGet({
-    materialVideoFileId
-  }, {
-    signal
-  }), [materialVideoFileId]), config.init);
+  var prefixCls = 'em-material-video-file';
+  var _useMaterialConfig = useMaterialConfig(),
+    orgNameShort = _useMaterialConfig.orgNameShort;
+  var _useMaterialVideoFile = useMaterialVideoFileApi({
+      eliceAccountApiConfiguration: eliceAccountApiConfiguration
+    }),
+    accountApi = _useMaterialVideoFile.accountApi;
+  var _useMaterialFetch = useMaterialFetch(enums.LectureMaterialType.VideoFile, React.useCallback(function (signal) {
+      return getOrgMaterialVideoFileGet({
+        materialVideoFileId: materialVideoFileId
+      }, {
+        signal: signal
+      });
+    }, [materialVideoFileId]), config.init),
+    materialVideoFile = _useMaterialFetch.materialVideoFile,
+    materialVideoFileStatus = _useMaterialFetch.status;
   //
   //
   //
-  return React.createElement(RawEliceIntlProvider, {
-    value: __intl
-  }, React.createElement(StyledMaterialVideoFileWrap, {
-    className: classnames(prefixCls, className)
-  }, React.createElement(MaterialVideoFilePlayer, Object.assign({}, playerProps, {
-    orgNameShort: orgNameShort,
-    materialVideoFile: materialVideoFile !== null && materialVideoFile !== void 0 ? materialVideoFile : null,
-    materialVideoFileStatus: materialVideoFileStatus,
-    accountApi: accountApi,
-    title: (_e = (_c = (_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.cloudflareStream) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : (_d = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _d === void 0 ? void 0 : _d.videoAssetName) !== null && _e !== void 0 ? _e : undefined
-  }))));
+  return jsx(RawEliceIntlProvider, {
+    value: __intl,
+    children: jsx(StyledMaterialVideoFileWrap, {
+      className: classnames(prefixCls, className),
+      children: jsx(MaterialVideoFilePlayer, Object.assign({}, playerProps, {
+        orgNameShort: orgNameShort,
+        materialVideoFile: materialVideoFile !== null && materialVideoFile !== void 0 ? materialVideoFile : null,
+        materialVideoFileStatus: materialVideoFileStatus,
+        accountApi: accountApi,
+        title: (_e = (_c = (_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.cloudflareStream) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : (_d = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _d === void 0 ? void 0 : _d.videoAssetName) !== null && _e !== void 0 ? _e : undefined
+      }))
+    })
+  });
 };
 var MaterialVideoFile$1 = new IntlComponentBuilder(MaterialVideoFile).add('en', messageEn).add('ko', messageKo).addAsync('th', import('./locales/th.json.js')).addAsync('ja', import('./locales/ja.json.js')).build();
 

package/es/components/material-video-file/MaterialVideoFile.styled.js

@@ -1,7 +1,7 @@
 import { base } from '@elice/design-tokens';
 import styled from 'styled-components';
 
-const StyledMaterialVideoFileWrap = styled.div.withConfig({
+var StyledMaterialVideoFileWrap = styled.div.withConfig({
   componentId: "sc-1a1otok-0"
 })(["display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;background:", ";"], base.color.gray9);
 

package/es/components/material-video-file/MaterialVideoFilePlayer.js

@@ -1,3 +1,4 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import { Spinner, Text } from '@elice/blocks';
 import { useRawEliceIntl } from '@elice/intl';
@@ -18,31 +19,38 @@ var VideoUploadStatus;
 //
 //
 //
-const MaterialVideoFilePlayer = ({
-  className,
-  materialVideoFile,
-  materialVideoFileStatus = 'idle',
-  materialVideoFileTrackerDisabled = false,
-  mainLecturePageId,
-  orgNameShort,
-  lms = false,
-  lmsOrganizationBusinessType = null,
-  autoPlay = false,
-  autoPlayNext = false,
-  endControl = false,
-  eliceVideoPlayerUrl,
-  emptyComponent = null,
-  onNavigatePreviousLecturePage,
-  onNavigateNextLecturePage,
-  accountApi
-}) => {
+var MaterialVideoFilePlayer = function MaterialVideoFilePlayer(_ref) {
+  var className = _ref.className,
+    materialVideoFile = _ref.materialVideoFile,
+    _ref$materialVideoFil = _ref.materialVideoFileStatus,
+    materialVideoFileStatus = _ref$materialVideoFil === void 0 ? 'idle' : _ref$materialVideoFil,
+    _ref$materialVideoFil2 = _ref.materialVideoFileTrackerDisabled,
+    materialVideoFileTrackerDisabled = _ref$materialVideoFil2 === void 0 ? false : _ref$materialVideoFil2,
+    mainLecturePageId = _ref.mainLecturePageId,
+    orgNameShort = _ref.orgNameShort,
+    _ref$lms = _ref.lms,
+    lms = _ref$lms === void 0 ? false : _ref$lms,
+    _ref$lmsOrganizationB = _ref.lmsOrganizationBusinessType,
+    lmsOrganizationBusinessType = _ref$lmsOrganizationB === void 0 ? null : _ref$lmsOrganizationB,
+    _ref$autoPlay = _ref.autoPlay,
+    autoPlay = _ref$autoPlay === void 0 ? false : _ref$autoPlay,
+    _ref$autoPlayNext = _ref.autoPlayNext,
+    autoPlayNext = _ref$autoPlayNext === void 0 ? false : _ref$autoPlayNext,
+    _ref$endControl = _ref.endControl,
+    endControl = _ref$endControl === void 0 ? false : _ref$endControl,
+    eliceVideoPlayerUrl = _ref.eliceVideoPlayerUrl,
+    _ref$emptyComponent = _ref.emptyComponent,
+    emptyComponent = _ref$emptyComponent === void 0 ? null : _ref$emptyComponent,
+    onNavigatePreviousLecturePage = _ref.onNavigatePreviousLecturePage,
+    onNavigateNextLecturePage = _ref.onNavigateNextLecturePage,
+    accountApi = _ref.accountApi;
   var _a;
-  const prefixCls = 'em-video-player';
-  const intl = useRawEliceIntl();
+  var prefixCls = 'em-video-player';
+  var intl = useRawEliceIntl();
   /**
    * Current video status.
    */
-  const materialVideoFileUploadStatus = React.useMemo(() => {
+  var materialVideoFileUploadStatus = React.useMemo(function () {
     var _a, _b, _c;
     // empty
     if (typeof ((_a = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.cloudflareStream) === null || _a === void 0 ? void 0 : _a.status) === 'undefined' && typeof ((_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _b === void 0 ? void 0 : _b.status) === 'undefined') {
@@ -82,38 +90,46 @@ const MaterialVideoFilePlayer = ({
   //
   // pending
   if (materialVideoFileStatus === 'idle' || materialVideoFileStatus === 'pending') {
-    return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Spinner, null));
+    return jsx(StyledVideoPlayerLoading, {
+      children: jsx(Spinner, {})
+    });
   }
   // rejected / empty video
   if (materialVideoFileStatus === 'rejected' || materialVideoFileUploadStatus === VideoUploadStatus.Empty) {
-    return React.createElement(React.Fragment, {
+    return jsx(React.Fragment, {
       children: emptyComponent
     });
   }
   // encoding
   if (materialVideoFileUploadStatus === VideoUploadStatus.Encoding) {
-    return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Spinner, null), React.createElement(Text, {
-      role: "gray3",
-      lineHeight: 1.5,
-      textAlign: "center",
-      preWrap: true
-    }, intl.formatMessage({
-      id: 'videoFile.player.encoding'
-    })));
+    return jsxs(StyledVideoPlayerLoading, {
+      children: [jsx(Spinner, {}), jsx(Text, {
+        role: "gray3",
+        lineHeight: 1.5,
+        textAlign: "center",
+        preWrap: true,
+        children: intl.formatMessage({
+          id: 'videoFile.player.encoding'
+        })
+      })]
+    });
   }
   // encoding failed
   if (materialVideoFileUploadStatus === VideoUploadStatus.EncodingFailed) {
-    return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Text, {
-      role: "gray3",
-      lineHeight: 1.5,
-      textAlign: "center",
-      preWrap: true
-    }, intl.formatMessage({
-      id: 'videoFile.player.encodingFailed'
-    })));
+    return jsx(StyledVideoPlayerLoading, {
+      children: jsx(Text, {
+        role: "gray3",
+        lineHeight: 1.5,
+        textAlign: "center",
+        preWrap: true,
+        children: intl.formatMessage({
+          id: 'videoFile.player.encodingFailed'
+        })
+      })
+    });
   }
   // resolved
-  return React.createElement(StyledVideoPlayer, {
+  return jsx(StyledVideoPlayer, {
     className: classnames(prefixCls, className),
     orgNameShort: orgNameShort !== null && orgNameShort !== void 0 ? orgNameShort : '',
     materialVideoId: (_a = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.id) !== null && _a !== void 0 ? _a : 0,
@@ -124,8 +140,12 @@ const MaterialVideoFilePlayer = ({
     noEndControl: !endControl,
     noTracker: materialVideoFileTrackerDisabled,
     playerBaseUrl: eliceVideoPlayerUrl,
-    otp: () => accountApi.auth.authOtpPost().then(res => res.otp),
-    onLecturePageNavigate: dir => {
+    otp: function otp() {
+      return accountApi.auth.authOtpPost().then(function (res) {
+        return res.otp;
+      });
+    },
+    onLecturePageNavigate: function onLecturePageNavigate(dir) {
       if (dir === 'prev' && onNavigatePreviousLecturePage) {
         onNavigatePreviousLecturePage();
       } else if (dir === 'next' && onNavigateNextLecturePage) {

package/es/components/material-video-file/MaterialVideoFilePlayer.styled.js

@@ -1,10 +1,10 @@
 import { EliceVideoplayer } from '@elice/videoplayer-client';
 import styled from 'styled-components';
 
-const StyledVideoPlayer = styled(EliceVideoplayer).withConfig({
+var StyledVideoPlayer = styled(EliceVideoplayer).withConfig({
   componentId: "sc-1ocq3lp-0"
 })(["width:100%;height:100%;border:0;"]);
-const StyledVideoPlayerLoading = styled.div.withConfig({
+var StyledVideoPlayerLoading = styled.div.withConfig({
   componentId: "sc-1ocq3lp-1"
 })(["display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;"]);
 

package/es/components/material-video-file/index.js

@@ -0,0 +1 @@
+export { default as MaterialVideoFile } from './MaterialVideoFile.js';

package/es/components/material-video-file/locales/index.js

@@ -0,0 +1,4 @@
+export { default as messageEn } from './en.json.js';
+export { default as messageKo } from './ko.json.js';
+export { default as messageTh } from './th.json.js';
+export { default as messageJa } from './ja.json.js';

package/es/components/material-video-file/useMaterialVideoFileApi.js

@@ -1,25 +1,33 @@
+import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { useRef, useState, useEffect } from 'react';
 import { AuthApi } from '@elice/openapi-client-account';
 
 //
 //
 //
-const useMaterialVideoFileApi = props => {
-  const _return = useRef({});
+var useMaterialVideoFileApi = function useMaterialVideoFileApi(props) {
+  var _return = useRef({});
   //
   //
   //
-  const createAccountApi = () => Object.freeze({
-    auth: new AuthApi(props.eliceAccountApiConfiguration)
-  });
+  var createAccountApi = function createAccountApi() {
+    return Object.freeze({
+      auth: new AuthApi(props.eliceAccountApiConfiguration)
+    });
+  };
   //
   //
   //
-  const [accountApi, setAccountApi] = useState(createAccountApi);
+  var _useState = useState(createAccountApi),
+    _useState2 = _slicedToArray(_useState, 2),
+    accountApi = _useState2[0],
+    setAccountApi = _useState2[1];
   //
   //
   //
-  useEffect(() => setAccountApi(createAccountApi),
+  useEffect(function () {
+    return setAccountApi(createAccountApi);
+  },
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [props.eliceAccountApiConfiguration]);
   //

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elice/material-video-file",
-  "version": "1.240718.3",
+  "version": "1.240719.0",
   "description": "User view and editing components of Elice material video file",
   "repository": "https://git.elicer.io/elice/frontend/library/elice-material",
   "license": "UNLICENSED",
@@ -17,10 +17,8 @@
   "scripts": {
     "start": "run-s watch",
     "prebuild": "run-s clean",
-    "build": "run-p build:es build:cjs",
-    "build:es": "rollup -c ../../rollup.config.ts --configPlugin typescript -f es",
-    "build:cjs": "rollup -c ../../rollup.config.ts --configPlugin typescript -f cjs",
-    "watch": "rollup -c ../../rollup.config.ts --configPlugin typescript -f es -w",
+    "build": "cross-env NODE_ENV=production rollup -c ../../rollup.config.ts --configPlugin typescript -f es -f cjs",
+    "watch": "rollup -c ../../rollup.config.ts --configPlugin typescript -f es -f cjs -w",
     "lint": "eslint --ext .ts,.tsx ./src --max-warnings=0",
     "clean": "del-cli \"es/*\" \"cjs/*\" \"dist/*\""
   },
@@ -47,16 +45,16 @@
   },
   "devDependencies": {
     "@elice/api-client": "1.240619.0",
-    "@elice/blocks": "^1.240514.0",
+    "@elice/blocks": "^1.240529.0",
     "@elice/design-tokens": "^1.220803.0",
     "@elice/icons": "^1.230814.0",
     "@elice/icons-legacy": "npm:@elice/icons@0.230814.0",
     "@elice/intl": "0.240425.0-rc.2",
-    "@elice/material-shared-types": "1.240718.3",
-    "@elice/material-shared-utils": "1.240718.3",
+    "@elice/material-shared-types": "1.240719.0",
+    "@elice/material-shared-utils": "1.240719.0",
     "@elice/messenger": "^1.240426.0",
     "@elice/openapi-client-account": "^1.230814.0",
-    "@elice/types": "1.240619.0",
+    "@elice/types": "^1.240709.0",
     "@elice/videoplayer-client": "^2.240618.1",
     "@types/classnames": "^2.3.1",
     "@types/query-string": "^6.3.0",
@@ -65,6 +63,5 @@
     "react": "^17.0.2",
     "react-use": "^17.2.4",
     "styled-components": "^5.3.0"
-  },
-  "gitHead": "5479962bf1206df7c1f6f4f24b5f2547b90be799"
+  }
 }