@codecademy/codebytes 0.7.2 → 0.7.3

package/dist/codeByteEditor.js

@@ -1,23 +1,11 @@
+import _objectWithoutPropertiesLoose from "/home/runner/work/mono/mono/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js";
 import _styled from "@emotion/styled/base";
+var _excluded = ["text", "language", "hideCopyButton", "snippetsBaseUrl", "onEdit", "onLanguageChange", "copyFormatter", "trackingData", "trackFirstEdit"];
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var _jsxFileName = "/home/runner/work/mono/mono/libs/codebytes/src/codeByteEditor.tsx",
+    _this = this;
 
+import "core-js/modules/es.object.assign.js";
 import { Box, IconButton } from '@codecademy/gamut';
 import { FaviconIcon } from '@codecademy/gamut-icons';
 import { Background, system } from '@codecademy/gamut-styles';
@@ -27,6 +15,7 @@ import { Editor } from './editor';
 import { trackClick } from './helpers';
 import { LanguageSelection } from './languageSelection';
 import { trackUserImpression } from './libs/eventTracking';
+import { jsxDEV as _jsxDEV } from "@emotion/react/jsx-dev-runtime";
 var editorBaseStyles = system.css({
   border: 1,
   borderColor: 'gray-900',
@@ -38,7 +27,7 @@ var editorBaseStyles = system.css({
 var EditorContainer = /*#__PURE__*/_styled(Background, {
   target: "e1epka4g0",
   label: "EditorContainer"
-})(editorBaseStyles, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9jb2RlQnl0ZUVkaXRvci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0J3QiIsImZpbGUiOiIuLi9zcmMvY29kZUJ5dGVFZGl0b3IudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQm94LCBJY29uQnV0dG9uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHsgRmF2aWNvbkljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyBCYWNrZ3JvdW5kLCBzeXN0ZW0gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgU3R5bGVQcm9wcyB9IGZyb20gJ0Bjb2RlY2FkZW15L3ZhcmlhbmNlJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBoZWxsb1dvcmxkLCBMYW5ndWFnZU9wdGlvbiB9IGZyb20gJy4vY29uc3RzJztcbmltcG9ydCB7IEVkaXRvciB9IGZyb20gJy4vZWRpdG9yJztcbmltcG9ydCB7IHRyYWNrQ2xpY2sgfSBmcm9tICcuL2hlbHBlcnMnO1xuaW1wb3J0IHsgTGFuZ3VhZ2VTZWxlY3Rpb24gfSBmcm9tICcuL2xhbmd1YWdlU2VsZWN0aW9uJztcbmltcG9ydCB7IHRyYWNrVXNlckltcHJlc3Npb24gfSBmcm9tICcuL2xpYnMvZXZlbnRUcmFja2luZyc7XG5pbXBvcnQgeyBDb2RlQnl0ZUVkaXRvclByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IGVkaXRvckJhc2VTdHlsZXMgPSBzeXN0ZW0uY3NzKHtcbiAgYm9yZGVyOiAxLFxuICBib3JkZXJDb2xvcjogJ2dyYXktOTAwJyxcbiAgZGlzcGxheTogJ2ZsZXgnLFxuICBmbGV4RGlyZWN0aW9uOiAnY29sdW1uJyxcbiAgbWluSGVpZ2h0OiAnMjVyZW0nLFxufSk7XG5cbmNvbnN0IEVkaXRvckNvbnRhaW5lciA9IHN0eWxlZChCYWNrZ3JvdW5kKTxTdHlsZVByb3BzPHR5cGVvZiBlZGl0b3JCYXNlU3R5bGVzPj4oXG4gIGVkaXRvckJhc2VTdHlsZXNcbik7XG5cbmV4cG9ydCBjb25zdCBDb2RlQnl0ZUVkaXRvcjogUmVhY3QuRkM8Q29kZUJ5dGVFZGl0b3JQcm9wcz4gPSAoe1xuICB0ZXh0OiBpbml0aWFsVGV4dCxcbiAgbGFuZ3VhZ2U6IGluaXRpYWxMYW5ndWFnZSxcbiAgaGlkZUNvcHlCdXR0b24gPSBmYWxzZSxcbiAgc25pcHBldHNCYXNlVXJsLFxuICBvbkVkaXQsXG4gIG9uTGFuZ3VhZ2VDaGFuZ2UsXG4gIGNvcHlGb3JtYXR0ZXIsXG4gIHRyYWNraW5nRGF0YSxcbiAgdHJhY2tGaXJzdEVkaXQgPSBmYWxzZSxcbiAgLi4ucmVzdFxufSkgPT4ge1xuICBjb25zdCBnZXRJbml0aWFsVGV4dCA9ICgpID0+IHtcbiAgICBpZiAoaW5pdGlhbFRleHQgIT09IHVuZGVmaW5lZCkgcmV0dXJuIGluaXRpYWxUZXh0O1xuICAgIHJldHVybiBpbml0aWFsTGFuZ3VhZ2UgPyBoZWxsb1dvcmxkW2luaXRpYWxMYW5ndWFnZV0gOiAnJztcbiAgfTtcblxuICBjb25zdCBbdGV4dCwgc2V0VGV4dF0gPSB1c2VTdGF0ZTxzdHJpbmc+KGdldEluaXRpYWxUZXh0KCkpO1xuICBjb25zdCBbbGFuZ3VhZ2UsIHNldExhbmd1YWdlXSA9IHVzZVN0YXRlPExhbmd1YWdlT3B0aW9uPihcbiAgICBpbml0aWFsTGFuZ3VhZ2UgPz8gJydcbiAgKTtcbiAgY29uc3QgW2hhc0JlZW5FZGl0ZWQsIHNldEhhc0JlZW5FZGl0ZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgdHJhY2tVc2VySW1wcmVzc2lvbih7XG4gICAgICBwYWdlX25hbWU6IHRyYWNraW5nRGF0YT8ucGFnZV9uYW1lID8/ICdVbmtub3duJyxcbiAgICAgIGNvbnRleHQ6IHRyYWNraW5nRGF0YT8uY29udGV4dCA/PyBkb2N1bWVudC5yZWZlcnJlcixcbiAgICAgIHRhcmdldDogJ2NvZGVieXRlJyxcbiAgICB9KTtcbiAgfSwgW3RyYWNraW5nRGF0YV0pO1xuXG4gIHJldHVybiAoXG4gICAgPEVkaXRvckNvbnRhaW5lciBiZz1cImJsYWNrXCIgbWF4V2lkdGg9XCI0M3JlbVwiIHsuLi5yZXN0fSBvdmVyZmxvdz1cImhpZGRlblwiPlxuICAgICAgPEJveCBib3JkZXJCb3R0b209ezF9IGJvcmRlckNvbG9yPVwiZ3JheS05MDBcIiBweT17NH0gcGw9ezh9PlxuICAgICAgICA8SWNvbkJ1dHRvblxuICAgICAgICAgIGljb249e0Zhdmljb25JY29ufVxuICAgICAgICAgIHZhcmlhbnQ9XCJzZWNvbmRhcnlcIlxuICAgICAgICAgIGhyZWY9XCJodHRwczovL3d3dy5jb2RlY2FkZW15LmNvbS9cIlxuICAgICAgICAgIHRhcmdldD1cIl9ibGFua1wiXG4gICAgICAgICAgcmVsPVwibm9yZWZlcnJlclwiXG4gICAgICAgICAgYXJpYS1sYWJlbD1cInZpc2l0IGNvZGVjYWRlbXkuY29tXCJcbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB0cmFja0NsaWNrKCdsb2dvJywgdHJhY2tpbmdEYXRhKX1cbiAgICAgICAgLz5cbiAgICAgIDwvQm94PlxuICAgICAge2xhbmd1YWdlID8gKFxuICAgICAgICA8RWRpdG9yXG4gICAgICAgICAgbGFuZ3VhZ2U9e2xhbmd1YWdlfVxuICAgICAgICAgIHRleHQ9e3RleHR9XG4gICAgICAgICAgaGlkZUNvcHlCdXR0b249e2hpZGVDb3B5QnV0dG9ufVxuICAgICAgICAgIG9uQ2hhbmdlPXsobmV3VGV4dDogc3RyaW5nKSA9PiB7XG4gICAgICAgICAgICBzZXRUZXh0KG5ld1RleHQpO1xuICAgICAgICAgICAgb25FZGl0Py4obmV3VGV4dCwgbGFuZ3VhZ2UpO1xuICAgICAgICAgICAgaWYgKHRyYWNrRmlyc3RFZGl0ICYmIGhhc0JlZW5FZGl0ZWQgPT09IGZhbHNlKSB7XG4gICAgICAgICAgICAgIHNldEhhc0JlZW5FZGl0ZWQodHJ1ZSk7XG4gICAgICAgICAgICAgIHRyYWNrQ2xpY2soJ2VkaXQnLCB0cmFja2luZ0RhdGEpO1xuICAgICAgICAgICAgfVxuICAgICAgICAgIH19XG4gICAgICAgICAgc25pcHBldHNCYXNlVXJsPXtzbmlwcGV0c0Jhc2VVcmx9XG4gICAgICAgICAgY29weUZvcm1hdHRlcj17Y29weUZvcm1hdHRlcn1cbiAgICAgICAgICB0cmFja2luZ0RhdGE9e3RyYWNraW5nRGF0YX1cbiAgICAgICAgLz5cbiAgICAgICkgOiAoXG4gICAgICAgIDxMYW5ndWFnZVNlbGVjdGlvblxuICAgICAgICAgIG9uQ2hhbmdlPXsobmV3TGFuZ3VhZ2UpID0+IHtcbiAgICAgICAgICAgIGNvbnN0IG5ld1RleHQ6IHN0cmluZyA9XG4gICAgICAgICAgICAgIHRleHQgfHwgKG5ld0xhbmd1YWdlID8gaGVsbG9Xb3JsZFtuZXdMYW5ndWFnZV0gOiAnJyk7XG4gICAgICAgICAgICBzZXRMYW5ndWFnZShuZXdMYW5ndWFnZSk7XG4gICAgICAgICAgICBzZXRUZXh0KG5ld1RleHQpO1xuICAgICAgICAgICAgdHJhY2tDbGljaygnbGFuZ19zZWxlY3QnLCB0cmFja2luZ0RhdGEpO1xuICAgICAgICAgICAgb25MYW5ndWFnZUNoYW5nZT8uKG5ld1RleHQsIG5ld0xhbmd1YWdlKTtcbiAgICAgICAgICB9fVxuICAgICAgICAvPlxuICAgICAgKX1cbiAgICA8L0VkaXRvckNvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IENvZGVCeXRlRWRpdG9yO1xuIl19 */");
+})(editorBaseStyles, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9jb2RlQnl0ZUVkaXRvci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUJFIiwiZmlsZSI6Ii4uL3NyYy9jb2RlQnl0ZUVkaXRvci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCb3gsIEljb25CdXR0b24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQgeyBGYXZpY29uSWNvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCB7IEJhY2tncm91bmQsIHN5c3RlbSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBTdHlsZVByb3BzIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IFJlYWN0LCB7IHVzZUVmZmVjdCwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IGhlbGxvV29ybGQsIExhbmd1YWdlT3B0aW9uIH0gZnJvbSAnLi9jb25zdHMnO1xuaW1wb3J0IHsgRWRpdG9yIH0gZnJvbSAnLi9lZGl0b3InO1xuaW1wb3J0IHsgdHJhY2tDbGljayB9IGZyb20gJy4vaGVscGVycyc7XG5pbXBvcnQgeyBMYW5ndWFnZVNlbGVjdGlvbiB9IGZyb20gJy4vbGFuZ3VhZ2VTZWxlY3Rpb24nO1xuaW1wb3J0IHsgdHJhY2tVc2VySW1wcmVzc2lvbiB9IGZyb20gJy4vbGlicy9ldmVudFRyYWNraW5nJztcbmltcG9ydCB7IENvZGVCeXRlRWRpdG9yUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgZWRpdG9yQmFzZVN0eWxlcyA9IHN5c3RlbS5jc3Moe1xuICBib3JkZXI6IDEsXG4gIGJvcmRlckNvbG9yOiAnZ3JheS05MDAnLFxuICBkaXNwbGF5OiAnZmxleCcsXG4gIGZsZXhEaXJlY3Rpb246ICdjb2x1bW4nLFxuICBtaW5IZWlnaHQ6ICcyNXJlbScsXG59KTtcblxuY29uc3QgRWRpdG9yQ29udGFpbmVyID1cbiAgc3R5bGVkKEJhY2tncm91bmQpPFN0eWxlUHJvcHM8dHlwZW9mIGVkaXRvckJhc2VTdHlsZXM+PihlZGl0b3JCYXNlU3R5bGVzKTtcblxuZXhwb3J0IGNvbnN0IENvZGVCeXRlRWRpdG9yOiBSZWFjdC5GQzxDb2RlQnl0ZUVkaXRvclByb3BzPiA9ICh7XG4gIHRleHQ6IGluaXRpYWxUZXh0LFxuICBsYW5ndWFnZTogaW5pdGlhbExhbmd1YWdlLFxuICBoaWRlQ29weUJ1dHRvbiA9IGZhbHNlLFxuICBzbmlwcGV0c0Jhc2VVcmwsXG4gIG9uRWRpdCxcbiAgb25MYW5ndWFnZUNoYW5nZSxcbiAgY29weUZvcm1hdHRlcixcbiAgdHJhY2tpbmdEYXRhLFxuICB0cmFja0ZpcnN0RWRpdCA9IGZhbHNlLFxuICAuLi5yZXN0XG59KSA9PiB7XG4gIGNvbnN0IGdldEluaXRpYWxUZXh0ID0gKCkgPT4ge1xuICAgIGlmIChpbml0aWFsVGV4dCAhPT0gdW5kZWZpbmVkKSByZXR1cm4gaW5pdGlhbFRleHQ7XG4gICAgcmV0dXJuIGluaXRpYWxMYW5ndWFnZSA/IGhlbGxvV29ybGRbaW5pdGlhbExhbmd1YWdlXSA6ICcnO1xuICB9O1xuXG4gIGNvbnN0IFt0ZXh0LCBzZXRUZXh0XSA9IHVzZVN0YXRlPHN0cmluZz4oZ2V0SW5pdGlhbFRleHQoKSk7XG4gIGNvbnN0IFtsYW5ndWFnZSwgc2V0TGFuZ3VhZ2VdID0gdXNlU3RhdGU8TGFuZ3VhZ2VPcHRpb24+KFxuICAgIGluaXRpYWxMYW5ndWFnZSA/PyAnJ1xuICApO1xuICBjb25zdCBbaGFzQmVlbkVkaXRlZCwgc2V0SGFzQmVlbkVkaXRlZF0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICB0cmFja1VzZXJJbXByZXNzaW9uKHtcbiAgICAgIHBhZ2VfbmFtZTogdHJhY2tpbmdEYXRhPy5wYWdlX25hbWUgPz8gJ1Vua25vd24nLFxuICAgICAgY29udGV4dDogdHJhY2tpbmdEYXRhPy5jb250ZXh0ID8/IGRvY3VtZW50LnJlZmVycmVyLFxuICAgICAgdGFyZ2V0OiAnY29kZWJ5dGUnLFxuICAgIH0pO1xuICB9LCBbdHJhY2tpbmdEYXRhXSk7XG5cbiAgcmV0dXJuIChcbiAgICA8RWRpdG9yQ29udGFpbmVyIGJnPVwiYmxhY2tcIiBtYXhXaWR0aD1cIjQzcmVtXCIgey4uLnJlc3R9IG92ZXJmbG93PVwiaGlkZGVuXCI+XG4gICAgICA8Qm94IGJvcmRlckJvdHRvbT17MX0gYm9yZGVyQ29sb3I9XCJncmF5LTkwMFwiIHB5PXs0fSBwbD17OH0+XG4gICAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgICAgaWNvbj17RmF2aWNvbkljb259XG4gICAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgICAgaHJlZj1cImh0dHBzOi8vd3d3LmNvZGVjYWRlbXkuY29tL1wiXG4gICAgICAgICAgdGFyZ2V0PVwiX2JsYW5rXCJcbiAgICAgICAgICByZWw9XCJub3JlZmVycmVyXCJcbiAgICAgICAgICBhcmlhLWxhYmVsPVwidmlzaXQgY29kZWNhZGVteS5jb21cIlxuICAgICAgICAgIG9uQ2xpY2s9eygpID0+IHRyYWNrQ2xpY2soJ2xvZ28nLCB0cmFja2luZ0RhdGEpfVxuICAgICAgICAvPlxuICAgICAgPC9Cb3g+XG4gICAgICB7bGFuZ3VhZ2UgPyAoXG4gICAgICAgIDxFZGl0b3JcbiAgICAgICAgICBsYW5ndWFnZT17bGFuZ3VhZ2V9XG4gICAgICAgICAgdGV4dD17dGV4dH1cbiAgICAgICAgICBoaWRlQ29weUJ1dHRvbj17aGlkZUNvcHlCdXR0b259XG4gICAgICAgICAgb25DaGFuZ2U9eyhuZXdUZXh0OiBzdHJpbmcpID0+IHtcbiAgICAgICAgICAgIHNldFRleHQobmV3VGV4dCk7XG4gICAgICAgICAgICBvbkVkaXQ/LihuZXdUZXh0LCBsYW5ndWFnZSk7XG4gICAgICAgICAgICBpZiAodHJhY2tGaXJzdEVkaXQgJiYgaGFzQmVlbkVkaXRlZCA9PT0gZmFsc2UpIHtcbiAgICAgICAgICAgICAgc2V0SGFzQmVlbkVkaXRlZCh0cnVlKTtcbiAgICAgICAgICAgICAgdHJhY2tDbGljaygnZWRpdCcsIHRyYWNraW5nRGF0YSk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfX1cbiAgICAgICAgICBzbmlwcGV0c0Jhc2VVcmw9e3NuaXBwZXRzQmFzZVVybH1cbiAgICAgICAgICBjb3B5Rm9ybWF0dGVyPXtjb3B5Rm9ybWF0dGVyfVxuICAgICAgICAgIHRyYWNraW5nRGF0YT17dHJhY2tpbmdEYXRhfVxuICAgICAgICAvPlxuICAgICAgKSA6IChcbiAgICAgICAgPExhbmd1YWdlU2VsZWN0aW9uXG4gICAgICAgICAgb25DaGFuZ2U9eyhuZXdMYW5ndWFnZSkgPT4ge1xuICAgICAgICAgICAgY29uc3QgbmV3VGV4dDogc3RyaW5nID1cbiAgICAgICAgICAgICAgdGV4dCB8fCAobmV3TGFuZ3VhZ2UgPyBoZWxsb1dvcmxkW25ld0xhbmd1YWdlXSA6ICcnKTtcbiAgICAgICAgICAgIHNldExhbmd1YWdlKG5ld0xhbmd1YWdlKTtcbiAgICAgICAgICAgIHNldFRleHQobmV3VGV4dCk7XG4gICAgICAgICAgICB0cmFja0NsaWNrKCdsYW5nX3NlbGVjdCcsIHRyYWNraW5nRGF0YSk7XG4gICAgICAgICAgICBvbkxhbmd1YWdlQ2hhbmdlPy4obmV3VGV4dCwgbmV3TGFuZ3VhZ2UpO1xuICAgICAgICAgIH19XG4gICAgICAgIC8+XG4gICAgICApfVxuICAgIDwvRWRpdG9yQ29udGFpbmVyPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgQ29kZUJ5dGVFZGl0b3I7XG4iXX0= */");
 
 export var CodeByteEditor = function CodeByteEditor(_ref) {
   var initialText = _ref.text,
@@ -52,7 +41,7 @@ export var CodeByteEditor = function CodeByteEditor(_ref) {
       trackingData = _ref.trackingData,
       _ref$trackFirstEdit = _ref.trackFirstEdit,
       trackFirstEdit = _ref$trackFirstEdit === void 0 ? false : _ref$trackFirstEdit,
-      rest = _objectWithoutProperties(_ref, ["text", "language", "hideCopyButton", "snippetsBaseUrl", "onEdit", "onLanguageChange", "copyFormatter", "trackingData", "trackFirstEdit"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var getInitialText = function getInitialText() {
     if (initialText !== undefined) return initialText;
@@ -60,73 +49,92 @@ export var CodeByteEditor = function CodeByteEditor(_ref) {
   };
 
   var _useState = useState(getInitialText()),
-      _useState2 = _slicedToArray(_useState, 2),
-      text = _useState2[0],
-      setText = _useState2[1];
+      text = _useState[0],
+      setText = _useState[1];
 
-  var _useState3 = useState(initialLanguage !== null && initialLanguage !== void 0 ? initialLanguage : ''),
-      _useState4 = _slicedToArray(_useState3, 2),
-      language = _useState4[0],
-      setLanguage = _useState4[1];
+  var _useState2 = useState(initialLanguage != null ? initialLanguage : ''),
+      language = _useState2[0],
+      setLanguage = _useState2[1];
 
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      hasBeenEdited = _useState6[0],
-      setHasBeenEdited = _useState6[1];
+  var _useState3 = useState(false),
+      hasBeenEdited = _useState3[0],
+      setHasBeenEdited = _useState3[1];
 
   useEffect(function () {
     var _trackingData$page_na, _trackingData$context;
 
     trackUserImpression({
-      page_name: (_trackingData$page_na = trackingData === null || trackingData === void 0 ? void 0 : trackingData.page_name) !== null && _trackingData$page_na !== void 0 ? _trackingData$page_na : 'Unknown',
-      context: (_trackingData$context = trackingData === null || trackingData === void 0 ? void 0 : trackingData.context) !== null && _trackingData$context !== void 0 ? _trackingData$context : document.referrer,
+      page_name: (_trackingData$page_na = trackingData == null ? void 0 : trackingData.page_name) != null ? _trackingData$page_na : 'Unknown',
+      context: (_trackingData$context = trackingData == null ? void 0 : trackingData.context) != null ? _trackingData$context : document.referrer,
       target: 'codebyte'
     });
   }, [trackingData]);
-  return /*#__PURE__*/React.createElement(EditorContainer, _extends({
+  return _jsxDEV(EditorContainer, Object.assign({
     bg: "black",
     maxWidth: "43rem"
   }, rest, {
-    overflow: "hidden"
-  }), /*#__PURE__*/React.createElement(Box, {
-    borderBottom: 1,
-    borderColor: "gray-900",
-    py: 4,
-    pl: 8
-  }, /*#__PURE__*/React.createElement(IconButton, {
-    icon: FaviconIcon,
-    variant: "secondary",
-    href: "https://www.codecademy.com/",
-    target: "_blank",
-    rel: "noreferrer",
-    "aria-label": "visit codecademy.com",
-    onClick: function onClick() {
-      return trackClick('logo', trackingData);
-    }
-  })), language ? /*#__PURE__*/React.createElement(Editor, {
-    language: language,
-    text: text,
-    hideCopyButton: hideCopyButton,
-    onChange: function onChange(newText) {
-      setText(newText);
-      onEdit === null || onEdit === void 0 ? void 0 : onEdit(newText, language);
-
-      if (trackFirstEdit && hasBeenEdited === false) {
-        setHasBeenEdited(true);
-        trackClick('edit', trackingData);
+    overflow: "hidden",
+    children: [_jsxDEV(Box, {
+      borderBottom: 1,
+      borderColor: "gray-900",
+      py: 4,
+      pl: 8,
+      children: _jsxDEV(IconButton, {
+        icon: FaviconIcon,
+        variant: "secondary",
+        href: "https://www.codecademy.com/",
+        target: "_blank",
+        rel: "noreferrer",
+        "aria-label": "visit codecademy.com",
+        onClick: function onClick() {
+          return trackClick('logo', trackingData);
+        }
+      }, void 0, false, {
+        fileName: _jsxFileName,
+        lineNumber: 60,
+        columnNumber: 9
+      }, _this)
+    }, void 0, false, {
+      fileName: _jsxFileName,
+      lineNumber: 59,
+      columnNumber: 7
+    }, _this), language ? _jsxDEV(Editor, {
+      language: language,
+      text: text,
+      hideCopyButton: hideCopyButton,
+      onChange: function onChange(newText) {
+        setText(newText);
+        onEdit == null ? void 0 : onEdit(newText, language);
+
+        if (trackFirstEdit && hasBeenEdited === false) {
+          setHasBeenEdited(true);
+          trackClick('edit', trackingData);
+        }
+      },
+      snippetsBaseUrl: snippetsBaseUrl,
+      copyFormatter: copyFormatter,
+      trackingData: trackingData
+    }, void 0, false, {
+      fileName: _jsxFileName,
+      lineNumber: 71,
+      columnNumber: 9
+    }, _this) : _jsxDEV(LanguageSelection, {
+      onChange: function onChange(newLanguage) {
+        var newText = text || (newLanguage ? helloWorld[newLanguage] : '');
+        setLanguage(newLanguage);
+        setText(newText);
+        trackClick('lang_select', trackingData);
+        onLanguageChange == null ? void 0 : onLanguageChange(newText, newLanguage);
       }
-    },
-    snippetsBaseUrl: snippetsBaseUrl,
-    copyFormatter: copyFormatter,
-    trackingData: trackingData
-  }) : /*#__PURE__*/React.createElement(LanguageSelection, {
-    onChange: function onChange(newLanguage) {
-      var newText = text || (newLanguage ? helloWorld[newLanguage] : '');
-      setLanguage(newLanguage);
-      setText(newText);
-      trackClick('lang_select', trackingData);
-      onLanguageChange === null || onLanguageChange === void 0 ? void 0 : onLanguageChange(newText, newLanguage);
-    }
-  }));
+    }, void 0, false, {
+      fileName: _jsxFileName,
+      lineNumber: 88,
+      columnNumber: 9
+    }, _this)]
+  }), void 0, true, {
+    fileName: _jsxFileName,
+    lineNumber: 58,
+    columnNumber: 5
+  }, _this);
 };
 export default CodeByteEditor;

package/dist/consts.js

@@ -1,3 +1,6 @@
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.object.keys.js";
 // key = language param to send to snippets service
 // val = label in language selection drop down
 export var LanguageOptions = {

package/dist/drawers.js

@@ -1,22 +1,15 @@
 import _styled from "@emotion/styled/base";
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var _jsxFileName = "/home/runner/work/mono/mono/libs/codebytes/src/drawers.tsx",
+    _this = this;
 
 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)."; }
 
 import { FlexBox, IconButton } from '@codecademy/gamut';
 import { ArrowChevronLeftIcon, ArrowChevronRightIcon } from '@codecademy/gamut-icons';
 import React, { useState } from 'react';
+import { jsxDEV as _jsxDEV } from "@emotion/react/jsx-dev-runtime";
+import { Fragment as _Fragment } from "@emotion/react/jsx-dev-runtime";
 
 var DrawerLabel = _styled("span", {
   target: "e1keub6a2",
@@ -55,7 +48,7 @@ var Drawer = /*#__PURE__*/_styled(FlexBox, {
 })("position:relative;", function (_ref) {
   var open = _ref.open,
       hideOnClose = _ref.hideOnClose;
-  return "\n    flex-basis: ".concat(open ? '100%' : '0%', ";\n    visibility: ").concat(!open && hideOnClose ? 'hidden' : 'visible', ";\n    transition: flex-basis 0.2s ").concat(open ? 'ease-out' : 'ease-in, visibility 0s 0.2s', ";\n\n    ").concat(LeftDrawerIcon, ", ").concat(RightDrawerIcon, " {\n      transform: rotateZ(").concat(open ? '0' : '180', "deg)};\n    }\n  ");
+  return "\n    flex-basis: " + (open ? '100%' : '0%') + ";\n    visibility: " + (!open && hideOnClose ? 'hidden' : 'visible') + ";\n    transition: flex-basis 0.2s " + (open ? 'ease-out' : 'ease-in, visibility 0s 0.2s') + ";\n\n    " + LeftDrawerIcon + ", " + RightDrawerIcon + " {\n      transform: rotateZ(" + (open ? '0' : '180') + "deg)};\n    }\n  ";
 }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9kcmF3ZXJzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQnlFIiwiZmlsZSI6Ii4uL3NyYy9kcmF3ZXJzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEZsZXhCb3gsIEljb25CdXR0b24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQge1xuICBBcnJvd0NoZXZyb25MZWZ0SWNvbixcbiAgQXJyb3dDaGV2cm9uUmlnaHRJY29uLFxufSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5cbmNvbnN0IERyYXdlckxhYmVsID0gc3R5bGVkLnNwYW5gXG4gIHBhZGRpbmc6IDAuODc1cmVtIDAuNXJlbTtcbmA7XG5cbmNvbnN0IExlZnREcmF3ZXJJY29uID0gc3R5bGVkKEFycm93Q2hldnJvbkxlZnRJY29uKTx7IG9wZW4/OiBib29sZWFuIH0+YFxuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4ycyBlYXNlLWluLW91dDtcbmA7XG5jb25zdCBSaWdodERyYXdlckljb24gPSBMZWZ0RHJhd2VySWNvbi53aXRoQ29tcG9uZW50KEFycm93Q2hldnJvblJpZ2h0SWNvbik7XG5cbmNvbnN0IERyYXdlciA9IHN0eWxlZChGbGV4Qm94KTx7IG9wZW4/OiBib29sZWFuOyBoaWRlT25DbG9zZT86IGJvb2xlYW4gfT5gXG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgJHsoeyBvcGVuLCBoaWRlT25DbG9zZSB9KSA9PiBgXG4gICAgZmxleC1iYXNpczogJHtvcGVuID8gJzEwMCUnIDogJzAlJ307XG4gICAgdmlzaWJpbGl0eTogJHshb3BlbiAmJiBoaWRlT25DbG9zZSA/ICdoaWRkZW4nIDogJ3Zpc2libGUnfTtcbiAgICB0cmFuc2l0aW9uOiBmbGV4LWJhc2lzIDAuMnMgJHtcbiAgICAgIG9wZW4gPyAnZWFzZS1vdXQnIDogJ2Vhc2UtaW4sIHZpc2liaWxpdHkgMHMgMC4ycydcbiAgICB9O1xuXG4gICAgJHtMZWZ0RHJhd2VySWNvbn0sICR7UmlnaHREcmF3ZXJJY29ufSB7XG4gICAgICB0cmFuc2Zvcm06IHJvdGF0ZVooJHtvcGVuID8gJzAnIDogJzE4MCd9ZGVnKX07XG4gICAgfVxuICBgfVxuYDtcblxuZXhwb3J0IHR5cGUgRHJhd2Vyc1Byb3BzID0ge1xuICBsZWZ0Q2hpbGQ6IFJlYWN0LlJlYWN0Tm9kZTtcbiAgcmlnaHRDaGlsZDogUmVhY3QuUmVhY3ROb2RlO1xufTtcblxuZXhwb3J0IGNvbnN0IERyYXdlcnM6IFJlYWN0LkZDPERyYXdlcnNQcm9wcz4gPSAoeyBsZWZ0Q2hpbGQsIHJpZ2h0Q2hpbGQgfSkgPT4ge1xuICBjb25zdCBbb3Blbiwgc2V0T3Blbl0gPSB1c2VTdGF0ZTwnbGVmdCcgfCAncmlnaHQnIHwgJ2JvdGgnPignYm90aCcpO1xuXG4gIGxldCBhcmlhTGFiZWxDb2RlQnV0dG9uID0gJ2hpZGUgY29kZSc7XG4gIGxldCBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnaGlkZSBvdXRwdXQnO1xuICBsZXQgaXNMZWZ0T3BlbiA9IGZhbHNlO1xuICBsZXQgaXNSaWdodE9wZW4gPSBmYWxzZTtcblxuICBpZiAob3BlbiA9PT0gJ2xlZnQnKSB7XG4gICAgYXJpYUxhYmVsQ29kZUJ1dHRvbiA9IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiA9ICdzaG93IG91dHB1dCc7XG4gICAgaXNMZWZ0T3BlbiA9IHRydWU7XG4gIH0gZWxzZSBpZiAob3BlbiA9PT0gJ3JpZ2h0Jykge1xuICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBjb2RlJztcbiAgICBpc1JpZ2h0T3BlbiA9IHRydWU7XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8RmxleEJveD5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIG9wZW49eyFpc1JpZ2h0T3Blbn1cbiAgICAgICAgICBhbGlnbkl0ZW1zPVwiY2VudGVyXCJcbiAgICAgICAgICBmbGV4V3JhcD1cIm5vd3JhcFwiXG4gICAgICAgICAgdGV4dEFsaWduPVwibGVmdFwiXG4gICAgICAgICAgYm9yZGVyUmlnaHQ9ezF9XG4gICAgICAgICAgYm9yZGVyQ29sb3I9XCJncmF5LTkwMFwiXG4gICAgICAgICAgcHg9ezh9XG4gICAgICAgID5cbiAgICAgICAgICA8SWNvbkJ1dHRvblxuICAgICAgICAgICAgaWNvbj17TGVmdERyYXdlckljb259XG4gICAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICBvbkNsaWNrPXsoKSA9PlxuICAgICAgICAgICAgICBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAncmlnaHQnIDogJ2JvdGgnKSlcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGFyaWEtbGFiZWw9e2FyaWFMYWJlbENvZGVCdXR0b259XG4gICAgICAgICAgICBhcmlhLWNvbnRyb2xzPVwiY29kZS1kcmF3ZXJcIlxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17IWlzUmlnaHRPcGVufVxuICAgICAgICAgIC8+XG4gICAgICAgICAgPERyYXdlckxhYmVsIGlkPVwiY29kZS1kcmF3ZXItbGFiZWxcIj5Db2RlPC9EcmF3ZXJMYWJlbD5cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICAgIDxEcmF3ZXJcbiAgICAgICAgICBvcGVuPXshaXNMZWZ0T3Blbn1cbiAgICAgICAgICBhbGlnbkl0ZW1zPVwiY2VudGVyXCJcbiAgICAgICAgICBmbGV4V3JhcD1cIm5vd3JhcFwiXG4gICAgICAgICAganVzdGlmeUNvbnRlbnQ9XCJmbGV4LWVuZFwiXG4gICAgICAgICAgcHg9ezh9XG4gICAgICAgID5cbiAgICAgICAgICA8RHJhd2VyTGFiZWwgaWQ9XCJvdXRwdXQtZHJhd2VyLWxhYmVsXCI+T3V0cHV0PC9EcmF3ZXJMYWJlbD5cbiAgICAgICAgICA8SWNvbkJ1dHRvblxuICAgICAgICAgICAgaWNvbj17UmlnaHREcmF3ZXJJY29ufVxuICAgICAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgICAgICBzaXplPVwic21hbGxcIlxuICAgICAgICAgICAgb25DbGljaz17KCkgPT5cbiAgICAgICAgICAgICAgc2V0T3Blbigoc3RhdGUpID0+IChzdGF0ZSA9PT0gJ2JvdGgnID8gJ2xlZnQnIDogJ2JvdGgnKSlcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGFyaWEtbGFiZWw9e2FyaWFMYWJlbE91dHB1dEJ1dHRvbn1cbiAgICAgICAgICAgIGFyaWEtY29udHJvbHM9XCJvdXRwdXQtZHJhd2VyXCJcbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9eyFpc0xlZnRPcGVufVxuICAgICAgICAgIC8+XG4gICAgICAgIDwvRHJhd2VyPlxuICAgICAgPC9GbGV4Qm94PlxuICAgICAgPEZsZXhCb3hcbiAgICAgICAgZmxleEdyb3c9ezF9XG4gICAgICAgIGJvcmRlclk9ezF9XG4gICAgICAgIGJvcmRlckNvbG9yPVwiZ3JheS05MDBcIlxuICAgICAgICBhbGlnbkl0ZW1zPVwic3RyZXRjaFwiXG4gICAgICAgIG92ZXJmbG93PVwiaGlkZGVuXCJcbiAgICAgID5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIGhpZGVPbkNsb3NlXG4gICAgICAgICAgaWQ9XCJjb2RlLWRyYXdlclwiXG4gICAgICAgICAgYXJpYS1sYWJlbGxlZGJ5PVwiY29kZS1kcmF3ZXItbGFiZWxcIlxuICAgICAgICAgIG9wZW49eyFpc1JpZ2h0T3Blbn1cbiAgICAgICAgICBmbGV4R3Jvdz17MH1cbiAgICAgICAgICBvdmVyZmxvdz1cImhpZGRlblwiXG4gICAgICAgICAgYm9yZGVyQ29sb3I9XCJncmF5LTkwMFwiXG4gICAgICAgICAgYm9yZGVyU3R5bGVSaWdodD1cInNvbGlkXCJcbiAgICAgICAgICBib3JkZXJXaWR0aFJpZ2h0PVwidGhpblwiXG4gICAgICAgID5cbiAgICAgICAgICB7bGVmdENoaWxkfVxuICAgICAgICA8L0RyYXdlcj5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIGhpZGVPbkNsb3NlXG4gICAgICAgICAgaWQ9XCJvdXRwdXQtZHJhd2VyXCJcbiAgICAgICAgICBhcmlhLWxhYmVsbGVkYnk9XCJvdXRwdXQtZHJhd2VyLWxhYmVsXCJcbiAgICAgICAgICByb2xlPVwicmVnaW9uXCJcbiAgICAgICAgICBvcGVuPXshaXNMZWZ0T3Blbn1cbiAgICAgICAgICBvdmVyZmxvdz1cImhpZGRlblwiXG4gICAgICAgID5cbiAgICAgICAgICB7cmlnaHRDaGlsZH1cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgPC8+XG4gICk7XG59O1xuIl19 */"));
 
 export var Drawers = function Drawers(_ref2) {
@@ -63,9 +56,8 @@ export var Drawers = function Drawers(_ref2) {
       rightChild = _ref2.rightChild;
 
   var _useState = useState('both'),
-      _useState2 = _slicedToArray(_useState, 2),
-      open = _useState2[0],
-      setOpen = _useState2[1];
+      open = _useState[0],
+      setOpen = _useState[1];
 
   var ariaLabelCodeButton = 'hide code';
   var ariaLabelOutputButton = 'hide output';
@@ -80,70 +72,121 @@ export var Drawers = function Drawers(_ref2) {
     isRightOpen = true;
   }
 
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FlexBox, null, /*#__PURE__*/React.createElement(Drawer, {
-    open: !isRightOpen,
-    alignItems: "center",
-    flexWrap: "nowrap",
-    textAlign: "left",
-    borderRight: 1,
-    borderColor: "gray-900",
-    px: 8
-  }, /*#__PURE__*/React.createElement(IconButton, {
-    icon: LeftDrawerIcon,
-    variant: "secondary",
-    size: "small",
-    onClick: function onClick() {
-      return setOpen(function (state) {
-        return state === 'both' ? 'right' : 'both';
-      });
-    },
-    "aria-label": ariaLabelCodeButton,
-    "aria-controls": "code-drawer",
-    "aria-expanded": !isRightOpen
-  }), /*#__PURE__*/React.createElement(DrawerLabel, {
-    id: "code-drawer-label"
-  }, "Code")), /*#__PURE__*/React.createElement(Drawer, {
-    open: !isLeftOpen,
-    alignItems: "center",
-    flexWrap: "nowrap",
-    justifyContent: "flex-end",
-    px: 8
-  }, /*#__PURE__*/React.createElement(DrawerLabel, {
-    id: "output-drawer-label"
-  }, "Output"), /*#__PURE__*/React.createElement(IconButton, {
-    icon: RightDrawerIcon,
-    variant: "secondary",
-    size: "small",
-    onClick: function onClick() {
-      return setOpen(function (state) {
-        return state === 'both' ? 'left' : 'both';
-      });
-    },
-    "aria-label": ariaLabelOutputButton,
-    "aria-controls": "output-drawer",
-    "aria-expanded": !isLeftOpen
-  }))), /*#__PURE__*/React.createElement(FlexBox, {
-    flexGrow: 1,
-    borderY: 1,
-    borderColor: "gray-900",
-    alignItems: "stretch",
-    overflow: "hidden"
-  }, /*#__PURE__*/React.createElement(Drawer, {
-    hideOnClose: true,
-    id: "code-drawer",
-    "aria-labelledby": "code-drawer-label",
-    open: !isRightOpen,
-    flexGrow: 0,
-    overflow: "hidden",
-    borderColor: "gray-900",
-    borderStyleRight: "solid",
-    borderWidthRight: "thin"
-  }, leftChild), /*#__PURE__*/React.createElement(Drawer, {
-    hideOnClose: true,
-    id: "output-drawer",
-    "aria-labelledby": "output-drawer-label",
-    role: "region",
-    open: !isLeftOpen,
-    overflow: "hidden"
-  }, rightChild)));
+  return _jsxDEV(_Fragment, {
+    children: [_jsxDEV(FlexBox, {
+      children: [_jsxDEV(Drawer, {
+        open: !isRightOpen,
+        alignItems: "center",
+        flexWrap: "nowrap",
+        textAlign: "left",
+        borderRight: 1,
+        borderColor: "gray-900",
+        px: 8,
+        children: [_jsxDEV(IconButton, {
+          icon: LeftDrawerIcon,
+          variant: "secondary",
+          size: "small",
+          onClick: function onClick() {
+            return setOpen(function (state) {
+              return state === 'both' ? 'right' : 'both';
+            });
+          },
+          "aria-label": ariaLabelCodeButton,
+          "aria-controls": "code-drawer",
+          "aria-expanded": !isRightOpen
+        }, void 0, false, {
+          fileName: _jsxFileName,
+          lineNumber: 66,
+          columnNumber: 11
+        }, _this), _jsxDEV(DrawerLabel, {
+          id: "code-drawer-label",
+          children: "Code"
+        }, void 0, false, {
+          fileName: _jsxFileName,
+          lineNumber: 77,
+          columnNumber: 11
+        }, _this)]
+      }, void 0, true, {
+        fileName: _jsxFileName,
+        lineNumber: 57,
+        columnNumber: 9
+      }, _this), _jsxDEV(Drawer, {
+        open: !isLeftOpen,
+        alignItems: "center",
+        flexWrap: "nowrap",
+        justifyContent: "flex-end",
+        px: 8,
+        children: [_jsxDEV(DrawerLabel, {
+          id: "output-drawer-label",
+          children: "Output"
+        }, void 0, false, {
+          fileName: _jsxFileName,
+          lineNumber: 86,
+          columnNumber: 11
+        }, _this), _jsxDEV(IconButton, {
+          icon: RightDrawerIcon,
+          variant: "secondary",
+          size: "small",
+          onClick: function onClick() {
+            return setOpen(function (state) {
+              return state === 'both' ? 'left' : 'both';
+            });
+          },
+          "aria-label": ariaLabelOutputButton,
+          "aria-controls": "output-drawer",
+          "aria-expanded": !isLeftOpen
+        }, void 0, false, {
+          fileName: _jsxFileName,
+          lineNumber: 87,
+          columnNumber: 11
+        }, _this)]
+      }, void 0, true, {
+        fileName: _jsxFileName,
+        lineNumber: 79,
+        columnNumber: 9
+      }, _this)]
+    }, void 0, true, {
+      fileName: _jsxFileName,
+      lineNumber: 56,
+      columnNumber: 7
+    }, _this), _jsxDEV(FlexBox, {
+      flexGrow: 1,
+      borderY: 1,
+      borderColor: "gray-900",
+      alignItems: "stretch",
+      overflow: "hidden",
+      children: [_jsxDEV(Drawer, {
+        hideOnClose: true,
+        id: "code-drawer",
+        "aria-labelledby": "code-drawer-label",
+        open: !isRightOpen,
+        flexGrow: 0,
+        overflow: "hidden",
+        borderColor: "gray-900",
+        borderStyleRight: "solid",
+        borderWidthRight: "thin",
+        children: leftChild
+      }, void 0, false, {
+        fileName: _jsxFileName,
+        lineNumber: 107,
+        columnNumber: 9
+      }, _this), _jsxDEV(Drawer, {
+        hideOnClose: true,
+        id: "output-drawer",
+        "aria-labelledby": "output-drawer-label",
+        role: "region",
+        open: !isLeftOpen,
+        overflow: "hidden",
+        children: rightChild
+      }, void 0, false, {
+        fileName: _jsxFileName,
+        lineNumber: 120,
+        columnNumber: 9
+      }, _this)]
+    }, void 0, true, {
+      fileName: _jsxFileName,
+      lineNumber: 100,
+      columnNumber: 7
+    }, _this)]
+  }, void 0, true);
 };