@codecademy/codebytes 1.0.4-alpha.37044bcdd.0 → 1.0.4-alpha.4641cabd2.0
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.
- package/dist/MonacoEditor/colorsDark.d.ts +32 -32
- package/dist/MonacoEditor/colorsDark.js +46 -0
- package/dist/MonacoEditor/index.d.ts +8 -8
- package/dist/MonacoEditor/index.js +42 -0
- package/dist/MonacoEditor/theme.d.ts +2 -2
- package/dist/MonacoEditor/theme.js +123 -0
- package/dist/MonacoEditor/types.d.ts +1 -1
- package/dist/MonacoEditor/types.js +1 -0
- package/dist/api.d.ts +12 -12
- package/dist/api.js +41 -0
- package/dist/codeByteEditor.d.ts +4 -4
- package/dist/codeByteEditor.js +141 -0
- package/dist/consts.d.ts +23 -23
- package/dist/consts.js +34 -0
- package/dist/drawers.d.ts +6 -6
- package/dist/drawers.js +149 -0
- package/dist/editor.d.ts +15 -15
- package/dist/editor.js +194 -0
- package/dist/helpers/index.d.ts +2 -2
- package/dist/helpers/index.js +12 -0
- package/dist/helpers/useEverInView.d.ts +5 -5
- package/dist/helpers/useEverInView.js +45 -0
- package/dist/helpers/useEverInView.test.js +63 -0
- package/dist/helpers/useIntersection.d.ts +2 -2
- package/dist/helpers/useIntersection.js +42 -0
- package/dist/helpers/useIntersection.test.js +127 -0
- package/dist/index.d.ts +3 -3
- package/dist/index.js +3 -741
- package/dist/languageSelection.d.ts +6 -6
- package/dist/languageSelection.js +22 -0
- package/dist/libs/eventTracking.d.ts +1 -1
- package/dist/libs/eventTracking.js +11 -0
- package/dist/theme.d.ts +5 -0
- package/dist/types.d.ts +22 -22
- package/dist/types.js +1 -0
- package/package.json +3 -3
- package/dist/index.cjs +0 -829
- package/dist/package.json +0 -44
package/dist/index.cjs
DELETED
|
@@ -1,829 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
var _styled = require('@emotion/styled/base');
|
|
6
|
-
var gamut = require('@codecademy/gamut');
|
|
7
|
-
var gamutIcons = require('@codecademy/gamut-icons');
|
|
8
|
-
var gamutStyles = require('@codecademy/gamut-styles');
|
|
9
|
-
var React = require('react');
|
|
10
|
-
var tracking = require('@codecademy/tracking');
|
|
11
|
-
var ReactMonacoEditor = require('@monaco-editor/react');
|
|
12
|
-
var ResizeObserver = require('react-resize-observer');
|
|
13
|
-
|
|
14
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
15
|
-
|
|
16
|
-
var _styled__default = /*#__PURE__*/_interopDefaultLegacy(_styled);
|
|
17
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
18
|
-
var ReactMonacoEditor__default = /*#__PURE__*/_interopDefaultLegacy(ReactMonacoEditor);
|
|
19
|
-
var ResizeObserver__default = /*#__PURE__*/_interopDefaultLegacy(ResizeObserver);
|
|
20
|
-
|
|
21
|
-
function _extends() {
|
|
22
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
23
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
24
|
-
var source = arguments[i];
|
|
25
|
-
|
|
26
|
-
for (var key in source) {
|
|
27
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
28
|
-
target[key] = source[key];
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
return target;
|
|
34
|
-
};
|
|
35
|
-
return _extends.apply(this, arguments);
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
39
|
-
if (source == null) return {};
|
|
40
|
-
var target = {};
|
|
41
|
-
var sourceKeys = Object.keys(source);
|
|
42
|
-
var key, i;
|
|
43
|
-
|
|
44
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
45
|
-
key = sourceKeys[i];
|
|
46
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
47
|
-
target[key] = source[key];
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
return target;
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
// key = language param to send to snippets service
|
|
54
|
-
// val = label in language selection drop down
|
|
55
|
-
const LanguageOptions = {
|
|
56
|
-
'': 'Select a language',
|
|
57
|
-
cpp: 'C++',
|
|
58
|
-
csharp: 'C#',
|
|
59
|
-
golang: 'Go',
|
|
60
|
-
javascript: 'JavaScript',
|
|
61
|
-
php: 'PHP',
|
|
62
|
-
python: 'Python 3',
|
|
63
|
-
ruby: 'Ruby',
|
|
64
|
-
scheme: 'Scheme'
|
|
65
|
-
};
|
|
66
|
-
const validLanguages = Object.keys(LanguageOptions).filter(option => !!option);
|
|
67
|
-
const cpp = `#include <iostream>
|
|
68
|
-
int main() {
|
|
69
|
-
std::cout << "Hello world!";
|
|
70
|
-
return 0;
|
|
71
|
-
}`;
|
|
72
|
-
const csharp = `namespace HelloWorld {
|
|
73
|
-
class Hello {
|
|
74
|
-
static void Main(string[] args) {
|
|
75
|
-
System.Console.WriteLine("Hello world!");
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
}`;
|
|
79
|
-
const golang = `package main
|
|
80
|
-
import "fmt"
|
|
81
|
-
func main() {
|
|
82
|
-
fmt.Println("Hello world!")
|
|
83
|
-
}`;
|
|
84
|
-
const javascript = "console.log('Hello world!');";
|
|
85
|
-
const php = `<?php
|
|
86
|
-
echo "Hello world!";
|
|
87
|
-
?>`;
|
|
88
|
-
const python = "print('Hello world!')";
|
|
89
|
-
const ruby = 'puts "Hello world!"';
|
|
90
|
-
const scheme = `(begin
|
|
91
|
-
(display "Hello world!")
|
|
92
|
-
(newline))`;
|
|
93
|
-
const helloWorld = {
|
|
94
|
-
cpp,
|
|
95
|
-
csharp,
|
|
96
|
-
golang,
|
|
97
|
-
javascript,
|
|
98
|
-
php,
|
|
99
|
-
python,
|
|
100
|
-
ruby,
|
|
101
|
-
scheme
|
|
102
|
-
};
|
|
103
|
-
|
|
104
|
-
function _await$1(value, then, direct) {
|
|
105
|
-
if (direct) {
|
|
106
|
-
return then ? then(value) : value;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
if (!value || !value.then) {
|
|
110
|
-
value = Promise.resolve(value);
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
return then ? value.then(then) : value;
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
function _async$1(f) {
|
|
117
|
-
return function () {
|
|
118
|
-
for (var args = [], i = 0; i < arguments.length; i++) {
|
|
119
|
-
args[i] = arguments[i];
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
try {
|
|
123
|
-
return Promise.resolve(f.apply(this, args));
|
|
124
|
-
} catch (e) {
|
|
125
|
-
return Promise.reject(e);
|
|
126
|
-
}
|
|
127
|
-
};
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
const postSnippet = _async$1(function (data, snippetsBaseUrl) {
|
|
131
|
-
const snippetsEndpoint = `https://${snippetsBaseUrl}/snippets`;
|
|
132
|
-
return _await$1(fetch(snippetsEndpoint, {
|
|
133
|
-
method: 'POST',
|
|
134
|
-
body: JSON.stringify(data),
|
|
135
|
-
headers: {
|
|
136
|
-
'x-codecademy-user-id': 'codebytes-anon-user'
|
|
137
|
-
}
|
|
138
|
-
}), function (response) {
|
|
139
|
-
return response.json();
|
|
140
|
-
});
|
|
141
|
-
});
|
|
142
|
-
|
|
143
|
-
function _EMOTION_STRINGIFIED_CSS_ERROR__$1() { 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)."; }
|
|
144
|
-
|
|
145
|
-
const DrawerLabel = _styled__default["default"]("span", {
|
|
146
|
-
target: "e1keub6a2",
|
|
147
|
-
label: "DrawerLabel"
|
|
148
|
-
})(process.env.NODE_ENV === "production" ? {
|
|
149
|
-
name: "1u2ibt9",
|
|
150
|
-
styles: "padding:0.875rem 0.5rem"
|
|
151
|
-
} : {
|
|
152
|
-
name: "1u2ibt9",
|
|
153
|
-
styles: "padding:0.875rem 0.5rem",
|
|
154
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyYXdlcnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlnQyIsImZpbGUiOiJkcmF3ZXJzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEZsZXhCb3gsIEljb25CdXR0b24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XHJcbmltcG9ydCB7IEFycm93Q2hldnJvbkxlZnRJY29uLCBBcnJvd0NoZXZyb25SaWdodEljb24sIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XHJcbmltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcclxuY29uc3QgRHJhd2VyTGFiZWwgPSBzdHlsZWQuc3BhbiBgXG4gIHBhZGRpbmc6IDAuODc1cmVtIDAuNXJlbTtcbmA7XHJcbmNvbnN0IExlZnREcmF3ZXJJY29uID0gc3R5bGVkKEFycm93Q2hldnJvbkxlZnRJY29uKSBgXG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjJzIGVhc2UtaW4tb3V0O1xuYDtcclxuY29uc3QgUmlnaHREcmF3ZXJJY29uID0gTGVmdERyYXdlckljb24ud2l0aENvbXBvbmVudChBcnJvd0NoZXZyb25SaWdodEljb24pO1xyXG5jb25zdCBEcmF3ZXIgPSBzdHlsZWQoRmxleEJveCkgYFxuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICR7KHsgb3BlbiwgaGlkZU9uQ2xvc2UgfSkgPT4gYFxuICAgIGZsZXgtYmFzaXM6ICR7b3BlbiA/ICcxMDAlJyA6ICcwJSd9O1xuICAgIHZpc2liaWxpdHk6ICR7IW9wZW4gJiYgaGlkZU9uQ2xvc2UgPyAnaGlkZGVuJyA6ICd2aXNpYmxlJ307XG4gICAgdHJhbnNpdGlvbjogZmxleC1iYXNpcyAwLjJzICR7b3BlbiA/ICdlYXNlLW91dCcgOiAnZWFzZS1pbiwgdmlzaWJpbGl0eSAwcyAwLjJzJ307XG5cbiAgICAke0xlZnREcmF3ZXJJY29ufSwgJHtSaWdodERyYXdlckljb259IHtcbiAgICAgIHRyYW5zZm9ybTogcm90YXRlWigke29wZW4gPyAnMCcgOiAnMTgwJ31kZWcpfTtcbiAgICB9XG4gIGB9XG5gO1xyXG5leHBvcnQgY29uc3QgRHJhd2VycyA9ICh7IGxlZnRDaGlsZCwgcmlnaHRDaGlsZCB9KSA9PiB7XHJcbiAgICBjb25zdCBbb3Blbiwgc2V0T3Blbl0gPSB1c2VTdGF0ZSgnYm90aCcpO1xyXG4gICAgbGV0IGFyaWFMYWJlbENvZGVCdXR0b24gPSAnaGlkZSBjb2RlJztcclxuICAgIGxldCBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnaGlkZSBvdXRwdXQnO1xyXG4gICAgbGV0IGlzTGVmdE9wZW4gPSBmYWxzZTtcclxuICAgIGxldCBpc1JpZ2h0T3BlbiA9IGZhbHNlO1xyXG4gICAgaWYgKG9wZW4gPT09ICdsZWZ0Jykge1xyXG4gICAgICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBvdXRwdXQnO1xyXG4gICAgICAgIGlzTGVmdE9wZW4gPSB0cnVlO1xyXG4gICAgfVxyXG4gICAgZWxzZSBpZiAob3BlbiA9PT0gJ3JpZ2h0Jykge1xyXG4gICAgICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBjb2RlJztcclxuICAgICAgICBpc1JpZ2h0T3BlbiA9IHRydWU7XHJcbiAgICB9XHJcbiAgICByZXR1cm4gKFJlYWN0LmNyZWF0ZUVsZW1lbnQoUmVhY3QuRnJhZ21lbnQsIG51bGwsXHJcbiAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChGbGV4Qm94LCBudWxsLFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBvcGVuOiAhaXNSaWdodE9wZW4sIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsIGZsZXhXcmFwOiBcIm5vd3JhcFwiLCB0ZXh0QWxpZ246IFwibGVmdFwiLCBib3JkZXJSaWdodDogMSwgYm9yZGVyQ29sb3I6IFwiZ3JheS05MDBcIiwgcHg6IDggfSxcclxuICAgICAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoSWNvbkJ1dHRvbiwgeyBpY29uOiBMZWZ0RHJhd2VySWNvbiwgdmFyaWFudDogXCJzZWNvbmRhcnlcIiwgc2l6ZTogXCJzbWFsbFwiLCBvbkNsaWNrOiAoKSA9PiBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAncmlnaHQnIDogJ2JvdGgnKSksIFwiYXJpYS1sYWJlbFwiOiBhcmlhTGFiZWxDb2RlQnV0dG9uLCBcImFyaWEtY29udHJvbHNcIjogXCJjb2RlLWRyYXdlclwiLCBcImFyaWEtZXhwYW5kZWRcIjogIWlzUmlnaHRPcGVuIH0pLFxyXG4gICAgICAgICAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChEcmF3ZXJMYWJlbCwgeyBpZDogXCJjb2RlLWRyYXdlci1sYWJlbFwiIH0sIFwiQ29kZVwiKSksXHJcbiAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRHJhd2VyLCB7IG9wZW46ICFpc0xlZnRPcGVuLCBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLCBmbGV4V3JhcDogXCJub3dyYXBcIiwganVzdGlmeUNvbnRlbnQ6IFwiZmxleC1lbmRcIiwgcHg6IDggfSxcclxuICAgICAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRHJhd2VyTGFiZWwsIHsgaWQ6IFwib3V0cHV0LWRyYXdlci1sYWJlbFwiIH0sIFwiT3V0cHV0XCIpLFxyXG4gICAgICAgICAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChJY29uQnV0dG9uLCB7IGljb246IFJpZ2h0RHJhd2VySWNvbiwgdmFyaWFudDogXCJzZWNvbmRhcnlcIiwgc2l6ZTogXCJzbWFsbFwiLCBvbkNsaWNrOiAoKSA9PiBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAnbGVmdCcgOiAnYm90aCcpKSwgXCJhcmlhLWxhYmVsXCI6IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiwgXCJhcmlhLWNvbnRyb2xzXCI6IFwib3V0cHV0LWRyYXdlclwiLCBcImFyaWEtZXhwYW5kZWRcIjogIWlzTGVmdE9wZW4gfSkpKSxcclxuICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KEZsZXhCb3gsIHsgZmxleEdyb3c6IDEsIGJvcmRlclk6IDEsIGJvcmRlckNvbG9yOiBcImdyYXktOTAwXCIsIGFsaWduSXRlbXM6IFwic3RyZXRjaFwiLCBvdmVyZmxvdzogXCJoaWRkZW5cIiB9LFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBoaWRlT25DbG9zZTogdHJ1ZSwgaWQ6IFwiY29kZS1kcmF3ZXJcIiwgXCJhcmlhLWxhYmVsbGVkYnlcIjogXCJjb2RlLWRyYXdlci1sYWJlbFwiLCBvcGVuOiAhaXNSaWdodE9wZW4sIGZsZXhHcm93OiAwLCBvdmVyZmxvdzogXCJoaWRkZW5cIiwgYm9yZGVyQ29sb3I6IFwiZ3JheS05MDBcIiwgYm9yZGVyU3R5bGVSaWdodDogXCJzb2xpZFwiLCBib3JkZXJXaWR0aFJpZ2h0OiBcInRoaW5cIiB9LCBsZWZ0Q2hpbGQpLFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBoaWRlT25DbG9zZTogdHJ1ZSwgaWQ6IFwib3V0cHV0LWRyYXdlclwiLCBcImFyaWEtbGFiZWxsZWRieVwiOiBcIm91dHB1dC1kcmF3ZXItbGFiZWxcIiwgcm9sZTogXCJyZWdpb25cIiwgb3BlbjogIWlzTGVmdE9wZW4sIG92ZXJmbG93OiBcImhpZGRlblwiIH0sIHJpZ2h0Q2hpbGQpKSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1kcmF3ZXJzLmpzLm1hcCJdfQ== */",
|
|
155
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__$1
|
|
156
|
-
});
|
|
157
|
-
|
|
158
|
-
const LeftDrawerIcon = /*#__PURE__*/_styled__default["default"](gamutIcons.ArrowChevronLeftIcon, {
|
|
159
|
-
target: "e1keub6a1",
|
|
160
|
-
label: "LeftDrawerIcon"
|
|
161
|
-
})(process.env.NODE_ENV === "production" ? {
|
|
162
|
-
name: "jlwh11",
|
|
163
|
-
styles: "transition:transform 0.2s ease-in-out"
|
|
164
|
-
} : {
|
|
165
|
-
name: "jlwh11",
|
|
166
|
-
styles: "transition:transform 0.2s ease-in-out",
|
|
167
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyYXdlcnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU9vRCIsImZpbGUiOiJkcmF3ZXJzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEZsZXhCb3gsIEljb25CdXR0b24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XHJcbmltcG9ydCB7IEFycm93Q2hldnJvbkxlZnRJY29uLCBBcnJvd0NoZXZyb25SaWdodEljb24sIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XHJcbmltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcclxuY29uc3QgRHJhd2VyTGFiZWwgPSBzdHlsZWQuc3BhbiBgXG4gIHBhZGRpbmc6IDAuODc1cmVtIDAuNXJlbTtcbmA7XHJcbmNvbnN0IExlZnREcmF3ZXJJY29uID0gc3R5bGVkKEFycm93Q2hldnJvbkxlZnRJY29uKSBgXG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjJzIGVhc2UtaW4tb3V0O1xuYDtcclxuY29uc3QgUmlnaHREcmF3ZXJJY29uID0gTGVmdERyYXdlckljb24ud2l0aENvbXBvbmVudChBcnJvd0NoZXZyb25SaWdodEljb24pO1xyXG5jb25zdCBEcmF3ZXIgPSBzdHlsZWQoRmxleEJveCkgYFxuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICR7KHsgb3BlbiwgaGlkZU9uQ2xvc2UgfSkgPT4gYFxuICAgIGZsZXgtYmFzaXM6ICR7b3BlbiA/ICcxMDAlJyA6ICcwJSd9O1xuICAgIHZpc2liaWxpdHk6ICR7IW9wZW4gJiYgaGlkZU9uQ2xvc2UgPyAnaGlkZGVuJyA6ICd2aXNpYmxlJ307XG4gICAgdHJhbnNpdGlvbjogZmxleC1iYXNpcyAwLjJzICR7b3BlbiA/ICdlYXNlLW91dCcgOiAnZWFzZS1pbiwgdmlzaWJpbGl0eSAwcyAwLjJzJ307XG5cbiAgICAke0xlZnREcmF3ZXJJY29ufSwgJHtSaWdodERyYXdlckljb259IHtcbiAgICAgIHRyYW5zZm9ybTogcm90YXRlWigke29wZW4gPyAnMCcgOiAnMTgwJ31kZWcpfTtcbiAgICB9XG4gIGB9XG5gO1xyXG5leHBvcnQgY29uc3QgRHJhd2VycyA9ICh7IGxlZnRDaGlsZCwgcmlnaHRDaGlsZCB9KSA9PiB7XHJcbiAgICBjb25zdCBbb3Blbiwgc2V0T3Blbl0gPSB1c2VTdGF0ZSgnYm90aCcpO1xyXG4gICAgbGV0IGFyaWFMYWJlbENvZGVCdXR0b24gPSAnaGlkZSBjb2RlJztcclxuICAgIGxldCBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnaGlkZSBvdXRwdXQnO1xyXG4gICAgbGV0IGlzTGVmdE9wZW4gPSBmYWxzZTtcclxuICAgIGxldCBpc1JpZ2h0T3BlbiA9IGZhbHNlO1xyXG4gICAgaWYgKG9wZW4gPT09ICdsZWZ0Jykge1xyXG4gICAgICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBvdXRwdXQnO1xyXG4gICAgICAgIGlzTGVmdE9wZW4gPSB0cnVlO1xyXG4gICAgfVxyXG4gICAgZWxzZSBpZiAob3BlbiA9PT0gJ3JpZ2h0Jykge1xyXG4gICAgICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBjb2RlJztcclxuICAgICAgICBpc1JpZ2h0T3BlbiA9IHRydWU7XHJcbiAgICB9XHJcbiAgICByZXR1cm4gKFJlYWN0LmNyZWF0ZUVsZW1lbnQoUmVhY3QuRnJhZ21lbnQsIG51bGwsXHJcbiAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChGbGV4Qm94LCBudWxsLFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBvcGVuOiAhaXNSaWdodE9wZW4sIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsIGZsZXhXcmFwOiBcIm5vd3JhcFwiLCB0ZXh0QWxpZ246IFwibGVmdFwiLCBib3JkZXJSaWdodDogMSwgYm9yZGVyQ29sb3I6IFwiZ3JheS05MDBcIiwgcHg6IDggfSxcclxuICAgICAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoSWNvbkJ1dHRvbiwgeyBpY29uOiBMZWZ0RHJhd2VySWNvbiwgdmFyaWFudDogXCJzZWNvbmRhcnlcIiwgc2l6ZTogXCJzbWFsbFwiLCBvbkNsaWNrOiAoKSA9PiBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAncmlnaHQnIDogJ2JvdGgnKSksIFwiYXJpYS1sYWJlbFwiOiBhcmlhTGFiZWxDb2RlQnV0dG9uLCBcImFyaWEtY29udHJvbHNcIjogXCJjb2RlLWRyYXdlclwiLCBcImFyaWEtZXhwYW5kZWRcIjogIWlzUmlnaHRPcGVuIH0pLFxyXG4gICAgICAgICAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChEcmF3ZXJMYWJlbCwgeyBpZDogXCJjb2RlLWRyYXdlci1sYWJlbFwiIH0sIFwiQ29kZVwiKSksXHJcbiAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRHJhd2VyLCB7IG9wZW46ICFpc0xlZnRPcGVuLCBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLCBmbGV4V3JhcDogXCJub3dyYXBcIiwganVzdGlmeUNvbnRlbnQ6IFwiZmxleC1lbmRcIiwgcHg6IDggfSxcclxuICAgICAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRHJhd2VyTGFiZWwsIHsgaWQ6IFwib3V0cHV0LWRyYXdlci1sYWJlbFwiIH0sIFwiT3V0cHV0XCIpLFxyXG4gICAgICAgICAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChJY29uQnV0dG9uLCB7IGljb246IFJpZ2h0RHJhd2VySWNvbiwgdmFyaWFudDogXCJzZWNvbmRhcnlcIiwgc2l6ZTogXCJzbWFsbFwiLCBvbkNsaWNrOiAoKSA9PiBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAnbGVmdCcgOiAnYm90aCcpKSwgXCJhcmlhLWxhYmVsXCI6IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiwgXCJhcmlhLWNvbnRyb2xzXCI6IFwib3V0cHV0LWRyYXdlclwiLCBcImFyaWEtZXhwYW5kZWRcIjogIWlzTGVmdE9wZW4gfSkpKSxcclxuICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KEZsZXhCb3gsIHsgZmxleEdyb3c6IDEsIGJvcmRlclk6IDEsIGJvcmRlckNvbG9yOiBcImdyYXktOTAwXCIsIGFsaWduSXRlbXM6IFwic3RyZXRjaFwiLCBvdmVyZmxvdzogXCJoaWRkZW5cIiB9LFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBoaWRlT25DbG9zZTogdHJ1ZSwgaWQ6IFwiY29kZS1kcmF3ZXJcIiwgXCJhcmlhLWxhYmVsbGVkYnlcIjogXCJjb2RlLWRyYXdlci1sYWJlbFwiLCBvcGVuOiAhaXNSaWdodE9wZW4sIGZsZXhHcm93OiAwLCBvdmVyZmxvdzogXCJoaWRkZW5cIiwgYm9yZGVyQ29sb3I6IFwiZ3JheS05MDBcIiwgYm9yZGVyU3R5bGVSaWdodDogXCJzb2xpZFwiLCBib3JkZXJXaWR0aFJpZ2h0OiBcInRoaW5cIiB9LCBsZWZ0Q2hpbGQpLFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBoaWRlT25DbG9zZTogdHJ1ZSwgaWQ6IFwib3V0cHV0LWRyYXdlclwiLCBcImFyaWEtbGFiZWxsZWRieVwiOiBcIm91dHB1dC1kcmF3ZXItbGFiZWxcIiwgcm9sZTogXCJyZWdpb25cIiwgb3BlbjogIWlzTGVmdE9wZW4sIG92ZXJmbG93OiBcImhpZGRlblwiIH0sIHJpZ2h0Q2hpbGQpKSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1kcmF3ZXJzLmpzLm1hcCJdfQ== */",
|
|
168
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__$1
|
|
169
|
-
});
|
|
170
|
-
|
|
171
|
-
const RightDrawerIcon = LeftDrawerIcon.withComponent(gamutIcons.ArrowChevronRightIcon, {
|
|
172
|
-
target: "e1keub6a3",
|
|
173
|
-
label: "RightDrawerIcon"
|
|
174
|
-
});
|
|
175
|
-
|
|
176
|
-
const Drawer = /*#__PURE__*/_styled__default["default"](gamut.FlexBox, {
|
|
177
|
-
target: "e1keub6a0",
|
|
178
|
-
label: "Drawer"
|
|
179
|
-
})("position:relative;", ({
|
|
180
|
-
open,
|
|
181
|
-
hideOnClose
|
|
182
|
-
}) => `
|
|
183
|
-
flex-basis: ${open ? '100%' : '0%'};
|
|
184
|
-
visibility: ${!open && hideOnClose ? 'hidden' : 'visible'};
|
|
185
|
-
transition: flex-basis 0.2s ${open ? 'ease-out' : 'ease-in, visibility 0s 0.2s'};
|
|
186
|
-
|
|
187
|
-
${LeftDrawerIcon}, ${RightDrawerIcon} {
|
|
188
|
-
transform: rotateZ(${open ? '0' : '180'}deg)};
|
|
189
|
-
}
|
|
190
|
-
`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyYXdlcnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVcrQiIsImZpbGUiOiJkcmF3ZXJzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEZsZXhCb3gsIEljb25CdXR0b24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XHJcbmltcG9ydCB7IEFycm93Q2hldnJvbkxlZnRJY29uLCBBcnJvd0NoZXZyb25SaWdodEljb24sIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XHJcbmltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcclxuY29uc3QgRHJhd2VyTGFiZWwgPSBzdHlsZWQuc3BhbiBgXG4gIHBhZGRpbmc6IDAuODc1cmVtIDAuNXJlbTtcbmA7XHJcbmNvbnN0IExlZnREcmF3ZXJJY29uID0gc3R5bGVkKEFycm93Q2hldnJvbkxlZnRJY29uKSBgXG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjJzIGVhc2UtaW4tb3V0O1xuYDtcclxuY29uc3QgUmlnaHREcmF3ZXJJY29uID0gTGVmdERyYXdlckljb24ud2l0aENvbXBvbmVudChBcnJvd0NoZXZyb25SaWdodEljb24pO1xyXG5jb25zdCBEcmF3ZXIgPSBzdHlsZWQoRmxleEJveCkgYFxuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICR7KHsgb3BlbiwgaGlkZU9uQ2xvc2UgfSkgPT4gYFxuICAgIGZsZXgtYmFzaXM6ICR7b3BlbiA/ICcxMDAlJyA6ICcwJSd9O1xuICAgIHZpc2liaWxpdHk6ICR7IW9wZW4gJiYgaGlkZU9uQ2xvc2UgPyAnaGlkZGVuJyA6ICd2aXNpYmxlJ307XG4gICAgdHJhbnNpdGlvbjogZmxleC1iYXNpcyAwLjJzICR7b3BlbiA/ICdlYXNlLW91dCcgOiAnZWFzZS1pbiwgdmlzaWJpbGl0eSAwcyAwLjJzJ307XG5cbiAgICAke0xlZnREcmF3ZXJJY29ufSwgJHtSaWdodERyYXdlckljb259IHtcbiAgICAgIHRyYW5zZm9ybTogcm90YXRlWigke29wZW4gPyAnMCcgOiAnMTgwJ31kZWcpfTtcbiAgICB9XG4gIGB9XG5gO1xyXG5leHBvcnQgY29uc3QgRHJhd2VycyA9ICh7IGxlZnRDaGlsZCwgcmlnaHRDaGlsZCB9KSA9PiB7XHJcbiAgICBjb25zdCBbb3Blbiwgc2V0T3Blbl0gPSB1c2VTdGF0ZSgnYm90aCcpO1xyXG4gICAgbGV0IGFyaWFMYWJlbENvZGVCdXR0b24gPSAnaGlkZSBjb2RlJztcclxuICAgIGxldCBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnaGlkZSBvdXRwdXQnO1xyXG4gICAgbGV0IGlzTGVmdE9wZW4gPSBmYWxzZTtcclxuICAgIGxldCBpc1JpZ2h0T3BlbiA9IGZhbHNlO1xyXG4gICAgaWYgKG9wZW4gPT09ICdsZWZ0Jykge1xyXG4gICAgICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBvdXRwdXQnO1xyXG4gICAgICAgIGlzTGVmdE9wZW4gPSB0cnVlO1xyXG4gICAgfVxyXG4gICAgZWxzZSBpZiAob3BlbiA9PT0gJ3JpZ2h0Jykge1xyXG4gICAgICAgIGFyaWFMYWJlbENvZGVCdXR0b24gPSBhcmlhTGFiZWxPdXRwdXRCdXR0b24gPSAnc2hvdyBjb2RlJztcclxuICAgICAgICBpc1JpZ2h0T3BlbiA9IHRydWU7XHJcbiAgICB9XHJcbiAgICByZXR1cm4gKFJlYWN0LmNyZWF0ZUVsZW1lbnQoUmVhY3QuRnJhZ21lbnQsIG51bGwsXHJcbiAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChGbGV4Qm94LCBudWxsLFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBvcGVuOiAhaXNSaWdodE9wZW4sIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsIGZsZXhXcmFwOiBcIm5vd3JhcFwiLCB0ZXh0QWxpZ246IFwibGVmdFwiLCBib3JkZXJSaWdodDogMSwgYm9yZGVyQ29sb3I6IFwiZ3JheS05MDBcIiwgcHg6IDggfSxcclxuICAgICAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoSWNvbkJ1dHRvbiwgeyBpY29uOiBMZWZ0RHJhd2VySWNvbiwgdmFyaWFudDogXCJzZWNvbmRhcnlcIiwgc2l6ZTogXCJzbWFsbFwiLCBvbkNsaWNrOiAoKSA9PiBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAncmlnaHQnIDogJ2JvdGgnKSksIFwiYXJpYS1sYWJlbFwiOiBhcmlhTGFiZWxDb2RlQnV0dG9uLCBcImFyaWEtY29udHJvbHNcIjogXCJjb2RlLWRyYXdlclwiLCBcImFyaWEtZXhwYW5kZWRcIjogIWlzUmlnaHRPcGVuIH0pLFxyXG4gICAgICAgICAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChEcmF3ZXJMYWJlbCwgeyBpZDogXCJjb2RlLWRyYXdlci1sYWJlbFwiIH0sIFwiQ29kZVwiKSksXHJcbiAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRHJhd2VyLCB7IG9wZW46ICFpc0xlZnRPcGVuLCBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLCBmbGV4V3JhcDogXCJub3dyYXBcIiwganVzdGlmeUNvbnRlbnQ6IFwiZmxleC1lbmRcIiwgcHg6IDggfSxcclxuICAgICAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRHJhd2VyTGFiZWwsIHsgaWQ6IFwib3V0cHV0LWRyYXdlci1sYWJlbFwiIH0sIFwiT3V0cHV0XCIpLFxyXG4gICAgICAgICAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChJY29uQnV0dG9uLCB7IGljb246IFJpZ2h0RHJhd2VySWNvbiwgdmFyaWFudDogXCJzZWNvbmRhcnlcIiwgc2l6ZTogXCJzbWFsbFwiLCBvbkNsaWNrOiAoKSA9PiBzZXRPcGVuKChzdGF0ZSkgPT4gKHN0YXRlID09PSAnYm90aCcgPyAnbGVmdCcgOiAnYm90aCcpKSwgXCJhcmlhLWxhYmVsXCI6IGFyaWFMYWJlbE91dHB1dEJ1dHRvbiwgXCJhcmlhLWNvbnRyb2xzXCI6IFwib3V0cHV0LWRyYXdlclwiLCBcImFyaWEtZXhwYW5kZWRcIjogIWlzTGVmdE9wZW4gfSkpKSxcclxuICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KEZsZXhCb3gsIHsgZmxleEdyb3c6IDEsIGJvcmRlclk6IDEsIGJvcmRlckNvbG9yOiBcImdyYXktOTAwXCIsIGFsaWduSXRlbXM6IFwic3RyZXRjaFwiLCBvdmVyZmxvdzogXCJoaWRkZW5cIiB9LFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBoaWRlT25DbG9zZTogdHJ1ZSwgaWQ6IFwiY29kZS1kcmF3ZXJcIiwgXCJhcmlhLWxhYmVsbGVkYnlcIjogXCJjb2RlLWRyYXdlci1sYWJlbFwiLCBvcGVuOiAhaXNSaWdodE9wZW4sIGZsZXhHcm93OiAwLCBvdmVyZmxvdzogXCJoaWRkZW5cIiwgYm9yZGVyQ29sb3I6IFwiZ3JheS05MDBcIiwgYm9yZGVyU3R5bGVSaWdodDogXCJzb2xpZFwiLCBib3JkZXJXaWR0aFJpZ2h0OiBcInRoaW5cIiB9LCBsZWZ0Q2hpbGQpLFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlciwgeyBoaWRlT25DbG9zZTogdHJ1ZSwgaWQ6IFwib3V0cHV0LWRyYXdlclwiLCBcImFyaWEtbGFiZWxsZWRieVwiOiBcIm91dHB1dC1kcmF3ZXItbGFiZWxcIiwgcm9sZTogXCJyZWdpb25cIiwgb3BlbjogIWlzTGVmdE9wZW4sIG92ZXJmbG93OiBcImhpZGRlblwiIH0sIHJpZ2h0Q2hpbGQpKSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1kcmF3ZXJzLmpzLm1hcCJdfQ== */"));
|
|
191
|
-
|
|
192
|
-
const Drawers = ({
|
|
193
|
-
leftChild,
|
|
194
|
-
rightChild
|
|
195
|
-
}) => {
|
|
196
|
-
const [open, setOpen] = React.useState('both');
|
|
197
|
-
let ariaLabelCodeButton = 'hide code';
|
|
198
|
-
let ariaLabelOutputButton = 'hide output';
|
|
199
|
-
let isLeftOpen = false;
|
|
200
|
-
let isRightOpen = false;
|
|
201
|
-
|
|
202
|
-
if (open === 'left') {
|
|
203
|
-
ariaLabelCodeButton = ariaLabelOutputButton = 'show output';
|
|
204
|
-
isLeftOpen = true;
|
|
205
|
-
} else if (open === 'right') {
|
|
206
|
-
ariaLabelCodeButton = ariaLabelOutputButton = 'show code';
|
|
207
|
-
isRightOpen = true;
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(gamut.FlexBox, null, /*#__PURE__*/React__default["default"].createElement(Drawer, {
|
|
211
|
-
open: !isRightOpen,
|
|
212
|
-
alignItems: "center",
|
|
213
|
-
flexWrap: "nowrap",
|
|
214
|
-
textAlign: "left",
|
|
215
|
-
borderRight: 1,
|
|
216
|
-
borderColor: "gray-900",
|
|
217
|
-
px: 8
|
|
218
|
-
}, /*#__PURE__*/React__default["default"].createElement(gamut.IconButton, {
|
|
219
|
-
icon: LeftDrawerIcon,
|
|
220
|
-
variant: "secondary",
|
|
221
|
-
size: "small",
|
|
222
|
-
onClick: () => setOpen(state => state === 'both' ? 'right' : 'both'),
|
|
223
|
-
"aria-label": ariaLabelCodeButton,
|
|
224
|
-
"aria-controls": "code-drawer",
|
|
225
|
-
"aria-expanded": !isRightOpen
|
|
226
|
-
}), /*#__PURE__*/React__default["default"].createElement(DrawerLabel, {
|
|
227
|
-
id: "code-drawer-label"
|
|
228
|
-
}, "Code")), /*#__PURE__*/React__default["default"].createElement(Drawer, {
|
|
229
|
-
open: !isLeftOpen,
|
|
230
|
-
alignItems: "center",
|
|
231
|
-
flexWrap: "nowrap",
|
|
232
|
-
justifyContent: "flex-end",
|
|
233
|
-
px: 8
|
|
234
|
-
}, /*#__PURE__*/React__default["default"].createElement(DrawerLabel, {
|
|
235
|
-
id: "output-drawer-label"
|
|
236
|
-
}, "Output"), /*#__PURE__*/React__default["default"].createElement(gamut.IconButton, {
|
|
237
|
-
icon: RightDrawerIcon,
|
|
238
|
-
variant: "secondary",
|
|
239
|
-
size: "small",
|
|
240
|
-
onClick: () => setOpen(state => state === 'both' ? 'left' : 'both'),
|
|
241
|
-
"aria-label": ariaLabelOutputButton,
|
|
242
|
-
"aria-controls": "output-drawer",
|
|
243
|
-
"aria-expanded": !isLeftOpen
|
|
244
|
-
}))), /*#__PURE__*/React__default["default"].createElement(gamut.FlexBox, {
|
|
245
|
-
flexGrow: 1,
|
|
246
|
-
borderY: 1,
|
|
247
|
-
borderColor: "gray-900",
|
|
248
|
-
alignItems: "stretch",
|
|
249
|
-
overflow: "hidden"
|
|
250
|
-
}, /*#__PURE__*/React__default["default"].createElement(Drawer, {
|
|
251
|
-
hideOnClose: true,
|
|
252
|
-
id: "code-drawer",
|
|
253
|
-
"aria-labelledby": "code-drawer-label",
|
|
254
|
-
open: !isRightOpen,
|
|
255
|
-
flexGrow: 0,
|
|
256
|
-
overflow: "hidden",
|
|
257
|
-
borderColor: "gray-900",
|
|
258
|
-
borderStyleRight: "solid",
|
|
259
|
-
borderWidthRight: "thin"
|
|
260
|
-
}, leftChild), /*#__PURE__*/React__default["default"].createElement(Drawer, {
|
|
261
|
-
hideOnClose: true,
|
|
262
|
-
id: "output-drawer",
|
|
263
|
-
"aria-labelledby": "output-drawer-label",
|
|
264
|
-
role: "region",
|
|
265
|
-
open: !isLeftOpen,
|
|
266
|
-
overflow: "hidden"
|
|
267
|
-
}, rightChild)));
|
|
268
|
-
};
|
|
269
|
-
|
|
270
|
-
const IS_DEV = process.env.NODE_ENV === 'development'; // TODO: confirm tracking details and implementation DISC-447
|
|
271
|
-
|
|
272
|
-
const tracker = tracking.createTracker({
|
|
273
|
-
apiBaseUrl: typeof window === 'undefined' ? 'https://www.codecademy.com' : window.location.origin,
|
|
274
|
-
verbose: IS_DEV
|
|
275
|
-
});
|
|
276
|
-
const {
|
|
277
|
-
click: trackUserClick,
|
|
278
|
-
visit: trackUserVisit,
|
|
279
|
-
impression: trackUserImpression
|
|
280
|
-
} = tracker;
|
|
281
|
-
|
|
282
|
-
const trackClick = (target, trackingData) => trackUserClick(_extends({}, trackingData, {
|
|
283
|
-
target
|
|
284
|
-
}));
|
|
285
|
-
|
|
286
|
-
// DO NOT CHANGE ANYTHING HERE
|
|
287
|
-
const darkTheme = {
|
|
288
|
-
blue: gamutStyles.editorColors.blue,
|
|
289
|
-
deepPurple: gamutStyles.editorColors.deepPurple,
|
|
290
|
-
gray: gamutStyles.editorColors.gray,
|
|
291
|
-
green: gamutStyles.editorColors.green,
|
|
292
|
-
orange: gamutStyles.editorColors.orange,
|
|
293
|
-
purple: gamutStyles.editorColors.purple,
|
|
294
|
-
red: gamutStyles.editorColors.red,
|
|
295
|
-
white: gamutStyles.colors.white,
|
|
296
|
-
yellow: gamutStyles.editorColors.yellow
|
|
297
|
-
};
|
|
298
|
-
const syntax = {
|
|
299
|
-
attribute: darkTheme.green,
|
|
300
|
-
annotation: darkTheme.red,
|
|
301
|
-
atom: darkTheme.deepPurple,
|
|
302
|
-
basic: darkTheme.white,
|
|
303
|
-
comment: darkTheme.gray,
|
|
304
|
-
constant: darkTheme.orange,
|
|
305
|
-
decoration: darkTheme.red,
|
|
306
|
-
invalid: darkTheme.red,
|
|
307
|
-
key: darkTheme.blue,
|
|
308
|
-
keyword: darkTheme.purple,
|
|
309
|
-
number: darkTheme.red,
|
|
310
|
-
operator: darkTheme.red,
|
|
311
|
-
predefined: darkTheme.white,
|
|
312
|
-
property: darkTheme.red,
|
|
313
|
-
regexp: darkTheme.green,
|
|
314
|
-
string: darkTheme.yellow,
|
|
315
|
-
tag: darkTheme.red,
|
|
316
|
-
text: darkTheme.orange,
|
|
317
|
-
value: darkTheme.yellow,
|
|
318
|
-
variable: darkTheme.green
|
|
319
|
-
};
|
|
320
|
-
const ui = {
|
|
321
|
-
background: '#211E2F',
|
|
322
|
-
text: darkTheme.white,
|
|
323
|
-
indent: {
|
|
324
|
-
active: '#393b41',
|
|
325
|
-
inactive: '#494b51'
|
|
326
|
-
}
|
|
327
|
-
};
|
|
328
|
-
|
|
329
|
-
var darkColors = /*#__PURE__*/Object.freeze({
|
|
330
|
-
__proto__: null,
|
|
331
|
-
syntax: syntax,
|
|
332
|
-
ui: ui
|
|
333
|
-
});
|
|
334
|
-
|
|
335
|
-
// DO NOT CHANGE ANYTHING HERE
|
|
336
|
-
|
|
337
|
-
const c = color => color.substr(1);
|
|
338
|
-
|
|
339
|
-
const theme = ({
|
|
340
|
-
ui,
|
|
341
|
-
syntax
|
|
342
|
-
}) => ({
|
|
343
|
-
base: 'vs-dark',
|
|
344
|
-
inherit: true,
|
|
345
|
-
rules: [// Base
|
|
346
|
-
{
|
|
347
|
-
token: '',
|
|
348
|
-
foreground: c(syntax.basic)
|
|
349
|
-
}, {
|
|
350
|
-
token: 'regexp',
|
|
351
|
-
foreground: c(syntax.regexp)
|
|
352
|
-
}, {
|
|
353
|
-
token: 'annotation',
|
|
354
|
-
foreground: c(syntax.annotation)
|
|
355
|
-
}, {
|
|
356
|
-
token: 'type',
|
|
357
|
-
foreground: c(syntax.annotation)
|
|
358
|
-
}, {
|
|
359
|
-
token: 'doctype',
|
|
360
|
-
foreground: c(syntax.comment)
|
|
361
|
-
}, {
|
|
362
|
-
token: 'delimiter',
|
|
363
|
-
foreground: c(syntax.decoration)
|
|
364
|
-
}, {
|
|
365
|
-
token: 'invalid',
|
|
366
|
-
foreground: c(syntax.invalid)
|
|
367
|
-
}, {
|
|
368
|
-
token: 'emphasis',
|
|
369
|
-
fontStyle: 'italic'
|
|
370
|
-
}, {
|
|
371
|
-
token: 'strong',
|
|
372
|
-
fontStyle: 'bold'
|
|
373
|
-
}, {
|
|
374
|
-
token: 'variable',
|
|
375
|
-
foreground: c(syntax.variable)
|
|
376
|
-
}, {
|
|
377
|
-
token: 'variable.predefined',
|
|
378
|
-
foreground: c(syntax.variable)
|
|
379
|
-
}, {
|
|
380
|
-
token: 'constant',
|
|
381
|
-
foreground: c(syntax.constant)
|
|
382
|
-
}, {
|
|
383
|
-
token: 'comment',
|
|
384
|
-
foreground: c(syntax.comment)
|
|
385
|
-
}, {
|
|
386
|
-
token: 'number',
|
|
387
|
-
foreground: c(syntax.number)
|
|
388
|
-
}, {
|
|
389
|
-
token: 'number.hex',
|
|
390
|
-
foreground: c(syntax.number)
|
|
391
|
-
}, {
|
|
392
|
-
token: 'keyword.directive',
|
|
393
|
-
foreground: c(syntax.comment)
|
|
394
|
-
}, {
|
|
395
|
-
token: 'include',
|
|
396
|
-
foreground: c(syntax.comment)
|
|
397
|
-
}, {
|
|
398
|
-
token: 'key',
|
|
399
|
-
foreground: c(syntax.property)
|
|
400
|
-
}, {
|
|
401
|
-
token: 'attribute.name',
|
|
402
|
-
foreground: c(syntax.attribute)
|
|
403
|
-
}, {
|
|
404
|
-
token: 'attribute.name-numeric',
|
|
405
|
-
foreground: c(syntax.string)
|
|
406
|
-
}, {
|
|
407
|
-
token: 'attribute.value',
|
|
408
|
-
foreground: c(syntax.property)
|
|
409
|
-
}, {
|
|
410
|
-
token: 'attribute.value.number',
|
|
411
|
-
foreground: c(syntax.number)
|
|
412
|
-
}, {
|
|
413
|
-
token: 'string',
|
|
414
|
-
foreground: c(syntax.string)
|
|
415
|
-
}, {
|
|
416
|
-
token: 'string.yaml',
|
|
417
|
-
foreground: c(syntax.string)
|
|
418
|
-
}, {
|
|
419
|
-
token: 'tag',
|
|
420
|
-
foreground: c(syntax.tag)
|
|
421
|
-
}, {
|
|
422
|
-
token: 'tag.id.jade',
|
|
423
|
-
foreground: c(syntax.tag)
|
|
424
|
-
}, {
|
|
425
|
-
token: 'tag.class.jade',
|
|
426
|
-
foreground: c(syntax.tag)
|
|
427
|
-
}, {
|
|
428
|
-
token: 'metatag',
|
|
429
|
-
foreground: c(syntax.comment)
|
|
430
|
-
}, {
|
|
431
|
-
token: 'attribute.value.unit',
|
|
432
|
-
foreground: c(syntax.string)
|
|
433
|
-
}, {
|
|
434
|
-
token: 'keyword',
|
|
435
|
-
foreground: c(syntax.keyword)
|
|
436
|
-
}, {
|
|
437
|
-
token: 'keyword.flow',
|
|
438
|
-
foreground: c(syntax.keyword)
|
|
439
|
-
}],
|
|
440
|
-
colors: {
|
|
441
|
-
'editor.background': ui.background,
|
|
442
|
-
'editor.foreground': ui.text,
|
|
443
|
-
'editorIndentGuide.background': ui.indent.inactive,
|
|
444
|
-
'editorIndentGuide.activeBackground': ui.indent.active,
|
|
445
|
-
'editorWhitespace.foreground': syntax.comment,
|
|
446
|
-
'editorLineNumber.foreground': '#9FA2AC'
|
|
447
|
-
}
|
|
448
|
-
});
|
|
449
|
-
|
|
450
|
-
const dark = theme(darkColors);
|
|
451
|
-
|
|
452
|
-
// DO NOT CHANGE ANYTHING HERE
|
|
453
|
-
const SimpleMonacoEditor = ({
|
|
454
|
-
value,
|
|
455
|
-
language,
|
|
456
|
-
onChange
|
|
457
|
-
}) => {
|
|
458
|
-
const editorRef = React.useRef(null);
|
|
459
|
-
const editorWillMount = React.useCallback((editor, monaco) => {
|
|
460
|
-
editorRef.current = editor;
|
|
461
|
-
monaco.editor.defineTheme('dark', dark);
|
|
462
|
-
monaco.editor.setTheme('dark');
|
|
463
|
-
}, []);
|
|
464
|
-
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ResizeObserver__default["default"], {
|
|
465
|
-
onResize: ({
|
|
466
|
-
height,
|
|
467
|
-
width
|
|
468
|
-
}) => {
|
|
469
|
-
var _editorRef$current;
|
|
470
|
-
|
|
471
|
-
(_editorRef$current = editorRef.current) == null ? void 0 : _editorRef$current.layout({
|
|
472
|
-
height,
|
|
473
|
-
width
|
|
474
|
-
});
|
|
475
|
-
}
|
|
476
|
-
}), /*#__PURE__*/React__default["default"].createElement(ReactMonacoEditor__default["default"], {
|
|
477
|
-
onMount: editorWillMount,
|
|
478
|
-
onChange: onChange,
|
|
479
|
-
options: {
|
|
480
|
-
minimap: {
|
|
481
|
-
enabled: false
|
|
482
|
-
}
|
|
483
|
-
},
|
|
484
|
-
theme: "vs-dark",
|
|
485
|
-
value: value,
|
|
486
|
-
language: language
|
|
487
|
-
}));
|
|
488
|
-
};
|
|
489
|
-
|
|
490
|
-
function _await(value, then, direct) {
|
|
491
|
-
if (direct) {
|
|
492
|
-
return then ? then(value) : value;
|
|
493
|
-
}
|
|
494
|
-
|
|
495
|
-
if (!value || !value.then) {
|
|
496
|
-
value = Promise.resolve(value);
|
|
497
|
-
}
|
|
498
|
-
|
|
499
|
-
return then ? value.then(then) : value;
|
|
500
|
-
}
|
|
501
|
-
|
|
502
|
-
function _catch(body, recover) {
|
|
503
|
-
try {
|
|
504
|
-
var result = body();
|
|
505
|
-
} catch (e) {
|
|
506
|
-
return recover(e);
|
|
507
|
-
}
|
|
508
|
-
|
|
509
|
-
if (result && result.then) {
|
|
510
|
-
return result.then(void 0, recover);
|
|
511
|
-
}
|
|
512
|
-
|
|
513
|
-
return result;
|
|
514
|
-
}
|
|
515
|
-
|
|
516
|
-
function _empty() {}
|
|
517
|
-
|
|
518
|
-
function _continueIgnored(value) {
|
|
519
|
-
if (value && value.then) {
|
|
520
|
-
return value.then(_empty);
|
|
521
|
-
}
|
|
522
|
-
}
|
|
523
|
-
|
|
524
|
-
function _async(f) {
|
|
525
|
-
return function () {
|
|
526
|
-
for (var args = [], i = 0; i < arguments.length; i++) {
|
|
527
|
-
args[i] = arguments[i];
|
|
528
|
-
}
|
|
529
|
-
|
|
530
|
-
try {
|
|
531
|
-
return Promise.resolve(f.apply(this, args));
|
|
532
|
-
} catch (e) {
|
|
533
|
-
return Promise.reject(e);
|
|
534
|
-
}
|
|
535
|
-
};
|
|
536
|
-
}
|
|
537
|
-
|
|
538
|
-
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)."; }
|
|
539
|
-
|
|
540
|
-
const Output = _styled__default["default"]("pre", {
|
|
541
|
-
target: "e1lzxy8e1",
|
|
542
|
-
label: "Output"
|
|
543
|
-
})("width:100%;height:100%;margin:0;padding:0 1rem;font-family:Monaco;font-size:0.875rem;overflow:auto;", ({
|
|
544
|
-
hasError,
|
|
545
|
-
theme
|
|
546
|
-
}) => `
|
|
547
|
-
color: ${hasError ? theme.colors.orange : theme.colors.text};
|
|
548
|
-
background-color: ${theme.colors['navy-900']};
|
|
549
|
-
`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImVkaXRvci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUTBCIiwiZmlsZSI6ImVkaXRvci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBGaWxsQnV0dG9uLCBGbGV4Qm94LCBTcGlubmVyLCBUZXh0QnV0dG9uLCBUb29sVGlwLCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcclxuaW1wb3J0IHsgQ29weUljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xyXG5pbXBvcnQgeyBwb3N0U25pcHBldCB9IGZyb20gJy4vYXBpJztcclxuaW1wb3J0IHsgRHJhd2VycyB9IGZyb20gJy4vZHJhd2Vycyc7XHJcbmltcG9ydCB7IHRyYWNrQ2xpY2sgfSBmcm9tICcuL2hlbHBlcnMnO1xyXG5pbXBvcnQgeyBTaW1wbGVNb25hY29FZGl0b3IgfSBmcm9tICcuL01vbmFjb0VkaXRvcic7XHJcbmNvbnN0IE91dHB1dCA9IHN0eWxlZC5wcmUgYFxuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBtYXJnaW46IDA7XG4gIHBhZGRpbmc6IDAgMXJlbTtcbiAgZm9udC1mYW1pbHk6IE1vbmFjbztcbiAgZm9udC1zaXplOiAwLjg3NXJlbTtcbiAgb3ZlcmZsb3c6IGF1dG87XG4gICR7KHsgaGFzRXJyb3IsIHRoZW1lIH0pID0+IGBcbiAgY29sb3I6ICR7aGFzRXJyb3IgPyB0aGVtZS5jb2xvcnMub3JhbmdlIDogdGhlbWUuY29sb3JzLnRleHR9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3RoZW1lLmNvbG9yc1snbmF2eS05MDAnXX07XG5gfVxuYDtcclxuY29uc3QgQ29weUljb25TdHlsZWQgPSBzdHlsZWQoQ29weUljb24pIGBcbiAgbWFyZ2luLXJpZ2h0OiAwLjVyZW07XG5gO1xyXG5jb25zdCBET0NLRVJfU0lHVEVSTSA9IDE0MztcclxuZXhwb3J0IGNvbnN0IEVkaXRvciA9ICh7IGxhbmd1YWdlLCB0ZXh0LCBoaWRlQ29weUJ1dHRvbiwgb25DaGFuZ2UsIGNvcHlGb3JtYXR0ZXIsIHNuaXBwZXRzQmFzZVVybCwgdHJhY2tpbmdEYXRhLCB9KSA9PiB7XHJcbiAgICBjb25zdCBbb3V0cHV0LCBzZXRPdXRwdXRdID0gdXNlU3RhdGUoJycpO1xyXG4gICAgY29uc3QgW3N0YXR1cywgc2V0U3RhdHVzXSA9IHVzZVN0YXRlKCdyZWFkeScpO1xyXG4gICAgY29uc3QgW2lzQ29kZUJ5dGVDb3BpZWQsIHNldElzQ29kZUJ5dGVDb3BpZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xyXG4gICAgY29uc3Qgb25Db3B5Q2xpY2sgPSAoKSA9PiB7XHJcbiAgICAgICAgaWYgKCFpc0NvZGVCeXRlQ29waWVkKSB7XHJcbiAgICAgICAgICAgIG5hdmlnYXRvci5jbGlwYm9hcmRcclxuICAgICAgICAgICAgICAgIC53cml0ZVRleHQoY29weUZvcm1hdHRlciA/IGNvcHlGb3JtYXR0ZXIoeyB0ZXh0LCBsYW5ndWFnZSB9KSA6IHRleHQpXHJcbiAgICAgICAgICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgbm8tY29uc29sZVxyXG4gICAgICAgICAgICAgICAgLmNhdGNoKCgpID0+IGNvbnNvbGUuZXJyb3IoJ0ZhaWxlZCB0byBjb3B5JykpO1xyXG4gICAgICAgICAgICBzZXRJc0NvZGVCeXRlQ29waWVkKHRydWUpO1xyXG4gICAgICAgICAgICB0cmFja0NsaWNrKCdjb3B5JywgdHJhY2tpbmdEYXRhKTtcclxuICAgICAgICB9XHJcbiAgICB9O1xyXG4gICAgY29uc3Qgc2V0RXJyb3JTdGF0dXNBbmRPdXRwdXQgPSAobWVzc2FnZSkgPT4ge1xyXG4gICAgICAgIHNldE91dHB1dChtZXNzYWdlKTtcclxuICAgICAgICBzZXRTdGF0dXMoJ2Vycm9yJyk7XHJcbiAgICB9O1xyXG4gICAgY29uc3QgaGFuZGxlU3VibWl0ID0gYXN5bmMgKCkgPT4ge1xyXG4gICAgICAgIGlmICh0ZXh0LnRyaW0oKS5sZW5ndGggPT09IDApIHtcclxuICAgICAgICAgICAgcmV0dXJuO1xyXG4gICAgICAgIH1cclxuICAgICAgICBjb25zdCBkYXRhID0ge1xyXG4gICAgICAgICAgICBsYW5ndWFnZSxcclxuICAgICAgICAgICAgY29kZTogdGV4dCxcclxuICAgICAgICB9O1xyXG4gICAgICAgIHNldFN0YXR1cygnd2FpdGluZycpO1xyXG4gICAgICAgIHNldE91dHB1dCgnJyk7XHJcbiAgICAgICAgdHJhY2tDbGljaygncnVuJywgdHJhY2tpbmdEYXRhKTtcclxuICAgICAgICB0cnkge1xyXG4gICAgICAgICAgICBjb25zdCByZXNwb25zZSA9IGF3YWl0IHBvc3RTbmlwcGV0KGRhdGEsIHNuaXBwZXRzQmFzZVVybCk7XHJcbiAgICAgICAgICAgIGlmIChyZXNwb25zZS5zdGRlcnIubGVuZ3RoID4gMCkge1xyXG4gICAgICAgICAgICAgICAgc2V0RXJyb3JTdGF0dXNBbmRPdXRwdXQocmVzcG9uc2Uuc3RkZXJyKTtcclxuICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICBlbHNlIGlmIChyZXNwb25zZS5leGl0X2NvZGUgPT09IERPQ0tFUl9TSUdURVJNKSB7XHJcbiAgICAgICAgICAgICAgICBzZXRFcnJvclN0YXR1c0FuZE91dHB1dCgnWW91ciBjb2RlIHRvb2sgdG9vIGxvbmcgdG8gcmV0dXJuIGEgcmVzdWx0LiBEb3VibGUgY2hlY2sgeW91ciBjb2RlIGZvciBhbnkgaXNzdWVzIGFuZCB0cnkgYWdhaW4hJyk7XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgZWxzZSBpZiAocmVzcG9uc2UuZXhpdF9jb2RlICE9PSAwKSB7XHJcbiAgICAgICAgICAgICAgICBzZXRFcnJvclN0YXR1c0FuZE91dHB1dCgnQW4gdW5rbm93biBlcnJvciBvY2N1cmVkLicpO1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgICAgIGVsc2Uge1xyXG4gICAgICAgICAgICAgICAgc2V0T3V0cHV0KHJlc3BvbnNlLnN0ZG91dCk7XHJcbiAgICAgICAgICAgICAgICBzZXRTdGF0dXMoJ3JlYWR5Jyk7XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICAgICAgY2F0Y2ggKGVycm9yKSB7XHJcbiAgICAgICAgICAgIHNldEVycm9yU3RhdHVzQW5kT3V0cHV0KCdFcnJvcjogJyArIGVycm9yKTtcclxuICAgICAgICB9XHJcbiAgICB9O1xyXG4gICAgcmV0dXJuIChSZWFjdC5jcmVhdGVFbGVtZW50KFJlYWN0LkZyYWdtZW50LCBudWxsLFxyXG4gICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRHJhd2VycywgeyBsZWZ0Q2hpbGQ6IFJlYWN0LmNyZWF0ZUVsZW1lbnQoU2ltcGxlTW9uYWNvRWRpdG9yLCB7IHZhbHVlOiB0ZXh0LCBsYW5ndWFnZTogbGFuZ3VhZ2UsIG9uQ2hhbmdlOiBvbkNoYW5nZSB9KSwgcmlnaHRDaGlsZDogUmVhY3QuY3JlYXRlRWxlbWVudChPdXRwdXQsIHsgaGFzRXJyb3I6IHN0YXR1cyA9PT0gJ2Vycm9yJywgXCJhcmlhLWxpdmVcIjogXCJwb2xpdGVcIiB9LCBvdXRwdXQpIH0pLFxyXG4gICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRmxleEJveCwgeyBqdXN0aWZ5Q29udGVudDogaGlkZUNvcHlCdXR0b24gPyAnZmxleC1lbmQnIDogJ3NwYWNlLWJldHdlZW4nLCBwbDogOCB9LFxyXG4gICAgICAgICAgICAhaGlkZUNvcHlCdXR0b24gPyAoUmVhY3QuY3JlYXRlRWxlbWVudChUb29sVGlwLCB7IGlkOiBcImNvZGVieXRlLWNvcGllZFwiLCBhbGlnbm1lbnQ6IFwidG9wLXJpZ2h0XCIsIHRhcmdldDogUmVhY3QuY3JlYXRlRWxlbWVudChUZXh0QnV0dG9uLCB7IHZhcmlhbnQ6IFwic2Vjb25kYXJ5XCIsIG9uQ2xpY2s6IG9uQ29weUNsaWNrLCBvbkJsdXI6ICgpID0+IHNldElzQ29kZUJ5dGVDb3BpZWQoZmFsc2UpLCBcImRhdGEtdGVzdGlkXCI6IFwiY29weS1jb2RlYnl0ZS1idG5cIiB9LFxyXG4gICAgICAgICAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoQ29weUljb25TdHlsZWQsIHsgXCJhcmlhLWhpZGRlblwiOiBcInRydWVcIiB9KSxcclxuICAgICAgICAgICAgICAgICAgICBcIiBDb3B5IENvZGVieXRlXCIpIH0sIGlzQ29kZUJ5dGVDb3BpZWQgPyAoUmVhY3QuY3JlYXRlRWxlbWVudChcInNwYW5cIiwgeyBcImRhdGEtdGVzdGlkXCI6IFwiY29weS1jb25maXJtYXRpb24tdG9vbHRpcFwiLCByb2xlOiBcImFsZXJ0XCIgfSwgXCJDb3BpZWQhXCIpKSA6IChSZWFjdC5jcmVhdGVFbGVtZW50KFwic3BhblwiLCB7IFwiZGF0YS10ZXN0aWRcIjogXCJjb3B5LXByb21wdC10b29sdGlwXCIgfSwgXCJDb3B5IHRvIHlvdXIgY2xpcGJvYXJkXCIpKSkpIDogbnVsbCxcclxuICAgICAgICAgICAgUmVhY3QuY3JlYXRlRWxlbWVudChGaWxsQnV0dG9uLCB7IG9uQ2xpY2s6IGhhbmRsZVN1Ym1pdCB9LCBzdGF0dXMgPT09ICd3YWl0aW5nJyA/IFJlYWN0LmNyZWF0ZUVsZW1lbnQoU3Bpbm5lciwgbnVsbCkgOiAnUnVuJykpKSk7XHJcbn07XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPWVkaXRvci5qcy5tYXAiXX0= */"));
|
|
550
|
-
|
|
551
|
-
const CopyIconStyled = /*#__PURE__*/_styled__default["default"](gamutIcons.CopyIcon, {
|
|
552
|
-
target: "e1lzxy8e0",
|
|
553
|
-
label: "CopyIconStyled"
|
|
554
|
-
})(process.env.NODE_ENV === "production" ? {
|
|
555
|
-
name: "u7ytkp",
|
|
556
|
-
styles: "margin-right:0.5rem"
|
|
557
|
-
} : {
|
|
558
|
-
name: "u7ytkp",
|
|
559
|
-
styles: "margin-right:0.5rem",
|
|
560
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImVkaXRvci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUJ3QyIsImZpbGUiOiJlZGl0b3IudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRmlsbEJ1dHRvbiwgRmxleEJveCwgU3Bpbm5lciwgVGV4dEJ1dHRvbiwgVG9vbFRpcCwgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XHJcbmltcG9ydCB7IENvcHlJY29uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XHJcbmltcG9ydCBSZWFjdCwgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcclxuaW1wb3J0IHsgcG9zdFNuaXBwZXQgfSBmcm9tICcuL2FwaSc7XHJcbmltcG9ydCB7IERyYXdlcnMgfSBmcm9tICcuL2RyYXdlcnMnO1xyXG5pbXBvcnQgeyB0cmFja0NsaWNrIH0gZnJvbSAnLi9oZWxwZXJzJztcclxuaW1wb3J0IHsgU2ltcGxlTW9uYWNvRWRpdG9yIH0gZnJvbSAnLi9Nb25hY29FZGl0b3InO1xyXG5jb25zdCBPdXRwdXQgPSBzdHlsZWQucHJlIGBcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMTAwJTtcbiAgbWFyZ2luOiAwO1xuICBwYWRkaW5nOiAwIDFyZW07XG4gIGZvbnQtZmFtaWx5OiBNb25hY287XG4gIGZvbnQtc2l6ZTogMC44NzVyZW07XG4gIG92ZXJmbG93OiBhdXRvO1xuICAkeyh7IGhhc0Vycm9yLCB0aGVtZSB9KSA9PiBgXG4gIGNvbG9yOiAke2hhc0Vycm9yID8gdGhlbWUuY29sb3JzLm9yYW5nZSA6IHRoZW1lLmNvbG9ycy50ZXh0fTtcbiAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZS5jb2xvcnNbJ25hdnktOTAwJ119O1xuYH1cbmA7XHJcbmNvbnN0IENvcHlJY29uU3R5bGVkID0gc3R5bGVkKENvcHlJY29uKSBgXG4gIG1hcmdpbi1yaWdodDogMC41cmVtO1xuYDtcclxuY29uc3QgRE9DS0VSX1NJR1RFUk0gPSAxNDM7XHJcbmV4cG9ydCBjb25zdCBFZGl0b3IgPSAoeyBsYW5ndWFnZSwgdGV4dCwgaGlkZUNvcHlCdXR0b24sIG9uQ2hhbmdlLCBjb3B5Rm9ybWF0dGVyLCBzbmlwcGV0c0Jhc2VVcmwsIHRyYWNraW5nRGF0YSwgfSkgPT4ge1xyXG4gICAgY29uc3QgW291dHB1dCwgc2V0T3V0cHV0XSA9IHVzZVN0YXRlKCcnKTtcclxuICAgIGNvbnN0IFtzdGF0dXMsIHNldFN0YXR1c10gPSB1c2VTdGF0ZSgncmVhZHknKTtcclxuICAgIGNvbnN0IFtpc0NvZGVCeXRlQ29waWVkLCBzZXRJc0NvZGVCeXRlQ29waWVkXSA9IHVzZVN0YXRlKGZhbHNlKTtcclxuICAgIGNvbnN0IG9uQ29weUNsaWNrID0gKCkgPT4ge1xyXG4gICAgICAgIGlmICghaXNDb2RlQnl0ZUNvcGllZCkge1xyXG4gICAgICAgICAgICBuYXZpZ2F0b3IuY2xpcGJvYXJkXHJcbiAgICAgICAgICAgICAgICAud3JpdGVUZXh0KGNvcHlGb3JtYXR0ZXIgPyBjb3B5Rm9ybWF0dGVyKHsgdGV4dCwgbGFuZ3VhZ2UgfSkgOiB0ZXh0KVxyXG4gICAgICAgICAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIG5vLWNvbnNvbGVcclxuICAgICAgICAgICAgICAgIC5jYXRjaCgoKSA9PiBjb25zb2xlLmVycm9yKCdGYWlsZWQgdG8gY29weScpKTtcclxuICAgICAgICAgICAgc2V0SXNDb2RlQnl0ZUNvcGllZCh0cnVlKTtcclxuICAgICAgICAgICAgdHJhY2tDbGljaygnY29weScsIHRyYWNraW5nRGF0YSk7XHJcbiAgICAgICAgfVxyXG4gICAgfTtcclxuICAgIGNvbnN0IHNldEVycm9yU3RhdHVzQW5kT3V0cHV0ID0gKG1lc3NhZ2UpID0+IHtcclxuICAgICAgICBzZXRPdXRwdXQobWVzc2FnZSk7XHJcbiAgICAgICAgc2V0U3RhdHVzKCdlcnJvcicpO1xyXG4gICAgfTtcclxuICAgIGNvbnN0IGhhbmRsZVN1Ym1pdCA9IGFzeW5jICgpID0+IHtcclxuICAgICAgICBpZiAodGV4dC50cmltKCkubGVuZ3RoID09PSAwKSB7XHJcbiAgICAgICAgICAgIHJldHVybjtcclxuICAgICAgICB9XHJcbiAgICAgICAgY29uc3QgZGF0YSA9IHtcclxuICAgICAgICAgICAgbGFuZ3VhZ2UsXHJcbiAgICAgICAgICAgIGNvZGU6IHRleHQsXHJcbiAgICAgICAgfTtcclxuICAgICAgICBzZXRTdGF0dXMoJ3dhaXRpbmcnKTtcclxuICAgICAgICBzZXRPdXRwdXQoJycpO1xyXG4gICAgICAgIHRyYWNrQ2xpY2soJ3J1bicsIHRyYWNraW5nRGF0YSk7XHJcbiAgICAgICAgdHJ5IHtcclxuICAgICAgICAgICAgY29uc3QgcmVzcG9uc2UgPSBhd2FpdCBwb3N0U25pcHBldChkYXRhLCBzbmlwcGV0c0Jhc2VVcmwpO1xyXG4gICAgICAgICAgICBpZiAocmVzcG9uc2Uuc3RkZXJyLmxlbmd0aCA+IDApIHtcclxuICAgICAgICAgICAgICAgIHNldEVycm9yU3RhdHVzQW5kT3V0cHV0KHJlc3BvbnNlLnN0ZGVycik7XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgZWxzZSBpZiAocmVzcG9uc2UuZXhpdF9jb2RlID09PSBET0NLRVJfU0lHVEVSTSkge1xyXG4gICAgICAgICAgICAgICAgc2V0RXJyb3JTdGF0dXNBbmRPdXRwdXQoJ1lvdXIgY29kZSB0b29rIHRvbyBsb25nIHRvIHJldHVybiBhIHJlc3VsdC4gRG91YmxlIGNoZWNrIHlvdXIgY29kZSBmb3IgYW55IGlzc3VlcyBhbmQgdHJ5IGFnYWluIScpO1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgICAgIGVsc2UgaWYgKHJlc3BvbnNlLmV4aXRfY29kZSAhPT0gMCkge1xyXG4gICAgICAgICAgICAgICAgc2V0RXJyb3JTdGF0dXNBbmRPdXRwdXQoJ0FuIHVua25vd24gZXJyb3Igb2NjdXJlZC4nKTtcclxuICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICBlbHNlIHtcclxuICAgICAgICAgICAgICAgIHNldE91dHB1dChyZXNwb25zZS5zdGRvdXQpO1xyXG4gICAgICAgICAgICAgICAgc2V0U3RhdHVzKCdyZWFkeScpO1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgfVxyXG4gICAgICAgIGNhdGNoIChlcnJvcikge1xyXG4gICAgICAgICAgICBzZXRFcnJvclN0YXR1c0FuZE91dHB1dCgnRXJyb3I6ICcgKyBlcnJvcik7XHJcbiAgICAgICAgfVxyXG4gICAgfTtcclxuICAgIHJldHVybiAoUmVhY3QuY3JlYXRlRWxlbWVudChSZWFjdC5GcmFnbWVudCwgbnVsbCxcclxuICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KERyYXdlcnMsIHsgbGVmdENoaWxkOiBSZWFjdC5jcmVhdGVFbGVtZW50KFNpbXBsZU1vbmFjb0VkaXRvciwgeyB2YWx1ZTogdGV4dCwgbGFuZ3VhZ2U6IGxhbmd1YWdlLCBvbkNoYW5nZTogb25DaGFuZ2UgfSksIHJpZ2h0Q2hpbGQ6IFJlYWN0LmNyZWF0ZUVsZW1lbnQoT3V0cHV0LCB7IGhhc0Vycm9yOiBzdGF0dXMgPT09ICdlcnJvcicsIFwiYXJpYS1saXZlXCI6IFwicG9saXRlXCIgfSwgb3V0cHV0KSB9KSxcclxuICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KEZsZXhCb3gsIHsganVzdGlmeUNvbnRlbnQ6IGhpZGVDb3B5QnV0dG9uID8gJ2ZsZXgtZW5kJyA6ICdzcGFjZS1iZXR3ZWVuJywgcGw6IDggfSxcclxuICAgICAgICAgICAgIWhpZGVDb3B5QnV0dG9uID8gKFJlYWN0LmNyZWF0ZUVsZW1lbnQoVG9vbFRpcCwgeyBpZDogXCJjb2RlYnl0ZS1jb3BpZWRcIiwgYWxpZ25tZW50OiBcInRvcC1yaWdodFwiLCB0YXJnZXQ6IFJlYWN0LmNyZWF0ZUVsZW1lbnQoVGV4dEJ1dHRvbiwgeyB2YXJpYW50OiBcInNlY29uZGFyeVwiLCBvbkNsaWNrOiBvbkNvcHlDbGljaywgb25CbHVyOiAoKSA9PiBzZXRJc0NvZGVCeXRlQ29waWVkKGZhbHNlKSwgXCJkYXRhLXRlc3RpZFwiOiBcImNvcHktY29kZWJ5dGUtYnRuXCIgfSxcclxuICAgICAgICAgICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KENvcHlJY29uU3R5bGVkLCB7IFwiYXJpYS1oaWRkZW5cIjogXCJ0cnVlXCIgfSksXHJcbiAgICAgICAgICAgICAgICAgICAgXCIgQ29weSBDb2RlYnl0ZVwiKSB9LCBpc0NvZGVCeXRlQ29waWVkID8gKFJlYWN0LmNyZWF0ZUVsZW1lbnQoXCJzcGFuXCIsIHsgXCJkYXRhLXRlc3RpZFwiOiBcImNvcHktY29uZmlybWF0aW9uLXRvb2x0aXBcIiwgcm9sZTogXCJhbGVydFwiIH0sIFwiQ29waWVkIVwiKSkgOiAoUmVhY3QuY3JlYXRlRWxlbWVudChcInNwYW5cIiwgeyBcImRhdGEtdGVzdGlkXCI6IFwiY29weS1wcm9tcHQtdG9vbHRpcFwiIH0sIFwiQ29weSB0byB5b3VyIGNsaXBib2FyZFwiKSkpKSA6IG51bGwsXHJcbiAgICAgICAgICAgIFJlYWN0LmNyZWF0ZUVsZW1lbnQoRmlsbEJ1dHRvbiwgeyBvbkNsaWNrOiBoYW5kbGVTdWJtaXQgfSwgc3RhdHVzID09PSAnd2FpdGluZycgPyBSZWFjdC5jcmVhdGVFbGVtZW50KFNwaW5uZXIsIG51bGwpIDogJ1J1bicpKSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1lZGl0b3IuanMubWFwIl19 */",
|
|
561
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
562
|
-
});
|
|
563
|
-
|
|
564
|
-
const DOCKER_SIGTERM = 143;
|
|
565
|
-
const Editor = ({
|
|
566
|
-
language,
|
|
567
|
-
text,
|
|
568
|
-
hideCopyButton,
|
|
569
|
-
onChange,
|
|
570
|
-
copyFormatter,
|
|
571
|
-
snippetsBaseUrl,
|
|
572
|
-
trackingData
|
|
573
|
-
}) => {
|
|
574
|
-
const [output, setOutput] = React.useState('');
|
|
575
|
-
const [status, setStatus] = React.useState('ready');
|
|
576
|
-
const [isCodeByteCopied, setIsCodeByteCopied] = React.useState(false);
|
|
577
|
-
|
|
578
|
-
const onCopyClick = () => {
|
|
579
|
-
if (!isCodeByteCopied) {
|
|
580
|
-
navigator.clipboard.writeText(copyFormatter ? copyFormatter({
|
|
581
|
-
text,
|
|
582
|
-
language
|
|
583
|
-
}) : text) // eslint-disable-next-line no-console
|
|
584
|
-
.catch(() => console.error('Failed to copy'));
|
|
585
|
-
setIsCodeByteCopied(true);
|
|
586
|
-
trackClick('copy', trackingData);
|
|
587
|
-
}
|
|
588
|
-
};
|
|
589
|
-
|
|
590
|
-
const setErrorStatusAndOutput = message => {
|
|
591
|
-
setOutput(message);
|
|
592
|
-
setStatus('error');
|
|
593
|
-
};
|
|
594
|
-
|
|
595
|
-
const handleSubmit = _async(function () {
|
|
596
|
-
if (text.trim().length === 0) {
|
|
597
|
-
return;
|
|
598
|
-
}
|
|
599
|
-
|
|
600
|
-
const data = {
|
|
601
|
-
language,
|
|
602
|
-
code: text
|
|
603
|
-
};
|
|
604
|
-
setStatus('waiting');
|
|
605
|
-
setOutput('');
|
|
606
|
-
trackClick('run', trackingData);
|
|
607
|
-
return _continueIgnored(_catch(function () {
|
|
608
|
-
return _await(postSnippet(data, snippetsBaseUrl), function (response) {
|
|
609
|
-
if (response.stderr.length > 0) {
|
|
610
|
-
setErrorStatusAndOutput(response.stderr);
|
|
611
|
-
} else if (response.exit_code === DOCKER_SIGTERM) {
|
|
612
|
-
setErrorStatusAndOutput('Your code took too long to return a result. Double check your code for any issues and try again!');
|
|
613
|
-
} else if (response.exit_code !== 0) {
|
|
614
|
-
setErrorStatusAndOutput('An unknown error occured.');
|
|
615
|
-
} else {
|
|
616
|
-
setOutput(response.stdout);
|
|
617
|
-
setStatus('ready');
|
|
618
|
-
}
|
|
619
|
-
});
|
|
620
|
-
}, function (error) {
|
|
621
|
-
setErrorStatusAndOutput('Error: ' + error);
|
|
622
|
-
}));
|
|
623
|
-
});
|
|
624
|
-
|
|
625
|
-
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Drawers, {
|
|
626
|
-
leftChild: /*#__PURE__*/React__default["default"].createElement(SimpleMonacoEditor, {
|
|
627
|
-
value: text,
|
|
628
|
-
language: language,
|
|
629
|
-
onChange: onChange
|
|
630
|
-
}),
|
|
631
|
-
rightChild: /*#__PURE__*/React__default["default"].createElement(Output, {
|
|
632
|
-
hasError: status === 'error',
|
|
633
|
-
"aria-live": "polite"
|
|
634
|
-
}, output)
|
|
635
|
-
}), /*#__PURE__*/React__default["default"].createElement(gamut.FlexBox, {
|
|
636
|
-
justifyContent: hideCopyButton ? 'flex-end' : 'space-between',
|
|
637
|
-
pl: 8
|
|
638
|
-
}, !hideCopyButton ? /*#__PURE__*/React__default["default"].createElement(gamut.ToolTip, {
|
|
639
|
-
id: "codebyte-copied",
|
|
640
|
-
alignment: "top-right",
|
|
641
|
-
target: /*#__PURE__*/React__default["default"].createElement(gamut.TextButton, {
|
|
642
|
-
variant: "secondary",
|
|
643
|
-
onClick: onCopyClick,
|
|
644
|
-
onBlur: () => setIsCodeByteCopied(false),
|
|
645
|
-
"data-testid": "copy-codebyte-btn"
|
|
646
|
-
}, /*#__PURE__*/React__default["default"].createElement(CopyIconStyled, {
|
|
647
|
-
"aria-hidden": "true"
|
|
648
|
-
}), " Copy Codebyte")
|
|
649
|
-
}, isCodeByteCopied ? /*#__PURE__*/React__default["default"].createElement("span", {
|
|
650
|
-
"data-testid": "copy-confirmation-tooltip",
|
|
651
|
-
role: "alert"
|
|
652
|
-
}, "Copied!") : /*#__PURE__*/React__default["default"].createElement("span", {
|
|
653
|
-
"data-testid": "copy-prompt-tooltip"
|
|
654
|
-
}, "Copy to your clipboard")) : null, /*#__PURE__*/React__default["default"].createElement(gamut.FillButton, {
|
|
655
|
-
onClick: handleSubmit
|
|
656
|
-
}, status === 'waiting' ? /*#__PURE__*/React__default["default"].createElement(gamut.Spinner, null) : 'Run')));
|
|
657
|
-
};
|
|
658
|
-
|
|
659
|
-
const useIntersection = (ref, options) => {
|
|
660
|
-
const [intersectionObserverEntry, setIntersectionObserverEntry] = React.useState(null);
|
|
661
|
-
React.useEffect(() => {
|
|
662
|
-
if (ref.current && typeof IntersectionObserver === 'function') {
|
|
663
|
-
const handler = entries => {
|
|
664
|
-
setIntersectionObserverEntry(entries[0]);
|
|
665
|
-
};
|
|
666
|
-
|
|
667
|
-
const observer = new IntersectionObserver(handler, {
|
|
668
|
-
threshold: options.threshold,
|
|
669
|
-
root: options.root,
|
|
670
|
-
rootMargin: options.rootMargin
|
|
671
|
-
});
|
|
672
|
-
observer.observe(ref.current);
|
|
673
|
-
return () => {
|
|
674
|
-
setIntersectionObserverEntry(null);
|
|
675
|
-
observer.disconnect();
|
|
676
|
-
};
|
|
677
|
-
} // eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
return () => {};
|
|
681
|
-
}, [ref, options.threshold, options.root, options.rootMargin]);
|
|
682
|
-
return intersectionObserverEntry;
|
|
683
|
-
};
|
|
684
|
-
|
|
685
|
-
// will determine the amount of the element that needs to come into the viewport
|
|
686
|
-
// before the useEverInView hook is triggered. The rootMargin will determine the
|
|
687
|
-
// size of the root element's bounding box.
|
|
688
|
-
// https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#intersection_observer_options
|
|
689
|
-
|
|
690
|
-
const useEverInView = (rootMargin = '0px', threshold = 0.2) => {
|
|
691
|
-
const ref = React.useRef(null);
|
|
692
|
-
const [everInView, setEverInView] = React.useState(false);
|
|
693
|
-
const intersection = useIntersection(ref, {
|
|
694
|
-
root: null,
|
|
695
|
-
rootMargin,
|
|
696
|
-
threshold
|
|
697
|
-
});
|
|
698
|
-
const inView = intersection == null ? void 0 : intersection.isIntersecting;
|
|
699
|
-
React.useEffect(() => {
|
|
700
|
-
if (inView) {
|
|
701
|
-
setEverInView(true);
|
|
702
|
-
}
|
|
703
|
-
}, [inView]);
|
|
704
|
-
return {
|
|
705
|
-
everInView: Boolean(everInView || inView),
|
|
706
|
-
ref
|
|
707
|
-
};
|
|
708
|
-
};
|
|
709
|
-
|
|
710
|
-
const LanguageSelection = ({
|
|
711
|
-
onChange
|
|
712
|
-
}) => {
|
|
713
|
-
return /*#__PURE__*/React__default["default"].createElement(gamutStyles.ColorMode, {
|
|
714
|
-
mode: "dark",
|
|
715
|
-
flex: 1,
|
|
716
|
-
px: 16,
|
|
717
|
-
pt: 48
|
|
718
|
-
}, /*#__PURE__*/React__default["default"].createElement(gamut.Text, {
|
|
719
|
-
mb: 16
|
|
720
|
-
}, "Which language do you want to code in?"), /*#__PURE__*/React__default["default"].createElement(gamut.Select, {
|
|
721
|
-
id: "language-select",
|
|
722
|
-
"aria-label": "Select a language",
|
|
723
|
-
options: LanguageOptions,
|
|
724
|
-
onChange: e => onChange(e.target.value)
|
|
725
|
-
}));
|
|
726
|
-
};
|
|
727
|
-
|
|
728
|
-
const _excluded = ["text", "language", "hideCopyButton", "snippetsBaseUrl", "onEdit", "onLanguageChange", "copyFormatter", "trackingData", "trackFirstEdit"];
|
|
729
|
-
const editorBaseStyles = gamutStyles.system.css({
|
|
730
|
-
border: 1,
|
|
731
|
-
borderColor: 'gray-900',
|
|
732
|
-
display: 'flex',
|
|
733
|
-
flexDirection: 'column',
|
|
734
|
-
minHeight: '25rem'
|
|
735
|
-
});
|
|
736
|
-
|
|
737
|
-
const EditorContainer = /*#__PURE__*/_styled__default["default"](gamutStyles.Background, {
|
|
738
|
-
target: "e1epka4g0",
|
|
739
|
-
label: "EditorContainer"
|
|
740
|
-
})(editorBaseStyles, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNvZGVCeXRlRWRpdG9yLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQndCIiwiZmlsZSI6ImNvZGVCeXRlRWRpdG9yLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgSWNvbkJ1dHRvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcclxuaW1wb3J0IHsgRmF2aWNvbkljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XHJcbmltcG9ydCB7IEJhY2tncm91bmQsIHN5c3RlbSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IFJlYWN0LCB7IHVzZUVmZmVjdCwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XHJcbmltcG9ydCB7IGhlbGxvV29ybGQgfSBmcm9tICcuL2NvbnN0cyc7XHJcbmltcG9ydCB7IEVkaXRvciB9IGZyb20gJy4vZWRpdG9yJztcclxuaW1wb3J0IHsgdHJhY2tDbGljayB9IGZyb20gJy4vaGVscGVycyc7XHJcbmltcG9ydCB7IHVzZUV2ZXJJblZpZXcgfSBmcm9tICcuL2hlbHBlcnMvdXNlRXZlckluVmlldyc7XHJcbmltcG9ydCB7IExhbmd1YWdlU2VsZWN0aW9uIH0gZnJvbSAnLi9sYW5ndWFnZVNlbGVjdGlvbic7XHJcbmltcG9ydCB7IHRyYWNrVXNlckltcHJlc3Npb24gfSBmcm9tICcuL2xpYnMvZXZlbnRUcmFja2luZyc7XHJcbmNvbnN0IGVkaXRvckJhc2VTdHlsZXMgPSBzeXN0ZW0uY3NzKHtcclxuICAgIGJvcmRlcjogMSxcclxuICAgIGJvcmRlckNvbG9yOiAnZ3JheS05MDAnLFxyXG4gICAgZGlzcGxheTogJ2ZsZXgnLFxyXG4gICAgZmxleERpcmVjdGlvbjogJ2NvbHVtbicsXHJcbiAgICBtaW5IZWlnaHQ6ICcyNXJlbScsXHJcbn0pO1xyXG5jb25zdCBFZGl0b3JDb250YWluZXIgPSBzdHlsZWQoQmFja2dyb3VuZCkoZWRpdG9yQmFzZVN0eWxlcyk7XHJcbmV4cG9ydCBjb25zdCBDb2RlQnl0ZUVkaXRvciA9ICh7IHRleHQ6IGluaXRpYWxUZXh0LCBsYW5ndWFnZTogaW5pdGlhbExhbmd1YWdlLCBoaWRlQ29weUJ1dHRvbiA9IGZhbHNlLCBzbmlwcGV0c0Jhc2VVcmwsIG9uRWRpdCwgb25MYW5ndWFnZUNoYW5nZSwgY29weUZvcm1hdHRlciwgdHJhY2tpbmdEYXRhLCB0cmFja0ZpcnN0RWRpdCA9IGZhbHNlLCAuLi5yZXN0IH0pID0+IHtcclxuICAgIGNvbnN0IHsgZXZlckluVmlldywgcmVmIH0gPSB1c2VFdmVySW5WaWV3KCk7XHJcbiAgICBjb25zdCBnZXRJbml0aWFsVGV4dCA9ICgpID0+IHtcclxuICAgICAgICBpZiAoaW5pdGlhbFRleHQgIT09IHVuZGVmaW5lZClcclxuICAgICAgICAgICAgcmV0dXJuIGluaXRpYWxUZXh0O1xyXG4gICAgICAgIHJldHVybiBpbml0aWFsTGFuZ3VhZ2UgPyBoZWxsb1dvcmxkW2luaXRpYWxMYW5ndWFnZV0gOiAnJztcclxuICAgIH07XHJcbiAgICBjb25zdCBbdGV4dCwgc2V0VGV4dF0gPSB1c2VTdGF0ZShnZXRJbml0aWFsVGV4dCgpKTtcclxuICAgIGNvbnN0IFtsYW5ndWFnZSwgc2V0TGFuZ3VhZ2VdID0gdXNlU3RhdGUoaW5pdGlhbExhbmd1YWdlID8/ICcnKTtcclxuICAgIGNvbnN0IFtoYXNCZWVuRWRpdGVkLCBzZXRIYXNCZWVuRWRpdGVkXSA9IHVzZVN0YXRlKGZhbHNlKTtcclxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XHJcbiAgICAgICAgaWYgKGV2ZXJJblZpZXcpIHtcclxuICAgICAgICAgICAgdHJhY2tVc2VySW1wcmVzc2lvbih7XHJcbiAgICAgICAgICAgICAgICBwYWdlX25hbWU6IHRyYWNraW5nRGF0YT8ucGFnZV9uYW1lID8/ICdVbmtub3duJyxcclxuICAgICAgICAgICAgICAgIGNvbnRleHQ6IHRyYWNraW5nRGF0YT8uY29udGV4dCA/PyBkb2N1bWVudC5yZWZlcnJlcixcclxuICAgICAgICAgICAgICAgIHRhcmdldDogJ2NvZGVieXRlJyxcclxuICAgICAgICAgICAgfSk7XHJcbiAgICAgICAgfVxyXG4gICAgfSwgW2V2ZXJJblZpZXcsIHRyYWNraW5nRGF0YV0pO1xyXG4gICAgcmV0dXJuIChSZWFjdC5jcmVhdGVFbGVtZW50KEVkaXRvckNvbnRhaW5lciwgeyBiZzogXCJibGFja1wiLCBtYXhXaWR0aDogXCI0M3JlbVwiLCAuLi5yZXN0LCBvdmVyZmxvdzogXCJoaWRkZW5cIiwgcmVmOiByZWYgfSxcclxuICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KEJveCwgeyBib3JkZXJCb3R0b206IDEsIGJvcmRlckNvbG9yOiBcImdyYXktOTAwXCIsIHB5OiA0LCBwbDogOCB9LFxyXG4gICAgICAgICAgICBSZWFjdC5jcmVhdGVFbGVtZW50KEljb25CdXR0b24sIHsgaWNvbjogRmF2aWNvbkljb24sIHZhcmlhbnQ6IFwic2Vjb25kYXJ5XCIsIGhyZWY6IFwiaHR0cHM6Ly93d3cuY29kZWNhZGVteS5jb20vXCIsIHRhcmdldDogXCJfYmxhbmtcIiwgcmVsOiBcIm5vcmVmZXJyZXJcIiwgXCJhcmlhLWxhYmVsXCI6IFwidmlzaXQgY29kZWNhZGVteS5jb21cIiwgb25DbGljazogKCkgPT4gdHJhY2tDbGljaygnbG9nbycsIHRyYWNraW5nRGF0YSkgfSkpLFxyXG4gICAgICAgIGxhbmd1YWdlID8gKFJlYWN0LmNyZWF0ZUVsZW1lbnQoRWRpdG9yLCB7IGxhbmd1YWdlOiBsYW5ndWFnZSwgdGV4dDogdGV4dCwgaGlkZUNvcHlCdXR0b246IGhpZGVDb3B5QnV0dG9uLCBvbkNoYW5nZTogKG5ld1RleHQpID0+IHtcclxuICAgICAgICAgICAgICAgIHNldFRleHQobmV3VGV4dCk7XHJcbiAgICAgICAgICAgICAgICBvbkVkaXQ/LihuZXdUZXh0LCBsYW5ndWFnZSk7XHJcbiAgICAgICAgICAgICAgICBpZiAodHJhY2tGaXJzdEVkaXQgJiYgaGFzQmVlbkVkaXRlZCA9PT0gZmFsc2UpIHtcclxuICAgICAgICAgICAgICAgICAgICBzZXRIYXNCZWVuRWRpdGVkKHRydWUpO1xyXG4gICAgICAgICAgICAgICAgICAgIHRyYWNrQ2xpY2soJ2VkaXQnLCB0cmFja2luZ0RhdGEpO1xyXG4gICAgICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICB9LCBzbmlwcGV0c0Jhc2VVcmw6IHNuaXBwZXRzQmFzZVVybCwgY29weUZvcm1hdHRlcjogY29weUZvcm1hdHRlciwgdHJhY2tpbmdEYXRhOiB0cmFja2luZ0RhdGEgfSkpIDogKFJlYWN0LmNyZWF0ZUVsZW1lbnQoTGFuZ3VhZ2VTZWxlY3Rpb24sIHsgb25DaGFuZ2U6IChuZXdMYW5ndWFnZSkgPT4ge1xyXG4gICAgICAgICAgICAgICAgY29uc3QgbmV3VGV4dCA9IHRleHQgfHwgKG5ld0xhbmd1YWdlID8gaGVsbG9Xb3JsZFtuZXdMYW5ndWFnZV0gOiAnJyk7XHJcbiAgICAgICAgICAgICAgICBzZXRMYW5ndWFnZShuZXdMYW5ndWFnZSk7XHJcbiAgICAgICAgICAgICAgICBzZXRUZXh0KG5ld1RleHQpO1xyXG4gICAgICAgICAgICAgICAgdHJhY2tDbGljaygnbGFuZ19zZWxlY3QnLCB0cmFja2luZ0RhdGEpO1xyXG4gICAgICAgICAgICAgICAgb25MYW5ndWFnZUNoYW5nZT8uKG5ld1RleHQsIG5ld0xhbmd1YWdlKTtcclxuICAgICAgICAgICAgfSB9KSkpKTtcclxufTtcclxuZXhwb3J0IGRlZmF1bHQgQ29kZUJ5dGVFZGl0b3I7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPWNvZGVCeXRlRWRpdG9yLmpzLm1hcCJdfQ== */");
|
|
741
|
-
|
|
742
|
-
const CodeByteEditor = _ref => {
|
|
743
|
-
let {
|
|
744
|
-
text: initialText,
|
|
745
|
-
language: initialLanguage,
|
|
746
|
-
hideCopyButton = false,
|
|
747
|
-
snippetsBaseUrl,
|
|
748
|
-
onEdit,
|
|
749
|
-
onLanguageChange,
|
|
750
|
-
copyFormatter,
|
|
751
|
-
trackingData,
|
|
752
|
-
trackFirstEdit = false
|
|
753
|
-
} = _ref,
|
|
754
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
755
|
-
|
|
756
|
-
const {
|
|
757
|
-
everInView,
|
|
758
|
-
ref
|
|
759
|
-
} = useEverInView();
|
|
760
|
-
|
|
761
|
-
const getInitialText = () => {
|
|
762
|
-
if (initialText !== undefined) return initialText;
|
|
763
|
-
return initialLanguage ? helloWorld[initialLanguage] : '';
|
|
764
|
-
};
|
|
765
|
-
|
|
766
|
-
const [text, setText] = React.useState(getInitialText());
|
|
767
|
-
const [language, setLanguage] = React.useState(initialLanguage != null ? initialLanguage : '');
|
|
768
|
-
const [hasBeenEdited, setHasBeenEdited] = React.useState(false);
|
|
769
|
-
React.useEffect(() => {
|
|
770
|
-
if (everInView) {
|
|
771
|
-
var _trackingData$page_na, _trackingData$context;
|
|
772
|
-
|
|
773
|
-
trackUserImpression({
|
|
774
|
-
page_name: (_trackingData$page_na = trackingData == null ? void 0 : trackingData.page_name) != null ? _trackingData$page_na : 'Unknown',
|
|
775
|
-
context: (_trackingData$context = trackingData == null ? void 0 : trackingData.context) != null ? _trackingData$context : document.referrer,
|
|
776
|
-
target: 'codebyte'
|
|
777
|
-
});
|
|
778
|
-
}
|
|
779
|
-
}, [everInView, trackingData]);
|
|
780
|
-
return /*#__PURE__*/React__default["default"].createElement(EditorContainer, _extends({
|
|
781
|
-
bg: "black",
|
|
782
|
-
maxWidth: "43rem"
|
|
783
|
-
}, rest, {
|
|
784
|
-
overflow: "hidden",
|
|
785
|
-
ref: ref
|
|
786
|
-
}), /*#__PURE__*/React__default["default"].createElement(gamut.Box, {
|
|
787
|
-
borderBottom: 1,
|
|
788
|
-
borderColor: "gray-900",
|
|
789
|
-
py: 4,
|
|
790
|
-
pl: 8
|
|
791
|
-
}, /*#__PURE__*/React__default["default"].createElement(gamut.IconButton, {
|
|
792
|
-
icon: gamutIcons.FaviconIcon,
|
|
793
|
-
variant: "secondary",
|
|
794
|
-
href: "https://www.codecademy.com/",
|
|
795
|
-
target: "_blank",
|
|
796
|
-
rel: "noreferrer",
|
|
797
|
-
"aria-label": "visit codecademy.com",
|
|
798
|
-
onClick: () => trackClick('logo', trackingData)
|
|
799
|
-
})), language ? /*#__PURE__*/React__default["default"].createElement(Editor, {
|
|
800
|
-
language: language,
|
|
801
|
-
text: text,
|
|
802
|
-
hideCopyButton: hideCopyButton,
|
|
803
|
-
onChange: newText => {
|
|
804
|
-
setText(newText);
|
|
805
|
-
onEdit == null ? void 0 : onEdit(newText, language);
|
|
806
|
-
|
|
807
|
-
if (trackFirstEdit && hasBeenEdited === false) {
|
|
808
|
-
setHasBeenEdited(true);
|
|
809
|
-
trackClick('edit', trackingData);
|
|
810
|
-
}
|
|
811
|
-
},
|
|
812
|
-
snippetsBaseUrl: snippetsBaseUrl,
|
|
813
|
-
copyFormatter: copyFormatter,
|
|
814
|
-
trackingData: trackingData
|
|
815
|
-
}) : /*#__PURE__*/React__default["default"].createElement(LanguageSelection, {
|
|
816
|
-
onChange: newLanguage => {
|
|
817
|
-
const newText = text || (newLanguage ? helloWorld[newLanguage] : '');
|
|
818
|
-
setLanguage(newLanguage);
|
|
819
|
-
setText(newText);
|
|
820
|
-
trackClick('lang_select', trackingData);
|
|
821
|
-
onLanguageChange == null ? void 0 : onLanguageChange(newText, newLanguage);
|
|
822
|
-
}
|
|
823
|
-
}));
|
|
824
|
-
};
|
|
825
|
-
|
|
826
|
-
exports.CodeByteEditor = CodeByteEditor;
|
|
827
|
-
exports.LanguageOptions = LanguageOptions;
|
|
828
|
-
exports.helloWorld = helloWorld;
|
|
829
|
-
exports.validLanguages = validLanguages;
|