@elice/material-video-file 1.240718.0-trasncript.2 → 1.240718.1

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

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

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

@@ -3,7 +3,6 @@
 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');
@@ -16,53 +15,49 @@ 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);
-
 //
 //
 //
-var MaterialVideoFile = function MaterialVideoFile(_a) {
+const MaterialVideoFile = _a => {
   var _b, _c, _d, _e;
-  var materialVideoFileId = _a.materialVideoFileId,
-    className = _a.className,
-    eliceAccountApiConfiguration = _a.eliceAccountApiConfiguration,
-    __intl = _a.__intl,
+  var {
+      materialVideoFileId,
+      className,
+      eliceAccountApiConfiguration,
+      __intl
+    } = _a,
     playerProps = tslib.__rest(_a, ["materialVideoFileId", "className", "eliceAccountApiConfiguration", "__intl"]);
-  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;
+  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);
   //
   //
   //
-  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
-      }))
-    })
-  });
+  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
+  }))));
 };
 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,11 +3,7 @@
 var designTokens = require('@elice/design-tokens');
 var styled = require('styled-components');
 
-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({
+const StyledMaterialVideoFileWrap = styled.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

@@ -38,8 +38,6 @@ export interface MaterialVideoFilePlayerProps extends UseMaterialVideoFileApiRet
     onNavigatePreviousLecturePage?: () => void;
     /** Navigate to next lecture page. */
     onNavigateNextLecturePage?: () => void;
-    /** Toggle transcript. */
-    onTranscriptToggle?: (enabled: boolean) => void;
 }
 declare const MaterialVideoFilePlayer: React.FC<MaterialVideoFilePlayerProps>;
 export default MaterialVideoFilePlayer;

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

@@ -2,7 +2,6 @@
 
 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');
@@ -10,11 +9,6 @@ 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);
-
 //
 //
 //
@@ -28,39 +22,31 @@ var VideoUploadStatus;
 //
 //
 //
-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,
-    _onTranscriptToggle = _ref.onTranscriptToggle,
-    accountApi = _ref.accountApi;
+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 _a;
-  var prefixCls = 'em-video-player';
-  var intl$1 = intl.useRawEliceIntl();
+  const prefixCls = 'em-video-player';
+  const intl$1 = intl.useRawEliceIntl();
   /**
    * Current video status.
    */
-  var materialVideoFileUploadStatus = React__default.default.useMemo(function () {
+  const materialVideoFileUploadStatus = React.useMemo(() => {
     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') {
@@ -100,47 +86,39 @@ var MaterialVideoFilePlayer = function MaterialVideoFilePlayer(_ref) {
   //
   // pending
   if (materialVideoFileStatus === 'idle' || materialVideoFileStatus === 'pending') {
-    return jsxRuntime.jsx(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, {
-      children: jsxRuntime.jsx(blocks.Spinner, {})
-    });
+    return React.createElement(MaterialVideoFilePlayer_styled.StyledVideoPlayerLoading, null, React.createElement(blocks.Spinner, null));
   }
   // rejected / empty video
   if (materialVideoFileStatus === 'rejected' || materialVideoFileUploadStatus === VideoUploadStatus.Empty) {
-    return jsxRuntime.jsx(React__default.default.Fragment, {
+    return React.createElement(React.Fragment, {
       children: emptyComponent
     });
   }
   // encoding
   if (materialVideoFileUploadStatus === VideoUploadStatus.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'
-        })
-      })]
-    });
+    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'
+    })));
   }
   // encoding failed
   if (materialVideoFileUploadStatus === VideoUploadStatus.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'
-        })
-      })
-    });
+    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'
+    })));
   }
   // resolved
-  return jsxRuntime.jsx(MaterialVideoFilePlayer_styled.StyledVideoPlayer, {
-    className: classnames__default.default(prefixCls, className),
+  return React.createElement(MaterialVideoFilePlayer_styled.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,
     linkedMaterialId: mainLecturePageId,
@@ -150,22 +128,13 @@ var MaterialVideoFilePlayer = function MaterialVideoFilePlayer(_ref) {
     noEndControl: !endControl,
     noTracker: materialVideoFileTrackerDisabled,
     playerBaseUrl: eliceVideoPlayerUrl,
-    otp: function otp() {
-      return accountApi.auth.authOtpPost().then(function (res) {
-        return res.otp;
-      });
-    },
-    onLecturePageNavigate: function onLecturePageNavigate(dir) {
+    otp: () => accountApi.auth.authOtpPost().then(res => res.otp),
+    onLecturePageNavigate: dir => {
       if (dir === 'prev' && onNavigatePreviousLecturePage) {
         onNavigatePreviousLecturePage();
       } else if (dir === 'next' && onNavigateNextLecturePage) {
         onNavigateNextLecturePage();
       }
-    },
-    onTranscriptToggle: function onTranscriptToggle(enabled) {
-      if (typeof _onTranscriptToggle === 'function') {
-        _onTranscriptToggle(enabled);
-      }
     }
   });
 };

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

@@ -3,14 +3,10 @@
 var videoplayerClient = require('@elice/videoplayer-client');
 var styled = require('styled-components');
 
-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({
+const StyledVideoPlayer = styled(videoplayerClient.EliceVideoplayer).withConfig({
   componentId: "sc-1ocq3lp-0"
 })(["width:100%;height:100%;border:0;"]);
-var StyledVideoPlayerLoading = styled__default.default.div.withConfig({
+const StyledVideoPlayerLoading = styled.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/useMaterialVideoFileApi.js

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

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

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

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

@@ -1,5 +1,4 @@
 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';
@@ -15,45 +14,46 @@ import { StyledMaterialVideoFileWrap } from './MaterialVideoFile.styled.js';
 //
 //
 //
-var MaterialVideoFile = function MaterialVideoFile(_a) {
+const MaterialVideoFile = _a => {
   var _b, _c, _d, _e;
-  var materialVideoFileId = _a.materialVideoFileId,
-    className = _a.className,
-    eliceAccountApiConfiguration = _a.eliceAccountApiConfiguration,
-    __intl = _a.__intl,
+  var {
+      materialVideoFileId,
+      className,
+      eliceAccountApiConfiguration,
+      __intl
+    } = _a,
     playerProps = __rest(_a, ["materialVideoFileId", "className", "eliceAccountApiConfiguration", "__intl"]);
-  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;
+  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);
   //
   //
   //
-  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
-      }))
-    })
-  });
+  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
+  }))));
 };
 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';
 
-var StyledMaterialVideoFileWrap = styled.div.withConfig({
+const 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

@@ -38,8 +38,6 @@ export interface MaterialVideoFilePlayerProps extends UseMaterialVideoFileApiRet
     onNavigatePreviousLecturePage?: () => void;
     /** Navigate to next lecture page. */
     onNavigateNextLecturePage?: () => void;
-    /** Toggle transcript. */
-    onTranscriptToggle?: (enabled: boolean) => void;
 }
 declare const MaterialVideoFilePlayer: React.FC<MaterialVideoFilePlayerProps>;
 export default MaterialVideoFilePlayer;

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

@@ -1,4 +1,3 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import { Spinner, Text } from '@elice/blocks';
 import { useRawEliceIntl } from '@elice/intl';
@@ -19,39 +18,31 @@ var VideoUploadStatus;
 //
 //
 //
-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,
-    _onTranscriptToggle = _ref.onTranscriptToggle,
-    accountApi = _ref.accountApi;
+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 _a;
-  var prefixCls = 'em-video-player';
-  var intl = useRawEliceIntl();
+  const prefixCls = 'em-video-player';
+  const intl = useRawEliceIntl();
   /**
    * Current video status.
    */
-  var materialVideoFileUploadStatus = React.useMemo(function () {
+  const materialVideoFileUploadStatus = React.useMemo(() => {
     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') {
@@ -91,46 +82,38 @@ var MaterialVideoFilePlayer = function MaterialVideoFilePlayer(_ref) {
   //
   // pending
   if (materialVideoFileStatus === 'idle' || materialVideoFileStatus === 'pending') {
-    return jsx(StyledVideoPlayerLoading, {
-      children: jsx(Spinner, {})
-    });
+    return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Spinner, null));
   }
   // rejected / empty video
   if (materialVideoFileStatus === 'rejected' || materialVideoFileUploadStatus === VideoUploadStatus.Empty) {
-    return jsx(React.Fragment, {
+    return React.createElement(React.Fragment, {
       children: emptyComponent
     });
   }
   // encoding
   if (materialVideoFileUploadStatus === VideoUploadStatus.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'
-        })
-      })]
-    });
+    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'
+    })));
   }
   // encoding failed
   if (materialVideoFileUploadStatus === VideoUploadStatus.EncodingFailed) {
-    return jsx(StyledVideoPlayerLoading, {
-      children: jsx(Text, {
-        role: "gray3",
-        lineHeight: 1.5,
-        textAlign: "center",
-        preWrap: true,
-        children: intl.formatMessage({
-          id: 'videoFile.player.encodingFailed'
-        })
-      })
-    });
+    return React.createElement(StyledVideoPlayerLoading, null, React.createElement(Text, {
+      role: "gray3",
+      lineHeight: 1.5,
+      textAlign: "center",
+      preWrap: true
+    }, intl.formatMessage({
+      id: 'videoFile.player.encodingFailed'
+    })));
   }
   // resolved
-  return jsx(StyledVideoPlayer, {
+  return React.createElement(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,
@@ -141,22 +124,13 @@ var MaterialVideoFilePlayer = function MaterialVideoFilePlayer(_ref) {
     noEndControl: !endControl,
     noTracker: materialVideoFileTrackerDisabled,
     playerBaseUrl: eliceVideoPlayerUrl,
-    otp: function otp() {
-      return accountApi.auth.authOtpPost().then(function (res) {
-        return res.otp;
-      });
-    },
-    onLecturePageNavigate: function onLecturePageNavigate(dir) {
+    otp: () => accountApi.auth.authOtpPost().then(res => res.otp),
+    onLecturePageNavigate: dir => {
       if (dir === 'prev' && onNavigatePreviousLecturePage) {
         onNavigatePreviousLecturePage();
       } else if (dir === 'next' && onNavigateNextLecturePage) {
         onNavigateNextLecturePage();
       }
-    },
-    onTranscriptToggle: function onTranscriptToggle(enabled) {
-      if (typeof _onTranscriptToggle === 'function') {
-        _onTranscriptToggle(enabled);
-      }
     }
   });
 };

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

@@ -1,10 +1,10 @@
 import { EliceVideoplayer } from '@elice/videoplayer-client';
 import styled from 'styled-components';
 
-var StyledVideoPlayer = styled(EliceVideoplayer).withConfig({
+const StyledVideoPlayer = styled(EliceVideoplayer).withConfig({
   componentId: "sc-1ocq3lp-0"
 })(["width:100%;height:100%;border:0;"]);
-var StyledVideoPlayerLoading = styled.div.withConfig({
+const 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/useMaterialVideoFileApi.js

@@ -1,33 +1,25 @@
-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({});
+const useMaterialVideoFileApi = props => {
+  const _return = useRef({});
   //
   //
   //
-  var createAccountApi = function createAccountApi() {
-    return Object.freeze({
-      auth: new AuthApi(props.eliceAccountApiConfiguration)
-    });
-  };
+  const createAccountApi = () => Object.freeze({
+    auth: new AuthApi(props.eliceAccountApiConfiguration)
+  });
   //
   //
   //
-  var _useState = useState(createAccountApi),
-    _useState2 = _slicedToArray(_useState, 2),
-    accountApi = _useState2[0],
-    setAccountApi = _useState2[1];
+  const [accountApi, setAccountApi] = useState(createAccountApi);
   //
   //
   //
-  useEffect(function () {
-    return setAccountApi(createAccountApi);
-  },
+  useEffect(() => 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.0-trasncript.2",
+  "version": "1.240718.1",
   "description": "User view and editing components of Elice material video file",
   "repository": "https://git.elicer.io/elice/frontend/library/elice-material",
   "license": "UNLICENSED",
@@ -17,8 +17,10 @@
   "scripts": {
     "start": "run-s watch",
     "prebuild": "run-s clean",
-    "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",
+    "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",
     "lint": "eslint --ext .ts,.tsx ./src --max-warnings=0",
     "clean": "del-cli \"es/*\" \"cjs/*\" \"dist/*\""
   },
@@ -45,17 +47,17 @@
   },
   "devDependencies": {
     "@elice/api-client": "1.240619.0",
-    "@elice/blocks": "^1.240529.0",
+    "@elice/blocks": "^1.240514.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.0-trasncript.2",
-    "@elice/material-shared-utils": "1.240718.0-trasncript.2",
+    "@elice/material-shared-types": "1.240718.1",
+    "@elice/material-shared-utils": "1.240718.1",
     "@elice/messenger": "^1.240426.0",
     "@elice/openapi-client-account": "^1.230814.0",
-    "@elice/types": "^1.240709.0",
-    "@elice/videoplayer-client": "^2.240717.0-transcript.0",
+    "@elice/types": "1.240619.0",
+    "@elice/videoplayer-client": "^2.240618.1",
     "@types/classnames": "^2.3.1",
     "@types/query-string": "^6.3.0",
     "@types/react": "~17.0.9",
@@ -63,5 +65,6 @@
     "react": "^17.0.2",
     "react-use": "^17.2.4",
     "styled-components": "^5.3.0"
-  }
+  },
+  "gitHead": "c1b2b8f98c5eed547941a327188a09f6ed21f6e4"
 }

package/cjs/_virtual/_rollupPluginBabelHelpers.js

@@ -1,55 +0,0 @@
-'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/index.js

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

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

@@ -1,13 +0,0 @@
-'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/es/_virtual/_rollupPluginBabelHelpers.js

@@ -1,48 +0,0 @@
-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/index.js

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

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

@@ -1,4 +0,0 @@
-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';