@elice/material-exercise 1.260305.0 → 1.260430.0

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

@@ -0,0 +1,188 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var intl = require('@elice/intl');
+var LockIcon = require('@mui/icons-material/Lock');
+var Box = require('@mui/material/Box');
+var Stack = require('@mui/material/Stack');
+var Typography = require('@mui/material/Typography');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var LockIcon__default = /*#__PURE__*/_interopDefaultCompat(LockIcon);
+var Box__default = /*#__PURE__*/_interopDefaultCompat(Box);
+var Stack__default = /*#__PURE__*/_interopDefaultCompat(Stack);
+var Typography__default = /*#__PURE__*/_interopDefaultCompat(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$1 = intl.useRawEliceIntl();
+  /**
+   *
+   */
+  var renderHeader = function renderHeader() {
+    return jsxRuntime.jsxs(Stack__default.default, {
+      direction: "row",
+      spacing: 1,
+      alignItems: "center",
+      sx: {
+        pt: '11px',
+        pb: '9px',
+        px: '14px',
+        borderBottom: "1px solid ".concat(MOCK_BORDER),
+        color: MOCK_TEXT
+      },
+      children: [jsxRuntime.jsx(LockIcon__default.default, {
+        sx: {
+          fontSize: 11,
+          color: '#5f6368'
+        }
+      }), jsxRuntime.jsx(Typography__default.default, {
+        noWrap: true,
+        sx: {
+          fontSize: 12.5,
+          fontFamily: SYSTEM_FONT,
+          color: MOCK_TEXT
+        },
+        children: intl$1.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 jsxRuntime.jsxs(Stack__default.default, {
+      sx: {
+        py: '6px'
+      },
+      children: [jsxRuntime.jsx(Box__default.default, {
+        sx: rowSx,
+        children: "cu.Bluetooth-Incoming-Port"
+      }), jsxRuntime.jsx(Box__default.default, {
+        sx: rowSx,
+        children: "cu.debug-console"
+      }), jsxRuntime.jsx(Box__default.default, {
+        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 jsxRuntime.jsxs(Stack__default.default, {
+      direction: "row",
+      spacing: 1,
+      alignItems: "center",
+      sx: {
+        py: '8px',
+        px: '12px',
+        bgcolor: MOCK_FOOT_BG,
+        borderTop: "1px solid ".concat(MOCK_BORDER)
+      },
+      children: [jsxRuntime.jsx(Box__default.default, {
+        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: "?"
+      }), jsxRuntime.jsx(Box__default.default, {
+        sx: {
+          flex: 1
+        }
+      }), jsxRuntime.jsx(Box__default.default, {
+        sx: Object.assign(Object.assign({}, btnBaseSx), {
+          border: "1px solid ".concat(MOCK_BTN_BORDER),
+          color: MOCK_ROW_TEXT,
+          bgcolor: 'transparent'
+        }),
+        children: intl$1.formatMessage({
+          id: 'exerciseRunner.arduino.connectGuide.preview.cancel'
+        })
+      }), jsxRuntime.jsx(Box__default.default, {
+        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$1.formatMessage({
+          id: 'exerciseRunner.arduino.connectGuide.preview.connect'
+        })
+      })]
+    });
+  };
+  //
+  //
+  //
+  return jsxRuntime.jsxs(Box__default.default, {
+    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()]
+  });
+};
+
+exports.default = ArduinoConnectionGuideDialogNativeMock;

package/cjs/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/cjs/components/material-exercise/exercise-runner/arduino/ArduinoConnectionGuideDialogSteps.js

@@ -0,0 +1,128 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var intl = require('@elice/intl');
+var Box = require('@mui/material/Box');
+var Stack = require('@mui/material/Stack');
+var Typography = require('@mui/material/Typography');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var Box__default = /*#__PURE__*/_interopDefaultCompat(Box);
+var Stack__default = /*#__PURE__*/_interopDefaultCompat(Stack);
+var Typography__default = /*#__PURE__*/_interopDefaultCompat(Typography);
+
+//
+//
+//
+var ACCENT = '#7353ea';
+var ACCENT_BG = 'rgba(115,83,234,.12)';
+var STEP_CODE_BG = '#f3f5f8';
+var STEP_CODE_BORDER = '#e9ebf0';
+var STEP_KEYS = [1, 2, 3];
+//
+//
+//
+var ArduinoConnectionGuideDialogSteps = function ArduinoConnectionGuideDialogSteps() {
+  var intl$1 = intl.useRawEliceIntl();
+  /**
+   *
+   */
+  var renderInlineCode = function renderInlineCode(text) {
+    return jsxRuntime.jsx(Box__default.default, {
+      component: "code",
+      sx: {
+        fontFamily: 'monospace',
+        fontSize: 12,
+        fontWeight: 600,
+        px: 0.75,
+        py: '1px',
+        mx: 0.25,
+        borderRadius: 0.5,
+        bgcolor: STEP_CODE_BG,
+        border: "1px solid ".concat(STEP_CODE_BORDER),
+        color: ACCENT
+      },
+      children: text
+    });
+  };
+  /**
+   *
+   */
+  var renderStrong = function renderStrong(text) {
+    return jsxRuntime.jsx(Box__default.default, {
+      component: "strong",
+      sx: {
+        color: '#191f28',
+        fontWeight: 700
+      },
+      children: text
+    });
+  };
+  /**
+   *
+   */
+  var renderStepBadge = function renderStepBadge(step) {
+    return jsxRuntime.jsx(Box__default.default, {
+      "aria-hidden": "true",
+      sx: {
+        flexShrink: 0,
+        width: 22,
+        height: 22,
+        borderRadius: '50%',
+        bgcolor: ACCENT_BG,
+        color: ACCENT,
+        display: 'inline-flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        fontSize: 11.5,
+        fontWeight: 800,
+        mt: '1px'
+      },
+      children: step
+    });
+  };
+  /**
+   *
+   */
+  var renderStep = function renderStep(step) {
+    return jsxRuntime.jsxs(Stack__default.default, {
+      direction: "row",
+      spacing: 1.25,
+      alignItems: "flex-start",
+      children: [renderStepBadge(step), jsxRuntime.jsx(Typography__default.default, {
+        sx: {
+          fontSize: 13.5,
+          lineHeight: 1.55,
+          color: '#4b5562',
+          fontWeight: 500
+        },
+        children: intl$1.formatMessage({
+          id: "exerciseRunner.arduino.connectGuide.steps.".concat(step)
+        }, {
+          usbmodem: renderInlineCode('usbmodem'),
+          usbserial: renderInlineCode('usbserial'),
+          connect: renderStrong(intl$1.formatMessage({
+            id: 'exerciseRunner.arduino.connectGuide.preview.connect'
+          })),
+          cancel: renderStrong(intl$1.formatMessage({
+            id: 'exerciseRunner.arduino.connectGuide.preview.cancel'
+          }))
+        })
+      })]
+    }, step);
+  };
+  //
+  //
+  //
+  return jsxRuntime.jsx(Stack__default.default, {
+    spacing: 1.25,
+    children: STEP_KEYS.map(function (step) {
+      return renderStep(step);
+    })
+  });
+};
+
+exports.default = ArduinoConnectionGuideDialogSteps;

package/cjs/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/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionCompile.js

@@ -0,0 +1,78 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var intl = require('@elice/intl');
+var lab = require('@mui/lab');
+var _context = require('./_context.js');
+var useControllerActionRun = require('../action/useControllerActionRun.js');
+var useExericseShortcut = require('../../../../hooks/useExericseShortcut.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+var ArduinoControllerActionCompile = function ArduinoControllerActionCompile() {
+  var intl$1 = intl.useRawEliceIntl();
+  var _useControllerActionR = useControllerActionRun.useControllerActionRun(),
+    isHidden = _useControllerActionR.isHidden,
+    isDisabled = _useControllerActionR.isDisabled,
+    isLoading = _useControllerActionR.isLoading,
+    run = _useControllerActionR.run;
+  var _useArduinoBridge = _context.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__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 (!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.useExericseShortcut('RUNNER_SUBMIT_RUN', compile);
+  //
+  //
+  //
+  if (isHidden) {
+    return null;
+  }
+  return jsxRuntime.jsx(lab.LoadingButton, {
+    size: "small",
+    variant: "contained",
+    color: "primary",
+    loading: isCompileLoading,
+    disabled: isCompileDisabled,
+    onClick: compile,
+    children: intl$1.formatMessage({
+      id: 'exerciseRunner.controller.arduino.button.compile'
+    })
+  });
+};
+
+exports.default = ArduinoControllerActionCompile;

package/cjs/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;

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionUpload.js

@@ -0,0 +1,98 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var intl = require('@elice/intl');
+var mcuBridge = require('@elice/mcu-bridge');
+var lab = require('@mui/lab');
+var _context = require('./_context.js');
+var useControllerActionRun = require('../action/useControllerActionRun.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+var ArduinoControllerActionUpload = function ArduinoControllerActionUpload() {
+  var intl$1 = intl.useRawEliceIntl();
+  var _useControllerActionR = useControllerActionRun.useControllerActionRun(),
+    isHidden = _useControllerActionR.isHidden,
+    isDisabled = _useControllerActionR.isDisabled,
+    run = _useControllerActionR.run;
+  var _useConnection = mcuBridge.useConnection(),
+    status = _useConnection.status,
+    connect = _useConnection.connect;
+  var isBrowserSupported = mcuBridge.useIsBrowserSupported();
+  var _useArduinoBridge = _context.useArduinoBridge(),
+    setPendingIntent = _useArduinoBridge.setPendingIntent,
+    isPending = _useArduinoBridge.isPending,
+    isFlashing = _useArduinoBridge.isFlashing,
+    setConnectionIntent = _useArduinoBridge.setConnectionIntent;
+  var isUploadDisabled = isDisabled || isPending || isFlashing || !isBrowserSupported;
+  var isUploadLoading = isPending || isFlashing;
+  /**
+   * Submit the Arduino sketch, then flash the compiled firmware to the board.
+   */
+  var upload = React__default.default.useCallback(/*#__PURE__*/_rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
+    return _rollupPluginBabelHelpers.regenerator().w(function (_context) {
+      while (1) switch (_context.p = _context.n) {
+        case 0:
+          if (!isUploadDisabled) {
+            _context.n = 1;
+            break;
+          }
+          return _context.a(2);
+        case 1:
+          if (!(status !== 'connected')) {
+            _context.n = 5;
+            break;
+          }
+          setConnectionIntent('upload');
+          _context.p = 2;
+          _context.n = 3;
+          return connect();
+        case 3:
+          _context.n = 5;
+          break;
+        case 4:
+          _context.p = 4;
+          _context.v;
+          return _context.a(2);
+        case 5:
+          setPendingIntent('upload');
+          _context.n = 6;
+          return run();
+        case 6:
+          return _context.a(2);
+      }
+    }, _callee, null, [[2, 4]]);
+  })), [isUploadDisabled, status, connect, setConnectionIntent, setPendingIntent, run]);
+  //
+  //
+  //
+  if (isHidden) {
+    return null;
+  }
+  return jsxRuntime.jsx(lab.LoadingButton, {
+    size: "small",
+    variant: "contained",
+    loading: isUploadLoading,
+    disabled: isUploadDisabled,
+    sx: {
+      bgcolor: function bgcolor(theme) {
+        return theme.palette.primary.light;
+      }
+    },
+    onClick: upload,
+    children: intl$1.formatMessage({
+      id: 'exerciseRunner.controller.arduino.button.upload'
+    })
+  });
+};
+
+exports.default = ArduinoControllerActionUpload;

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerButtonGroup.d.ts

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

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerButtonGroup.js

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@mui/material');
+var ArduinoControllerActionCompile = require('./ArduinoControllerActionCompile.js');
+var ArduinoControllerActionUpload = require('./ArduinoControllerActionUpload.js');
+var ControllerActionGrade = require('../action/ControllerActionGrade.js');
+var ControllerActionCancel = require('../action/ControllerActionCancel.js');
+
+//
+//
+//
+var ArduinoControllerButtonGroup = function ArduinoControllerButtonGroup() {
+  return jsxRuntime.jsxs(material.Stack, {
+    direction: "row",
+    alignItems: "center",
+    gap: "0.5rem",
+    children: [jsxRuntime.jsx(ArduinoControllerActionCompile.default, {}), jsxRuntime.jsx(ArduinoControllerActionUpload.default, {}), jsxRuntime.jsx(ControllerActionGrade.default, {}), jsxRuntime.jsx(ControllerActionCancel.default, {})]
+  });
+};
+
+exports.default = ArduinoControllerButtonGroup;

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerStatusMessage.d.ts

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