@elice/material-exercise 1.260429.0-improvetimerpopoverui.0 → 1.260430.0

package/cjs/components/material-exercise/exercise-runner/ExerciseRunnerControllerButtonGroup.js

@@ -2,228 +2,22 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
-var _styled = require('@emotion/styled/base');
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var blocks = require('@elice/blocks');
-var intl = require('@elice/intl');
-var muiSystem = require('@elice/mui-system');
-var types = require('@elice/types');
-var websocket = require('@elice/websocket');
-var recoil = require('recoil');
-var ExerciseRunnerContext = require('./ExerciseRunnerContext.js');
-var recoil$1 = require('../context/recoil.js');
-var useExericseShortcut = require('../../../hooks/useExericseShortcut.js');
-var context = require('../context/context.js');
-var useExerciseFile = require('../../../hooks/useExerciseFile.js');
-var subjects = require('../context/subjects.js');
+var material = require('@mui/material');
+var ControllerActionRun = require('./action/ControllerActionRun.js');
+var ControllerActionGrade = require('./action/ControllerActionGrade.js');
+var ControllerActionCancel = require('./action/ControllerActionCancel.js');
+var ControllerActionSyncRequest = require('./action/ControllerActionSyncRequest.js');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var _styled__default = /*#__PURE__*/_interopDefaultCompat(_styled);
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-
-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 StyledControllerButton = /*#__PURE__*/_styled__default.default(blocks.Button, {
-  target: "e45p2z2"
-})("position:relative;transition:none;&.eb-button--role-danger{border-color:", muiSystem.colors.red[700], ";background-color:", muiSystem.colors.red[700], ";}");
-var StyledControllerButtonWrap = /*#__PURE__*/_styled__default.default("div", {
-  target: "e45p2z1"
-})("production" === "production" ? {
-  name: "zjik7",
-  styles: "display:flex"
-} : {
-  name: "zjik7",
-  styles: "display:flex",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var StyledControllerButtonGroup = /*#__PURE__*/_styled__default.default("div", {
-  target: "e45p2z0"
-})("display:flex;flex-direction:row;align-items:center;>", StyledControllerButtonWrap, ",>", StyledControllerButton, "{margin-right:0.5rem;&:last-child{margin-right:0;}}");
+//
+//
+//
 var ExerciseRunnerControllerButtonGroup = function ExerciseRunnerControllerButtonGroup() {
-  var _a;
-  var intl$1 = intl.useRawEliceIntl();
-  var _React$useContext = React__default.default.useContext(context.ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId;
-  var _React$useContext2 = React__default.default.useContext(ExerciseRunnerContext.ExerciseRunnerContext),
-    onSubmit = _React$useContext2.onSubmit,
-    onSyncRequest = _React$useContext2.onSyncRequest,
-    onCancel = _React$useContext2.onCancel;
-  var activeFilename = recoil.useRecoilValue(recoil$1.exerciseActiveFilenameState);
-  var isFileEditable = useExerciseFile.useExerciseFileEditable(activeFilename);
-  var runnerWebsocketStatus = recoil.useRecoilValue(recoil$1.exerciseWebSocketTotalStatusQuery([].concat(_rollupPluginBabelHelpers.toConsumableArray(isFileEditable ? ['usercodeEdit'] : []), ['runnerRoom', 'stdio'])));
-  var exercise = recoil.useRecoilValue(recoil$1.exerciseState(materialExerciseId));
-  var exerciseRunType = recoil.useRecoilValue(recoil$1.exerciseRunnerRunTypeState);
-  var exerciseWithNoGrade = Boolean(exercise === null || exercise === void 0 ? void 0 : exercise.isNoSubmitGrade);
-  var lecture = recoil.useRecoilValue(recoil$1.exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
-  var isTestLecture = (lecture === null || lecture === void 0 ? void 0 : lecture.lectureType) === types.enums.LectureType.Test;
-  var isTestLectureCompleted = (lecture === null || lecture === void 0 ? void 0 : lecture.testAdmissionStatus) === types.enums.TestAdmissionStatus.Completed;
-  // runner states
-  var isSubmitting = recoil.useRecoilValue(recoil$1.exerciseRunnerSubmittingState);
-  var isRunning = recoil.useRecoilValue(recoil$1.exerciseRunnerRunningState);
-  var isConnecting = runnerWebsocketStatus === websocket.EliceWebSocket.CONNECTING;
-  var isNotReady = runnerWebsocketStatus !== websocket.EliceWebSocket.OPEN;
-  // arduino
-  var isArduinoExercise = (exercise === null || exercise === void 0 ? void 0 : exercise.envType) === types.enums.ExerciseEnvType.Arduino;
-  var arduinoUploadProgress = recoil.useRecoilValue(recoil$1.exerciseArduinoUploadProgressState);
-  var arduinoOpenedPortName = recoil.useRecoilValue(recoil$1.exerciseArduinoOpenedPortNameState);
-  //
-  // ========= ui states =========
-  //
-  // submit run
-  var isSubmitRunHidden = isRunning;
-  var isSubmitRunArduinoDisabled = isArduinoExercise ? arduinoUploadProgress !== 'ready' && arduinoUploadProgress !== 'error' || !arduinoOpenedPortName : false;
-  var isSubmitRunDisabled = isSubmitRunHidden || isSubmitRunArduinoDisabled || isNotReady || isConnecting || isSubmitting;
-  // submit grade
-  var isSubmitGradeHidden = isRunning;
-  var isSubmitGradeDisabled = isSubmitGradeHidden || exerciseWithNoGrade || isTestLecture && isTestLectureCompleted || isNotReady || isConnecting || isSubmitting;
-  // cancel
-  var isCancelHidden = !isRunning;
-  var isCancelDisabled = isCancelHidden || isNotReady || isConnecting;
-  // sync request
-  var isSyncRequestHidden = !isRunning || !((_a = exercise === null || exercise === void 0 ? void 0 : exercise.readyExerciseImage) === null || _a === void 0 ? void 0 : _a.httpPort);
-  var isSyncRequestDisabled = isSyncRequestHidden || isNotReady || isConnecting;
-  //
-  //
-  //
-  /**
-   * Submit to run
-   */
-  var handleSubmitRun = function handleSubmitRun() {
-    if (!isSubmitRunDisabled) {
-      void onSubmit(types.enums.ExerciseRunType.Run);
-    }
-  };
-  /**
-   * Submit to grade
-   */
-  var handleSubmitGrade = function handleSubmitGrade() {
-    if (!isSubmitGradeDisabled) {
-      void onSubmit(types.enums.ExerciseRunType.Grade);
-    }
-  };
-  /**
-   * Cancel
-   */
-  var handleCancel = function handleCancel() {
-    if (!isCancelDisabled) {
-      onCancel();
-    }
-  };
-  /**
-   * Sync request
-   */
-  var handleSyncRequest = function handleSyncRequest() {
-    if (!isSyncRequestDisabled) {
-      onSyncRequest();
-    }
-  };
-  //
-  // keyboard shortcuts to control runner
-  //
-  useExericseShortcut.useExericseShortcut('RUNNER_SUBMIT_RUN', handleSubmitRun);
-  useExericseShortcut.useExericseShortcut('RUNNER_SUBMIT_GRADE', handleSubmitGrade);
-  useExericseShortcut.useExericseShortcut('RUNNER_CANCEL', handleCancel);
-  useExericseShortcut.useExericseShortcut('RUNNER_SYNC_REQUEST', handleSyncRequest);
-  //
-  // handle save action emitted by file editor
-  //
-  React__default.default.useEffect(function () {
-    var saveActionSub = subjects.exerciseFileEditorSaveAction$.subscribe(handleSyncRequest);
-    return function () {
-      saveActionSub.unsubscribe();
-    };
-  },
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [isSyncRequestDisabled]);
-  /**
-   * Submit to run button
-   */
-  var renderSubmitRunButton = function renderSubmitRunButton() {
-    if (isSubmitRunHidden) {
-      return null;
-    }
-    return jsxRuntime.jsx(StyledControllerButton, {
-      size: "tiny",
-      loading: isConnecting || isSubmitting && exerciseRunType === types.enums.ExerciseRunType.Run,
-      disabled: isSubmitRunDisabled,
-      onClick: handleSubmitRun,
-      children: isArduinoExercise ? intl$1.formatMessage({
-        id: 'exerciseRunner.controller.buttonGroup.button.compile'
-      }) : intl$1.formatMessage({
-        id: 'exerciseRunner.controller.buttonGroup.button.run'
-      })
-    });
-  };
-  /**
-   * Submit to grade button
-   */
-  var renderSubmitGradeButton = function renderSubmitGradeButton() {
-    if (isSubmitGradeHidden) {
-      return null;
-    }
-    return jsxRuntime.jsx(blocks.Tooltip, {
-      dark: true,
-      title: exerciseWithNoGrade ? intl$1.formatMessage({
-        id: 'exerciseRunner.controller.buttonGroup.button.submit.tooltip.noSubmit'
-      }) : undefined,
-      placement: "top",
-      children: jsxRuntime.jsx(StyledControllerButtonWrap, {
-        children: jsxRuntime.jsx(StyledControllerButton, {
-          size: "tiny",
-          role: "secondary",
-          loading: isConnecting || isSubmitting && exerciseRunType === types.enums.ExerciseRunType.Grade,
-          disabled: isSubmitGradeDisabled,
-          onClick: handleSubmitGrade,
-          children: intl$1.formatMessage({
-            id: 'exerciseRunner.controller.buttonGroup.button.submit'
-          })
-        })
-      })
-    });
-  };
-  /**
-   * Cancel button
-   */
-  var renderCancelButton = function renderCancelButton() {
-    if (isCancelHidden) {
-      return null;
-    }
-    return jsxRuntime.jsx(StyledControllerButton, {
-      size: "tiny",
-      role: "danger",
-      loading: isConnecting,
-      disabled: isCancelDisabled,
-      onClick: handleCancel,
-      children: intl$1.formatMessage({
-        id: 'exerciseRunner.controller.buttonGroup.button.stop'
-      })
-    });
-  };
-  /**
-   * Sync request button
-   */
-  var renderSyncRequestButton = function renderSyncRequestButton() {
-    if (isSyncRequestHidden) {
-      return null;
-    }
-    return jsxRuntime.jsx(StyledControllerButton, {
-      size: "tiny",
-      role: "secondary",
-      loading: isConnecting,
-      disabled: isSyncRequestDisabled,
-      onClick: handleSyncRequest,
-      children: intl$1.formatMessage({
-        id: 'exerciseRunner.controller.buttonGroup.button.syncRequest'
-      })
-    });
-  };
-  //
-  //
-  //
-  return jsxRuntime.jsxs(StyledControllerButtonGroup, {
-    children: [renderSubmitRunButton(), renderSubmitGradeButton(), renderCancelButton(), renderSyncRequestButton()]
+  return jsxRuntime.jsxs(material.Stack, {
+    direction: "row",
+    alignItems: "center",
+    gap: "0.5rem",
+    children: [jsxRuntime.jsx(ControllerActionRun.default, {}), jsxRuntime.jsx(ControllerActionGrade.default, {}), jsxRuntime.jsx(ControllerActionCancel.default, {}), jsxRuntime.jsx(ControllerActionSyncRequest.default, {})]
   });
 };
 

package/cjs/components/material-exercise/exercise-runner/ExerciseRunnerControllerCodeHelpRequestButton.d.ts

@@ -1,6 +1,6 @@
 import type React from 'react';
-interface ExerciseRunnerControllerCodeHelpRequestButtonProps {
+interface CodeHelpRequestButtonProps {
     onClick: () => void;
 }
-declare const ExerciseRunnerControllerCodeHelpRequestButton: React.FC<ExerciseRunnerControllerCodeHelpRequestButtonProps>;
+declare const ExerciseRunnerControllerCodeHelpRequestButton: React.FC<CodeHelpRequestButtonProps>;
 export default ExerciseRunnerControllerCodeHelpRequestButton;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionCancel.d.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+declare const ControllerActionCancel: React.VFC;
+export default ControllerActionCancel;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionCancel.js

@@ -0,0 +1,44 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var intl = require('@elice/intl');
+var lab = require('@mui/lab');
+var useControllerActionCancel = require('./useControllerActionCancel.js');
+var useExericseShortcut = require('../../../../hooks/useExericseShortcut.js');
+
+//
+//
+//
+var ControllerActionCancel = function ControllerActionCancel() {
+  var intl$1 = intl.useRawEliceIntl();
+  var _useControllerActionC = useControllerActionCancel.useControllerActionCancel(),
+    isHidden = _useControllerActionC.isHidden,
+    isDisabled = _useControllerActionC.isDisabled,
+    isLoading = _useControllerActionC.isLoading,
+    cancel = _useControllerActionC.cancel;
+  //
+  // register the shortcut
+  //
+  useExericseShortcut.useExericseShortcut('RUNNER_CANCEL', cancel);
+  //
+  //
+  //
+  if (isHidden) {
+    return null;
+  }
+  return jsxRuntime.jsx(lab.LoadingButton, {
+    size: "small",
+    variant: "contained",
+    color: "error",
+    loading: isLoading,
+    disabled: isDisabled,
+    onClick: cancel,
+    children: intl$1.formatMessage({
+      id: 'exerciseRunner.controller.buttonGroup.button.stop'
+    })
+  });
+};
+
+exports.default = ControllerActionCancel;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionGrade.d.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+declare const ControllerActionGrade: React.VFC;
+export default ControllerActionGrade;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionGrade.js

@@ -0,0 +1,58 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var intl = require('@elice/intl');
+var lab = require('@mui/lab');
+var material = require('@mui/material');
+var useControllerActionGrade = require('./useControllerActionGrade.js');
+var useExericseShortcut = require('../../../../hooks/useExericseShortcut.js');
+
+//
+//
+//
+var ControllerActionGrade = function ControllerActionGrade() {
+  var intl$1 = intl.useRawEliceIntl();
+  var _useControllerActionG = useControllerActionGrade.useControllerActionGrade(),
+    isHidden = _useControllerActionG.isHidden,
+    isDisabled = _useControllerActionG.isDisabled,
+    isLoading = _useControllerActionG.isLoading,
+    isNoGrade = _useControllerActionG.isNoGrade,
+    grade = _useControllerActionG.grade;
+  //
+  // register the shortcut
+  //
+  useExericseShortcut.useExericseShortcut('RUNNER_SUBMIT_GRADE', grade);
+  //
+  //
+  //
+  if (isHidden) {
+    return null;
+  }
+  return jsxRuntime.jsx(material.Tooltip, {
+    title: isNoGrade ? intl$1.formatMessage({
+      id: 'exerciseRunner.controller.buttonGroup.button.submit.tooltip.noSubmit'
+    }) : '',
+    placement: "top",
+    children: jsxRuntime.jsx(material.Box, {
+      component: "span",
+      sx: {
+        display: 'inline-flex'
+      },
+      children: jsxRuntime.jsx(lab.LoadingButton, {
+        size: "small",
+        variant: "contained",
+        color: "info",
+        loading: isLoading,
+        disabled: isDisabled,
+        onClick: grade,
+        children: intl$1.formatMessage({
+          id: 'exerciseRunner.controller.buttonGroup.button.submit'
+        })
+      })
+    })
+  });
+};
+
+exports.default = ControllerActionGrade;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionRun.d.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+declare const ControllerActionRun: React.VFC;
+export default ControllerActionRun;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionRun.js

@@ -0,0 +1,44 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var intl = require('@elice/intl');
+var lab = require('@mui/lab');
+var useControllerActionRun = require('./useControllerActionRun.js');
+var useExericseShortcut = require('../../../../hooks/useExericseShortcut.js');
+
+//
+//
+//
+var ControllerActionRun = function ControllerActionRun() {
+  var intl$1 = intl.useRawEliceIntl();
+  var _useControllerActionR = useControllerActionRun.useControllerActionRun(),
+    isHidden = _useControllerActionR.isHidden,
+    isDisabled = _useControllerActionR.isDisabled,
+    isLoading = _useControllerActionR.isLoading,
+    run = _useControllerActionR.run;
+  //
+  // register the shortcut
+  //
+  useExericseShortcut.useExericseShortcut('RUNNER_SUBMIT_RUN', run);
+  //
+  //
+  //
+  if (isHidden) {
+    return null;
+  }
+  return jsxRuntime.jsx(lab.LoadingButton, {
+    size: "small",
+    variant: "contained",
+    color: "primary",
+    loading: isLoading,
+    disabled: isDisabled,
+    onClick: run,
+    children: intl$1.formatMessage({
+      id: 'exerciseRunner.controller.buttonGroup.button.run'
+    })
+  });
+};
+
+exports.default = ControllerActionRun;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionSyncRequest.d.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+declare const ControllerActionSyncRequest: React.VFC;
+export default ControllerActionSyncRequest;

package/cjs/components/material-exercise/exercise-runner/action/ControllerActionSyncRequest.js

@@ -0,0 +1,44 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var intl = require('@elice/intl');
+var lab = require('@mui/lab');
+var useControllerActionSyncRequest = require('./useControllerActionSyncRequest.js');
+var useExericseShortcut = require('../../../../hooks/useExericseShortcut.js');
+
+//
+//
+//
+var ControllerActionSyncRequest = function ControllerActionSyncRequest() {
+  var intl$1 = intl.useRawEliceIntl();
+  var _useControllerActionS = useControllerActionSyncRequest.useControllerActionSyncRequest(),
+    isHidden = _useControllerActionS.isHidden,
+    isDisabled = _useControllerActionS.isDisabled,
+    isLoading = _useControllerActionS.isLoading,
+    syncRequest = _useControllerActionS.syncRequest;
+  //
+  // register the shortcut
+  //
+  useExericseShortcut.useExericseShortcut('RUNNER_SYNC_REQUEST', syncRequest);
+  //
+  //
+  //
+  if (isHidden) {
+    return null;
+  }
+  return jsxRuntime.jsx(lab.LoadingButton, {
+    size: "small",
+    variant: "contained",
+    color: "secondary",
+    loading: isLoading,
+    disabled: isDisabled,
+    onClick: syncRequest,
+    children: intl$1.formatMessage({
+      id: 'exerciseRunner.controller.buttonGroup.button.syncRequest'
+    })
+  });
+};
+
+exports.default = ControllerActionSyncRequest;

package/cjs/components/material-exercise/exercise-runner/action/index.d.ts

@@ -0,0 +1,5 @@
+export { default as ControllerActionCancel } from './ControllerActionCancel';
+export { default as ControllerActionGrade } from './ControllerActionGrade';
+export { default as ControllerActionRun } from './ControllerActionRun';
+export { default as ControllerActionSyncRequest } from './ControllerActionSyncRequest';
+export { useControllerActionRun } from './useControllerActionRun';

package/cjs/components/material-exercise/exercise-runner/action/index.js

@@ -0,0 +1,15 @@
+'use strict';
+
+var ControllerActionCancel = require('./ControllerActionCancel.js');
+var ControllerActionGrade = require('./ControllerActionGrade.js');
+var ControllerActionRun = require('./ControllerActionRun.js');
+var ControllerActionSyncRequest = require('./ControllerActionSyncRequest.js');
+var useControllerActionRun = require('./useControllerActionRun.js');
+
+
+
+exports.ControllerActionCancel = ControllerActionCancel.default;
+exports.ControllerActionGrade = ControllerActionGrade.default;
+exports.ControllerActionRun = ControllerActionRun.default;
+exports.ControllerActionSyncRequest = ControllerActionSyncRequest.default;
+exports.useControllerActionRun = useControllerActionRun.useControllerActionRun;

package/cjs/components/material-exercise/exercise-runner/action/useControllerActionCancel.d.ts

@@ -0,0 +1,14 @@
+export interface UseControllerActionCancelReturn {
+    /** Whether the cancel button should be hidden. */
+    isHidden: boolean;
+    /** Whether the cancel button should be disabled. */
+    isDisabled: boolean;
+    /** Whether the cancel button should show a loading indicator. */
+    isLoading: boolean;
+    /** Cancel the running exercise. */
+    cancel: () => void;
+}
+/**
+ * Provides state and handler for the exercise runner's "cancel" action.
+ */
+export declare const useControllerActionCancel: () => UseControllerActionCancelReturn;

package/cjs/components/material-exercise/exercise-runner/action/useControllerActionCancel.js

@@ -0,0 +1,52 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var websocket = require('@elice/websocket');
+var recoil = require('recoil');
+var ExerciseRunnerContext = require('../ExerciseRunnerContext.js');
+var recoil$1 = require('../../context/recoil.js');
+var useExerciseFile = require('../../../../hooks/useExerciseFile.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+/**
+ * Provides state and handler for the exercise runner's "cancel" action.
+ */
+var useControllerActionCancel = function useControllerActionCancel() {
+  var _return = React__default.default.useRef({});
+  var _React$useContext = React__default.default.useContext(ExerciseRunnerContext.ExerciseRunnerContext),
+    onCancel = _React$useContext.onCancel;
+  var activeFilename = recoil.useRecoilValue(recoil$1.exerciseActiveFilenameState);
+  var isFileEditable = useExerciseFile.useExerciseFileEditable(activeFilename);
+  var runnerWebsocketStatus = recoil.useRecoilValue(recoil$1.exerciseWebSocketTotalStatusQuery([].concat(_rollupPluginBabelHelpers.toConsumableArray(isFileEditable ? ['usercodeEdit'] : []), ['runnerRoom', 'stdio'])));
+  var isRunning = recoil.useRecoilValue(recoil$1.exerciseRunnerRunningState);
+  var isConnecting = runnerWebsocketStatus === websocket.EliceWebSocket.CONNECTING;
+  var isNotReady = runnerWebsocketStatus !== websocket.EliceWebSocket.OPEN;
+  var isHidden = !isRunning;
+  var isDisabled = isHidden || isNotReady || isConnecting;
+  var isLoading = isConnecting;
+  /**
+   *
+   */
+  var cancel = React__default.default.useCallback(function () {
+    if (!isDisabled) {
+      onCancel();
+    }
+  }, [isDisabled, onCancel]);
+  //
+  //
+  //
+  _return.current.isHidden = isHidden;
+  _return.current.isDisabled = isDisabled;
+  _return.current.isLoading = isLoading;
+  _return.current.cancel = cancel;
+  return _return.current;
+};
+
+exports.useControllerActionCancel = useControllerActionCancel;

package/cjs/components/material-exercise/exercise-runner/action/useControllerActionGrade.d.ts

@@ -0,0 +1,16 @@
+export interface UseControllerActionGradeReturn {
+    /** Whether the grade button should be hidden. */
+    isHidden: boolean;
+    /** Whether the grade button should be disabled. */
+    isDisabled: boolean;
+    /** Whether the grade button should show a loading indicator. */
+    isLoading: boolean;
+    /** Whether grading is disallowed for this exercise (used to show tooltip). */
+    isNoGrade: boolean;
+    /** Submit the exercise to grade. Resolves when the submission completes. */
+    grade: () => Promise<void>;
+}
+/**
+ * Provides state and handler for the exercise runner's "grade" action.
+ */
+export declare const useControllerActionGrade: () => UseControllerActionGradeReturn;

package/cjs/components/material-exercise/exercise-runner/action/useControllerActionGrade.js

@@ -0,0 +1,74 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var types = require('@elice/types');
+var websocket = require('@elice/websocket');
+var recoil = require('recoil');
+var ExerciseRunnerContext = require('../ExerciseRunnerContext.js');
+var recoil$1 = require('../../context/recoil.js');
+var context = require('../../context/context.js');
+var useExerciseFile = require('../../../../hooks/useExerciseFile.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+/**
+ * Provides state and handler for the exercise runner's "grade" action.
+ */
+var useControllerActionGrade = function useControllerActionGrade() {
+  var _return = React__default.default.useRef({});
+  var _React$useContext = React__default.default.useContext(context.ExerciseContext),
+    materialExerciseId = _React$useContext.materialExerciseId;
+  var _React$useContext2 = React__default.default.useContext(ExerciseRunnerContext.ExerciseRunnerContext),
+    onSubmit = _React$useContext2.onSubmit;
+  var activeFilename = recoil.useRecoilValue(recoil$1.exerciseActiveFilenameState);
+  var isFileEditable = useExerciseFile.useExerciseFileEditable(activeFilename);
+  var runnerWebsocketStatus = recoil.useRecoilValue(recoil$1.exerciseWebSocketTotalStatusQuery([].concat(_rollupPluginBabelHelpers.toConsumableArray(isFileEditable ? ['usercodeEdit'] : []), ['runnerRoom', 'stdio'])));
+  var exercise = recoil.useRecoilValue(recoil$1.exerciseState(materialExerciseId));
+  var exerciseRunType = recoil.useRecoilValue(recoil$1.exerciseRunnerRunTypeState);
+  var isNoGrade = Boolean(exercise === null || exercise === void 0 ? void 0 : exercise.isNoSubmitGrade);
+  var lecture = recoil.useRecoilValue(recoil$1.exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
+  var isTestLecture = (lecture === null || lecture === void 0 ? void 0 : lecture.lectureType) === types.enums.LectureType.Test;
+  var isTestLectureCompleted = (lecture === null || lecture === void 0 ? void 0 : lecture.testAdmissionStatus) === types.enums.TestAdmissionStatus.Completed;
+  var isSubmitting = recoil.useRecoilValue(recoil$1.exerciseRunnerSubmittingState);
+  var isRunning = recoil.useRecoilValue(recoil$1.exerciseRunnerRunningState);
+  var isConnecting = runnerWebsocketStatus === websocket.EliceWebSocket.CONNECTING;
+  var isNotReady = runnerWebsocketStatus !== websocket.EliceWebSocket.OPEN;
+  var isHidden = isRunning;
+  var isDisabled = isHidden || isNoGrade || isTestLecture && isTestLectureCompleted || isNotReady || isConnecting || isSubmitting;
+  var isLoading = isConnecting || isSubmitting && exerciseRunType === types.enums.ExerciseRunType.Grade;
+  /**
+   *
+   */
+  var grade = React__default.default.useCallback(/*#__PURE__*/_rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
+    return _rollupPluginBabelHelpers.regenerator().w(function (_context) {
+      while (1) switch (_context.n) {
+        case 0:
+          if (isDisabled) {
+            _context.n = 1;
+            break;
+          }
+          _context.n = 1;
+          return onSubmit(types.enums.ExerciseRunType.Grade);
+        case 1:
+          return _context.a(2);
+      }
+    }, _callee);
+  })), [isDisabled, onSubmit]);
+  //
+  //
+  //
+  _return.current.isHidden = isHidden;
+  _return.current.isDisabled = isDisabled;
+  _return.current.isLoading = isLoading;
+  _return.current.isNoGrade = isNoGrade;
+  _return.current.grade = grade;
+  return _return.current;
+};
+
+exports.useControllerActionGrade = useControllerActionGrade;

package/cjs/components/material-exercise/exercise-runner/action/useControllerActionRun.d.ts

@@ -0,0 +1,14 @@
+export interface UseControllerActionRunReturn {
+    /** Whether the run button should be hidden. */
+    isHidden: boolean;
+    /** Whether the run button should be disabled. */
+    isDisabled: boolean;
+    /** Whether the run button should show a loading indicator. */
+    isLoading: boolean;
+    /** Submit the exercise to run. Resolves when the submission completes. */
+    run: () => Promise<void>;
+}
+/**
+ * Provides state and handler for the exercise runner's "run" action.
+ */
+export declare const useControllerActionRun: () => UseControllerActionRunReturn;