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

package/es/components/material-exercise/exercise-runner/action/useControllerActionRun.js

@@ -0,0 +1,59 @@
+import { toConsumableArray as _toConsumableArray, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import React from 'react';
+import { enums } from '@elice/types';
+import { EliceWebSocket } from '@elice/websocket';
+import { useRecoilValue } from 'recoil';
+import { ExerciseRunnerContext } from '../ExerciseRunnerContext.js';
+import { exerciseActiveFilenameState, exerciseWebSocketTotalStatusQuery, exerciseRunnerRunTypeState, exerciseRunnerSubmittingState, exerciseRunnerRunningState } from '../../context/recoil.js';
+import { useExerciseFileEditable } from '../../../../hooks/useExerciseFile.js';
+
+//
+//
+//
+/**
+ * Provides state and handler for the exercise runner's "run" action.
+ */
+var useControllerActionRun = function useControllerActionRun() {
+  var _return = React.useRef({});
+  var _React$useContext = React.useContext(ExerciseRunnerContext),
+    onSubmit = _React$useContext.onSubmit;
+  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  var isFileEditable = useExerciseFileEditable(activeFilename);
+  var runnerWebsocketStatus = useRecoilValue(exerciseWebSocketTotalStatusQuery([].concat(_toConsumableArray(isFileEditable ? ['usercodeEdit'] : []), ['runnerRoom', 'stdio'])));
+  var exerciseRunType = useRecoilValue(exerciseRunnerRunTypeState);
+  var isSubmitting = useRecoilValue(exerciseRunnerSubmittingState);
+  var isRunning = useRecoilValue(exerciseRunnerRunningState);
+  var isConnecting = runnerWebsocketStatus === EliceWebSocket.CONNECTING;
+  var isNotReady = runnerWebsocketStatus !== EliceWebSocket.OPEN;
+  var isHidden = isRunning;
+  var isDisabled = isHidden || isNotReady || isConnecting || isSubmitting;
+  var isLoading = isConnecting || isSubmitting && exerciseRunType === enums.ExerciseRunType.Run;
+  /**
+   *
+   */
+  var run = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+    return _regenerator().w(function (_context) {
+      while (1) switch (_context.n) {
+        case 0:
+          if (isDisabled) {
+            _context.n = 1;
+            break;
+          }
+          _context.n = 1;
+          return onSubmit(enums.ExerciseRunType.Run);
+        case 1:
+          return _context.a(2);
+      }
+    }, _callee);
+  })), [isDisabled, onSubmit]);
+  //
+  //
+  //
+  _return.current.isHidden = isHidden;
+  _return.current.isDisabled = isDisabled;
+  _return.current.isLoading = isLoading;
+  _return.current.run = run;
+  return _return.current;
+};
+
+export { useControllerActionRun };

package/es/components/material-exercise/exercise-runner/action/useControllerActionSyncRequest.d.ts

@@ -0,0 +1,15 @@
+export interface UseControllerActionSyncRequestReturn {
+    /** Whether the sync-request button should be hidden. */
+    isHidden: boolean;
+    /** Whether the sync-request button should be disabled. */
+    isDisabled: boolean;
+    /** Whether the sync-request button should show a loading indicator. */
+    isLoading: boolean;
+    /** Request the runner to sync the latest user code. */
+    syncRequest: () => void;
+}
+/**
+ * Provides state and handler for the exercise runner's "sync request" action,
+ * and forwards file-editor save actions to the same handler.
+ */
+export declare const useControllerActionSyncRequest: () => UseControllerActionSyncRequestReturn;

package/es/components/material-exercise/exercise-runner/action/useControllerActionSyncRequest.js

@@ -0,0 +1,62 @@
+import { toConsumableArray as _toConsumableArray } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import React from 'react';
+import { EliceWebSocket } from '@elice/websocket';
+import { useRecoilValue } from 'recoil';
+import { ExerciseRunnerContext } from '../ExerciseRunnerContext.js';
+import { ExerciseContext } from '../../context/context.js';
+import { exerciseActiveFilenameState, exerciseWebSocketTotalStatusQuery, exerciseState, exerciseRunnerRunningState } from '../../context/recoil.js';
+import { useExerciseFileEditable } from '../../../../hooks/useExerciseFile.js';
+import { exerciseFileEditorSaveAction$ } from '../../context/subjects.js';
+
+//
+//
+//
+/**
+ * Provides state and handler for the exercise runner's "sync request" action,
+ * and forwards file-editor save actions to the same handler.
+ */
+var useControllerActionSyncRequest = function useControllerActionSyncRequest() {
+  var _a;
+  var _return = React.useRef({});
+  var _React$useContext = React.useContext(ExerciseContext),
+    materialExerciseId = _React$useContext.materialExerciseId;
+  var _React$useContext2 = React.useContext(ExerciseRunnerContext),
+    onSyncRequest = _React$useContext2.onSyncRequest;
+  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  var isFileEditable = useExerciseFileEditable(activeFilename);
+  var runnerWebsocketStatus = useRecoilValue(exerciseWebSocketTotalStatusQuery([].concat(_toConsumableArray(isFileEditable ? ['usercodeEdit'] : []), ['runnerRoom', 'stdio'])));
+  var exercise = useRecoilValue(exerciseState(materialExerciseId));
+  var isRunning = useRecoilValue(exerciseRunnerRunningState);
+  var isConnecting = runnerWebsocketStatus === EliceWebSocket.CONNECTING;
+  var isNotReady = runnerWebsocketStatus !== EliceWebSocket.OPEN;
+  var isHidden = !isRunning || !((_a = exercise === null || exercise === void 0 ? void 0 : exercise.readyExerciseImage) === null || _a === void 0 ? void 0 : _a.httpPort);
+  var isDisabled = isHidden || isNotReady || isConnecting;
+  var isLoading = isConnecting;
+  /**
+   *
+   */
+  var syncRequest = React.useCallback(function () {
+    if (!isDisabled) {
+      onSyncRequest();
+    }
+  }, [isDisabled, onSyncRequest]);
+  //
+  //
+  //
+  React.useEffect(function () {
+    var saveActionSub = exerciseFileEditorSaveAction$.subscribe(syncRequest);
+    return function () {
+      saveActionSub.unsubscribe();
+    };
+  }, [syncRequest]);
+  //
+  //
+  //
+  _return.current.isHidden = isHidden;
+  _return.current.isDisabled = isDisabled;
+  _return.current.isLoading = isLoading;
+  _return.current.syncRequest = syncRequest;
+  return _return.current;
+};
+
+export { useControllerActionSyncRequest };

package/es/components/material-exercise/exercise-runner/arduino/ArduinoConnectionGuideDialog.d.ts

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

package/es/components/material-exercise/exercise-runner/arduino/ArduinoConnectionGuideDialog.js

@@ -0,0 +1,141 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useRawEliceIntl } from '@elice/intl';
+import { usePermissionPhase } from '@elice/mcu-bridge';
+import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
+import Alert from '@mui/material/Alert';
+import Dialog from '@mui/material/Dialog';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+import { useArduinoBridge } from './_context.js';
+import ArduinoConnectionGuideDialogNativeMock from './ArduinoConnectionGuideDialogNativeMock.js';
+import ArduinoConnectionGuideDialogSteps from './ArduinoConnectionGuideDialogSteps.js';
+
+//
+//
+//
+var ArduinoConnectionGuideDialog = function ArduinoConnectionGuideDialog() {
+  var intl = useRawEliceIntl();
+  var phase = usePermissionPhase();
+  var _useArduinoBridge = useArduinoBridge(),
+    connectionIntent = _useArduinoBridge.connectionIntent;
+  var open = phase === 'requesting';
+  var isUpload = connectionIntent === 'upload';
+  /**
+   *
+   */
+  var renderTitle = function renderTitle() {
+    return intl.formatMessage({
+      id: isUpload ? 'exerciseRunner.arduino.connectGuide.title.upload' : 'exerciseRunner.arduino.connectGuide.title.connect'
+    });
+  };
+  /**
+   *
+   */
+  var renderUploadNotice = function renderUploadNotice() {
+    if (!isUpload) {
+      return null;
+    }
+    return jsx(Alert, {
+      severity: "info",
+      children: intl.formatMessage({
+        id: 'exerciseRunner.arduino.connectGuide.upload.note'
+      })
+    });
+  };
+  /**
+   *
+   */
+  var renderPreview = function renderPreview() {
+    return jsxs(Stack, {
+      alignItems: "center",
+      spacing: 1.25,
+      sx: {
+        bgcolor: function bgcolor(theme) {
+          return theme.palette.background.paper;
+        },
+        border: function border(theme) {
+          return "1px solid ".concat(theme.palette.divider);
+        },
+        borderRadius: '10px',
+        p: '14px'
+      },
+      children: [jsxs(Stack, {
+        direction: "row",
+        spacing: 0.75,
+        alignItems: "center",
+        children: [jsx(ArrowUpwardIcon, {
+          sx: {
+            fontSize: 11
+          }
+        }), jsx(Typography, {
+          color: "primary.main",
+          sx: {
+            fontSize: 12,
+            fontWeight: 700,
+            letterSpacing: '-.01em'
+          },
+          children: intl.formatMessage({
+            id: 'exerciseRunner.arduino.connectGuide.preview.label'
+          })
+        })]
+      }), jsx(ArduinoConnectionGuideDialogNativeMock, {})]
+    });
+  };
+  /**
+   *
+   */
+  var renderActions = function renderActions() {
+    return jsx(DialogActions, {
+      sx: {
+        justifyContent: 'flex-start',
+        px: 3,
+        py: 2
+      },
+      children: jsx(Typography, {
+        variant: "caption",
+        color: "text.secondary",
+        children: intl.formatMessage({
+          id: 'exerciseRunner.arduino.connectGuide.footer'
+        })
+      })
+    });
+  };
+  //
+  //
+  //
+  // No onClose: open state is fully derived from the picker phase.
+  return jsxs(Dialog, {
+    disableEnforceFocus: true,
+    hideBackdrop: true,
+    fullWidth: true,
+    open: open,
+    maxWidth: "sm",
+    sx: {
+      pointerEvents: 'none'
+    },
+    PaperProps: {
+      sx: {
+        pointerEvents: 'auto'
+      }
+    },
+    children: [jsx(DialogTitle, {
+      children: renderTitle()
+    }), jsx(DialogContent, {
+      children: jsxs(Stack, {
+        spacing: 2,
+        children: [renderUploadNotice(), jsx(Typography, {
+          variant: "body2",
+          color: "text.secondary",
+          children: intl.formatMessage({
+            id: 'exerciseRunner.arduino.connectGuide.body'
+          })
+        }), renderPreview(), jsx(ArduinoConnectionGuideDialogSteps, {})]
+      })
+    }), renderActions()]
+  });
+};
+
+export { ArduinoConnectionGuideDialog as default };

package/es/components/material-exercise/exercise-runner/arduino/ArduinoConnectionGuideDialogNativeMock.d.ts

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

package/es/components/material-exercise/exercise-runner/arduino/ArduinoConnectionGuideDialogNativeMock.js

@@ -0,0 +1,177 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useRawEliceIntl } from '@elice/intl';
+import LockIcon from '@mui/icons-material/Lock';
+import Box from '@mui/material/Box';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+//
+//
+//
+// Mirrors the Chromium serial picker palette so the kid sees what the native
+// browser dialog will look like before it pops. Theme tokens are intentionally
+// not used here — the goal is to imitate the OS chrome, not the app brand.
+var MOCK_BG = '#2a2c30';
+var MOCK_FOOT_BG = '#202124';
+var MOCK_TEXT = '#e8eaed';
+var MOCK_ROW_TEXT = '#cdd0d4';
+var MOCK_BORDER = 'rgba(255,255,255,.08)';
+var MOCK_SEL_BG = '#3367d6';
+var MOCK_BTN_BORDER = 'rgba(255,255,255,.18)';
+var MOCK_BTN_PRIMARY_BG = '#8ab4f8';
+var MOCK_BTN_PRIMARY_TEXT = '#202124';
+var MOCK_HELP_BORDER = 'rgba(255,255,255,.25)';
+var MOCK_HELP_TEXT = '#9aa0a6';
+var SYSTEM_FONT = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+//
+//
+//
+var ArduinoConnectionGuideDialogNativeMock = function ArduinoConnectionGuideDialogNativeMock() {
+  var intl = useRawEliceIntl();
+  /**
+   *
+   */
+  var renderHeader = function renderHeader() {
+    return jsxs(Stack, {
+      direction: "row",
+      spacing: 1,
+      alignItems: "center",
+      sx: {
+        pt: '11px',
+        pb: '9px',
+        px: '14px',
+        borderBottom: "1px solid ".concat(MOCK_BORDER),
+        color: MOCK_TEXT
+      },
+      children: [jsx(LockIcon, {
+        sx: {
+          fontSize: 11,
+          color: '#5f6368'
+        }
+      }), jsx(Typography, {
+        noWrap: true,
+        sx: {
+          fontSize: 12.5,
+          fontFamily: SYSTEM_FONT,
+          color: MOCK_TEXT
+        },
+        children: intl.formatMessage({
+          id: 'exerciseRunner.arduino.connectGuide.preview.host'
+        }, {
+          host: window.location.host
+        })
+      })]
+    });
+  };
+  /**
+   *
+   */
+  var renderRows = function renderRows() {
+    var rowSx = {
+      px: '14px',
+      py: '7px',
+      fontSize: 12.5,
+      color: MOCK_ROW_TEXT,
+      fontFamily: SYSTEM_FONT
+    };
+    return jsxs(Stack, {
+      sx: {
+        py: '6px'
+      },
+      children: [jsx(Box, {
+        sx: rowSx,
+        children: "cu.Bluetooth-Incoming-Port"
+      }), jsx(Box, {
+        sx: rowSx,
+        children: "cu.debug-console"
+      }), jsx(Box, {
+        sx: Object.assign(Object.assign({}, rowSx), {
+          bgcolor: MOCK_SEL_BG,
+          color: '#fff',
+          fontWeight: 500
+        }),
+        children: "cu.usbmodem2112401"
+      })]
+    });
+  };
+  /**
+   *
+   */
+  var renderFooter = function renderFooter() {
+    var btnBaseSx = {
+      display: 'inline-flex',
+      alignItems: 'center',
+      height: 28,
+      px: '14px',
+      borderRadius: '4px',
+      fontSize: 12,
+      fontWeight: 500,
+      fontFamily: SYSTEM_FONT
+    };
+    return jsxs(Stack, {
+      direction: "row",
+      spacing: 1,
+      alignItems: "center",
+      sx: {
+        py: '8px',
+        px: '12px',
+        bgcolor: MOCK_FOOT_BG,
+        borderTop: "1px solid ".concat(MOCK_BORDER)
+      },
+      children: [jsx(Box, {
+        sx: {
+          width: 22,
+          height: 22,
+          borderRadius: '50%',
+          border: "1px solid ".concat(MOCK_HELP_BORDER),
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          fontSize: 11,
+          color: MOCK_HELP_TEXT
+        },
+        children: "?"
+      }), jsx(Box, {
+        sx: {
+          flex: 1
+        }
+      }), jsx(Box, {
+        sx: Object.assign(Object.assign({}, btnBaseSx), {
+          border: "1px solid ".concat(MOCK_BTN_BORDER),
+          color: MOCK_ROW_TEXT,
+          bgcolor: 'transparent'
+        }),
+        children: intl.formatMessage({
+          id: 'exerciseRunner.arduino.connectGuide.preview.cancel'
+        })
+      }), jsx(Box, {
+        sx: Object.assign(Object.assign({}, btnBaseSx), {
+          border: "1px solid ".concat(MOCK_BTN_PRIMARY_BG),
+          bgcolor: MOCK_BTN_PRIMARY_BG,
+          color: MOCK_BTN_PRIMARY_TEXT
+        }),
+        children: intl.formatMessage({
+          id: 'exerciseRunner.arduino.connectGuide.preview.connect'
+        })
+      })]
+    });
+  };
+  //
+  //
+  //
+  return jsxs(Box, {
+    sx: {
+      bgcolor: MOCK_BG,
+      color: MOCK_TEXT,
+      borderRadius: '8px',
+      boxShadow: '0 4px 14px rgba(0,0,0,.25)',
+      width: 340,
+      maxWidth: '100%',
+      border: "1px solid ".concat(MOCK_BORDER),
+      overflow: 'hidden'
+    },
+    children: [renderHeader(), renderRows(), renderFooter()]
+  });
+};
+
+export { ArduinoConnectionGuideDialogNativeMock as default };

package/es/components/material-exercise/exercise-runner/arduino/ArduinoConnectionGuideDialogSteps.d.ts

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

package/es/components/material-exercise/exercise-runner/arduino/ArduinoConnectionGuideDialogSteps.js

@@ -0,0 +1,122 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useRawEliceIntl } from '@elice/intl';
+import Box from '@mui/material/Box';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+//
+//
+//
+var STEP_KEYS = [1, 2, 3];
+//
+//
+//
+var ArduinoConnectionGuideDialogSteps = function ArduinoConnectionGuideDialogSteps() {
+  var intl = useRawEliceIntl();
+  /**
+   *
+   */
+  var renderInlineCode = function renderInlineCode(text) {
+    return jsx(Box, {
+      component: "code",
+      sx: {
+        fontFamily: 'monospace',
+        fontSize: 12,
+        fontWeight: 600,
+        px: 0.75,
+        py: '1px',
+        mx: 0.25,
+        borderRadius: 0.5,
+        bgcolor: function bgcolor(theme) {
+          return theme.palette.background.inverse;
+        },
+        border: function border(theme) {
+          return "1px solid ".concat(theme.palette.divider);
+        },
+        color: function color(theme) {
+          return theme.palette.inverse.main;
+        }
+      },
+      children: text
+    });
+  };
+  /**
+   *
+   */
+  var renderStrong = function renderStrong(text) {
+    return jsx(Typography, {
+      component: "span",
+      variant: "inherit",
+      color: "text.primary",
+      fontWeight: 700,
+      children: text
+    });
+  };
+  /**
+   *
+   */
+  var renderStepBadge = function renderStepBadge(step) {
+    return jsx(Box, {
+      "aria-hidden": "true",
+      sx: {
+        flexShrink: 0,
+        width: 22,
+        height: 22,
+        borderRadius: '50%',
+        bgcolor: function bgcolor(theme) {
+          return theme.palette.primary.main;
+        },
+        color: function color(theme) {
+          return theme.palette.background.paper;
+        },
+        display: 'inline-flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        fontSize: 11.5,
+        fontWeight: 800,
+        mt: '1px'
+      },
+      children: step
+    });
+  };
+  /**
+   *
+   */
+  var renderStep = function renderStep(step) {
+    return jsxs(Stack, {
+      direction: "row",
+      spacing: 1.25,
+      alignItems: "flex-start",
+      children: [renderStepBadge(step), jsx(Typography, {
+        variant: "body2",
+        color: "text.secondary",
+        sx: {
+          whiteSpace: 'pre-line'
+        },
+        children: intl.formatMessage({
+          id: "exerciseRunner.arduino.connectGuide.steps.".concat(step)
+        }, {
+          usbmodem: renderInlineCode('usbmodem'),
+          usbserial: renderInlineCode('usbserial'),
+          connect: renderStrong(intl.formatMessage({
+            id: 'exerciseRunner.arduino.connectGuide.preview.connect'
+          })),
+          cancel: renderStrong(intl.formatMessage({
+            id: 'exerciseRunner.arduino.connectGuide.preview.cancel'
+          }))
+        })
+      })]
+    }, step);
+  };
+  //
+  //
+  //
+  return jsx(Stack, {
+    spacing: 1.25,
+    children: STEP_KEYS.map(function (step) {
+      return renderStep(step);
+    })
+  });
+};
+
+export { ArduinoConnectionGuideDialogSteps as default };

package/es/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionCompile.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const ArduinoControllerActionCompile: React.FC;
+export default ArduinoControllerActionCompile;

package/es/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionCompile.js

@@ -0,0 +1,80 @@
+import { asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { useRawEliceIntl } from '@elice/intl';
+import { colors } from '@elice/mui-system';
+import { LoadingButton } from '@mui/lab';
+import { useArduinoBridge } from './_context.js';
+import { useControllerActionRun } from '../action/useControllerActionRun.js';
+import { useExericseShortcut } from '../../../../hooks/useExericseShortcut.js';
+
+//
+//
+//
+var ArduinoControllerActionCompile = function ArduinoControllerActionCompile() {
+  var intl = useRawEliceIntl();
+  var _useControllerActionR = useControllerActionRun(),
+    isHidden = _useControllerActionR.isHidden,
+    isDisabled = _useControllerActionR.isDisabled,
+    isLoading = _useControllerActionR.isLoading,
+    run = _useControllerActionR.run;
+  var _useArduinoBridge = useArduinoBridge(),
+    setPendingIntent = _useArduinoBridge.setPendingIntent,
+    isPending = _useArduinoBridge.isPending,
+    isFlashing = _useArduinoBridge.isFlashing;
+  var isCompileDisabled = isDisabled || isPending || isFlashing;
+  var isCompileLoading = isLoading || isPending;
+  /**
+   * Submit the Arduino sketch for compilation without flashing the board.
+   */
+  var compile = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+    return _regenerator().w(function (_context) {
+      while (1) switch (_context.n) {
+        case 0:
+          if (!isCompileDisabled) {
+            _context.n = 1;
+            break;
+          }
+          return _context.a(2);
+        case 1:
+          setPendingIntent('compile');
+          _context.n = 2;
+          return run();
+        case 2:
+          return _context.a(2);
+      }
+    }, _callee);
+  })), [isCompileDisabled, setPendingIntent, run]);
+  //
+  // register the shortcut
+  //
+  useExericseShortcut('RUNNER_SUBMIT_RUN', compile);
+  //
+  //
+  //
+  if (isHidden) {
+    return null;
+  }
+  return jsx(LoadingButton, {
+    size: "small",
+    variant: "contained",
+    color: "primary",
+    loading: isCompileLoading,
+    disabled: isCompileDisabled,
+    sx: {
+      color: function color(theme) {
+        return theme.palette.getContrastText(colors.elicepurple[500]);
+      },
+      bgcolor: colors.elicepurple[500],
+      '&:hover, &:active': {
+        bgcolor: colors.elicepurple[600]
+      }
+    },
+    onClick: compile,
+    children: intl.formatMessage({
+      id: 'exerciseRunner.controller.arduino.button.compile'
+    })
+  });
+};
+
+export { ArduinoControllerActionCompile as default };

package/es/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionUpload.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const ArduinoControllerActionUpload: React.FC;
+export default ArduinoControllerActionUpload;