@elicecontents/content-ui 1.0.24-rc.2 → 1.0.24

package/cjs/components/layout/Layout.js

@@ -122,11 +122,11 @@ var Layout = function Layout(_ref) {
 var HeaderContainerInner = /*#__PURE__*/_styled__default.default(Stack, {
   target: "efnp08i6"
 })("production" === "production" ? {
-  name: "gwvfyq",
-  styles: "height:74px;width:100%;max-width:1200px;justify-content:space-between;flex-direction:row"
+  name: "14ia2gs",
+  styles: "height:74px;width:100%;justify-content:space-between;flex-direction:row"
 } : {
-  name: "gwvfyq",
-  styles: "height:74px;width:100%;max-width:1200px;justify-content:space-between;flex-direction:row",
+  name: "14ia2gs",
+  styles: "height:74px;width:100%;justify-content:space-between;flex-direction:row",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 var HeaderContainer = function HeaderContainer(_ref2) {
@@ -141,7 +141,7 @@ var HeaderTitle = LayoutHeaderTitle.default;
 var HeaderSubTitle = LayoutHeaderSubTitle.default;
 var ContentContainerInner = /*#__PURE__*/_styled__default.default(Stack, {
   target: "efnp08i5"
-})("flex:1;width:100%;max-width:1200px;max-height:calc(100vh - 74px - 92px);overflow-y:auto;min-height:0;position:relative;&::-webkit-scrollbar{width:8px;}&::-webkit-scrollbar-thumb{background-color:", function (_ref3) {
+})("flex:1;width:100%;max-height:calc(100vh - 74px - 92px);overflow-y:auto;min-height:0;position:relative;&::-webkit-scrollbar{width:8px;}&::-webkit-scrollbar-thumb{background-color:", function (_ref3) {
   var theme = _ref3.theme;
   return theme.palette.primary.main;
 }, ";border-radius:4px;}&::-webkit-scrollbar-track{background-color:", function (_ref4) {
@@ -211,22 +211,22 @@ var ContentContainer = function ContentContainer(_ref5) {
     };
   }, []);
   return jsxRuntime.jsxs(Stack, {
-    sx: Object.assign({
+    sx: {
       position: 'relative',
       width: '100%',
       height: '100%'
-    }, sx),
+    },
     children: [jsxRuntime.jsxs(ContentContainerInner, {
       ref: contentRef,
       theme: theme,
       flex: 1,
-      sx: {
+      sx: Object.assign(Object.assign({}, sx), {
         scrollbarWidth: 'none',
         msOverflowStyle: 'none',
         '&::-webkit-scrollbar': {
           display: 'none'
         }
-      },
+      }),
       children: [children, enableScrollTracking && hasScroll && !isScrollActive && jsxRuntime.jsx(ScrollMoreButton, {
         children: jsxRuntime.jsx(ScrollMoreIcon.default, {
           size: 32,

package/cjs/components/video/VideoV2.js

@@ -282,20 +282,118 @@ function EliceVideoV2(_ref3) {
     }), jsxRuntime.jsxs("video", {
       ref: function ref(r) {
         videoRef.current = r;
-        requestAnimationFrame(function () {
-          var player = videojs__default.default(r, Object.assign(Object.assign({}, options), {
-            disablePictureInPicture: true,
-            fluid: true
-          }));
-          playerRef.current = player;
-        });
-        return function () {
-          var _a;
-          if (playerRef.current) {
-            (_a = playerRef.current) === null || _a === void 0 ? void 0 : _a.dispose();
-            playerRef.current = null;
-          }
-        };
+        if (!videoRef.current) {
+          requestAnimationFrame(function () {
+            var player = videojs__default.default(r, defu(options, {
+              disablePictureInPicture: true,
+              fluid: true,
+              languages: {
+                ko: {
+                  "Audio Player": "오디오 플레이어",
+                  "Video Player": "비디오 플레이어",
+                  "Play": "재생",
+                  "Pause": "일시중지",
+                  "Replay": "다시 재생",
+                  "Current Time": "현재 시간",
+                  "Duration": "지정 기간",
+                  "Remaining Time": "남은 시간",
+                  "Stream Type": "스트리밍 유형",
+                  "LIVE": "라이브",
+                  "Seek to live, currently behind live": "Seek to Live, 현재 생중계보다 뒤처짐",
+                  "Seek to live, currently playing live": "Seek to Live, 현재 생중계 스트리밍 중",
+                  "Loaded": "로드됨",
+                  "Progress": "진행",
+                  "Progress Bar": "진행 표시줄",
+                  "progress bar timing: currentTime={1} duration={2}": "{2} 중 {1}",
+                  "Fullscreen": "전체 화면",
+                  "Exit Fullscreen": "전체 화면 해제",
+                  "Mute": "음소거",
+                  "Unmute": "음소거 해제",
+                  "Playback Rate": "재생 속도",
+                  "Subtitles": "자막",
+                  "subtitles off": "자막 끄기",
+                  "Captions": "자막",
+                  "captions off": "자막 끄기",
+                  "Chapters": "챕터",
+                  "Descriptions": "제품 설명",
+                  "descriptions off": "제품 설명 끄기",
+                  "Audio Track": "오디오 트랙",
+                  "Volume Level": "볼륨 레벨",
+                  "You aborted the media playback": "비디오 재생을 취소했습니다.",
+                  "A network error caused the media download to fail part-way.": "네트워크 오류로 인하여 비디오 일부를 다운로드하지 못 했습니다.",
+                  "The media could not be loaded, either because the server or network failed or because the format is not supported.": "비디오를 로드할 수 없습니다. 서버 혹은 네트워크 오류 때문이거나 지원되지 않는 형식 때문일 수 있습니다.",
+                  "The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "비디오 재생이 취소됐습니다. 비디오가 손상되었거나 비디오가 사용하는 기능을 브라우저에서 지원하지 않는 것 같습니다.",
+                  "No compatible source was found for this media.": "비디오에 호환되지 않는 소스가 있습니다.",
+                  "The media is encrypted and we do not have the keys to decrypt it.": "미디어는 암호화되어 있으며 이를 해독할 키를 갖고 있지 않습니다.",
+                  "Play Video": "영상 재생",
+                  "Close": "닫기",
+                  "Close Modal Dialog": "대화 상자 닫기",
+                  "Modal Window": "모달 창",
+                  "This is a modal window": "모달 창입니다",
+                  "This modal can be closed by pressing the Escape key or activating the close button.": "이 모달은 Esc 키를 누르거나 닫기 버튼을 활성화하여 닫을 수 있습니다.",
+                  ", opens captions settings dialog": ", 자막 설정 대화 상자가 열립니다",
+                  ", opens subtitles settings dialog": ", 자막 설정 대화 상자가 열립니다",
+                  ", opens descriptions settings dialog": ", 설명 설정 대화 상자가 열립니다",
+                  ", selected": ", 선택됨",
+                  "captions settings": "자막 설정",
+                  "subtitles settings": "자막 설정",
+                  "descriptions settings": "설명 설정",
+                  "Text": "텍스트",
+                  "White": "화이트",
+                  "Black": "블랙",
+                  "Red": "레드",
+                  "Green": "그린",
+                  "Blue": "블루",
+                  "Yellow": "옐로우",
+                  "Magenta": "마젠타",
+                  "Cyan": "씨엉",
+                  "Background": "배경",
+                  "Window": "창",
+                  "Transparent": "투명",
+                  "Semi-Transparent": "반투명",
+                  "Opaque": "불투명",
+                  "Font Size": "폰트 크기",
+                  "Text Edge Style": "텍스트 가장자리 스타일",
+                  "None": "없음",
+                  "Raised": "글자 위치 올림",
+                  "Depressed": "글자 위치 내림",
+                  "Uniform": "균일",
+                  "Drop shadow": "그림자 효과 넣기",
+                  "Font Family": "폰트 모음",
+                  "Proportional Sans-Serif": "비례 산세리프체",
+                  "Monospace Sans-Serif": "고정폭 산세리프체",
+                  "Proportional Serif": "비례 세리프체",
+                  "Monospace Serif": "고정폭 세리프체",
+                  "Casual": "캐주얼",
+                  "Script": "스크립트",
+                  "Small Caps": "소문자",
+                  "Reset": "리셋",
+                  "restore all settings to the default values": "모든 설정을 기본값으로 복원",
+                  "Done": "완료",
+                  "Caption Settings Dialog": "자막 설정 대화 상자",
+                  "Beginning of dialog window. Escape will cancel and close the window.": "대화창 시작. Esc 키를 누르면 취소되고 창이 닫힙니다.",
+                  "End of dialog window.": "대화창 종료",
+                  "{1} is loading.": "{1}이(가) 로딩 중입니다.",
+                  "Exit Picture-in-Picture": "Picture-in-Picture 종료",
+                  "Picture-in-Picture": "Picture-in-Picture",
+                  "No content": "콘텐츠 없음",
+                  "Color": "색상",
+                  "Opacity": "투명도",
+                  "Text Background": "텍스트 배경",
+                  "Caption Area Background": "자막 배경"
+                }
+              }
+            }));
+            playerRef.current = player;
+          });
+          return function () {
+            var _a;
+            if (playerRef.current) {
+              (_a = playerRef.current) === null || _a === void 0 ? void 0 : _a.dispose();
+              playerRef.current = null;
+            }
+          };
+        }
       },
       className: "video-js elice-video vjs-default-skin",
       children: [source.map(function (srcInfo) {

package/es/components/layout/Layout.js

@@ -115,11 +115,11 @@ var Layout = function Layout(_ref) {
 var HeaderContainerInner = /*#__PURE__*/_styled(Stack, {
   target: "efnp08i6"
 })("production" === "production" ? {
-  name: "gwvfyq",
-  styles: "height:74px;width:100%;max-width:1200px;justify-content:space-between;flex-direction:row"
+  name: "14ia2gs",
+  styles: "height:74px;width:100%;justify-content:space-between;flex-direction:row"
 } : {
-  name: "gwvfyq",
-  styles: "height:74px;width:100%;max-width:1200px;justify-content:space-between;flex-direction:row",
+  name: "14ia2gs",
+  styles: "height:74px;width:100%;justify-content:space-between;flex-direction:row",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 var HeaderContainer = function HeaderContainer(_ref2) {
@@ -134,7 +134,7 @@ var HeaderTitle = LayoutHeaderTitle;
 var HeaderSubTitle = LayoutHeaderSubTitle;
 var ContentContainerInner = /*#__PURE__*/_styled(Stack, {
   target: "efnp08i5"
-})("flex:1;width:100%;max-width:1200px;max-height:calc(100vh - 74px - 92px);overflow-y:auto;min-height:0;position:relative;&::-webkit-scrollbar{width:8px;}&::-webkit-scrollbar-thumb{background-color:", function (_ref3) {
+})("flex:1;width:100%;max-height:calc(100vh - 74px - 92px);overflow-y:auto;min-height:0;position:relative;&::-webkit-scrollbar{width:8px;}&::-webkit-scrollbar-thumb{background-color:", function (_ref3) {
   var theme = _ref3.theme;
   return theme.palette.primary.main;
 }, ";border-radius:4px;}&::-webkit-scrollbar-track{background-color:", function (_ref4) {
@@ -204,22 +204,22 @@ var ContentContainer = function ContentContainer(_ref5) {
     };
   }, []);
   return jsxs(Stack, {
-    sx: Object.assign({
+    sx: {
       position: 'relative',
       width: '100%',
       height: '100%'
-    }, sx),
+    },
     children: [jsxs(ContentContainerInner, {
       ref: contentRef,
       theme: theme,
       flex: 1,
-      sx: {
+      sx: Object.assign(Object.assign({}, sx), {
         scrollbarWidth: 'none',
         msOverflowStyle: 'none',
         '&::-webkit-scrollbar': {
           display: 'none'
         }
-      },
+      }),
       children: [children, enableScrollTracking && hasScroll && !isScrollActive && jsx(ScrollMoreButton, {
         children: jsx(ScrollMoreIcon, {
           size: 32,

package/es/components/video/VideoV2.js

@@ -275,20 +275,118 @@ function EliceVideoV2(_ref3) {
     }), jsxs("video", {
       ref: function ref(r) {
         videoRef.current = r;
-        requestAnimationFrame(function () {
-          var player = videojs(r, Object.assign(Object.assign({}, options), {
-            disablePictureInPicture: true,
-            fluid: true
-          }));
-          playerRef.current = player;
-        });
-        return function () {
-          var _a;
-          if (playerRef.current) {
-            (_a = playerRef.current) === null || _a === void 0 ? void 0 : _a.dispose();
-            playerRef.current = null;
-          }
-        };
+        if (!videoRef.current) {
+          requestAnimationFrame(function () {
+            var player = videojs(r, defu(options, {
+              disablePictureInPicture: true,
+              fluid: true,
+              languages: {
+                ko: {
+                  "Audio Player": "오디오 플레이어",
+                  "Video Player": "비디오 플레이어",
+                  "Play": "재생",
+                  "Pause": "일시중지",
+                  "Replay": "다시 재생",
+                  "Current Time": "현재 시간",
+                  "Duration": "지정 기간",
+                  "Remaining Time": "남은 시간",
+                  "Stream Type": "스트리밍 유형",
+                  "LIVE": "라이브",
+                  "Seek to live, currently behind live": "Seek to Live, 현재 생중계보다 뒤처짐",
+                  "Seek to live, currently playing live": "Seek to Live, 현재 생중계 스트리밍 중",
+                  "Loaded": "로드됨",
+                  "Progress": "진행",
+                  "Progress Bar": "진행 표시줄",
+                  "progress bar timing: currentTime={1} duration={2}": "{2} 중 {1}",
+                  "Fullscreen": "전체 화면",
+                  "Exit Fullscreen": "전체 화면 해제",
+                  "Mute": "음소거",
+                  "Unmute": "음소거 해제",
+                  "Playback Rate": "재생 속도",
+                  "Subtitles": "자막",
+                  "subtitles off": "자막 끄기",
+                  "Captions": "자막",
+                  "captions off": "자막 끄기",
+                  "Chapters": "챕터",
+                  "Descriptions": "제품 설명",
+                  "descriptions off": "제품 설명 끄기",
+                  "Audio Track": "오디오 트랙",
+                  "Volume Level": "볼륨 레벨",
+                  "You aborted the media playback": "비디오 재생을 취소했습니다.",
+                  "A network error caused the media download to fail part-way.": "네트워크 오류로 인하여 비디오 일부를 다운로드하지 못 했습니다.",
+                  "The media could not be loaded, either because the server or network failed or because the format is not supported.": "비디오를 로드할 수 없습니다. 서버 혹은 네트워크 오류 때문이거나 지원되지 않는 형식 때문일 수 있습니다.",
+                  "The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "비디오 재생이 취소됐습니다. 비디오가 손상되었거나 비디오가 사용하는 기능을 브라우저에서 지원하지 않는 것 같습니다.",
+                  "No compatible source was found for this media.": "비디오에 호환되지 않는 소스가 있습니다.",
+                  "The media is encrypted and we do not have the keys to decrypt it.": "미디어는 암호화되어 있으며 이를 해독할 키를 갖고 있지 않습니다.",
+                  "Play Video": "영상 재생",
+                  "Close": "닫기",
+                  "Close Modal Dialog": "대화 상자 닫기",
+                  "Modal Window": "모달 창",
+                  "This is a modal window": "모달 창입니다",
+                  "This modal can be closed by pressing the Escape key or activating the close button.": "이 모달은 Esc 키를 누르거나 닫기 버튼을 활성화하여 닫을 수 있습니다.",
+                  ", opens captions settings dialog": ", 자막 설정 대화 상자가 열립니다",
+                  ", opens subtitles settings dialog": ", 자막 설정 대화 상자가 열립니다",
+                  ", opens descriptions settings dialog": ", 설명 설정 대화 상자가 열립니다",
+                  ", selected": ", 선택됨",
+                  "captions settings": "자막 설정",
+                  "subtitles settings": "자막 설정",
+                  "descriptions settings": "설명 설정",
+                  "Text": "텍스트",
+                  "White": "화이트",
+                  "Black": "블랙",
+                  "Red": "레드",
+                  "Green": "그린",
+                  "Blue": "블루",
+                  "Yellow": "옐로우",
+                  "Magenta": "마젠타",
+                  "Cyan": "씨엉",
+                  "Background": "배경",
+                  "Window": "창",
+                  "Transparent": "투명",
+                  "Semi-Transparent": "반투명",
+                  "Opaque": "불투명",
+                  "Font Size": "폰트 크기",
+                  "Text Edge Style": "텍스트 가장자리 스타일",
+                  "None": "없음",
+                  "Raised": "글자 위치 올림",
+                  "Depressed": "글자 위치 내림",
+                  "Uniform": "균일",
+                  "Drop shadow": "그림자 효과 넣기",
+                  "Font Family": "폰트 모음",
+                  "Proportional Sans-Serif": "비례 산세리프체",
+                  "Monospace Sans-Serif": "고정폭 산세리프체",
+                  "Proportional Serif": "비례 세리프체",
+                  "Monospace Serif": "고정폭 세리프체",
+                  "Casual": "캐주얼",
+                  "Script": "스크립트",
+                  "Small Caps": "소문자",
+                  "Reset": "리셋",
+                  "restore all settings to the default values": "모든 설정을 기본값으로 복원",
+                  "Done": "완료",
+                  "Caption Settings Dialog": "자막 설정 대화 상자",
+                  "Beginning of dialog window. Escape will cancel and close the window.": "대화창 시작. Esc 키를 누르면 취소되고 창이 닫힙니다.",
+                  "End of dialog window.": "대화창 종료",
+                  "{1} is loading.": "{1}이(가) 로딩 중입니다.",
+                  "Exit Picture-in-Picture": "Picture-in-Picture 종료",
+                  "Picture-in-Picture": "Picture-in-Picture",
+                  "No content": "콘텐츠 없음",
+                  "Color": "색상",
+                  "Opacity": "투명도",
+                  "Text Background": "텍스트 배경",
+                  "Caption Area Background": "자막 배경"
+                }
+              }
+            }));
+            playerRef.current = player;
+          });
+          return function () {
+            var _a;
+            if (playerRef.current) {
+              (_a = playerRef.current) === null || _a === void 0 ? void 0 : _a.dispose();
+              playerRef.current = null;
+            }
+          };
+        }
       },
       className: "video-js elice-video vjs-default-skin",
       children: [source.map(function (srcInfo) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elicecontents/content-ui",
-  "version": "1.0.24-rc.2",
+  "version": "1.0.24",
   "description": "A set of UI components for creating content of Elice",
   "author": "Elice <contact@elice.io>",
   "license": "UNLICENSED",