diff --git a/.gitpod.yml b/.gitpod.yml new file mode 100644 index 00000000..c7f5787f --- /dev/null +++ b/.gitpod.yml @@ -0,0 +1,9 @@ +# This configuration file was automatically generated by Gitpod. +# Please adjust to your needs (see https://www.gitpod.io/docs/config-gitpod-file) +# and commit this file to your remote git repository to share the goodness with others. + +tasks: + - init: npm install && npm run build + command: npm run dev + + diff --git a/apps/docs/components/Code/CodeEditor/index.tsx b/apps/docs/components/Code/CodeEditor/index.tsx index 36e76fcc..293ce564 100644 --- a/apps/docs/components/Code/CodeEditor/index.tsx +++ b/apps/docs/components/Code/CodeEditor/index.tsx @@ -52,5 +52,3 @@ type Props = { code: string; }; export default React.memo(CodeEditor); - - diff --git a/apps/docs/components/Code/CodeEditor/monaco/MonacoCodeEditor.tsx b/apps/docs/components/Code/CodeEditor/monaco/MonacoCodeEditor.tsx new file mode 100644 index 00000000..ca2ce5aa --- /dev/null +++ b/apps/docs/components/Code/CodeEditor/monaco/MonacoCodeEditor.tsx @@ -0,0 +1,55 @@ +import * as React from "react"; +import { OnChange } from "@monaco-editor/react"; +import monacoOptions from "./options"; +import Editor from "@monaco-editor/react"; +import { bhailangConfig, bhailangSyntax } from "./monacoBhailang"; +import { useMonaco } from "@monaco-editor/react"; +import { + reservedValueCompletions, + keywordCompletions, + snippetCompletions, +} from "./completions"; +import { theme } from "./theme"; + +interface Props { + handleChange: OnChange; + code: string; +} + +const MonacoCodeEditor = (props: Props) => { + const monaco = useMonaco(); + React.useEffect(() => { + if (monaco) { + monaco.languages.register({ id: "bhailang" }); + monaco.languages.setMonarchTokensProvider("bhailang", bhailangSyntax); + monaco.languages.setLanguageConfiguration("bhailang", bhailangConfig); + monaco.languages.registerCompletionItemProvider("bhailang", { + provideCompletionItems: () => { + var suggestions = [ + ...keywordCompletions(monaco), + ...snippetCompletions(monaco), + ...reservedValueCompletions(monaco), + ]; + return { suggestions: suggestions }; + }, + }); + monaco.editor.defineTheme("my-theme", theme); + monaco.editor.setTheme("my-theme"); + } + }, [monaco]); + + return ( +
+ +
+ ); +}; + +export default React.memo(MonacoCodeEditor); diff --git a/apps/docs/components/Code/CodeEditor/monaco/completions.ts b/apps/docs/components/Code/CodeEditor/monaco/completions.ts new file mode 100644 index 00000000..4701e7b3 --- /dev/null +++ b/apps/docs/components/Code/CodeEditor/monaco/completions.ts @@ -0,0 +1,72 @@ +import { bhailangKeywords } from "./monacoBhailang"; +import M from "monaco-editor"; + +export const keywordCompletions = (monaco: typeof M) => + bhailangKeywords.map((keyword) => ({ + label: keyword, + kind: monaco.languages.CompletionItemKind.Keyword, + insertText: keyword, + })); + +export const snippetCompletions = (monaco: typeof M) => [ + { + label: "byh", + kind: monaco.languages.CompletionItemKind.Snippet, + insertText: "bhai ye hai ${1:varname} = ${0:value};", + insertTextRules: + monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet, + documentation: "Variable banata hai bhai", + }, + { + label: "bb", + kind: monaco.languages.CompletionItemKind.Snippet, + insertText: 'bol bhai ${1:"Kuch to bol bhai"};', + insertTextRules: + monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet, + documentation: "Bolega bhai", + }, + { + label: "agb", + kind: monaco.languages.CompletionItemKind.Snippet, + insertText: ["agar bhai (${1:condition}) {", "\t$0", "}"].join("\n"), + insertTextRules: + monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet, + documentation: "If statement", + }, + { + label: "ntb", + kind: monaco.languages.CompletionItemKind.Snippet, + insertText: ["nahi to bhai (${1:condition}) {", "\t$0", "}"].join("\n"), + insertTextRules: + monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet, + documentation: "Elseif block", + }, + { + label: "wb", + kind: monaco.languages.CompletionItemKind.Snippet, + insertText: ["warna bhai {", "\t$0", "}"].join("\n"), + insertTextRules: + monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet, + documentation: "Else block", + }, + { + label: "jtb", + kind: monaco.languages.CompletionItemKind.Snippet, + insertText: [ + "jab tak bhai (${1:condition}) {", + "\t${0:// kuch kar bhai}", + "}", + ].join("\n"), + insertTextRules: + monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet, + documentation: "If-Else Statement", + }, +]; + +export const reservedValueCompletions = (monaco: typeof M) => [ + ...["sahi", "galat", "nalla"].map((b) => ({ + label: b, + kind: monaco.languages.CompletionItemKind.Value, + insertText: b, + })), +]; diff --git a/apps/docs/components/Code/CodeEditor/monaco/monacoBhailang.ts b/apps/docs/components/Code/CodeEditor/monaco/monacoBhailang.ts new file mode 100644 index 00000000..7976991d --- /dev/null +++ b/apps/docs/components/Code/CodeEditor/monaco/monacoBhailang.ts @@ -0,0 +1,230 @@ +import monaco from "monaco-editor"; + +export const bhailangKeywords = + "hi|bye|bol|bhai|agar|nahi|to|warna|jab|tak|bas|kar|hai|agla|dekh|ye".split( + "|" + ); + +export const bhailangSyntax: monaco.languages.IMonarchLanguage = { + // Set defaultToken to invalid to see what you do not tokenize yet + defaultToken: "invalid", + tokenPostfix: ".bhai", + + keywords: bhailangKeywords, + + typeKeywords: ["any", "boolean", "number", "object", "string", "nalla"], + + operators: [ + "<=", + ">=", + "==", + "!=", + "===", + "!==", + "=>", + "+", + "-", + "**", + "*", + "/", + "%", + "++", + "--", + "<<", + ">", + ">>>", + "&", + "|", + "^", + "!", + "~", + "&&", + "||", + "?", + ":", + "=", + "+=", + "-=", + "*=", + "**=", + "/=", + "%=", + "<<=", + ">>=", + ">>>=", + "&=", + "|=", + "^=", + "@", + ], + + // we include these common regular expressions + symbols: /[=>](?!@symbols)/, "@brackets"], + [ + /@symbols/, + { + cases: { + "@operators": "delimiter", + "@default": "", + }, + }, + ], + + // numbers + [/(@digits)[eE]([\-+]?(@digits))?/, "number.float"], + [/(@digits)\.(@digits)([eE][\-+]?(@digits))?/, "number.float"], + [/0[xX](@hexdigits)/, "number.hex"], + [/0[oO]?(@octaldigits)/, "number.octal"], + [/0[bB](@binarydigits)/, "number.binary"], + [/(@digits)/, "number"], + + // delimiter: after number because of .\d floats + [/[;,.]/, "delimiter"], + + // strings + [/"([^"\\]|\\.)*$/, "string.invalid"], // non-teminated string + [/'([^'\\]|\\.)*$/, "string.invalid"], // non-teminated string + [/"/, "string", "@string_double"], + [/'/, "string", "@string_single"], + [/`/, "string", "@string_backtick"], + ], + + whitespace: [ + [/[ \t\r\n]+/, ""], + [/\/\*\*(?!\/)/, "comment.doc", "@jsdoc"], + [/\/\*/, "comment", "@comment"], + [/\/\/.*$/, "comment"], + ], + + comment: [ + // [/[^\/*]+/, "comment"], + [/((\n*.*)*)(.*)hi bhai/, "comment"], + [/\*\//, "comment", "@pop"], + [/[\/*]/, "comment"], + ], + + jsdoc: [ + [/[^\/*]+/, "comment.doc"], + [/\*\//, "comment.doc", "@pop"], + [/[\/*]/, "comment.doc"], + ], + + // We match regular expression quite precisely + regexp: [ + [ + /(\{)(\d+(?:,\d*)?)(\})/, + [ + "regexp.escape.control", + "regexp.escape.control", + "regexp.escape.control", + ], + ], + [/(\()(\?:|\?=|\?!)/, ["regexp.escape.control", "regexp.escape.control"]], + [/[()]/, "regexp.escape.control"], + [/@regexpctl/, "regexp.escape.control"], + [/[^\\\/]/, "regexp"], + [/@regexpesc/, "regexp.escape"], + [/\\\./, "regexp.invalid"], + ], + + regexrange: [ + [/-/, "regexp.escape.control"], + [/\^/, "regexp.invalid"], + [/@regexpesc/, "regexp.escape"], + [/[^\]]/, "regexp"], + [ + /\]/, + { token: "regexp.escape.control", next: "@pop", bracket: "@close" }, + ], + ], + + string_double: [ + [/[^\\"]+/, "string"], + [/@escapes/, "string.escape"], + [/\\./, "string.escape.invalid"], + [/"/, "string", "@pop"], + ], + + string_single: [ + [/[^\\']+/, "string"], + [/@escapes/, "string.escape"], + [/\\./, "string.escape.invalid"], + [/'/, "string", "@pop"], + ], + + string_backtick: [ + [/\$\{/, { token: "delimiter.bracket", next: "@bracketCounting" }], + [/[^\\`$]+/, "string"], + [/@escapes/, "string.escape"], + [/\\./, "string.escape.invalid"], + [/`/, "string", "@pop"], + ], + + bracketCounting: [ + [/\{/, "delimiter.bracket", "@bracketCounting"], + [/\}/, "delimiter.bracket", "@pop"], + { include: "common" }, + ], + }, +}; + +export const bhailangConfig: monaco.languages.LanguageConfiguration = { + surroundingPairs: [ + { open: "{", close: "}" }, + { open: "[", close: "]" }, + { open: "(", close: ")" }, + { open: "<", close: ">" }, + { open: "'", close: "'" }, + { open: '"', close: '"' }, + ], + autoClosingPairs: [ + { open: "{", close: "}" }, + { open: "[", close: "]" }, + { open: "(", close: ")" }, + { open: "'", close: "'", notIn: ["string", "comment"] }, + { open: '"', close: '"', notIn: ["string", "comment"] }, + ], +}; diff --git a/apps/docs/components/Code/CodeEditor/monaco/options.ts b/apps/docs/components/Code/CodeEditor/monaco/options.ts new file mode 100644 index 00000000..8296e0df --- /dev/null +++ b/apps/docs/components/Code/CodeEditor/monaco/options.ts @@ -0,0 +1,18 @@ +import { editor } from "monaco-editor"; + +const options: editor.IStandaloneEditorConstructionOptions = { + automaticLayout: true, + padding: { top: 16, bottom: 16 }, + tabSize: 2, + autoClosingQuotes: "always", + fontFamily: "Jetbrains Mono", + fontLigatures: true, + fontSize: 14, + lineHeight: 32, + suggestLineHeight: 32, + cursorSmoothCaretAnimation: true, + scrollBeyondLastLine: false, + smoothScrolling: true, +}; + +export default options; diff --git a/apps/docs/components/Code/CodeEditor/monaco/theme.ts b/apps/docs/components/Code/CodeEditor/monaco/theme.ts new file mode 100644 index 00000000..a21d4cbc --- /dev/null +++ b/apps/docs/components/Code/CodeEditor/monaco/theme.ts @@ -0,0 +1,147 @@ +import monaco from "monaco-editor"; + +// Monokai theme +export const theme: monaco.editor.IStandaloneThemeData = { + base: "vs-dark", + inherit: true, + rules: [ + { + background: "1f2937", + token: "", + }, + { + foreground: "75715e", + token: "comment", + }, + { + foreground: "e6db74", + token: "string", + }, + { + foreground: "ae81ff", + token: "constant.numeric", + }, + { + foreground: "ae81ff", + token: "constant.language", + }, + { + foreground: "ae81ff", + token: "constant.character", + }, + { + foreground: "ae81ff", + token: "constant.other", + }, + { + foreground: "fa4b78", + token: "keyword", + }, + { + foreground: "f92672", + token: "storage", + }, + { + foreground: "66d9ef", + fontStyle: "italic", + token: "storage.type", + }, + { + foreground: "a6e22e", + fontStyle: "underline", + token: "entity.name.class", + }, + { + foreground: "a6e22e", + fontStyle: "italic underline", + token: "entity.other.inherited-class", + }, + { + foreground: "a6e22e", + token: "entity.name.function", + }, + { + foreground: "fd971f", + fontStyle: "italic", + token: "variable.parameter", + }, + { + foreground: "f92672", + token: "entity.name.tag", + }, + { + foreground: "a6e22e", + token: "entity.other.attribute-name", + }, + { + foreground: "66d9ef", + token: "support.function", + }, + { + foreground: "66d9ef", + token: "support.constant", + }, + { + foreground: "66d9ef", + fontStyle: "italic", + token: "support.type", + }, + { + foreground: "66d9ef", + fontStyle: "italic", + token: "support.class", + }, + { + foreground: "f8f8f0", + background: "f92672", + token: "invalid", + }, + { + foreground: "f8f8f0", + background: "ae81ff", + token: "invalid.deprecated", + }, + { + foreground: "cfcfc2", + token: "meta.structure.dictionary.json string.quoted.double.json", + }, + { + foreground: "75715e", + token: "meta.diff", + }, + { + foreground: "75715e", + token: "meta.diff.header", + }, + { + foreground: "f92672", + token: "markup.deleted", + }, + { + foreground: "a6e22e", + token: "markup.inserted", + }, + { + foreground: "e6db74", + token: "markup.changed", + }, + { + foreground: "ae81ffa0", + token: "constant.numeric.line-number.find-in-files - match", + }, + { + foreground: "e6db74", + token: "entity.name.filename.find-in-files", + }, + ], + colors: { + "editor.foreground": "#F8F8F2", + "editor.background": "#1f2937", + "editor.selectionBackground": "#49483E", + "editor.lineHighlightBackground": "#374151", + "editorCursor.foreground": "#F8F8F0", + "editorWhitespace.foreground": "#3B3A32", + "editorIndentGuide.activeBackground": "#9D550FB0", + "editor.selectionHighlightBorder": "#222218", + }, +}; diff --git a/apps/docs/components/Code/Terminal/index.tsx b/apps/docs/components/Code/Terminal/index.tsx index 8d1f8967..32ac9628 100644 --- a/apps/docs/components/Code/Terminal/index.tsx +++ b/apps/docs/components/Code/Terminal/index.tsx @@ -1,28 +1,29 @@ import React, { useEffect, useRef } from "react"; - const Terminal = (props: Props) => { const { output, isSuccess } = props; const terminalRef = useRef(null); - useEffect(() => { + useEffect(() => { if (output.length) { setTimeout(() => terminalRef.current?.scrollIntoView(false), 100); } }, [output]); - return (
{isSuccess !== null && !isSuccess ? ( -
❌ Arre Bhai Bhai Bhai !!!
+
+ ❌ Arre Bhai Bhai Bhai !!! +
) : ( -
Shandaar bhai 🎉
+
Shandaar bhai 🎉
)} {output.map((line, i) => { return ( diff --git a/apps/docs/components/Code/index.tsx b/apps/docs/components/Code/index.tsx index 4b8467ea..cbe604ea 100644 --- a/apps/docs/components/Code/index.tsx +++ b/apps/docs/components/Code/index.tsx @@ -6,10 +6,10 @@ import { sendEvents } from "../../helpers"; import CodeEditor from "./CodeEditor"; import Terminal from "./Terminal"; +import MonacoCodeEditor from "./CodeEditor/monaco/MonacoCodeEditor"; +import { OnChange } from "@monaco-editor/react"; - -const initialCode = ` -hi bhai +const initialCode = `hi bhai bol bhai "Hello World"; bhai ye hai a = 3; @@ -38,8 +38,9 @@ const Code = (props: Props) => { ); const [isSuccess, setIsSuccess] = useState(null); - const handleChange = (newCode: string) => { - setCode(newCode); + // Onchange is the event handler interface for React Monaco Editor + const handleChange: OnChange = (newCode, event) => { + setCode(newCode || ""); }; const executeCode = () => { @@ -61,7 +62,7 @@ const Code = (props: Props) => { } } - sendEvents("CodeExecuted", {success: isExecusionSuccess}); + sendEvents("CodeExecuted", { success: isExecusionSuccess }); setIsSuccess(isExecusionSuccess); setOutput(outputList); @@ -98,7 +99,8 @@ const Code = (props: Props) => {
- + {/* */} + ); diff --git a/apps/docs/styles/global.css b/apps/docs/styles/global.css index 70d2b8d2..df5aa573 100644 --- a/apps/docs/styles/global.css +++ b/apps/docs/styles/global.css @@ -1,84 +1,113 @@ +@import url("https://fonts.googleapis.com/css2?family=Fira+Code&display=swap"); @tailwind base; @tailwind components; @tailwind utilities; @import "prismjs/themes/prism-tomorrow.css"; html { - scroll-behavior: smooth; + scroll-behavior: smooth; } @media screen and (prefers-reduced-motion: reduce) { - html { - scroll-behavior: auto; - } + html { + scroll-behavior: auto; + } } -.header{ - min-height: 70vh; +.header { + min-height: 70vh; } -.playground-editor{ - position: relative; +.playground-editor { + position: relative; } .editor-container { - height: 60vh; - overflow: auto; - tab-size: 4ch; - color: #fff; - background-color: #333; + height: 60vh; + overflow: auto; + tab-size: 4ch; + color: #fff; + background-color: #333; } .editorLineNumber { - position: absolute; - left: 0px; - color: #8a8a8a; - text-align: right; - width: 40px; + position: absolute; + left: 0px; + color: #8a8a8a; + text-align: right; + width: 40px; } .editor { - counter-reset: line; + counter-reset: line; } -.editor pre{ - padding-left: 5rem !important; - height: 100% +.editor pre { + padding-left: 5rem !important; + height: 100%; } .codeArea { - overflow-wrap: normal !important; - word-break: keep-all !important; - outline: none; - padding-top: 1rem; - padding-left: 5rem !important; - /* z-index: 999999999; */ - white-space: nowrap; + overflow-wrap: normal !important; + word-break: keep-all !important; + outline: none; + padding-top: 1rem; + padding-left: 5rem !important; + /* z-index: 999999999; */ + white-space: nowrap; } .terminal { overflow-y: scroll; - transition-property: max-height, padding; - transition-duration: 0.2s; - transition-timing-function: ease-in-out; - height:auto; + transition-property: max-height, padding; + transition-duration: 0.2s; + transition-timing-function: ease-in-out; + height: auto; max-height: 30rem; - padding: 2rem; - opacity: 1; + padding: 1rem 2rem; + opacity: 1; +} + +.terminal::-webkit-scrollbar { + width: 6px; + height: 80%; } -.terminal .output{ - opacity: 1; - transition: opacity 0.5s; - transition-delay: 0.3s; +.terminal::-webkit-scrollbar-track { + background: transparent; +} + +.terminal::-webkit-scrollbar-thumb { + background-color: hsla(150, 70%, 60%, 0.8); + border-radius: 4px; +} +.terminal:hover::-webkit-scrollbar-thumb { + background-color: hsl(150, 70%, 60%); + border-radius: 4px; +} + +.terminal::-webkit-scrollbar-track-piece:end { + background: transparent; + margin-bottom: 10px; +} + +.terminal::-webkit-scrollbar-track-piece:start { + background: transparent; + margin-top: 10px; +} + +.terminal .output { + opacity: 1; + transition: opacity 0.5s; + transition-delay: 0.3s; } .terminal-collapsed { - max-height:0; - padding:0; - transition-property: max-height, padding; - transition-duration: 0.2s; - transition-timing-function: ease-out; + max-height: 0; + padding: 0; + transition-property: max-height, padding; + transition-duration: 0.2s; + transition-timing-function: ease-out; } .documentation-code { @@ -96,4 +125,4 @@ html { border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 8px solid #666; -} \ No newline at end of file +} diff --git a/package-lock.json b/package-lock.json index 1ab7ac4c..e6eff3ef 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,10 @@ "apps/*", "packages/*" ], + "dependencies": { + "@monaco-editor/react": "^4.3.1", + "monaco-editor": "^0.33.0" + }, "devDependencies": { "@parcel/packager-ts": "^2.2.0", "@parcel/transformer-typescript-types": "^2.2.0", @@ -1114,6 +1118,31 @@ "@jridgewell/sourcemap-codec": "^1.4.10" } }, + "node_modules/@monaco-editor/loader": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@monaco-editor/loader/-/loader-1.3.0.tgz", + "integrity": "sha512-N3mGq1ktC3zh7WUx3NGO+PSDdNq9Vspk/41rEmRdrCqV9vNbBTRzAOplmUpNQsi+hmTs++ERMBobMERb8Kb+3g==", + "dependencies": { + "state-local": "^1.0.6" + }, + "peerDependencies": { + "monaco-editor": ">= 0.21.0 < 1" + } + }, + "node_modules/@monaco-editor/react": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/@monaco-editor/react/-/react-4.3.1.tgz", + "integrity": "sha512-f+0BK1PP/W5I50hHHmwf11+Ea92E5H1VZXs+wvKplWUWOfyMa1VVwqkJrXjRvbcqHL+XdIGYWhWNdi4McEvnZg==", + "dependencies": { + "@monaco-editor/loader": "^1.2.0", + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "monaco-editor": ">= 0.25.0 < 1", + "react": "^16.8.0 || ^17.0.0", + "react-dom": "^16.8.0 || ^17.0.0" + } + }, "node_modules/@next/env": { "version": "12.1.0", "resolved": "https://registry.npmjs.org/@next/env/-/env-12.1.0.tgz", @@ -6431,6 +6460,11 @@ "mkdirp": "bin/cmd.js" } }, + "node_modules/monaco-editor": { + "version": "0.33.0", + "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.33.0.tgz", + "integrity": "sha512-VcRWPSLIUEgQJQIE0pVT8FcGBIgFoxz7jtqctE+IiCxWugD0DwgyQBcZBhdSrdMC84eumoqMZsGl2GTreOzwqw==" + }, "node_modules/ms": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", @@ -7735,6 +7769,11 @@ "node": ">=8" } }, + "node_modules/state-local": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/state-local/-/state-local-1.0.7.tgz", + "integrity": "sha512-HTEHMNieakEnoe33shBYcZ7NX83ACUjCu8c40iOGEZsngj9zRnkqS9j1pqQPXwobB0ZcVTk27REb7COQ0UR59w==" + }, "node_modules/string_decoder": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", @@ -9106,7 +9145,7 @@ }, "packages/cli": { "name": "bhailang", - "version": "0.0.7", + "version": "0.1.0", "license": "MIT", "bin": { "bhailang": "bin/index.js" @@ -9203,7 +9242,7 @@ }, "packages/parser": { "name": "bhai-lang-parser", - "version": "0.0.1", + "version": "0.0.2", "license": "MIT", "devDependencies": { "@types/jest": "^27.4.0", @@ -10041,6 +10080,23 @@ "@jridgewell/sourcemap-codec": "^1.4.10" } }, + "@monaco-editor/loader": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@monaco-editor/loader/-/loader-1.3.0.tgz", + "integrity": "sha512-N3mGq1ktC3zh7WUx3NGO+PSDdNq9Vspk/41rEmRdrCqV9vNbBTRzAOplmUpNQsi+hmTs++ERMBobMERb8Kb+3g==", + "requires": { + "state-local": "^1.0.6" + } + }, + "@monaco-editor/react": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/@monaco-editor/react/-/react-4.3.1.tgz", + "integrity": "sha512-f+0BK1PP/W5I50hHHmwf11+Ea92E5H1VZXs+wvKplWUWOfyMa1VVwqkJrXjRvbcqHL+XdIGYWhWNdi4McEvnZg==", + "requires": { + "@monaco-editor/loader": "^1.2.0", + "prop-types": "^15.7.2" + } + }, "@next/env": { "version": "12.1.0", "resolved": "https://registry.npmjs.org/@next/env/-/env-12.1.0.tgz", @@ -13973,6 +14029,11 @@ "minimist": "^1.2.5" } }, + "monaco-editor": { + "version": "0.33.0", + "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.33.0.tgz", + "integrity": "sha512-VcRWPSLIUEgQJQIE0pVT8FcGBIgFoxz7jtqctE+IiCxWugD0DwgyQBcZBhdSrdMC84eumoqMZsGl2GTreOzwqw==" + }, "ms": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", @@ -14899,6 +14960,11 @@ } } }, + "state-local": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/state-local/-/state-local-1.0.7.tgz", + "integrity": "sha512-HTEHMNieakEnoe33shBYcZ7NX83ACUjCu8c40iOGEZsngj9zRnkqS9j1pqQPXwobB0ZcVTk27REb7COQ0UR59w==" + }, "string_decoder": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", diff --git a/package.json b/package.json index e7d3da69..fe22436c 100644 --- a/package.json +++ b/package.json @@ -42,5 +42,9 @@ "npm": ">=7.0.0", "node": ">=14.0.0" }, - "packageManager": "npm@8.1.4" + "packageManager": "npm@8.1.4", + "dependencies": { + "@monaco-editor/react": "^4.3.1", + "monaco-editor": "^0.33.0" + } }