@elice/material-video-file 1.230328.0 → 1.230418.0

package/cjs/_virtual/_rollupPluginBabelHelpers.js

@@ -0,0 +1,60 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+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) {
+        if (Object(_i) !== _i) return;
+        _n = !1;
+      } 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.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { MaterialVideoFilePlayerProps } from './MaterialVideoFilePlayer';
+import type { UseMaterialVideoFileApiProps } from './useMaterialVideoFileApi';
 declare type PickedVideoPlayerProps = Pick<MaterialVideoFilePlayerProps, 'materialVideoFileTrackerDisabled' | 'mainLecturePageId' | 'lms' | 'lmsOrganizationBusinessType' | 'emptyComponent' | 'autoPlay' | 'autoPlayNext' | 'endControl' | 'eliceVideoPlayerUrl' | 'onNavigatePreviousLecturePage' | 'onNavigateNextLecturePage'>;
-export interface MaterialVideoFileProps extends PickedVideoPlayerProps {
+export interface MaterialVideoFileProps extends PickedVideoPlayerProps, UseMaterialVideoFileApiProps {
     materialVideoFileId: number;
     className?: string;
     locale?: string;

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

@@ -1,5 +1,7 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var tslib = require('tslib');
 var React = require('react');
 var reactIntl = require('react-intl');
@@ -9,6 +11,7 @@ var types = require('@elice/types');
 var classnames = require('classnames');
 var locales = require('./locales.js');
 var MaterialVideoFilePlayer = require('./MaterialVideoFilePlayer.js');
+var useMaterialVideoFileApi = require('./useMaterialVideoFileApi.js');
 var MaterialVideoFile_styled = require('./MaterialVideoFile.styled.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -16,43 +19,49 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 
-const MaterialVideoFile = _a => {
+//
+//
+//
+var MaterialVideoFile = function MaterialVideoFile(_a) {
   var _b, _c;
-
-  var {
-    materialVideoFileId,
-    className,
-    locale = 'en'
-  } = _a,
-      playerProps = tslib.__rest(_a, ["materialVideoFileId", "className", "locale"]);
-
-  const prefixCls = 'em-material-video-file';
-  const {
-    orgNameShort
-  } = materialSharedUtils.useMaterialConfig();
-  const {
-    materialVideoFile,
-    status: materialVideoFileStatus
-  } = materialSharedUtils.useMaterialFetch(types.enums.LectureMaterialType.VideoFile, React__default["default"].useCallback(signal => apiClient.getOrgMaterialVideoFileGet({
-    materialVideoFileId
-  }, {
-    signal
-  }), [materialVideoFileId]), apiClient.config.init); //
+  var materialVideoFileId = _a.materialVideoFileId,
+    className = _a.className,
+    _a$locale = _a.locale,
+    locale = _a$locale === void 0 ? 'en' : _a$locale,
+    eliceAccountApiConfiguration = _a.eliceAccountApiConfiguration,
+    playerProps = tslib.__rest(_a, ["materialVideoFileId", "className", "locale", "eliceAccountApiConfiguration"]);
+  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__default["default"].createElement(MaterialVideoFile_styled.StyledMaterialVideoFileWrap, {
     className: classnames__default["default"](prefixCls, className)
   }, React__default["default"].createElement(reactIntl.IntlProvider, {
     locale: locale,
     defaultLocale: "en",
     messages: locale in locales ? locales[locale] : locales.en
-  }, React__default["default"].createElement(MaterialVideoFilePlayer, Object.assign({}, playerProps, {
+  }, React__default["default"].createElement(MaterialVideoFilePlayer["default"], Object.assign({}, playerProps, {
     orgNameShort: orgNameShort,
     materialVideoFile: materialVideoFile !== null && materialVideoFile !== void 0 ? materialVideoFile : null,
     materialVideoFileStatus: materialVideoFileStatus,
+    accountApi: accountApi,
     title: (_c = (_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _b === void 0 ? void 0 : _b.videoAssetName) !== null && _c !== void 0 ? _c : undefined
   }))));
 };
 
-module.exports = MaterialVideoFile;
+exports["default"] = MaterialVideoFile;

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

@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const StyledMaterialVideoFileWrap = styled__default["default"].div.withConfig({
+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.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { APIStatus } from '@elice/material-shared-types';
 import type { EliceVideoPlayerSearchParams, GetOrgMaterialVideoFileGetResponses } from '@elice/types';
-export interface MaterialVideoFilePlayerProps {
+import type { UseMaterialVideoFileApiReturn } from './useMaterialVideoFileApi';
+export interface MaterialVideoFilePlayerProps extends UseMaterialVideoFileApiReturn {
     /** Classname for the element. */
     className?: string;
     /** Material video file. */

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

@@ -1,8 +1,10 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactIntl = require('react-intl');
-var apiClient = require('@elice/api-client');
 var blocks = require('@elice/blocks');
 var types = require('@elice/types');
 var classnames = require('classnames');
@@ -13,176 +15,188 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 
+//
+//
+//
 var VideoUploadStatus;
-
 (function (VideoUploadStatus) {
   VideoUploadStatus[VideoUploadStatus["Empty"] = 0] = "Empty";
   VideoUploadStatus[VideoUploadStatus["Encoding"] = 1] = "Encoding";
   VideoUploadStatus[VideoUploadStatus["EncodingFailed"] = 2] = "EncodingFailed";
   VideoUploadStatus[VideoUploadStatus["Ready"] = 3] = "Ready";
 })(VideoUploadStatus || (VideoUploadStatus = {}));
-
 var VideoMimeType;
-
 (function (VideoMimeType) {
   /** `application/vnd.ms-sstr+xml` */
   VideoMimeType["Smooth"] = "application/vnd.ms-sstr+xml";
   /** `application/vnd.apple.mpegurl` */
-
   VideoMimeType["Hls"] = "application/vnd.apple.mpegurl";
   /** `application/dash+xml` */
-
   VideoMimeType["Mpeg"] = "application/dash+xml";
 })(VideoMimeType || (VideoMimeType = {}));
-
-const ELICE_VIDEO_PLAYER_MESSAGE_EVENT = 'elice-videoplayer';
-const ELICE_VIDEO_PLAYER_MESSAGE_TYPE = 'navigate';
-
-const MaterialVideoFilePlayer = ({
-  className,
-  materialVideoFile,
-  materialVideoFileStatus = 'idle',
-  materialVideoFileTrackerDisabled = false,
-  mainLecturePageId,
-  orgNameShort,
-  lms = false,
-  lmsOrganizationBusinessType = null,
-  autoPlay = false,
-  autoPlayNext = false,
-  endControl = false,
-  locale,
-  eliceVideoPlayerUrl,
-  emptyComponent = null,
-  title = 'elice-videoplayer',
-  onNavigatePreviousLecturePage,
-  onNavigateNextLecturePage
-}) => {
-  const prefixCls = 'em-video-player';
-  const [playerFrameSrc, setPlayerFrameSrc] = React__default["default"].useState(null);
+//
+//
+//
+var ELICE_VIDEO_PLAYER_MESSAGE_EVENT = 'elice-videoplayer';
+var ELICE_VIDEO_PLAYER_MESSAGE_TYPE = 'navigate';
+//
+//
+//
+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,
+    locale = _ref.locale,
+    eliceVideoPlayerUrl = _ref.eliceVideoPlayerUrl,
+    _ref$emptyComponent = _ref.emptyComponent,
+    emptyComponent = _ref$emptyComponent === void 0 ? null : _ref$emptyComponent,
+    _ref$title = _ref.title,
+    title = _ref$title === void 0 ? 'elice-videoplayer' : _ref$title,
+    onNavigatePreviousLecturePage = _ref.onNavigatePreviousLecturePage,
+    onNavigateNextLecturePage = _ref.onNavigateNextLecturePage,
+    accountApi = _ref.accountApi;
+  var prefixCls = 'em-video-player';
+  var _React$useState = React__default["default"].useState(null),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    playerFrameSrc = _React$useState2[0],
+    setPlayerFrameSrc = _React$useState2[1];
   /**
    * Current video status.
    */
-
-  const materialVideoFileUploadStatus = React__default["default"].useMemo(() => {
+  var materialVideoFileUploadStatus = React__default["default"].useMemo(function () {
     var _a, _b, _c, _d;
-
     switch (true) {
       case typeof ((_a = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _a === void 0 ? void 0 : _a.status) === 'undefined':
         return VideoUploadStatus.Empty;
-
       case ((_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _b === void 0 ? void 0 : _b.status) === types.enums.AzureMediaVideoStatus.Encoding:
         return VideoUploadStatus.Encoding;
-
       case ((_c = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _c === void 0 ? void 0 : _c.status) === types.enums.AzureMediaVideoStatus.Error:
         return VideoUploadStatus.EncodingFailed;
-
       case ((_d = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _d === void 0 ? void 0 : _d.status) === types.enums.AzureMediaVideoStatus.Done && typeof materialVideoFile.azureMediaVideo.videoStreamingUrl === 'string':
         return VideoUploadStatus.Ready;
-
       default:
         return VideoUploadStatus.Empty;
     }
-  }, [materialVideoFile]); //
+  }, [materialVideoFile]);
+  //
   // Get video iframe src.
   //
-
-  React__default["default"].useEffect(() => {
+  React__default["default"].useEffect(function () {
     if (!eliceVideoPlayerUrl || !materialVideoFile) {
       return;
     }
-
-    const abortCtrl = new AbortController();
-    apiClient.postGlobalAuthOtpKeyMake({
+    var abortCtrl = new AbortController();
+    accountApi.auth.authOtpPost({
       signal: abortCtrl.signal
-    }) // issue otp key
-    .then(res => res.otpKey) // create search params
-    .then(otp => ({
-      org: orgNameShort,
-      mid: materialVideoFile.id,
-      lmid: mainLecturePageId,
-      lms,
-      lmstype: lms ? lmsOrganizationBusinessType !== null && lmsOrganizationBusinessType !== void 0 ? lmsOrganizationBusinessType : undefined : undefined,
-      codec: VideoMimeType.Smooth,
-      autoplay: autoPlay,
-      autoplaynext: autoPlayNext,
-      endctrl: endControl,
-      notrack: materialVideoFileTrackerDisabled,
-      origin: window.location.origin,
-      locale,
-      otp
-    })) // create url from search params
-    .then(params => {
-      const url = new URL(eliceVideoPlayerUrl);
-      Object.entries(params).forEach(([key, value]) => {
+    })
+    // issue otp key
+    .then(function (res) {
+      return res.otp;
+    })
+    // create search params
+    .then(function (otp) {
+      return {
+        org: orgNameShort,
+        mid: materialVideoFile.id,
+        lmid: mainLecturePageId,
+        lms: lms,
+        lmstype: lms ? lmsOrganizationBusinessType !== null && lmsOrganizationBusinessType !== void 0 ? lmsOrganizationBusinessType : undefined : undefined,
+        codec: VideoMimeType.Smooth,
+        autoplay: autoPlay,
+        autoplaynext: autoPlayNext,
+        endctrl: endControl,
+        notrack: materialVideoFileTrackerDisabled,
+        origin: window.location.origin,
+        locale: locale,
+        otp: otp
+      };
+    })
+    // create url from search params
+    .then(function (params) {
+      var url = new URL(eliceVideoPlayerUrl);
+      Object.entries(params).forEach(function (_ref2) {
+        var _ref3 = _rollupPluginBabelHelpers.slicedToArray(_ref2, 2),
+          key = _ref3[0],
+          value = _ref3[1];
         if (value) {
           url.searchParams.set(key, value);
         }
       });
       return url;
-    }).then(url => url.href).then(setPlayerFrameSrc).catch(err => {
+    }).then(function (url) {
+      return url.href;
+    }).then(setPlayerFrameSrc).catch(function (err) {
       if (err.name !== 'AbortError') {
         setPlayerFrameSrc(null);
       }
     });
-    return () => {
+    return function () {
       abortCtrl.abort();
     };
-  }, [orgNameShort, materialVideoFile, materialVideoFileTrackerDisabled, mainLecturePageId, lms, lmsOrganizationBusinessType, eliceVideoPlayerUrl, autoPlay, autoPlayNext, endControl, locale]); //
+  }, [orgNameShort, materialVideoFile, materialVideoFileTrackerDisabled, mainLecturePageId, lms, lmsOrganizationBusinessType, eliceVideoPlayerUrl, autoPlay, autoPlayNext, endControl, locale, accountApi]);
+  //
   // Add event listener for navigating prev and next lecture page.
   //
-
-  React__default["default"].useEffect(() => {
-    const _handle = event => {
+  React__default["default"].useEffect(function () {
+    var _handle = function _handle(event) {
       var _a, _b, _c;
-
       try {
-        const edata = JSON.parse(event.data);
-
+        var edata = JSON.parse(event.data);
         if (edata.key !== ELICE_VIDEO_PLAYER_MESSAGE_EVENT || ((_a = edata.event) === null || _a === void 0 ? void 0 : _a.type) !== ELICE_VIDEO_PLAYER_MESSAGE_TYPE) {
           return;
         }
-
         switch ((_c = (_b = edata.event) === null || _b === void 0 ? void 0 : _b.args) === null || _c === void 0 ? void 0 : _c.direction) {
           case 'previous':
             if (typeof onNavigatePreviousLecturePage === 'function') {
               onNavigatePreviousLecturePage();
             }
-
             break;
-
           case 'next':
             if (typeof onNavigateNextLecturePage === 'function') {
               onNavigateNextLecturePage === null || onNavigateNextLecturePage === void 0 ? void 0 : onNavigateNextLecturePage();
             }
-
             break;
         }
-      } catch (_) {//
+      } catch (_) {
+        //
       }
     };
-
     window.addEventListener('message', _handle);
-    return () => {
+    return function () {
       window.removeEventListener('message', _handle);
     };
-  }, // eslint-disable-next-line react-hooks/exhaustive-deps
-  []); //
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  []);
+  //
   //
   //
   // pending
-
   if (materialVideoFileStatus === 'idle' || materialVideoFileStatus === 'pending' || materialVideoFileStatus === 'resolved' && !playerFrameSrc) {
     return React__default["default"].createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, null, React__default["default"].createElement(blocks.Spinner, null));
-  } // rejected / empty video
-
-
+  }
+  // rejected / empty video
   if (materialVideoFileStatus === 'rejected' || materialVideoFileUploadStatus === VideoUploadStatus.Empty) {
     return React__default["default"].createElement(React__default["default"].Fragment, {
       children: emptyComponent
     });
-  } // encoding
-
-
+  }
+  // encoding
   if (materialVideoFileUploadStatus === VideoUploadStatus.Encoding) {
     return React__default["default"].createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, null, React__default["default"].createElement(blocks.Spinner, null), React__default["default"].createElement(blocks.Text, {
       role: "gray3",
@@ -192,9 +206,8 @@ const MaterialVideoFilePlayer = ({
     }, React__default["default"].createElement(reactIntl.FormattedMessage, {
       id: "videoFile.player.encoding"
     })));
-  } // encoding failed
-
-
+  }
+  // encoding failed
   if (materialVideoFileUploadStatus === VideoUploadStatus.EncodingFailed) {
     return React__default["default"].createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, null, React__default["default"].createElement(blocks.Text, {
       role: "gray3",
@@ -204,9 +217,8 @@ const MaterialVideoFilePlayer = ({
     }, React__default["default"].createElement(reactIntl.FormattedMessage, {
       id: "videoFile.player.encodingFailed"
     })));
-  } // resolved
-
-
+  }
+  // resolved
   return React__default["default"].createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerWrap, {
     className: classnames__default["default"](prefixCls, className),
     src: playerFrameSrc,
@@ -215,9 +227,8 @@ const MaterialVideoFilePlayer = ({
     allowFullScreen: true
   });
 };
-
 var MaterialVideoFilePlayer$1 = Object.assign(MaterialVideoFilePlayer, {
   MimeType: VideoMimeType
 });
 
-module.exports = MaterialVideoFilePlayer$1;
+exports["default"] = MaterialVideoFilePlayer$1;

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

@@ -8,10 +8,10 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const StyledVideoPlayerWrap = styled__default["default"].iframe.withConfig({
+var StyledVideoPlayerWrap = styled__default["default"].iframe.withConfig({
   componentId: "sc-1ocq3lp-0"
 })(["width:100%;height:100%;border:0;"]);
-const StyledVideoPlayerLoading = styled__default["default"].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/locales.js

@@ -2,14 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const en = {
+var en = {
   'videoFile.player.preparing': 'Material on preparing.',
   'videoFile.player.uploadVideoBtn': 'Upload File',
   'videoFile.player.encoding': 'A video is being prepared.\nPlease check back later.',
   'videoFile.player.encodingFailed': 'There was a problem processing the video.\nIf the problem persists, please contact customer service.',
   'videoFile.player.noVideo': 'This file does not exist.'
 };
-const ko = {
+var ko = {
   'videoFile.player.preparing': '자료를 준비 중입니다.',
   'videoFile.player.uploadVideoBtn': '파일 업로드',
   'videoFile.player.encoding': '동영상을 준비 중 입니다.\n잠시 후 다시 확인해주세요.',

package/cjs/components/material-video-file/useMaterialVideoFileApi.d.ts

@@ -0,0 +1,12 @@
+import { AuthApi as EliceAccountAuthApi } from '@elice/openapi-client-account';
+import type { Configuration as EliceAccountApiConfiguration } from '@elice/openapi-client-account';
+export interface UseMaterialVideoFileApiProps {
+    eliceAccountApiConfiguration: EliceAccountApiConfiguration;
+}
+export interface UseMaterialVideoFileApiReturnMaterialRunbox {
+    auth: EliceAccountAuthApi;
+}
+export interface UseMaterialVideoFileApiReturn {
+    accountApi: UseMaterialVideoFileApiReturnMaterialRunbox;
+}
+export declare const useMaterialVideoFileApi: (props: UseMaterialVideoFileApiProps) => UseMaterialVideoFileApiReturn;

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

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

package/cjs/index.js

@@ -6,4 +6,4 @@ var MaterialVideoFile = require('./components/material-video-file/MaterialVideoF
 
 
 
-exports.MaterialVideoFile = MaterialVideoFile;
+exports.MaterialVideoFile = MaterialVideoFile["default"];

package/es/_virtual/_rollupPluginBabelHelpers.js

@@ -0,0 +1,51 @@
+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) {
+        if (Object(_i) !== _i) return;
+        _n = !1;
+      } 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.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { MaterialVideoFilePlayerProps } from './MaterialVideoFilePlayer';
+import type { UseMaterialVideoFileApiProps } from './useMaterialVideoFileApi';
 declare type PickedVideoPlayerProps = Pick<MaterialVideoFilePlayerProps, 'materialVideoFileTrackerDisabled' | 'mainLecturePageId' | 'lms' | 'lmsOrganizationBusinessType' | 'emptyComponent' | 'autoPlay' | 'autoPlayNext' | 'endControl' | 'eliceVideoPlayerUrl' | 'onNavigatePreviousLecturePage' | 'onNavigateNextLecturePage'>;
-export interface MaterialVideoFileProps extends PickedVideoPlayerProps {
+export interface MaterialVideoFileProps extends PickedVideoPlayerProps, UseMaterialVideoFileApiProps {
     materialVideoFileId: number;
     className?: string;
     locale?: string;

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

@@ -8,33 +8,39 @@ import classnames from 'classnames';
 import * as locales from './locales.js';
 import { en } from './locales.js';
 import MaterialVideoFilePlayer from './MaterialVideoFilePlayer.js';
+import { useMaterialVideoFileApi } from './useMaterialVideoFileApi.js';
 import { StyledMaterialVideoFileWrap } from './MaterialVideoFile.styled.js';
 
-const MaterialVideoFile = _a => {
+//
+//
+//
+var MaterialVideoFile = function MaterialVideoFile(_a) {
   var _b, _c;
-
-  var {
-    materialVideoFileId,
-    className,
-    locale = 'en'
-  } = _a,
-      playerProps = __rest(_a, ["materialVideoFileId", "className", "locale"]);
-
-  const prefixCls = 'em-material-video-file';
-  const {
-    orgNameShort
-  } = useMaterialConfig();
-  const {
-    materialVideoFile,
-    status: materialVideoFileStatus
-  } = useMaterialFetch(enums.LectureMaterialType.VideoFile, React.useCallback(signal => getOrgMaterialVideoFileGet({
-    materialVideoFileId
-  }, {
-    signal
-  }), [materialVideoFileId]), config.init); //
+  var materialVideoFileId = _a.materialVideoFileId,
+    className = _a.className,
+    _a$locale = _a.locale,
+    locale = _a$locale === void 0 ? 'en' : _a$locale,
+    eliceAccountApiConfiguration = _a.eliceAccountApiConfiguration,
+    playerProps = __rest(_a, ["materialVideoFileId", "className", "locale", "eliceAccountApiConfiguration"]);
+  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(StyledMaterialVideoFileWrap, {
     className: classnames(prefixCls, className)
   }, React.createElement(IntlProvider, {
@@ -45,6 +51,7 @@ const MaterialVideoFile = _a => {
     orgNameShort: orgNameShort,
     materialVideoFile: materialVideoFile !== null && materialVideoFile !== void 0 ? materialVideoFile : null,
     materialVideoFileStatus: materialVideoFileStatus,
+    accountApi: accountApi,
     title: (_c = (_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _b === void 0 ? void 0 : _b.videoAssetName) !== null && _c !== void 0 ? _c : undefined
   }))));
 };

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.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { APIStatus } from '@elice/material-shared-types';
 import type { EliceVideoPlayerSearchParams, GetOrgMaterialVideoFileGetResponses } from '@elice/types';
-export interface MaterialVideoFilePlayerProps {
+import type { UseMaterialVideoFileApiReturn } from './useMaterialVideoFileApi';
+export interface MaterialVideoFilePlayerProps extends UseMaterialVideoFileApiReturn {
     /** Classname for the element. */
     className?: string;
     /** Material video file. */

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

@@ -1,181 +1,193 @@
+import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
-import { postGlobalAuthOtpKeyMake } from '@elice/api-client';
 import { Spinner, Text } from '@elice/blocks';
 import { enums } from '@elice/types';
 import classnames from 'classnames';
 import { StyledVideoPlayerLoading, StyledVideoPlayerWrap } from './MaterialVideoFilePlayer.styled.js';
 
+//
+//
+//
 var VideoUploadStatus;
-
 (function (VideoUploadStatus) {
   VideoUploadStatus[VideoUploadStatus["Empty"] = 0] = "Empty";
   VideoUploadStatus[VideoUploadStatus["Encoding"] = 1] = "Encoding";
   VideoUploadStatus[VideoUploadStatus["EncodingFailed"] = 2] = "EncodingFailed";
   VideoUploadStatus[VideoUploadStatus["Ready"] = 3] = "Ready";
 })(VideoUploadStatus || (VideoUploadStatus = {}));
-
 var VideoMimeType;
-
 (function (VideoMimeType) {
   /** `application/vnd.ms-sstr+xml` */
   VideoMimeType["Smooth"] = "application/vnd.ms-sstr+xml";
   /** `application/vnd.apple.mpegurl` */
-
   VideoMimeType["Hls"] = "application/vnd.apple.mpegurl";
   /** `application/dash+xml` */
-
   VideoMimeType["Mpeg"] = "application/dash+xml";
 })(VideoMimeType || (VideoMimeType = {}));
-
-const ELICE_VIDEO_PLAYER_MESSAGE_EVENT = 'elice-videoplayer';
-const ELICE_VIDEO_PLAYER_MESSAGE_TYPE = 'navigate';
-
-const MaterialVideoFilePlayer = ({
-  className,
-  materialVideoFile,
-  materialVideoFileStatus = 'idle',
-  materialVideoFileTrackerDisabled = false,
-  mainLecturePageId,
-  orgNameShort,
-  lms = false,
-  lmsOrganizationBusinessType = null,
-  autoPlay = false,
-  autoPlayNext = false,
-  endControl = false,
-  locale,
-  eliceVideoPlayerUrl,
-  emptyComponent = null,
-  title = 'elice-videoplayer',
-  onNavigatePreviousLecturePage,
-  onNavigateNextLecturePage
-}) => {
-  const prefixCls = 'em-video-player';
-  const [playerFrameSrc, setPlayerFrameSrc] = React.useState(null);
+//
+//
+//
+var ELICE_VIDEO_PLAYER_MESSAGE_EVENT = 'elice-videoplayer';
+var ELICE_VIDEO_PLAYER_MESSAGE_TYPE = 'navigate';
+//
+//
+//
+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,
+    locale = _ref.locale,
+    eliceVideoPlayerUrl = _ref.eliceVideoPlayerUrl,
+    _ref$emptyComponent = _ref.emptyComponent,
+    emptyComponent = _ref$emptyComponent === void 0 ? null : _ref$emptyComponent,
+    _ref$title = _ref.title,
+    title = _ref$title === void 0 ? 'elice-videoplayer' : _ref$title,
+    onNavigatePreviousLecturePage = _ref.onNavigatePreviousLecturePage,
+    onNavigateNextLecturePage = _ref.onNavigateNextLecturePage,
+    accountApi = _ref.accountApi;
+  var prefixCls = 'em-video-player';
+  var _React$useState = React.useState(null),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    playerFrameSrc = _React$useState2[0],
+    setPlayerFrameSrc = _React$useState2[1];
   /**
    * Current video status.
    */
-
-  const materialVideoFileUploadStatus = React.useMemo(() => {
+  var materialVideoFileUploadStatus = React.useMemo(function () {
     var _a, _b, _c, _d;
-
     switch (true) {
       case typeof ((_a = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _a === void 0 ? void 0 : _a.status) === 'undefined':
         return VideoUploadStatus.Empty;
-
       case ((_b = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _b === void 0 ? void 0 : _b.status) === enums.AzureMediaVideoStatus.Encoding:
         return VideoUploadStatus.Encoding;
-
       case ((_c = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _c === void 0 ? void 0 : _c.status) === enums.AzureMediaVideoStatus.Error:
         return VideoUploadStatus.EncodingFailed;
-
       case ((_d = materialVideoFile === null || materialVideoFile === void 0 ? void 0 : materialVideoFile.azureMediaVideo) === null || _d === void 0 ? void 0 : _d.status) === enums.AzureMediaVideoStatus.Done && typeof materialVideoFile.azureMediaVideo.videoStreamingUrl === 'string':
         return VideoUploadStatus.Ready;
-
       default:
         return VideoUploadStatus.Empty;
     }
-  }, [materialVideoFile]); //
+  }, [materialVideoFile]);
+  //
   // Get video iframe src.
   //
-
-  React.useEffect(() => {
+  React.useEffect(function () {
     if (!eliceVideoPlayerUrl || !materialVideoFile) {
       return;
     }
-
-    const abortCtrl = new AbortController();
-    postGlobalAuthOtpKeyMake({
+    var abortCtrl = new AbortController();
+    accountApi.auth.authOtpPost({
       signal: abortCtrl.signal
-    }) // issue otp key
-    .then(res => res.otpKey) // create search params
-    .then(otp => ({
-      org: orgNameShort,
-      mid: materialVideoFile.id,
-      lmid: mainLecturePageId,
-      lms,
-      lmstype: lms ? lmsOrganizationBusinessType !== null && lmsOrganizationBusinessType !== void 0 ? lmsOrganizationBusinessType : undefined : undefined,
-      codec: VideoMimeType.Smooth,
-      autoplay: autoPlay,
-      autoplaynext: autoPlayNext,
-      endctrl: endControl,
-      notrack: materialVideoFileTrackerDisabled,
-      origin: window.location.origin,
-      locale,
-      otp
-    })) // create url from search params
-    .then(params => {
-      const url = new URL(eliceVideoPlayerUrl);
-      Object.entries(params).forEach(([key, value]) => {
+    })
+    // issue otp key
+    .then(function (res) {
+      return res.otp;
+    })
+    // create search params
+    .then(function (otp) {
+      return {
+        org: orgNameShort,
+        mid: materialVideoFile.id,
+        lmid: mainLecturePageId,
+        lms: lms,
+        lmstype: lms ? lmsOrganizationBusinessType !== null && lmsOrganizationBusinessType !== void 0 ? lmsOrganizationBusinessType : undefined : undefined,
+        codec: VideoMimeType.Smooth,
+        autoplay: autoPlay,
+        autoplaynext: autoPlayNext,
+        endctrl: endControl,
+        notrack: materialVideoFileTrackerDisabled,
+        origin: window.location.origin,
+        locale: locale,
+        otp: otp
+      };
+    })
+    // create url from search params
+    .then(function (params) {
+      var url = new URL(eliceVideoPlayerUrl);
+      Object.entries(params).forEach(function (_ref2) {
+        var _ref3 = _slicedToArray(_ref2, 2),
+          key = _ref3[0],
+          value = _ref3[1];
         if (value) {
           url.searchParams.set(key, value);
         }
       });
       return url;
-    }).then(url => url.href).then(setPlayerFrameSrc).catch(err => {
+    }).then(function (url) {
+      return url.href;
+    }).then(setPlayerFrameSrc).catch(function (err) {
       if (err.name !== 'AbortError') {
         setPlayerFrameSrc(null);
       }
     });
-    return () => {
+    return function () {
       abortCtrl.abort();
     };
-  }, [orgNameShort, materialVideoFile, materialVideoFileTrackerDisabled, mainLecturePageId, lms, lmsOrganizationBusinessType, eliceVideoPlayerUrl, autoPlay, autoPlayNext, endControl, locale]); //
+  }, [orgNameShort, materialVideoFile, materialVideoFileTrackerDisabled, mainLecturePageId, lms, lmsOrganizationBusinessType, eliceVideoPlayerUrl, autoPlay, autoPlayNext, endControl, locale, accountApi]);
+  //
   // Add event listener for navigating prev and next lecture page.
   //
-
-  React.useEffect(() => {
-    const _handle = event => {
+  React.useEffect(function () {
+    var _handle = function _handle(event) {
       var _a, _b, _c;
-
       try {
-        const edata = JSON.parse(event.data);
-
+        var edata = JSON.parse(event.data);
         if (edata.key !== ELICE_VIDEO_PLAYER_MESSAGE_EVENT || ((_a = edata.event) === null || _a === void 0 ? void 0 : _a.type) !== ELICE_VIDEO_PLAYER_MESSAGE_TYPE) {
           return;
         }
-
         switch ((_c = (_b = edata.event) === null || _b === void 0 ? void 0 : _b.args) === null || _c === void 0 ? void 0 : _c.direction) {
           case 'previous':
             if (typeof onNavigatePreviousLecturePage === 'function') {
               onNavigatePreviousLecturePage();
             }
-
             break;
-
           case 'next':
             if (typeof onNavigateNextLecturePage === 'function') {
               onNavigateNextLecturePage === null || onNavigateNextLecturePage === void 0 ? void 0 : onNavigateNextLecturePage();
             }
-
             break;
         }
-      } catch (_) {//
+      } catch (_) {
+        //
       }
     };
-
     window.addEventListener('message', _handle);
-    return () => {
+    return function () {
       window.removeEventListener('message', _handle);
     };
-  }, // eslint-disable-next-line react-hooks/exhaustive-deps
-  []); //
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  []);
+  //
   //
   //
   // pending
-
   if (materialVideoFileStatus === 'idle' || materialVideoFileStatus === 'pending' || materialVideoFileStatus === 'resolved' && !playerFrameSrc) {
     return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Spinner, null));
-  } // rejected / empty video
-
-
+  }
+  // rejected / empty video
   if (materialVideoFileStatus === 'rejected' || materialVideoFileUploadStatus === VideoUploadStatus.Empty) {
     return React.createElement(React.Fragment, {
       children: emptyComponent
     });
-  } // encoding
-
-
+  }
+  // encoding
   if (materialVideoFileUploadStatus === VideoUploadStatus.Encoding) {
     return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Spinner, null), React.createElement(Text, {
       role: "gray3",
@@ -185,9 +197,8 @@ const MaterialVideoFilePlayer = ({
     }, React.createElement(FormattedMessage, {
       id: "videoFile.player.encoding"
     })));
-  } // encoding failed
-
-
+  }
+  // encoding failed
   if (materialVideoFileUploadStatus === VideoUploadStatus.EncodingFailed) {
     return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Text, {
       role: "gray3",
@@ -197,9 +208,8 @@ const MaterialVideoFilePlayer = ({
     }, React.createElement(FormattedMessage, {
       id: "videoFile.player.encodingFailed"
     })));
-  } // resolved
-
-
+  }
+  // resolved
   return React.createElement(StyledVideoPlayerWrap, {
     className: classnames(prefixCls, className),
     src: playerFrameSrc,
@@ -208,7 +218,6 @@ const MaterialVideoFilePlayer = ({
     allowFullScreen: true
   });
 };
-
 var MaterialVideoFilePlayer$1 = Object.assign(MaterialVideoFilePlayer, {
   MimeType: VideoMimeType
 });

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

@@ -1,9 +1,9 @@
 import styled from 'styled-components';
 
-const StyledVideoPlayerWrap = styled.iframe.withConfig({
+var StyledVideoPlayerWrap = styled.iframe.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/locales.js

@@ -1,11 +1,11 @@
-const en = {
+var en = {
   'videoFile.player.preparing': 'Material on preparing.',
   'videoFile.player.uploadVideoBtn': 'Upload File',
   'videoFile.player.encoding': 'A video is being prepared.\nPlease check back later.',
   'videoFile.player.encodingFailed': 'There was a problem processing the video.\nIf the problem persists, please contact customer service.',
   'videoFile.player.noVideo': 'This file does not exist.'
 };
-const ko = {
+var ko = {
   'videoFile.player.preparing': '자료를 준비 중입니다.',
   'videoFile.player.uploadVideoBtn': '파일 업로드',
   'videoFile.player.encoding': '동영상을 준비 중 입니다.\n잠시 후 다시 확인해주세요.',

package/es/components/material-video-file/useMaterialVideoFileApi.d.ts

@@ -0,0 +1,12 @@
+import { AuthApi as EliceAccountAuthApi } from '@elice/openapi-client-account';
+import type { Configuration as EliceAccountApiConfiguration } from '@elice/openapi-client-account';
+export interface UseMaterialVideoFileApiProps {
+    eliceAccountApiConfiguration: EliceAccountApiConfiguration;
+}
+export interface UseMaterialVideoFileApiReturnMaterialRunbox {
+    auth: EliceAccountAuthApi;
+}
+export interface UseMaterialVideoFileApiReturn {
+    accountApi: UseMaterialVideoFileApiReturnMaterialRunbox;
+}
+export declare const useMaterialVideoFileApi: (props: UseMaterialVideoFileApiProps) => UseMaterialVideoFileApiReturn;

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elice/material-video-file",
-  "version": "1.230328.0",
+  "version": "1.230418.0",
   "description": "User view and editing components of Elice material video file",
   "repository": "https://git.elicer.io/elice/frontend/library/elice-material",
   "license": "UNLICENSED",
@@ -29,13 +29,14 @@
     "clean": "del-cli \"es/*\" \"cjs/*\" \"dist/*\""
   },
   "peerDependencies": {
-    "@elice/api-client": "1.230306.1",
+    "@elice/api-client": "^1.230413.0",
     "@elice/blocks": "^1.220803.0",
     "@elice/design-tokens": "^1.220803.0",
     "@elice/icons": "^1.220803.0",
     "@elice/material-shared-types": "*",
     "@elice/material-shared-utils": "*",
-    "@elice/types": "^1.230306.0",
+    "@elice/openapi-client-account": "^1.230302.0",
+    "@elice/types": "^1.230417.0",
     "react": "^16.8.0  || ^17.0.0 || ^18.0.0",
     "react-intl": "^5.0.0",
     "react-use": "^17.0.0",
@@ -47,14 +48,15 @@
     "tslib": "^2.3.1"
   },
   "devDependencies": {
-    "@elice/api-client": "1.230306.1",
+    "@elice/api-client": "^1.230413.0",
     "@elice/blocks": "^1.220803.0",
     "@elice/design-tokens": "^1.220803.0",
     "@elice/icons": "^1.220803.0",
     "@elice/icons-legacy": "npm:@elice/icons@0.220803.1",
-    "@elice/material-shared-types": "1.230328.0",
-    "@elice/material-shared-utils": "1.230328.0",
-    "@elice/types": "^1.230306.0",
+    "@elice/material-shared-types": "1.230418.0",
+    "@elice/material-shared-utils": "1.230418.0",
+    "@elice/openapi-client-account": "^1.230302.0",
+    "@elice/types": "^1.230417.0",
     "@types/classnames": "^2.3.1",
     "@types/query-string": "^6.3.0",
     "@types/react": "~17.0.9",
@@ -64,5 +66,5 @@
     "react-use": "^17.2.4",
     "styled-components": "^5.3.0"
   },
-  "gitHead": "c24abeffe609385031a77c725bf6e92e47e94b56"
+  "gitHead": "06d5f856939bdbb6bffa9eba30f2fab56d66129b"
 }