@elice/material-runbox 1.231227.0 → 1.231228.0

package/cjs/components/material-runbox/runtime/RuntimeOverlayTerminated.js

@@ -2,7 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactIntl = require('react-intl');
 var iconsMaterial = require('@mui/icons-material');
@@ -13,36 +12,31 @@ require('../contexts/MaterialRunboxCommandContext.js');
 var MaterialRunboxContext = require('../contexts/MaterialRunboxContext.js');
 var terminated = require('../../../assets/terminated.png.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 //
 //
 //
-var RuntimeOverlayTerminated = function RuntimeOverlayTerminated(_ref) {
-  var reason = _ref.reason,
-    startRuntime = _ref.startRuntime;
-  var intl = reactIntl.useIntl();
-  var _useMaterialRunboxCon = MaterialRunboxContext.useMaterialRunboxContext(),
-    showMessenger = _useMaterialRunboxCon.showMessenger;
-  var _React$useState = React__default["default"].useState(false),
-    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
-    isRestarting = _React$useState2[0],
-    setRestarting = _React$useState2[1];
+const RuntimeOverlayTerminated = ({
+  reason,
+  startRuntime
+}) => {
+  const intl = reactIntl.useIntl();
+  const {
+    showMessenger
+  } = MaterialRunboxContext.useMaterialRunboxContext();
+  const [isRestarting, setRestarting] = React.useState(false);
   /**
    * Restart the project.
    */
-  var handleRestart = function handleRestart() {
+  const handleRestart = () => {
     setRestarting(true);
-    startRuntime().finally(function () {
+    startRuntime().finally(() => {
       setRestarting(false);
     });
   };
   /**
    * Terminated description and action.
    */
-  var runtimeTerminatedAction = React__default["default"].useMemo(function () {
+  const runtimeTerminatedAction = React.useMemo(() => {
     switch (reason) {
       // general shutdown
       case 'stopped_by_user':
@@ -90,7 +84,7 @@ var RuntimeOverlayTerminated = function RuntimeOverlayTerminated(_ref) {
   //
   //
   //
-  return React__default["default"].createElement(material.Box, {
+  return React.createElement(material.Box, {
     sx: {
       display: 'flex',
       justifyContent: 'center',
@@ -98,49 +92,49 @@ var RuntimeOverlayTerminated = function RuntimeOverlayTerminated(_ref) {
       width: '100%',
       height: '100%'
     }
-  }, React__default["default"].createElement(material.Stack, {
+  }, React.createElement(material.Stack, {
     gap: "1.5rem",
     alignItems: "center"
-  }, React__default["default"].createElement(material.Box, {
+  }, React.createElement(material.Box, {
     component: "img",
-    src: terminated["default"],
+    src: terminated.default,
     alt: "terminated",
     sx: {
       maxWidth: '10rem',
       height: 'auto'
     }
-  }), React__default["default"].createElement(material.Stack, {
+  }), React.createElement(material.Stack, {
     gap: "0.5rem"
-  }, React__default["default"].createElement(material.Typography, {
+  }, React.createElement(material.Typography, {
     variant: "h6",
     textAlign: "center"
-  }, React__default["default"].createElement(reactIntl.FormattedMessage, {
+  }, React.createElement(reactIntl.FormattedMessage, {
     id: "runbox.runtime.overlay.terminated.title"
-  })), React__default["default"].createElement(material.Typography, {
+  })), React.createElement(material.Typography, {
     variant: "body2",
     textAlign: "center",
     whiteSpace: "pre-line"
   }, runtimeTerminatedAction.unexpected ? runtimeTerminatedAction.description.concat('\n', intl.formatMessage({
     id: 'runbox.runtime.overlay.terminated.description.unexpected'
-  })) : runtimeTerminatedAction.description)), React__default["default"].createElement(material.Stack, {
+  })) : runtimeTerminatedAction.description)), React.createElement(material.Stack, {
     gap: "0.5rem",
     sx: {
       width: '100%',
       maxWidth: '17rem'
     }
-  }, React__default["default"].createElement(lab.LoadingButton, {
+  }, React.createElement(lab.LoadingButton, {
     variant: "contained",
     loading: isRestarting,
-    startIcon: React__default["default"].createElement(iconsMaterial.PlayArrow, null),
+    startIcon: React.createElement(iconsMaterial.PlayArrow, null),
     onClick: handleRestart
-  }, React__default["default"].createElement(reactIntl.FormattedMessage, {
+  }, React.createElement(reactIntl.FormattedMessage, {
     id: "runbox.runtime.overlay.terminated.restart"
-  })), runtimeTerminatedAction.unexpected && typeof showMessenger === 'function' ? React__default["default"].createElement(material.Button, {
+  })), runtimeTerminatedAction.unexpected && typeof showMessenger === 'function' ? React.createElement(material.Button, {
     variant: "text",
     onClick: showMessenger
-  }, React__default["default"].createElement(reactIntl.FormattedMessage, {
+  }, React.createElement(reactIntl.FormattedMessage, {
     id: "runbox.common.support"
   })) : null)));
 };
 
-exports["default"] = RuntimeOverlayTerminated;
+exports.default = RuntimeOverlayTerminated;

package/cjs/index.js

@@ -1,9 +1,7 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var MaterialRunbox = require('./components/material-runbox/MaterialRunbox.js');
 
 
 
-exports.MaterialRunbox = MaterialRunbox["default"];
+exports.MaterialRunbox = MaterialRunbox.default;

package/es/components/material-runbox/MaterialRunbox.js

@@ -11,15 +11,17 @@ import en from './locales/en.json.js';
 //
 //
 //
-var MaterialRunbox = function MaterialRunbox(_a) {
-  var _a$enableAutoShutdown = _a.enableAutoShutdownToggle,
-    enableAutoShutdownToggle = _a$enableAutoShutdown === void 0 ? false : _a$enableAutoShutdown,
-    _a$enableUrlShare = _a.enableUrlShare,
-    enableUrlShare = _a$enableUrlShare === void 0 ? false : _a$enableUrlShare,
-    _a$locale = _a.locale,
-    locale = _a$locale === void 0 ? 'ko' : _a$locale,
-    showMessenger = _a.showMessenger,
-    eliceMaterialRunboxApiConfiguration = _a.eliceMaterialRunboxApiConfiguration,
+const MaterialRunbox = _a => {
+  //
+  //
+  //
+  var {
+      enableAutoShutdownToggle = false,
+      enableUrlShare = false,
+      locale = 'ko',
+      showMessenger,
+      eliceMaterialRunboxApiConfiguration
+    } = _a,
     contentProps = __rest(_a, ["enableAutoShutdownToggle", "enableUrlShare", "locale", "showMessenger", "eliceMaterialRunboxApiConfiguration"]);
   return React.createElement(MaterialRunboxContextProvider, {
     enableAutoShutdownToggle: enableAutoShutdownToggle,

package/es/components/material-runbox/MaterialRunboxBody.js

@@ -1,17 +1,25 @@
-import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _styled from '@emotion/styled/base';
 import React from 'react';
-import styled from '@emotion/styled';
 import Runtime from './runtime/Runtime.js';
 
-var _templateObject;
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 //
 //
 //
-var StyledRunboxBody = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  width: 100%;\n"])));
+const StyledRunboxBody = /*#__PURE__*/_styled("div", {
+  target: "e9bwldp0"
+})("production" === "production" ? {
+  name: "277wu0",
+  styles: "flex:1;width:100%"
+} : {
+  name: "277wu0",
+  styles: "flex:1;width:100%",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
 //
 //
 //
-var MaterialRunboxBody = function MaterialRunboxBody(props) {
+const MaterialRunboxBody = props => {
   return React.createElement(StyledRunboxBody, null, React.createElement(Runtime, Object.assign({}, props)));
 };
 

package/es/components/material-runbox/MaterialRunboxContent.js

@@ -1,9 +1,8 @@
-import { taggedTemplateLiteral as _taggedTemplateLiteral, slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _styled from '@emotion/styled/base';
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
 import { Spinner } from '@elice/blocks';
 import { EliceRunboxProvider } from '@elice/runbox-client';
-import styled from '@emotion/styled';
 import { Refresh } from '@mui/icons-material';
 import { Stack, Typography, Button } from '@mui/material';
 import { useQuery } from '@tanstack/react-query';
@@ -14,77 +13,81 @@ import MaterialRunboxBody from './MaterialRunboxBody.js';
 import MaterialRunboxFooter from './MaterialRunboxFooter.js';
 import MaterialRunboxHeader from './MaterialRunboxHeader.js';
 
-var _templateObject;
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 //
 //
 //
-var DEFAULT_DATA = [null, null, null];
+const DEFAULT_DATA = [null, null, null];
 //
 //
 //
-var StyledRunboxContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n"])));
+const StyledRunboxContainer = /*#__PURE__*/_styled("div", {
+  target: "eeh98mq0"
+})("production" === "production" ? {
+  name: "t5t5sq",
+  styles: "display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%"
+} : {
+  name: "t5t5sq",
+  styles: "display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
 //
 //
 //
-var MaterialRunboxContent = function MaterialRunboxContent(_ref) {
-  var runboxId = _ref.runboxId,
-    courseId = _ref.courseId;
-  var _useMaterialRunboxCon = useMaterialRunboxContext(),
-    locale = _useMaterialRunboxCon.locale,
-    showMessenger = _useMaterialRunboxCon.showMessenger;
-  var materialRunboxApi = useMaterialRunboxApiContext();
+const MaterialRunboxContent = ({
+  runboxId,
+  courseId
+}) => {
+  const {
+    locale,
+    showMessenger
+  } = useMaterialRunboxContext();
+  const materialRunboxApi = useMaterialRunboxApiContext();
   //
   //
   //
-  var _useQuery = useQuery({
-      enabled: Boolean(runboxId),
-      queryKey: ['eliceMaterialRunboxRunboxApi.runboxRunboxIdGet', 'eliceMaterialRunboxRuntimeTemplateApi.runtimeTemplateRuntimeTemplateIdGet', runboxId, courseId],
-      queryFn: function queryFn(_ref2) {
-        var signal = _ref2.signal;
-        return materialRunboxApi.runbox.runboxRunboxIdGet({
-          runboxId: runboxId,
-          eliceCourseId: courseId
-        }, {
-          signal: signal
-        }).then(function (runbox) {
-          return Promise.all([
-          // runbox
-          runbox,
-          // runtime
-          materialRunboxApi.runtime.runtimeGet({
-            filterImageId: runbox.imageId,
-            filterRuntimeTemplateId: runbox.runtimeTemplateId,
-            skip: 0,
-            count: 1,
-            eliceCourseId: courseId
-          }, {
-            signal: signal
-          }).then(function (runtimes) {
-            var _a;
-            return (_a = runtimes[0]) !== null && _a !== void 0 ? _a : null;
-          }),
-          // runtimeTemplate
-          materialRunboxApi.runtimeTemplate.runtimeTemplateRuntimeTemplateIdGet({
-            runtimeTemplateId: runbox.runtimeTemplateId,
-            eliceCourseId: courseId
-          }, {
-            signal: signal
-          })]);
-        });
-      },
-      cacheTime: 0,
-      keepPreviousData: true,
-      refetchOnWindowFocus: false
+  const {
+    data: [runbox, runtime, runtimeTemplate] = DEFAULT_DATA,
+    isInitialLoading,
+    isError,
+    refetch
+  } = useQuery({
+    enabled: Boolean(runboxId),
+    queryKey: ['eliceMaterialRunboxRunboxApi.runboxRunboxIdGet', 'eliceMaterialRunboxRuntimeTemplateApi.runtimeTemplateRuntimeTemplateIdGet', runboxId, courseId],
+    queryFn: ({
+      signal
+    }) => materialRunboxApi.runbox.runboxRunboxIdGet({
+      runboxId: runboxId,
+      eliceCourseId: courseId
+    }, {
+      signal
+    }).then(runbox => Promise.all([
+    // runbox
+    runbox,
+    // runtime
+    materialRunboxApi.runtime.runtimeGet({
+      filterImageId: runbox.imageId,
+      filterRuntimeTemplateId: runbox.runtimeTemplateId,
+      skip: 0,
+      count: 1,
+      eliceCourseId: courseId
+    }, {
+      signal
+    }).then(runtimes => {
+      var _a;
+      return (_a = runtimes[0]) !== null && _a !== void 0 ? _a : null;
     }),
-    _useQuery$data = _useQuery.data,
-    _useQuery$data2 = _useQuery$data === void 0 ? DEFAULT_DATA : _useQuery$data,
-    _useQuery$data3 = _slicedToArray(_useQuery$data2, 3),
-    runbox = _useQuery$data3[0],
-    runtime = _useQuery$data3[1],
-    runtimeTemplate = _useQuery$data3[2],
-    isInitialLoading = _useQuery.isInitialLoading,
-    isError = _useQuery.isError,
-    refetch = _useQuery.refetch;
+    // runtimeTemplate
+    materialRunboxApi.runtimeTemplate.runtimeTemplateRuntimeTemplateIdGet({
+      runtimeTemplateId: runbox.runtimeTemplateId,
+      eliceCourseId: courseId
+    }, {
+      signal
+    })])),
+    cacheTime: 0,
+    keepPreviousData: true,
+    refetchOnWindowFocus: false
+  });
   //
   //
   //
@@ -102,16 +105,12 @@ var MaterialRunboxContent = function MaterialRunboxContent(_ref) {
       gap: "0.5rem"
     }, React.createElement(Button, {
       startIcon: React.createElement(Refresh, null),
-      onClick: function onClick() {
-        return refetch();
-      }
+      onClick: () => refetch()
     }, React.createElement(FormattedMessage, {
       id: "runbox.common.retry"
     })), typeof showMessenger === 'function' ? React.createElement(Button, {
       variant: "outlined",
-      onClick: function onClick() {
-        return showMessenger();
-      }
+      onClick: () => showMessenger()
     }, React.createElement(FormattedMessage, {
       id: "runbox.common.support"
     })) : null)));
@@ -119,28 +118,27 @@ var MaterialRunboxContent = function MaterialRunboxContent(_ref) {
   if (!runbox || !runtimeTemplate) {
     return null;
   }
-  var props = {
-    runbox: runbox,
-    runtime: runtime,
-    runtimeTemplate: runtimeTemplate,
-    courseId: courseId,
-    refetch: refetch
+  const props = {
+    runbox,
+    runtime,
+    runtimeTemplate,
+    courseId,
+    refetch
   };
   return React.createElement(MaterialRunboxCommandContextProvider, {
     runtime: runtime,
     courseId: courseId
   }, React.createElement(EliceRunboxProvider, {
     runboxId: runbox.id,
-    runboxApiHeartbeat: function runboxApiHeartbeat(_ref3) {
-      var id = _ref3.id,
-        signal = _ref3.signal;
-      return materialRunboxApi.runbox.runboxRunboxIdHeartbeatPost({
-        runboxId: id,
-        eliceCourseId: courseId
-      }, {
-        signal: signal
-      });
-    },
+    runboxApiHeartbeat: ({
+      id,
+      signal
+    }) => materialRunboxApi.runbox.runboxRunboxIdHeartbeatPost({
+      runboxId: id,
+      eliceCourseId: courseId
+    }, {
+      signal
+    }),
     locale: locale,
     onRunboxRefetchRequest: refetch
   }, React.createElement(StyledRunboxContainer, null, React.createElement(MaterialRunboxHeader, Object.assign({}, props)), React.createElement(MaterialRunboxBody, Object.assign({}, props)), React.createElement(MaterialRunboxFooter, Object.assign({}, props)))));

package/es/components/material-runbox/MaterialRunboxFooter.js

@@ -1,26 +1,26 @@
-import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _styled from '@emotion/styled/base';
 import React from 'react';
 import { EliceRunboxResourceStat, EliceRunboxRemainingTimer, EliceRunboxNetworkStat, EliceRunboxRunningStatus } from '@elice/runbox-client';
-import styled from '@emotion/styled';
 import { Box, Stack, Divider } from '@mui/material';
 
-var _templateObject;
 //
 //
 //
-var StyledFooter = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  flex: 0 0 2rem;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 0 1rem;\n  width: 100%;\n  border-top: 1px solid ", ";\n"])), function (_ref) {
-  var theme = _ref.theme;
-  return theme.palette.divider;
-});
+const StyledFooter = /*#__PURE__*/_styled("div", {
+  target: "e9lbhtr0"
+})("position:relative;flex:0 0 2rem;display:flex;justify-content:space-between;align-items:center;padding:0 1rem;width:100%;border-top:1px solid ", ({
+  theme
+}) => theme.palette.divider, ";");
 //
 //
 //
-var MaterialRunboxFooter = function MaterialRunboxFooter(_ref2) {
-  var runtimeTemplate = _ref2.runtimeTemplate;
+const MaterialRunboxFooter = ({
+  runtimeTemplate
+}) => {
   /**
    * Resource stats
    */
-  var renderFooterResourceStats = function renderFooterResourceStats() {
+  const renderFooterResourceStats = () => {
     var _a, _b;
     return React.createElement(Box, null, React.createElement(EliceRunboxResourceStat, {
       gpu: ((_b = (_a = runtimeTemplate.gpus) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0
@@ -29,7 +29,7 @@ var MaterialRunboxFooter = function MaterialRunboxFooter(_ref2) {
   /**
    * Status
    */
-  var renderFooterStatus = function renderFooterStatus() {
+  const renderFooterStatus = () => {
     return React.createElement(Stack, {
       direction: "row",
       gap: "0.5rem",

package/es/components/material-runbox/MaterialRunboxHeader.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
 import type { RuntimeProps } from './runtime/Runtime';
+export type RunboxHeaderOptionProps = {
+    onMenuClose: () => void;
+};
 declare const MaterialRunboxHeader: React.FC<RuntimeProps>;
 export default MaterialRunboxHeader;