@codecademy/codebytes 0.6.1 → 0.6.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/MonacoEditor/colorsDark.d.ts +32 -0
  3. package/{src/MonacoEditor/colorsDark.ts → dist/MonacoEditor/colorsDark.js} +8 -16
  4. package/dist/MonacoEditor/index.d.ts +7 -0
  5. package/dist/MonacoEditor/index.js +42 -0
  6. package/dist/MonacoEditor/theme.d.ts +2 -0
  7. package/dist/MonacoEditor/theme.js +122 -0
  8. package/dist/MonacoEditor/types.d.ts +1 -0
  9. package/dist/MonacoEditor/types.js +0 -0
  10. package/dist/__tests__/codebyte-test.d.ts +1 -0
  11. package/dist/__tests__/codebyte-test.js +195 -0
  12. package/dist/__tests__/editor-test.d.ts +1 -0
  13. package/dist/__tests__/editor-test.js +147 -0
  14. package/dist/__tests__/helpers-test.d.ts +1 -0
  15. package/dist/__tests__/helpers-test.js +117 -0
  16. package/dist/__tests__/language-selection-test.d.ts +1 -0
  17. package/dist/__tests__/language-selection-test.js +15 -0
  18. package/dist/__tests__/mocks.d.ts +0 -0
  19. package/dist/__tests__/mocks.js +13 -0
  20. package/dist/api.d.ts +12 -0
  21. package/dist/api.js +39 -0
  22. package/dist/codeByteEditor.d.ts +13 -0
  23. package/dist/codeByteEditor.js +133 -0
  24. package/dist/consts.d.ts +23 -0
  25. package/dist/consts.js +34 -0
  26. package/dist/drawers.d.ts +6 -0
  27. package/dist/drawers.js +148 -0
  28. package/dist/editor.d.ts +13 -0
  29. package/dist/editor.js +189 -0
  30. package/dist/helpers/index.d.ts +15 -0
  31. package/dist/helpers/index.js +29 -0
  32. package/{src/index.ts → dist/index.d.ts} +0 -0
  33. package/dist/index.js +2 -0
  34. package/dist/languageSelection.d.ts +6 -0
  35. package/dist/languageSelection.js +22 -0
  36. package/dist/libs/eventTracking.d.ts +1 -0
  37. package/dist/libs/eventTracking.js +11 -0
  38. package/{src → dist}/theme.d.ts +0 -0
  39. package/dist/types.d.ts +14 -0
  40. package/dist/types.js +0 -0
  41. package/package.json +16 -8
  42. package/babel.config.js +0 -15
  43. package/jest.config.js +0 -1
  44. package/src/MonacoEditor/index.tsx +0 -56
  45. package/src/MonacoEditor/theme.ts +0 -64
  46. package/src/MonacoEditor/types.ts +0 -1
  47. package/src/__tests__/codebyte-test.tsx +0 -197
  48. package/src/__tests__/editor-test.tsx +0 -113
  49. package/src/__tests__/helpers-test.tsx +0 -121
  50. package/src/__tests__/language-selection-test.tsx +0 -14
  51. package/src/__tests__/mocks.ts +0 -8
  52. package/src/api.ts +0 -28
  53. package/src/codeByteEditor.tsx +0 -118
  54. package/src/consts.ts +0 -64
  55. package/src/drawers.tsx +0 -132
  56. package/src/editor.tsx +0 -160
  57. package/src/helpers/index.ts +0 -41
  58. package/src/languageSelection.tsx +0 -26
  59. package/src/libs/eventTracking.ts +0 -18
  60. package/src/types.ts +0 -15
  61. package/tsconfig.json +0 -8
@@ -0,0 +1,117 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+
3
+ 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."); }
4
+
5
+ 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); }
6
+
7
+ 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; }
8
+
9
+ 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; }
10
+
11
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
12
+
13
+ import { encode } from 'js-base64';
14
+ import { getOptions, trackClick } from '../helpers';
15
+ import { trackUserClick } from '../libs/eventTracking';
16
+ jest.mock('../libs/eventTracking');
17
+ var initialUrl = window.location.href;
18
+
19
+ var resetCodebytesParams = function resetCodebytesParams() {
20
+ return window.history.replaceState(null, '', initialUrl);
21
+ };
22
+
23
+ var setCodebytesParams = function setCodebytesParams(params) {
24
+ if (params.text) {
25
+ params.text = encode(params.text);
26
+ }
27
+
28
+ var url = new URL(window.location.href);
29
+ Object.entries(params).forEach(function (_ref) {
30
+ var _ref2 = _slicedToArray(_ref, 2),
31
+ key = _ref2[0],
32
+ value = _ref2[1];
33
+
34
+ url.searchParams.set(key, value);
35
+ });
36
+ window.history.replaceState({}, '', url.toString());
37
+ };
38
+
39
+ describe('getOptions', function () {
40
+ afterEach(function () {
41
+ resetCodebytesParams();
42
+ });
43
+ it('parses props out of the window locations', function () {
44
+ var text = "\n const msg = 'Sup?';\n console.log(msg);\n ".trim();
45
+ setCodebytesParams({
46
+ lang: 'javascript',
47
+ text: text,
48
+ 'copy-mode': '',
49
+ 'client-name': 'forum',
50
+ page: 'https://discuss.codecademy.com/some-interesting/post',
51
+ mode: 'compose'
52
+ });
53
+ expect(getOptions()).toEqual({
54
+ clientName: 'forum',
55
+ parentPage: 'https://discuss.codecademy.com/some-interesting/post',
56
+ renderMode: 'compose'
57
+ });
58
+ });
59
+ });
60
+ describe('trackClick', function () {
61
+ afterEach(function () {
62
+ resetCodebytesParams();
63
+ trackUserClick.mockReset();
64
+ });
65
+ it('proxies to trackUserClick setting the page_name, context, and target', function () {
66
+ var target = 'foobar';
67
+ setCodebytesParams({
68
+ lang: 'javascript',
69
+ text: "\n const msg = 'Sup?';\n console.log(msg);\n ".trim(),
70
+ 'copy-mode': '',
71
+ 'client-name': 'forum',
72
+ page: 'https://discuss.codecademy.com/some-interesting/post',
73
+ mode: ''
74
+ });
75
+ trackClick(target);
76
+ expect(trackUserClick).toHaveBeenCalledWith({
77
+ page_name: 'forum',
78
+ context: 'https://discuss.codecademy.com/some-interesting/post',
79
+ target: target
80
+ });
81
+ });
82
+ it('defaults the client name to "Unknown"', function () {
83
+ var target = 'foobar';
84
+ setCodebytesParams({
85
+ lang: 'javascript',
86
+ text: "\n const msg = 'Sup?';\n console.log(msg);\n ".trim(),
87
+ 'copy-mode': '',
88
+ 'client-name': '',
89
+ page: 'https://discuss.codecademy.com/some-interesting/post',
90
+ mode: ''
91
+ });
92
+ trackClick(target);
93
+ expect(trackUserClick).toHaveBeenCalledWith({
94
+ page_name: 'Unknown',
95
+ context: 'https://discuss.codecademy.com/some-interesting/post',
96
+ target: target
97
+ });
98
+ });
99
+ it('embeds the render mode into the page_name', function () {
100
+ var mode = 'compose';
101
+ var target = 'foobar';
102
+ setCodebytesParams({
103
+ lang: 'javascript',
104
+ text: "\n const msg = 'Sup?';\n console.log(msg);\n ".trim(),
105
+ 'copy-mode': '',
106
+ 'client-name': 'forum',
107
+ page: 'https://discuss.codecademy.com/some-interesting/post',
108
+ mode: mode
109
+ });
110
+ trackClick(target);
111
+ expect(trackUserClick).toHaveBeenCalledWith({
112
+ page_name: "forum_".concat(mode),
113
+ context: 'https://discuss.codecademy.com/some-interesting/post',
114
+ target: target
115
+ });
116
+ });
117
+ });
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,15 @@
1
+ import { setupRtl } from '@codecademy/gamut-tests';
2
+ import { LanguageSelection } from '../languageSelection';
3
+ var renderWrapper = setupRtl(LanguageSelection, {
4
+ onChange: function onChange() {
5
+ return null;
6
+ }
7
+ });
8
+ describe('LanguageSelection', function () {
9
+ it('has placeholder text', function () {
10
+ var _renderWrapper = renderWrapper(),
11
+ view = _renderWrapper.view;
12
+
13
+ view.getByText('Which language do you want to code in?');
14
+ });
15
+ });
File without changes
@@ -0,0 +1,13 @@
1
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
2
+
3
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
4
+
5
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
+
7
+ jest.mock('react-resize-observer');
8
+ jest.mock('../libs/eventTracking');
9
+ jest.mock('../helpers', function () {
10
+ return _objectSpread(_objectSpread({}, jest.requireActual('../helpers')), {}, {
11
+ trackClick: jest.fn()
12
+ });
13
+ });
package/dist/api.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ import type { LanguageOption } from './consts';
2
+ interface Response {
3
+ stderr: string;
4
+ stdout: string;
5
+ exit_code: number;
6
+ }
7
+ interface PostSnippetData {
8
+ language: LanguageOption;
9
+ code: string;
10
+ }
11
+ export declare const postSnippet: (data: PostSnippetData, snippetsBaseUrl?: string | undefined) => Promise<Response>;
12
+ export {};
package/dist/api.js ADDED
@@ -0,0 +1,39 @@
1
+ import _regeneratorRuntime from "@babel/runtime/regenerator";
2
+
3
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
4
+
5
+ function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
6
+
7
+ export var postSnippet = /*#__PURE__*/function () {
8
+ var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(data, snippetsBaseUrl) {
9
+ var snippetsEndpoint, response;
10
+ return _regeneratorRuntime.wrap(function _callee$(_context) {
11
+ while (1) {
12
+ switch (_context.prev = _context.next) {
13
+ case 0:
14
+ snippetsEndpoint = "https://".concat(snippetsBaseUrl, "/snippets");
15
+ _context.next = 3;
16
+ return fetch(snippetsEndpoint, {
17
+ method: 'POST',
18
+ body: JSON.stringify(data),
19
+ headers: {
20
+ 'x-codecademy-user-id': 'codebytes-anon-user'
21
+ }
22
+ });
23
+
24
+ case 3:
25
+ response = _context.sent;
26
+ return _context.abrupt("return", response.json());
27
+
28
+ case 5:
29
+ case "end":
30
+ return _context.stop();
31
+ }
32
+ }
33
+ }, _callee);
34
+ }));
35
+
36
+ return function postSnippet(_x, _x2) {
37
+ return _ref.apply(this, arguments);
38
+ };
39
+ }();
@@ -0,0 +1,13 @@
1
+ import { StyleProps } from '@codecademy/variance';
2
+ import React from 'react';
3
+ import { CodeByteEditorProps } from './types';
4
+ declare const editorStates: (props: Partial<Record<"isIFrame", boolean>> & {
5
+ theme?: import("@emotion/react").Theme | undefined;
6
+ }) => import("@codecademy/variance").CSSObject;
7
+ declare const editorBaseStyles: (props: {
8
+ theme?: import("@emotion/react").Theme | undefined;
9
+ }) => import("@codecademy/variance").CSSObject;
10
+ export interface EditorStyleProps extends StyleProps<typeof editorBaseStyles>, StyleProps<typeof editorStates> {
11
+ }
12
+ export declare const CodeByteEditor: React.FC<CodeByteEditorProps>;
13
+ export default CodeByteEditor;
@@ -0,0 +1,133 @@
1
+ import _styled from "@emotion/styled/base";
2
+
3
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
+
5
+ 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."); }
6
+
7
+ 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); }
8
+
9
+ 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; }
10
+
11
+ 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; }
12
+
13
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
14
+
15
+ import { Box, IconButton } from '@codecademy/gamut';
16
+ import { FaviconIcon } from '@codecademy/gamut-icons';
17
+ import { Background, states, system } from '@codecademy/gamut-styles';
18
+ import React, { useEffect, useState } from 'react';
19
+ import { helloWorld } from './consts';
20
+ import { Editor } from './editor';
21
+ import { getOptions, trackClick } from './helpers';
22
+ import { LanguageSelection } from './languageSelection';
23
+ import { trackUserImpression } from './libs/eventTracking';
24
+ var editorStates = states({
25
+ isIFrame: {
26
+ height: '100vh'
27
+ }
28
+ });
29
+ var editorBaseStyles = system.css({
30
+ border: 1,
31
+ borderColor: 'gray-900',
32
+ display: 'flex',
33
+ flexDirection: 'column',
34
+ height: '25rem',
35
+ width: '43rem',
36
+ overflow: 'hidden'
37
+ });
38
+
39
+ var EditorContainer = /*#__PURE__*/_styled(Background, {
40
+ target: "e1epka4g0",
41
+ label: "EditorContainer"
42
+ })(editorBaseStyles, editorStates, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9jb2RlQnl0ZUVkaXRvci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBK0J3QiIsImZpbGUiOiIuLi9zcmMvY29kZUJ5dGVFZGl0b3IudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQm94LCBJY29uQnV0dG9uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHsgRmF2aWNvbkljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyBCYWNrZ3JvdW5kLCBzdGF0ZXMsIHN5c3RlbSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBTdHlsZVByb3BzIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IFJlYWN0LCB7IHVzZUVmZmVjdCwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IGhlbGxvV29ybGQsIExhbmd1YWdlT3B0aW9uIH0gZnJvbSAnLi9jb25zdHMnO1xuaW1wb3J0IHsgRWRpdG9yIH0gZnJvbSAnLi9lZGl0b3InO1xuaW1wb3J0IHsgZ2V0T3B0aW9ucywgdHJhY2tDbGljayB9IGZyb20gJy4vaGVscGVycyc7XG5pbXBvcnQgeyBMYW5ndWFnZVNlbGVjdGlvbiB9IGZyb20gJy4vbGFuZ3VhZ2VTZWxlY3Rpb24nO1xuaW1wb3J0IHsgdHJhY2tVc2VySW1wcmVzc2lvbiB9IGZyb20gJy4vbGlicy9ldmVudFRyYWNraW5nJztcbmltcG9ydCB7IENvZGVCeXRlRWRpdG9yUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgZWRpdG9yU3RhdGVzID0gc3RhdGVzKHtcbiAgaXNJRnJhbWU6IHsgaGVpZ2h0OiAnMTAwdmgnIH0sXG59KTtcblxuY29uc3QgZWRpdG9yQmFzZVN0eWxlcyA9IHN5c3RlbS5jc3Moe1xuICBib3JkZXI6IDEsXG4gIGJvcmRlckNvbG9yOiAnZ3JheS05MDAnLFxuICBkaXNwbGF5OiAnZmxleCcsXG4gIGZsZXhEaXJlY3Rpb246ICdjb2x1bW4nLFxuICBoZWlnaHQ6ICcyNXJlbScsXG4gIHdpZHRoOiAnNDNyZW0nLFxuICBvdmVyZmxvdzogJ2hpZGRlbicsXG59KTtcbmV4cG9ydCBpbnRlcmZhY2UgRWRpdG9yU3R5bGVQcm9wc1xuICBleHRlbmRzIFN0eWxlUHJvcHM8dHlwZW9mIGVkaXRvckJhc2VTdHlsZXM+LFxuICAgIFN0eWxlUHJvcHM8dHlwZW9mIGVkaXRvclN0YXRlcz4ge31cblxuY29uc3QgRWRpdG9yQ29udGFpbmVyID0gc3R5bGVkKEJhY2tncm91bmQpPEVkaXRvclN0eWxlUHJvcHM+KFxuICBlZGl0b3JCYXNlU3R5bGVzLFxuICBlZGl0b3JTdGF0ZXNcbik7XG5cbmV4cG9ydCBjb25zdCBDb2RlQnl0ZUVkaXRvcjogUmVhY3QuRkM8Q29kZUJ5dGVFZGl0b3JQcm9wcz4gPSAoe1xuICB0ZXh0OiBpbml0aWFsVGV4dCxcbiAgbGFuZ3VhZ2U6IGluaXRpYWxMYW5ndWFnZSxcbiAgaGlkZUNvcHlCdXR0b24gPSBmYWxzZSxcbiAgaXNJRnJhbWUgPSBmYWxzZSxcbiAgc25pcHBldHNCYXNlVXJsLFxuICBvbkVkaXQsXG4gIG9uTGFuZ3VhZ2VDaGFuZ2UsXG4gIG9uQ29weSxcbn0pID0+IHtcbiAgY29uc3QgZ2V0SW5pdGlhbFRleHQgPSAoKSA9PiB7XG4gICAgaWYgKGluaXRpYWxUZXh0ICE9PSB1bmRlZmluZWQpIHJldHVybiBpbml0aWFsVGV4dDtcbiAgICByZXR1cm4gaW5pdGlhbExhbmd1YWdlID8gaGVsbG9Xb3JsZFtpbml0aWFsTGFuZ3VhZ2VdIDogJyc7XG4gIH07XG5cbiAgY29uc3QgW3RleHQsIHNldFRleHRdID0gdXNlU3RhdGU8c3RyaW5nPihnZXRJbml0aWFsVGV4dCgpKTtcbiAgY29uc3QgW2xhbmd1YWdlLCBzZXRMYW5ndWFnZV0gPSB1c2VTdGF0ZTxMYW5ndWFnZU9wdGlvbj4oXG4gICAgaW5pdGlhbExhbmd1YWdlID8/ICcnXG4gICk7XG4gIGNvbnN0IFtoYXNCZWVuRWRpdGVkLCBzZXRIYXNCZWVuRWRpdGVkXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGNvbnN0IG9wdGlvbnMgPSBnZXRPcHRpb25zKCk7XG4gICAgY29uc3QgcGFnZV9uYW1lID0gb3B0aW9ucy5yZW5kZXJNb2RlXG4gICAgICA/IGAke29wdGlvbnMuY2xpZW50TmFtZX1fJHtvcHRpb25zLnJlbmRlck1vZGV9YFxuICAgICAgOiBvcHRpb25zLmNsaWVudE5hbWU7XG5cbiAgICB0cmFja1VzZXJJbXByZXNzaW9uKHtcbiAgICAgIHBhZ2VfbmFtZSxcbiAgICAgIGNvbnRleHQ6IG9wdGlvbnMucGFyZW50UGFnZSxcbiAgICAgIHRhcmdldDogJ2NvZGVieXRlJyxcbiAgICB9KTtcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPEVkaXRvckNvbnRhaW5lciBiZz1cImJsYWNrXCIgYXM9XCJtYWluXCIgaXNJRnJhbWU9e2lzSUZyYW1lfT5cbiAgICAgIDxCb3ggYm9yZGVyQm90dG9tPXsxfSBib3JkZXJDb2xvcj1cImdyYXktOTAwXCIgcHk9ezR9IHBsPXs4fT5cbiAgICAgICAgPEljb25CdXR0b25cbiAgICAgICAgICBpY29uPXtGYXZpY29uSWNvbn1cbiAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICBocmVmPVwiaHR0cHM6Ly93d3cuY29kZWNhZGVteS5jb20vXCJcbiAgICAgICAgICB0YXJnZXQ9XCJfYmxhbmtcIlxuICAgICAgICAgIHJlbD1cIm5vcmVmZXJyZXJcIlxuICAgICAgICAgIGFyaWEtbGFiZWw9XCJ2aXNpdCBjb2RlY2FkZW15LmNvbVwiXG4gICAgICAgICAgb25DbGljaz17KCkgPT4gdHJhY2tDbGljaygnbG9nbycpfVxuICAgICAgICAvPlxuICAgICAgPC9Cb3g+XG4gICAgICB7bGFuZ3VhZ2UgPyAoXG4gICAgICAgIDxFZGl0b3JcbiAgICAgICAgICBsYW5ndWFnZT17bGFuZ3VhZ2V9XG4gICAgICAgICAgdGV4dD17dGV4dH1cbiAgICAgICAgICBoaWRlQ29weUJ1dHRvbj17aGlkZUNvcHlCdXR0b259XG4gICAgICAgICAgb25DaGFuZ2U9eyhuZXdUZXh0OiBzdHJpbmcpID0+IHtcbiAgICAgICAgICAgIHNldFRleHQobmV3VGV4dCk7XG4gICAgICAgICAgICBvbkVkaXQ/LihuZXdUZXh0LCBsYW5ndWFnZSk7XG4gICAgICAgICAgICBjb25zdCB7IHJlbmRlck1vZGUgfSA9IGdldE9wdGlvbnMoKTtcbiAgICAgICAgICAgIGlmICghcmVuZGVyTW9kZSAmJiBoYXNCZWVuRWRpdGVkID09PSBmYWxzZSkge1xuICAgICAgICAgICAgICBzZXRIYXNCZWVuRWRpdGVkKHRydWUpO1xuICAgICAgICAgICAgICB0cmFja0NsaWNrKCdlZGl0Jyk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfX1cbiAgICAgICAgICBzbmlwcGV0c0Jhc2VVcmw9e3NuaXBwZXRzQmFzZVVybH1cbiAgICAgICAgICBvbkNvcHk9e29uQ29weX1cbiAgICAgICAgLz5cbiAgICAgICkgOiAoXG4gICAgICAgIDxMYW5ndWFnZVNlbGVjdGlvblxuICAgICAgICAgIG9uQ2hhbmdlPXsobmV3TGFuZ3VhZ2UpID0+IHtcbiAgICAgICAgICAgIGNvbnN0IG5ld1RleHQ6IHN0cmluZyA9XG4gICAgICAgICAgICAgIHRleHQgfHwgKG5ld0xhbmd1YWdlID8gaGVsbG9Xb3JsZFtuZXdMYW5ndWFnZV0gOiAnJyk7XG4gICAgICAgICAgICBzZXRMYW5ndWFnZShuZXdMYW5ndWFnZSk7XG4gICAgICAgICAgICBzZXRUZXh0KG5ld1RleHQpO1xuICAgICAgICAgICAgdHJhY2tDbGljaygnbGFuZ19zZWxlY3QnKTtcbiAgICAgICAgICAgIG9uTGFuZ3VhZ2VDaGFuZ2U/LihuZXdUZXh0LCBuZXdMYW5ndWFnZSk7XG4gICAgICAgICAgICB0cmFja0NsaWNrKCdsYW5nX3NlbGVjdCcpO1xuICAgICAgICAgIH19XG4gICAgICAgIC8+XG4gICAgICApfVxuICAgIDwvRWRpdG9yQ29udGFpbmVyPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgQ29kZUJ5dGVFZGl0b3I7XG4iXX0= */");
43
+
44
+ export var CodeByteEditor = function CodeByteEditor(_ref) {
45
+ var initialText = _ref.text,
46
+ initialLanguage = _ref.language,
47
+ _ref$hideCopyButton = _ref.hideCopyButton,
48
+ hideCopyButton = _ref$hideCopyButton === void 0 ? false : _ref$hideCopyButton,
49
+ _ref$isIFrame = _ref.isIFrame,
50
+ isIFrame = _ref$isIFrame === void 0 ? false : _ref$isIFrame,
51
+ snippetsBaseUrl = _ref.snippetsBaseUrl,
52
+ onEdit = _ref.onEdit,
53
+ onLanguageChange = _ref.onLanguageChange,
54
+ onCopy = _ref.onCopy;
55
+
56
+ var getInitialText = function getInitialText() {
57
+ if (initialText !== undefined) return initialText;
58
+ return initialLanguage ? helloWorld[initialLanguage] : '';
59
+ };
60
+
61
+ var _useState = useState(getInitialText()),
62
+ _useState2 = _slicedToArray(_useState, 2),
63
+ text = _useState2[0],
64
+ setText = _useState2[1];
65
+
66
+ var _useState3 = useState(initialLanguage !== null && initialLanguage !== void 0 ? initialLanguage : ''),
67
+ _useState4 = _slicedToArray(_useState3, 2),
68
+ language = _useState4[0],
69
+ setLanguage = _useState4[1];
70
+
71
+ var _useState5 = useState(false),
72
+ _useState6 = _slicedToArray(_useState5, 2),
73
+ hasBeenEdited = _useState6[0],
74
+ setHasBeenEdited = _useState6[1];
75
+
76
+ useEffect(function () {
77
+ var options = getOptions();
78
+ var page_name = options.renderMode ? "".concat(options.clientName, "_").concat(options.renderMode) : options.clientName;
79
+ trackUserImpression({
80
+ page_name: page_name,
81
+ context: options.parentPage,
82
+ target: 'codebyte'
83
+ });
84
+ }, []);
85
+ return /*#__PURE__*/React.createElement(EditorContainer, {
86
+ bg: "black",
87
+ as: "main",
88
+ isIFrame: isIFrame
89
+ }, /*#__PURE__*/React.createElement(Box, {
90
+ borderBottom: 1,
91
+ borderColor: "gray-900",
92
+ py: 4,
93
+ pl: 8
94
+ }, /*#__PURE__*/React.createElement(IconButton, {
95
+ icon: FaviconIcon,
96
+ variant: "secondary",
97
+ href: "https://www.codecademy.com/",
98
+ target: "_blank",
99
+ rel: "noreferrer",
100
+ "aria-label": "visit codecademy.com",
101
+ onClick: function onClick() {
102
+ return trackClick('logo');
103
+ }
104
+ })), language ? /*#__PURE__*/React.createElement(Editor, {
105
+ language: language,
106
+ text: text,
107
+ hideCopyButton: hideCopyButton,
108
+ onChange: function onChange(newText) {
109
+ setText(newText);
110
+ onEdit === null || onEdit === void 0 ? void 0 : onEdit(newText, language);
111
+
112
+ var _getOptions = getOptions(),
113
+ renderMode = _getOptions.renderMode;
114
+
115
+ if (!renderMode && hasBeenEdited === false) {
116
+ setHasBeenEdited(true);
117
+ trackClick('edit');
118
+ }
119
+ },
120
+ snippetsBaseUrl: snippetsBaseUrl,
121
+ onCopy: onCopy
122
+ }) : /*#__PURE__*/React.createElement(LanguageSelection, {
123
+ onChange: function onChange(newLanguage) {
124
+ var newText = text || (newLanguage ? helloWorld[newLanguage] : '');
125
+ setLanguage(newLanguage);
126
+ setText(newText);
127
+ trackClick('lang_select');
128
+ onLanguageChange === null || onLanguageChange === void 0 ? void 0 : onLanguageChange(newText, newLanguage);
129
+ trackClick('lang_select');
130
+ }
131
+ }));
132
+ };
133
+ export default CodeByteEditor;
@@ -0,0 +1,23 @@
1
+ export declare const LanguageOptions: {
2
+ '': string;
3
+ cpp: string;
4
+ csharp: string;
5
+ golang: string;
6
+ javascript: string;
7
+ php: string;
8
+ python: string;
9
+ ruby: string;
10
+ scheme: string;
11
+ };
12
+ export declare type LanguageOption = keyof typeof LanguageOptions;
13
+ export declare const validLanguages: ("cpp" | "csharp" | "golang" | "javascript" | "php" | "python" | "ruby" | "scheme")[];
14
+ export declare const helloWorld: {
15
+ readonly cpp: "#include <iostream>\nint main() {\n std::cout << \"Hello world!\";\n return 0;\n}";
16
+ readonly csharp: "namespace HelloWorld {\n class Hello {\n static void Main(string[] args) {\n System.Console.WriteLine(\"Hello world!\");\n }\n }\n}";
17
+ readonly golang: "package main\nimport \"fmt\"\nfunc main() {\n fmt.Println(\"Hello world!\")\n}";
18
+ readonly javascript: "console.log('Hello world!');";
19
+ readonly php: "<?php\n echo \"Hello world!\";\n?>";
20
+ readonly python: "print('Hello world!')";
21
+ readonly ruby: "puts \"Hello world!\"";
22
+ readonly scheme: "(begin\n (display \"Hello world!\")\n (newline))";
23
+ };
package/dist/consts.js ADDED
@@ -0,0 +1,34 @@
1
+ // key = language param to send to snippets service
2
+ // val = label in language selection drop down
3
+ export var LanguageOptions = {
4
+ '': 'Select a language',
5
+ cpp: 'C++',
6
+ csharp: 'C#',
7
+ golang: 'Go',
8
+ javascript: 'JavaScript',
9
+ php: 'PHP',
10
+ python: 'Python 3',
11
+ ruby: 'Ruby',
12
+ scheme: 'Scheme'
13
+ };
14
+ export var validLanguages = Object.keys(LanguageOptions).filter(function (option) {
15
+ return !!option;
16
+ });
17
+ var cpp = "#include <iostream>\nint main() {\n std::cout << \"Hello world!\";\n return 0;\n}";
18
+ var csharp = "namespace HelloWorld {\n class Hello {\n static void Main(string[] args) {\n System.Console.WriteLine(\"Hello world!\");\n }\n }\n}";
19
+ var golang = "package main\nimport \"fmt\"\nfunc main() {\n fmt.Println(\"Hello world!\")\n}";
20
+ var javascript = "console.log('Hello world!');";
21
+ var php = "<?php\n echo \"Hello world!\";\n?>";
22
+ var python = "print('Hello world!')";
23
+ var ruby = 'puts "Hello world!"';
24
+ var scheme = "(begin\n (display \"Hello world!\")\n (newline))";
25
+ export var helloWorld = {
26
+ cpp: cpp,
27
+ csharp: csharp,
28
+ golang: golang,
29
+ javascript: javascript,
30
+ php: php,
31
+ python: python,
32
+ ruby: ruby,
33
+ scheme: scheme
34
+ };
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ export declare type DrawersProps = {
3
+ leftChild: React.ReactNode;
4
+ rightChild: React.ReactNode;
5
+ };
6
+ export declare const Drawers: React.FC<DrawersProps>;
@@ -0,0 +1,148 @@
1
+ import _styled from "@emotion/styled/base";
2
+
3
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
+
5
+ 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."); }
6
+
7
+ 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); }
8
+
9
+ 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; }
10
+
11
+ 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; }
12
+
13
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
14
+
15
+ 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)."; }
16
+
17
+ import { FlexBox, IconButton } from '@codecademy/gamut';
18
+ import { ArrowChevronLeftIcon, ArrowChevronRightIcon } from '@codecademy/gamut-icons';
19
+ import React, { useState } from 'react';
20
+
21
+ var DrawerLabel = _styled("span", {
22
+ target: "e1keub6a2",
23
+ label: "DrawerLabel"
24
+ })(process.env.NODE_ENV === "production" ? {
25
+ name: "1u2ibt9",
26
+ styles: "padding:0.875rem 0.5rem"
27
+ } : {
28
+ name: "1u2ibt9",
29
+ styles: "padding:0.875rem 0.5rem",
30
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9kcmF3ZXJzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRK0IiLCJmaWxlIjoiLi4vc3JjL2RyYXdlcnMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRmxleEJveCwgSWNvbkJ1dHRvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7XG4gIEFycm93Q2hldnJvbkxlZnRJY29uLFxuICBBcnJvd0NoZXZyb25SaWdodEljb24sXG59IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcblxuY29uc3QgRHJhd2VyTGFiZWwgPSBzdHlsZWQuc3BhbmBcbiAgcGFkZGluZzogMC44NzVyZW0gMC41cmVtO1xuYDtcblxuY29uc3QgTGVmdERyYXdlckljb24gPSBzdHlsZWQoQXJyb3dDaGV2cm9uTGVmdEljb24pPHsgb3Blbj86IGJvb2xlYW4gfT5gXG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjJzIGVhc2UtaW4tb3V0O1xuYDtcbmNvbnN0IFJpZ2h0RHJhd2VySWNvbiA9IExlZnREcmF3ZXJJY29uLndpdGhDb21wb25lbnQoQXJyb3dDaGV2cm9uUmlnaHRJY29uKTtcblxuY29uc3QgRHJhd2VyID0gc3R5bGVkKEZsZXhCb3gpPHsgb3Blbj86IGJvb2xlYW47IGhpZGVPbkNsb3NlPzogYm9vbGVhbiB9PmBcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAkeyh7IG9wZW4sIGhpZGVPbkNsb3NlIH0pID0+IGBcbiAgICBmbGV4LWJhc2lzOiAke29wZW4gPyAnMTAwJScgOiAnMCUnfTtcbiAgICB2aXNpYmlsaXR5OiAkeyFvcGVuICYmIGhpZGVPbkNsb3NlID8gJ2hpZGRlbicgOiAndmlzaWJsZSd9O1xuICAgIHRyYW5zaXRpb246IGZsZXgtYmFzaXMgMC4ycyAke1xuICAgICAgb3BlbiA/ICdlYXNlLW91dCcgOiAnZWFzZS1pbiwgdmlzaWJpbGl0eSAwcyAwLjJzJ1xuICAgIH07XG5cbiAgICAke0xlZnREcmF3ZXJJY29ufSwgJHtSaWdodERyYXdlckljb259IHtcbiAgICAgIHRyYW5zZm9ybTogcm90YXRlWigke29wZW4gPyAnMCcgOiAnMTgwJ31kZWcpfTtcbiAgICB9XG4gIGB9XG5gO1xuXG5leHBvcnQgdHlwZSBEcmF3ZXJzUHJvcHMgPSB7XG4gIGxlZnRDaGlsZDogUmVhY3QuUmVhY3ROb2RlO1xuICByaWdodENoaWxkOiBSZWFjdC5SZWFjdE5vZGU7XG59O1xuXG5leHBvcnQgY29uc3QgRHJhd2VyczogUmVhY3QuRkM8RHJhd2Vyc1Byb3BzPiA9ICh7IGxlZnRDaGlsZCwgcmlnaHRDaGlsZCB9KSA9PiB7XG4gIGNvbnN0IFtvcGVuLCBzZXRPcGVuXSA9IHVzZVN0YXRlPCdsZWZ0JyB8ICdyaWdodCcgfCAnYm90aCc+KCdib3RoJyk7XG5cbiAgbGV0IGFyaWFMYWJlbENvZGVCdXR0b24gPSAnaGlkZSBjb2RlJztcbiAgbGV0IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiA9ICdoaWRlIG91dHB1dCc7XG4gIGxldCBpc0xlZnRPcGVuID0gZmFsc2U7XG4gIGxldCBpc1JpZ2h0T3BlbiA9IGZhbHNlO1xuXG4gIGlmIChvcGVuID09PSAnbGVmdCcpIHtcbiAgICBhcmlhTGFiZWxDb2RlQnV0dG9uID0gYXJpYUxhYmVsT3V0cHV0QnV0dG9uID0gJ3Nob3cgb3V0cHV0JztcbiAgICBpc0xlZnRPcGVuID0gdHJ1ZTtcbiAgfSBlbHNlIGlmIChvcGVuID09PSAncmlnaHQnKSB7XG4gICAgYXJpYUxhYmVsQ29kZUJ1dHRvbiA9IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiA9ICdzaG93IGNvZGUnO1xuICAgIGlzUmlnaHRPcGVuID0gdHJ1ZTtcbiAgfVxuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxGbGV4Qm94PlxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgb3Blbj17IWlzUmlnaHRPcGVufVxuICAgICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgICAgIGZsZXhXcmFwPVwibm93cmFwXCJcbiAgICAgICAgICB0ZXh0QWxpZ249XCJsZWZ0XCJcbiAgICAgICAgICBib3JkZXJSaWdodD17MX1cbiAgICAgICAgICBib3JkZXJDb2xvcj1cImdyYXktOTAwXCJcbiAgICAgICAgICBweD17OH1cbiAgICAgICAgPlxuICAgICAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgICAgICBpY29uPXtMZWZ0RHJhd2VySWNvbn1cbiAgICAgICAgICAgIHZhcmlhbnQ9XCJzZWNvbmRhcnlcIlxuICAgICAgICAgICAgc2l6ZT1cInNtYWxsXCJcbiAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+XG4gICAgICAgICAgICAgIHNldE9wZW4oKHN0YXRlKSA9PiAoc3RhdGUgPT09ICdib3RoJyA/ICdyaWdodCcgOiAnYm90aCcpKVxuICAgICAgICAgICAgfVxuICAgICAgICAgICAgYXJpYS1sYWJlbD17YXJpYUxhYmVsQ29kZUJ1dHRvbn1cbiAgICAgICAgICAgIGFyaWEtY29udHJvbHM9XCJjb2RlLWRyYXdlclwiXG4gICAgICAgICAgICBhcmlhLWV4cGFuZGVkPXshaXNSaWdodE9wZW59XG4gICAgICAgICAgLz5cbiAgICAgICAgICA8RHJhd2VyTGFiZWwgaWQ9XCJjb2RlLWRyYXdlci1sYWJlbFwiPkNvZGU8L0RyYXdlckxhYmVsPlxuICAgICAgICA8L0RyYXdlcj5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIG9wZW49eyFpc0xlZnRPcGVufVxuICAgICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgICAgIGZsZXhXcmFwPVwibm93cmFwXCJcbiAgICAgICAgICBqdXN0aWZ5Q29udGVudD1cImZsZXgtZW5kXCJcbiAgICAgICAgICBweD17OH1cbiAgICAgICAgPlxuICAgICAgICAgIDxEcmF3ZXJMYWJlbCBpZD1cIm91dHB1dC1kcmF3ZXItbGFiZWxcIj5PdXRwdXQ8L0RyYXdlckxhYmVsPlxuICAgICAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgICAgICBpY29uPXtSaWdodERyYXdlckljb259XG4gICAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICBvbkNsaWNrPXsoKSA9PlxuICAgICAgICAgICAgICBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAnbGVmdCcgOiAnYm90aCcpKVxuICAgICAgICAgICAgfVxuICAgICAgICAgICAgYXJpYS1sYWJlbD17YXJpYUxhYmVsT3V0cHV0QnV0dG9ufVxuICAgICAgICAgICAgYXJpYS1jb250cm9scz1cIm91dHB1dC1kcmF3ZXJcIlxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17IWlzTGVmdE9wZW59XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgICA8RmxleEJveFxuICAgICAgICBmbGV4R3Jvdz17MX1cbiAgICAgICAgYm9yZGVyWT17MX1cbiAgICAgICAgYm9yZGVyQ29sb3I9XCJncmF5LTkwMFwiXG4gICAgICAgIGFsaWduSXRlbXM9XCJzdHJldGNoXCJcbiAgICAgICAgb3ZlcmZsb3c9XCJoaWRkZW5cIlxuICAgICAgPlxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgaGlkZU9uQ2xvc2VcbiAgICAgICAgICBpZD1cImNvZGUtZHJhd2VyXCJcbiAgICAgICAgICBhcmlhLWxhYmVsbGVkYnk9XCJjb2RlLWRyYXdlci1sYWJlbFwiXG4gICAgICAgICAgb3Blbj17IWlzUmlnaHRPcGVufVxuICAgICAgICAgIGZsZXhHcm93PXswfVxuICAgICAgICAgIG92ZXJmbG93PVwiaGlkZGVuXCJcbiAgICAgICAgICBib3JkZXJDb2xvcj1cImdyYXktOTAwXCJcbiAgICAgICAgICBib3JkZXJTdHlsZVJpZ2h0PVwic29saWRcIlxuICAgICAgICAgIGJvcmRlcldpZHRoUmlnaHQ9XCJ0aGluXCJcbiAgICAgICAgPlxuICAgICAgICAgIHtsZWZ0Q2hpbGR9XG4gICAgICAgIDwvRHJhd2VyPlxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgaGlkZU9uQ2xvc2VcbiAgICAgICAgICBpZD1cIm91dHB1dC1kcmF3ZXJcIlxuICAgICAgICAgIGFyaWEtbGFiZWxsZWRieT1cIm91dHB1dC1kcmF3ZXItbGFiZWxcIlxuICAgICAgICAgIG9wZW49eyFpc0xlZnRPcGVufVxuICAgICAgICAgIG92ZXJmbG93PVwiaGlkZGVuXCJcbiAgICAgICAgPlxuICAgICAgICAgIHtyaWdodENoaWxkfVxuICAgICAgICA8L0RyYXdlcj5cbiAgICAgIDwvRmxleEJveD5cbiAgICA8Lz5cbiAgKTtcbn07XG4iXX0= */",
31
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
32
+ });
33
+
34
+ var LeftDrawerIcon = /*#__PURE__*/_styled(ArrowChevronLeftIcon, {
35
+ target: "e1keub6a1",
36
+ label: "LeftDrawerIcon"
37
+ })(process.env.NODE_ENV === "production" ? {
38
+ name: "jlwh11",
39
+ styles: "transition:transform 0.2s ease-in-out"
40
+ } : {
41
+ name: "jlwh11",
42
+ styles: "transition:transform 0.2s ease-in-out",
43
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9kcmF3ZXJzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZdUUiLCJmaWxlIjoiLi4vc3JjL2RyYXdlcnMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRmxleEJveCwgSWNvbkJ1dHRvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7XG4gIEFycm93Q2hldnJvbkxlZnRJY29uLFxuICBBcnJvd0NoZXZyb25SaWdodEljb24sXG59IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcblxuY29uc3QgRHJhd2VyTGFiZWwgPSBzdHlsZWQuc3BhbmBcbiAgcGFkZGluZzogMC44NzVyZW0gMC41cmVtO1xuYDtcblxuY29uc3QgTGVmdERyYXdlckljb24gPSBzdHlsZWQoQXJyb3dDaGV2cm9uTGVmdEljb24pPHsgb3Blbj86IGJvb2xlYW4gfT5gXG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjJzIGVhc2UtaW4tb3V0O1xuYDtcbmNvbnN0IFJpZ2h0RHJhd2VySWNvbiA9IExlZnREcmF3ZXJJY29uLndpdGhDb21wb25lbnQoQXJyb3dDaGV2cm9uUmlnaHRJY29uKTtcblxuY29uc3QgRHJhd2VyID0gc3R5bGVkKEZsZXhCb3gpPHsgb3Blbj86IGJvb2xlYW47IGhpZGVPbkNsb3NlPzogYm9vbGVhbiB9PmBcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAkeyh7IG9wZW4sIGhpZGVPbkNsb3NlIH0pID0+IGBcbiAgICBmbGV4LWJhc2lzOiAke29wZW4gPyAnMTAwJScgOiAnMCUnfTtcbiAgICB2aXNpYmlsaXR5OiAkeyFvcGVuICYmIGhpZGVPbkNsb3NlID8gJ2hpZGRlbicgOiAndmlzaWJsZSd9O1xuICAgIHRyYW5zaXRpb246IGZsZXgtYmFzaXMgMC4ycyAke1xuICAgICAgb3BlbiA/ICdlYXNlLW91dCcgOiAnZWFzZS1pbiwgdmlzaWJpbGl0eSAwcyAwLjJzJ1xuICAgIH07XG5cbiAgICAke0xlZnREcmF3ZXJJY29ufSwgJHtSaWdodERyYXdlckljb259IHtcbiAgICAgIHRyYW5zZm9ybTogcm90YXRlWigke29wZW4gPyAnMCcgOiAnMTgwJ31kZWcpfTtcbiAgICB9XG4gIGB9XG5gO1xuXG5leHBvcnQgdHlwZSBEcmF3ZXJzUHJvcHMgPSB7XG4gIGxlZnRDaGlsZDogUmVhY3QuUmVhY3ROb2RlO1xuICByaWdodENoaWxkOiBSZWFjdC5SZWFjdE5vZGU7XG59O1xuXG5leHBvcnQgY29uc3QgRHJhd2VyczogUmVhY3QuRkM8RHJhd2Vyc1Byb3BzPiA9ICh7IGxlZnRDaGlsZCwgcmlnaHRDaGlsZCB9KSA9PiB7XG4gIGNvbnN0IFtvcGVuLCBzZXRPcGVuXSA9IHVzZVN0YXRlPCdsZWZ0JyB8ICdyaWdodCcgfCAnYm90aCc+KCdib3RoJyk7XG5cbiAgbGV0IGFyaWFMYWJlbENvZGVCdXR0b24gPSAnaGlkZSBjb2RlJztcbiAgbGV0IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiA9ICdoaWRlIG91dHB1dCc7XG4gIGxldCBpc0xlZnRPcGVuID0gZmFsc2U7XG4gIGxldCBpc1JpZ2h0T3BlbiA9IGZhbHNlO1xuXG4gIGlmIChvcGVuID09PSAnbGVmdCcpIHtcbiAgICBhcmlhTGFiZWxDb2RlQnV0dG9uID0gYXJpYUxhYmVsT3V0cHV0QnV0dG9uID0gJ3Nob3cgb3V0cHV0JztcbiAgICBpc0xlZnRPcGVuID0gdHJ1ZTtcbiAgfSBlbHNlIGlmIChvcGVuID09PSAncmlnaHQnKSB7XG4gICAgYXJpYUxhYmVsQ29kZUJ1dHRvbiA9IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiA9ICdzaG93IGNvZGUnO1xuICAgIGlzUmlnaHRPcGVuID0gdHJ1ZTtcbiAgfVxuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxGbGV4Qm94PlxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgb3Blbj17IWlzUmlnaHRPcGVufVxuICAgICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgICAgIGZsZXhXcmFwPVwibm93cmFwXCJcbiAgICAgICAgICB0ZXh0QWxpZ249XCJsZWZ0XCJcbiAgICAgICAgICBib3JkZXJSaWdodD17MX1cbiAgICAgICAgICBib3JkZXJDb2xvcj1cImdyYXktOTAwXCJcbiAgICAgICAgICBweD17OH1cbiAgICAgICAgPlxuICAgICAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgICAgICBpY29uPXtMZWZ0RHJhd2VySWNvbn1cbiAgICAgICAgICAgIHZhcmlhbnQ9XCJzZWNvbmRhcnlcIlxuICAgICAgICAgICAgc2l6ZT1cInNtYWxsXCJcbiAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+XG4gICAgICAgICAgICAgIHNldE9wZW4oKHN0YXRlKSA9PiAoc3RhdGUgPT09ICdib3RoJyA/ICdyaWdodCcgOiAnYm90aCcpKVxuICAgICAgICAgICAgfVxuICAgICAgICAgICAgYXJpYS1sYWJlbD17YXJpYUxhYmVsQ29kZUJ1dHRvbn1cbiAgICAgICAgICAgIGFyaWEtY29udHJvbHM9XCJjb2RlLWRyYXdlclwiXG4gICAgICAgICAgICBhcmlhLWV4cGFuZGVkPXshaXNSaWdodE9wZW59XG4gICAgICAgICAgLz5cbiAgICAgICAgICA8RHJhd2VyTGFiZWwgaWQ9XCJjb2RlLWRyYXdlci1sYWJlbFwiPkNvZGU8L0RyYXdlckxhYmVsPlxuICAgICAgICA8L0RyYXdlcj5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIG9wZW49eyFpc0xlZnRPcGVufVxuICAgICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgICAgIGZsZXhXcmFwPVwibm93cmFwXCJcbiAgICAgICAgICBqdXN0aWZ5Q29udGVudD1cImZsZXgtZW5kXCJcbiAgICAgICAgICBweD17OH1cbiAgICAgICAgPlxuICAgICAgICAgIDxEcmF3ZXJMYWJlbCBpZD1cIm91dHB1dC1kcmF3ZXItbGFiZWxcIj5PdXRwdXQ8L0RyYXdlckxhYmVsPlxuICAgICAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgICAgICBpY29uPXtSaWdodERyYXdlckljb259XG4gICAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICBvbkNsaWNrPXsoKSA9PlxuICAgICAgICAgICAgICBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAnbGVmdCcgOiAnYm90aCcpKVxuICAgICAgICAgICAgfVxuICAgICAgICAgICAgYXJpYS1sYWJlbD17YXJpYUxhYmVsT3V0cHV0QnV0dG9ufVxuICAgICAgICAgICAgYXJpYS1jb250cm9scz1cIm91dHB1dC1kcmF3ZXJcIlxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17IWlzTGVmdE9wZW59XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgICA8RmxleEJveFxuICAgICAgICBmbGV4R3Jvdz17MX1cbiAgICAgICAgYm9yZGVyWT17MX1cbiAgICAgICAgYm9yZGVyQ29sb3I9XCJncmF5LTkwMFwiXG4gICAgICAgIGFsaWduSXRlbXM9XCJzdHJldGNoXCJcbiAgICAgICAgb3ZlcmZsb3c9XCJoaWRkZW5cIlxuICAgICAgPlxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgaGlkZU9uQ2xvc2VcbiAgICAgICAgICBpZD1cImNvZGUtZHJhd2VyXCJcbiAgICAgICAgICBhcmlhLWxhYmVsbGVkYnk9XCJjb2RlLWRyYXdlci1sYWJlbFwiXG4gICAgICAgICAgb3Blbj17IWlzUmlnaHRPcGVufVxuICAgICAgICAgIGZsZXhHcm93PXswfVxuICAgICAgICAgIG92ZXJmbG93PVwiaGlkZGVuXCJcbiAgICAgICAgICBib3JkZXJDb2xvcj1cImdyYXktOTAwXCJcbiAgICAgICAgICBib3JkZXJTdHlsZVJpZ2h0PVwic29saWRcIlxuICAgICAgICAgIGJvcmRlcldpZHRoUmlnaHQ9XCJ0aGluXCJcbiAgICAgICAgPlxuICAgICAgICAgIHtsZWZ0Q2hpbGR9XG4gICAgICAgIDwvRHJhd2VyPlxuICAgICAgICA8RHJhd2VyXG4gICAgICAgICAgaGlkZU9uQ2xvc2VcbiAgICAgICAgICBpZD1cIm91dHB1dC1kcmF3ZXJcIlxuICAgICAgICAgIGFyaWEtbGFiZWxsZWRieT1cIm91dHB1dC1kcmF3ZXItbGFiZWxcIlxuICAgICAgICAgIG9wZW49eyFpc0xlZnRPcGVufVxuICAgICAgICAgIG92ZXJmbG93PVwiaGlkZGVuXCJcbiAgICAgICAgPlxuICAgICAgICAgIHtyaWdodENoaWxkfVxuICAgICAgICA8L0RyYXdlcj5cbiAgICAgIDwvRmxleEJveD5cbiAgICA8Lz5cbiAgKTtcbn07XG4iXX0= */",
44
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
45
+ });
46
+
47
+ var RightDrawerIcon = LeftDrawerIcon.withComponent(ArrowChevronRightIcon, {
48
+ target: "e1keub6a3",
49
+ label: "RightDrawerIcon"
50
+ });
51
+
52
+ var Drawer = /*#__PURE__*/_styled(FlexBox, {
53
+ target: "e1keub6a0",
54
+ label: "Drawer"
55
+ })("position:relative;", function (_ref) {
56
+ var open = _ref.open,
57
+ hideOnClose = _ref.hideOnClose;
58
+ 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 ");
59
+ }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9kcmF3ZXJzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQnlFIiwiZmlsZSI6Ii4uL3NyYy9kcmF3ZXJzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEZsZXhCb3gsIEljb25CdXR0b24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQge1xuICBBcnJvd0NoZXZyb25MZWZ0SWNvbixcbiAgQXJyb3dDaGV2cm9uUmlnaHRJY29uLFxufSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5cbmNvbnN0IERyYXdlckxhYmVsID0gc3R5bGVkLnNwYW5gXG4gIHBhZGRpbmc6IDAuODc1cmVtIDAuNXJlbTtcbmA7XG5cbmNvbnN0IExlZnREcmF3ZXJJY29uID0gc3R5bGVkKEFycm93Q2hldnJvbkxlZnRJY29uKTx7IG9wZW4/OiBib29sZWFuIH0+YFxuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4ycyBlYXNlLWluLW91dDtcbmA7XG5jb25zdCBSaWdodERyYXdlckljb24gPSBMZWZ0RHJhd2VySWNvbi53aXRoQ29tcG9uZW50KEFycm93Q2hldnJvblJpZ2h0SWNvbik7XG5cbmNvbnN0IERyYXdlciA9IHN0eWxlZChGbGV4Qm94KTx7IG9wZW4/OiBib29sZWFuOyBoaWRlT25DbG9zZT86IGJvb2xlYW4gfT5gXG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgJHsoeyBvcGVuLCBoaWRlT25DbG9zZSB9KSA9PiBgXG4gICAgZmxleC1iYXNpczogJHtvcGVuID8gJzEwMCUnIDogJzAlJ307XG4gICAgdmlzaWJpbGl0eTogJHshb3BlbiAmJiBoaWRlT25DbG9zZSA/ICdoaWRkZW4nIDogJ3Zpc2libGUnfTtcbiAgICB0cmFuc2l0aW9uOiBmbGV4LWJhc2lzIDAuMnMgJHtcbiAgICAgIG9wZW4gPyAnZWFzZS1vdXQnIDogJ2Vhc2UtaW4sIHZpc2liaWxpdHkgMHMgMC4ycydcbiAgICB9O1xuXG4gICAgJHtMZWZ0RHJhd2VySWNvbn0sICR7UmlnaHREcmF3ZXJJY29ufSB7XG4gICAgICB0cmFuc2Zvcm06IHJvdGF0ZVooJHtvcGVuID8gJzAnIDogJzE4MCd9ZGVnKX07XG4gICAgfVxuICBgfVxuYDtcblxuZXhwb3J0IHR5cGUgRHJhd2Vyc1Byb3BzID0ge1xuICBsZWZ0Q2hpbGQ6IFJlYWN0LlJlYWN0Tm9kZTtcbiAgcmlnaHRDaGlsZDogUmVhY3QuUmVhY3ROb2RlO1xufTtcblxuZXhwb3J0IGNvbnN0IERyYXdlcnM6IFJlYWN0LkZDPERyYXdlcnNQcm9wcz4gPSAoeyBsZWZ0Q2hpbGQsIHJpZ2h0Q2hpbGQgfSkgPT4ge1xuICBjb25zdCBbb3Blbiwgc2V0T3Blbl0gPSB1c2VTdGF0ZTwnbGVmdCcgfCAncmlnaHQnIHwgJ2JvdGgnPignYm90aCcpO1xuXG4gIGxldCBhcmlhTGFiZWxDb2RlQnV0dG9uID0gJ2hpZGUgY29kZSc7XG4gIGxldCBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnaGlkZSBvdXRwdXQnO1xuICBsZXQgaXNMZWZ0T3BlbiA9IGZhbHNlO1xuICBsZXQgaXNSaWdodE9wZW4gPSBmYWxzZTtcblxuICBpZiAob3BlbiA9PT0gJ2xlZnQnKSB7XG4gICAgYXJpYUxhYmVsQ29kZUJ1dHRvbiA9IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiA9ICdzaG93IG91dHB1dCc7XG4gICAgaXNMZWZ0T3BlbiA9IHRydWU7XG4gIH0gZWxzZSBpZiAob3BlbiA9PT0gJ3JpZ2h0Jykge1xuICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBjb2RlJztcbiAgICBpc1JpZ2h0T3BlbiA9IHRydWU7XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8RmxleEJveD5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIG9wZW49eyFpc1JpZ2h0T3Blbn1cbiAgICAgICAgICBhbGlnbkl0ZW1zPVwiY2VudGVyXCJcbiAgICAgICAgICBmbGV4V3JhcD1cIm5vd3JhcFwiXG4gICAgICAgICAgdGV4dEFsaWduPVwibGVmdFwiXG4gICAgICAgICAgYm9yZGVyUmlnaHQ9ezF9XG4gICAgICAgICAgYm9yZGVyQ29sb3I9XCJncmF5LTkwMFwiXG4gICAgICAgICAgcHg9ezh9XG4gICAgICAgID5cbiAgICAgICAgICA8SWNvbkJ1dHRvblxuICAgICAgICAgICAgaWNvbj17TGVmdERyYXdlckljb259XG4gICAgICAgICAgICB2YXJpYW50PVwic2Vjb25kYXJ5XCJcbiAgICAgICAgICAgIHNpemU9XCJzbWFsbFwiXG4gICAgICAgICAgICBvbkNsaWNrPXsoKSA9PlxuICAgICAgICAgICAgICBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAncmlnaHQnIDogJ2JvdGgnKSlcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGFyaWEtbGFiZWw9e2FyaWFMYWJlbENvZGVCdXR0b259XG4gICAgICAgICAgICBhcmlhLWNvbnRyb2xzPVwiY29kZS1kcmF3ZXJcIlxuICAgICAgICAgICAgYXJpYS1leHBhbmRlZD17IWlzUmlnaHRPcGVufVxuICAgICAgICAgIC8+XG4gICAgICAgICAgPERyYXdlckxhYmVsIGlkPVwiY29kZS1kcmF3ZXItbGFiZWxcIj5Db2RlPC9EcmF3ZXJMYWJlbD5cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICAgIDxEcmF3ZXJcbiAgICAgICAgICBvcGVuPXshaXNMZWZ0T3Blbn1cbiAgICAgICAgICBhbGlnbkl0ZW1zPVwiY2VudGVyXCJcbiAgICAgICAgICBmbGV4V3JhcD1cIm5vd3JhcFwiXG4gICAgICAgICAganVzdGlmeUNvbnRlbnQ9XCJmbGV4LWVuZFwiXG4gICAgICAgICAgcHg9ezh9XG4gICAgICAgID5cbiAgICAgICAgICA8RHJhd2VyTGFiZWwgaWQ9XCJvdXRwdXQtZHJhd2VyLWxhYmVsXCI+T3V0cHV0PC9EcmF3ZXJMYWJlbD5cbiAgICAgICAgICA8SWNvbkJ1dHRvblxuICAgICAgICAgICAgaWNvbj17UmlnaHREcmF3ZXJJY29ufVxuICAgICAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgICAgICBzaXplPVwic21hbGxcIlxuICAgICAgICAgICAgb25DbGljaz17KCkgPT5cbiAgICAgICAgICAgICAgc2V0T3Blbigoc3RhdGUpID0+IChzdGF0ZSA9PT0gJ2JvdGgnID8gJ2xlZnQnIDogJ2JvdGgnKSlcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGFyaWEtbGFiZWw9e2FyaWFMYWJlbE91dHB1dEJ1dHRvbn1cbiAgICAgICAgICAgIGFyaWEtY29udHJvbHM9XCJvdXRwdXQtZHJhd2VyXCJcbiAgICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9eyFpc0xlZnRPcGVufVxuICAgICAgICAgIC8+XG4gICAgICAgIDwvRHJhd2VyPlxuICAgICAgPC9GbGV4Qm94PlxuICAgICAgPEZsZXhCb3hcbiAgICAgICAgZmxleEdyb3c9ezF9XG4gICAgICAgIGJvcmRlclk9ezF9XG4gICAgICAgIGJvcmRlckNvbG9yPVwiZ3JheS05MDBcIlxuICAgICAgICBhbGlnbkl0ZW1zPVwic3RyZXRjaFwiXG4gICAgICAgIG92ZXJmbG93PVwiaGlkZGVuXCJcbiAgICAgID5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIGhpZGVPbkNsb3NlXG4gICAgICAgICAgaWQ9XCJjb2RlLWRyYXdlclwiXG4gICAgICAgICAgYXJpYS1sYWJlbGxlZGJ5PVwiY29kZS1kcmF3ZXItbGFiZWxcIlxuICAgICAgICAgIG9wZW49eyFpc1JpZ2h0T3Blbn1cbiAgICAgICAgICBmbGV4R3Jvdz17MH1cbiAgICAgICAgICBvdmVyZmxvdz1cImhpZGRlblwiXG4gICAgICAgICAgYm9yZGVyQ29sb3I9XCJncmF5LTkwMFwiXG4gICAgICAgICAgYm9yZGVyU3R5bGVSaWdodD1cInNvbGlkXCJcbiAgICAgICAgICBib3JkZXJXaWR0aFJpZ2h0PVwidGhpblwiXG4gICAgICAgID5cbiAgICAgICAgICB7bGVmdENoaWxkfVxuICAgICAgICA8L0RyYXdlcj5cbiAgICAgICAgPERyYXdlclxuICAgICAgICAgIGhpZGVPbkNsb3NlXG4gICAgICAgICAgaWQ9XCJvdXRwdXQtZHJhd2VyXCJcbiAgICAgICAgICBhcmlhLWxhYmVsbGVkYnk9XCJvdXRwdXQtZHJhd2VyLWxhYmVsXCJcbiAgICAgICAgICBvcGVuPXshaXNMZWZ0T3Blbn1cbiAgICAgICAgICBvdmVyZmxvdz1cImhpZGRlblwiXG4gICAgICAgID5cbiAgICAgICAgICB7cmlnaHRDaGlsZH1cbiAgICAgICAgPC9EcmF3ZXI+XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgPC8+XG4gICk7XG59O1xuIl19 */"));
60
+
61
+ export var Drawers = function Drawers(_ref2) {
62
+ var leftChild = _ref2.leftChild,
63
+ rightChild = _ref2.rightChild;
64
+
65
+ var _useState = useState('both'),
66
+ _useState2 = _slicedToArray(_useState, 2),
67
+ open = _useState2[0],
68
+ setOpen = _useState2[1];
69
+
70
+ var ariaLabelCodeButton = 'hide code';
71
+ var ariaLabelOutputButton = 'hide output';
72
+ var isLeftOpen = false;
73
+ var isRightOpen = false;
74
+
75
+ if (open === 'left') {
76
+ ariaLabelCodeButton = ariaLabelOutputButton = 'show output';
77
+ isLeftOpen = true;
78
+ } else if (open === 'right') {
79
+ ariaLabelCodeButton = ariaLabelOutputButton = 'show code';
80
+ isRightOpen = true;
81
+ }
82
+
83
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FlexBox, null, /*#__PURE__*/React.createElement(Drawer, {
84
+ open: !isRightOpen,
85
+ alignItems: "center",
86
+ flexWrap: "nowrap",
87
+ textAlign: "left",
88
+ borderRight: 1,
89
+ borderColor: "gray-900",
90
+ px: 8
91
+ }, /*#__PURE__*/React.createElement(IconButton, {
92
+ icon: LeftDrawerIcon,
93
+ variant: "secondary",
94
+ size: "small",
95
+ onClick: function onClick() {
96
+ return setOpen(function (state) {
97
+ return state === 'both' ? 'right' : 'both';
98
+ });
99
+ },
100
+ "aria-label": ariaLabelCodeButton,
101
+ "aria-controls": "code-drawer",
102
+ "aria-expanded": !isRightOpen
103
+ }), /*#__PURE__*/React.createElement(DrawerLabel, {
104
+ id: "code-drawer-label"
105
+ }, "Code")), /*#__PURE__*/React.createElement(Drawer, {
106
+ open: !isLeftOpen,
107
+ alignItems: "center",
108
+ flexWrap: "nowrap",
109
+ justifyContent: "flex-end",
110
+ px: 8
111
+ }, /*#__PURE__*/React.createElement(DrawerLabel, {
112
+ id: "output-drawer-label"
113
+ }, "Output"), /*#__PURE__*/React.createElement(IconButton, {
114
+ icon: RightDrawerIcon,
115
+ variant: "secondary",
116
+ size: "small",
117
+ onClick: function onClick() {
118
+ return setOpen(function (state) {
119
+ return state === 'both' ? 'left' : 'both';
120
+ });
121
+ },
122
+ "aria-label": ariaLabelOutputButton,
123
+ "aria-controls": "output-drawer",
124
+ "aria-expanded": !isLeftOpen
125
+ }))), /*#__PURE__*/React.createElement(FlexBox, {
126
+ flexGrow: 1,
127
+ borderY: 1,
128
+ borderColor: "gray-900",
129
+ alignItems: "stretch",
130
+ overflow: "hidden"
131
+ }, /*#__PURE__*/React.createElement(Drawer, {
132
+ hideOnClose: true,
133
+ id: "code-drawer",
134
+ "aria-labelledby": "code-drawer-label",
135
+ open: !isRightOpen,
136
+ flexGrow: 0,
137
+ overflow: "hidden",
138
+ borderColor: "gray-900",
139
+ borderStyleRight: "solid",
140
+ borderWidthRight: "thin"
141
+ }, leftChild), /*#__PURE__*/React.createElement(Drawer, {
142
+ hideOnClose: true,
143
+ id: "output-drawer",
144
+ "aria-labelledby": "output-drawer-label",
145
+ open: !isLeftOpen,
146
+ overflow: "hidden"
147
+ }, rightChild)));
148
+ };
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ import type { LanguageOption } from './consts';
3
+ import { CodebytesChangeHandler } from './types';
4
+ declare type EditorProps = {
5
+ hideCopyButton: boolean;
6
+ language: LanguageOption;
7
+ text: string;
8
+ onChange: (text: string) => void;
9
+ snippetsBaseUrl?: string;
10
+ onCopy?: CodebytesChangeHandler;
11
+ };
12
+ export declare const Editor: React.FC<EditorProps>;
13
+ export {};