btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

feat: css variable on themes

Browse Source
This commit is contained in:
liyasthomas
2021-11-09 22:05:39 +05:30
parent d538d722d7
commit 6b70a39f02
8 changed files with 210 additions and 494 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
packages/hoppscotch-app/assets/scss/themes.scss
View File

@@ -52,6 +52,48 @@
--editor-theme: "twilight";
}
@mixin dark-editor-theme {
--editor-type-color: theme("colors.gray.800");
--editor-name-color: theme("colors.gray.600");
--editor-operator-color: theme("colors.gray.600");
--editor-invalid-color: theme("colors.red.500");
--editor-separator-color: theme("colors.gray.500");
--editor-meta-color: theme("colors.gray.500");
--editor-variable-color: theme("colors.gray.500");
--editor-link-color: theme("colors.blue.500");
--editor-process-color: theme("colors.blue.500");
--editor-constant-color: theme("colors.blue.500");
--editor-keyword-color: theme("colors.blue.500");
}
@mixin light-editor-theme {
--editor-type-color: theme("colors.gray.800");
--editor-name-color: theme("colors.gray.600");
--editor-operator-color: theme("colors.gray.600");
--editor-invalid-color: theme("colors.red.500");
--editor-separator-color: theme("colors.gray.500");
--editor-meta-color: theme("colors.gray.500");
--editor-variable-color: theme("colors.gray.500");
--editor-link-color: theme("colors.blue.500");
--editor-process-color: theme("colors.blue.500");
--editor-constant-color: theme("colors.blue.500");
--editor-keyword-color: theme("colors.blue.500");
}
@mixin black-editor-theme {
--editor-type-color: theme("colors.gray.800");
--editor-name-color: theme("colors.gray.600");
--editor-operator-color: theme("colors.gray.600");
--editor-invalid-color: theme("colors.red.500");
--editor-separator-color: theme("colors.gray.500");
--editor-meta-color: theme("colors.gray.500");
--editor-variable-color: theme("colors.gray.500");
--editor-link-color: theme("colors.blue.500");
--editor-process-color: theme("colors.blue.500");
--editor-constant-color: theme("colors.blue.500");
--editor-keyword-color: theme("colors.blue.500");
}
@mixin green-theme {
--accent-color: theme("colors.green.500");
--accent-light-color: theme("colors.green.400");
@@ -146,18 +188,22 @@
@include base-theme;
@include dark-theme;
@include green-theme;
@include dark-editor-theme;
}
:root.light {
@include light-theme;
@include light-editor-theme;
}
:root.dark {
@include dark-theme;
@include dark-editor-theme;
}
:root.black {
@include black-theme;
@include black-editor-theme;
}
:root[data-accent="blue"] {

110
packages/hoppscotch-app/helpers/editor/codemirror.ts
View File

@@ -25,15 +25,7 @@ import "codemirror/addon/search/jump-to-line"
import "codemirror/addon/dialog/dialog"
import "codemirror/addon/selection/active-line"
import {
keymap,
highlightSpecialChars,
drawSelection,
highlightActiveLine,
EditorView,
ViewPlugin,
ViewUpdate,
} from "@codemirror/view"
import { keymap, EditorView, ViewPlugin, ViewUpdate } from "@codemirror/view"
import {
Extension,
EditorState,
@@ -41,23 +33,11 @@ import {
EditorSelection,
TransactionSpec,
} from "@codemirror/state"
import { history, historyKeymap } from "@codemirror/history"
import { foldKeymap } from "@codemirror/fold"
import { indentOnInput, Language, LanguageSupport } from "@codemirror/language"
import { lineNumbers, highlightActiveLineGutter } from "@codemirror/gutter"
import { Language, LanguageSupport } from "@codemirror/language"
import { defaultKeymap } from "@codemirror/commands"
import { bracketMatching } from "@codemirror/matchbrackets"
import { closeBrackets, closeBracketsKeymap } from "@codemirror/closebrackets"
import { searchKeymap, highlightSelectionMatches } from "@codemirror/search"
import {
completionKeymap,
Completion,
autocompletion,
} from "@codemirror/autocomplete"
import { commentKeymap } from "@codemirror/comment"
import { rectangularSelection } from "@codemirror/rectangular-selection"
import { defaultHighlightStyle } from "@codemirror/highlight"
import { lintKeymap, linter } from "@codemirror/lint"
import { basicSetup } from "@codemirror/basic-setup"
import { Completion, autocompletion } from "@codemirror/autocomplete"
import { linter } from "@codemirror/lint"
import { watch, onMounted, ref, Ref, useContext } from "@nuxtjs/composition-api"
@@ -69,11 +49,7 @@ import * as O from "fp-ts/Option"
import { isJSONContentType } from "../utils/contenttypes"
import { Completer } from "./completion"
import { LinterDefinition } from "./linting/linter"
import { baseThemeFoldStyle } from "./themes/baseTheme"
import { darkTheme, darkHighlightStyle } from "./themes/darkTheme"
import { lightTheme, lightHighlightStyle } from "./themes/lightTheme"
import { blackTheme, blackHighlightStyle } from "./themes/blackTheme"
import { HoppBgColor } from "~/newstore/settings"
import { baseTheme, baseHighlightStyle } from "./themes/baseTheme"
type CodeMirrorOptions = {
extendedEditorConfig: Omit<CodeMirror.EditorConfiguration, "value">
@@ -260,34 +236,6 @@ export function useCodemirror(
}
}
export const basicSetup: Extension = [
lineNumbers(),
highlightActiveLineGutter(),
highlightSpecialChars(),
history(),
baseThemeFoldStyle,
drawSelection(),
EditorState.allowMultipleSelections.of(true),
indentOnInput(),
defaultHighlightStyle.fallback,
bracketMatching(),
closeBrackets(),
autocompletion(),
rectangularSelection(),
highlightActiveLine(),
highlightSelectionMatches(),
keymap.of([
...closeBracketsKeymap,
...defaultKeymap,
...searchKeymap,
...historyKeymap,
...foldKeymap,
...commentKeymap,
...completionKeymap,
...lintKeymap,
]),
]
const hoppCompleterExt = (completer: Completer): Extension => {
return autocompletion({
override: [
@@ -373,43 +321,13 @@ const getEditorLanguage = (
O.getOrElseW(() => [])
)
const getHightlightMode = (mode: HoppBgColor): Extension => {
switch (mode) {
case "light":
return lightHighlightStyle
case "dark":
return darkHighlightStyle
case "black":
return blackHighlightStyle
default:
return darkHighlightStyle
}
}
const getThemeExt = (mode: HoppBgColor): Extension => {
switch (mode) {
case "dark":
return darkTheme
case "black":
return blackTheme
case "light":
return lightTheme
case "system":
return darkTheme
}
}
export function useNewCodemirror(
el: Ref<any | null>,
value: Ref<string>,
options: CodeMirrorOptions
): { cursor: Ref<{ line: number; ch: number }> } {
const { $colorMode } = useContext() as any
const language = new Compartment()
const lineWrapping = new Compartment()
const theming = new Compartment()
const highlightStyle = new Compartment()
const cachedCursor = ref({
line: 0,
@@ -425,8 +343,8 @@ export function useNewCodemirror(
doc: value.value,
extensions: [
basicSetup,
theming.of(getThemeExt($colorMode.value)),
highlightStyle.of(getHightlightMode($colorMode.value)),
baseTheme,
baseHighlightStyle,
ViewPlugin.fromClass(
class {
update(update: ViewUpdate) {
@@ -537,18 +455,6 @@ export function useNewCodemirror(
}
)
watch(
() => $colorMode.value,
(newVal) => {
dispatch({
effects: [
theming.reconfigure(getThemeExt(newVal)),
highlightStyle.reconfigure(getHightlightMode(newVal)),
],
})
}
)
watch(el, (newEl) => {
if (view.value) {
view.value.destroy()

137
packages/hoppscotch-app/helpers/editor/themes/baseTheme.ts
View File

@@ -1,9 +1,138 @@
import { Extension } from "@codemirror/state"
import { EditorView } from "@codemirror/view"
import { HighlightStyle, tags as t } from "@codemirror/highlight"
import { foldGutter } from "@codemirror/fold"
export const baseThemeFoldStyle = foldGutter({
export const baseTheme = EditorView.theme(
{
"&": {
fontSize: "var(--body-font-size)",
},
".cm-content": {
caretColor: "var(--secondary-light-color)",
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
},
"&.cm-focused .cm-cursor": {
borderLeftColor: "var(--secondary-light-color)",
},
"&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection":
{ backgroundColor: "var(--primary-light-color)" },
".cm-panels": {
backgroundColor: "var(--primary-dark-color)",
color: "var(--secondary-light-color)",
},
".cm-panels.cm-panels-top": { borderBottom: "2px solid black" },
".cm-panels.cm-panels-bottom": { borderTop: "2px solid black" },
".cm-activeLine": { backgroundColor: "var(--primary-light-color)" },
".cm-searchMatch": {
backgroundColor: "var(--accent-light-color)",
outline: "1px solid var(--accent-dark-color)",
},
".cm-selectionMatch": { backgroundColor: "#aafe661a" },
"&.cm-focused .cm-matchingBracket, &.cm-focused .cm-nonmatchingBracket": {
backgroundColor: "#bad0f847",
outline: "1px solid #515a6b",
},
".cm-gutters": {
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
borderColor: "var(--divider-light-color)",
},
".cm-lineNumbers": {
minWidth: "3em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter": {
minWidth: "2em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter .cm-gutterElement": {
textAlign: "center",
},
".cm-line": {
paddingLeft: "0.5em",
paddingRight: "0.5em",
},
".cm-activeLineGutter": {
backgroundColor: "var(--primary-dark-color)",
},
},
{
dark: !!"var(--editor-dark-mode)",
}
)
const editorTypeColor = "var(--editor-type-color)"
const editorNameColor = "var(--editor-name-color)"
const editorOperatorColor = "var(--editor-operator-color)"
const editorInvalidColor = "var(--editor-invalid-color)"
const editorSeparatorColor = "var(--editor-separator-color)"
const editorMetaColor = "var(--editor-meta-color)"
const editorVariableColor = "var(--editor-variable-color)"
const editorLinkColor = "var(--editor-link-color)"
const editorProcessColor = "var(--editor-process-color)"
const editorConstantColor = "var(--editor-constant-color)"
const editorKeywordColor = "var(--editor-keyword-color)"
export const baseHighlightStyle = HighlightStyle.define([
{ tag: t.keyword, color: editorKeywordColor },
{
tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
color: editorNameColor,
},
{
tag: [t.function(t.variableName), t.labelName],
color: editorVariableColor,
},
{
tag: [t.color, t.constant(t.name), t.standard(t.name)],
color: editorConstantColor,
},
{ tag: [t.definition(t.name), t.separator], color: editorSeparatorColor },
{
tag: [
t.typeName,
t.className,
t.number,
t.changed,
t.annotation,
t.modifier,
t.self,
t.namespace,
],
color: editorTypeColor,
},
{
tag: [
t.operator,
t.operatorKeyword,
t.url,
t.escape,
t.regexp,
t.link,
t.special(t.string),
],
color: editorOperatorColor,
},
{ tag: [t.meta, t.comment], color: editorMetaColor },
{ tag: t.strong, fontWeight: "bold" },
{ tag: t.emphasis, fontStyle: "italic" },
{ tag: t.strikethrough, textDecoration: "line-through" },
{ tag: t.link, color: editorLinkColor, textDecoration: "underline" },
{ tag: t.heading, fontWeight: "bold", color: editorNameColor },
{
tag: [t.atom, t.bool, t.special(t.variableName)],
color: editorConstantColor,
},
{
tag: [t.processingInstruction, t.string, t.inserted],
color: editorProcessColor,
},
{ tag: t.invalid, color: editorInvalidColor },
])
export const baseFoldStyle = foldGutter({
openText: "▾",
closedText: "▸",
})
export const baseTheme: Extension = [baseThemeFoldStyle]

122
packages/hoppscotch-app/helpers/editor/themes/blackTheme.ts
View File

@@ -1,122 +0,0 @@
import { EditorView } from "@codemirror/view"
import { Extension } from "@codemirror/state"
import { HighlightStyle, tags as t } from "@codemirror/highlight"
const chalky = "#e5c07b"
const coral = "#e06c75"
const cyan = "#56b6c2"
const invalid = "#ffffff"
const ivory = "#abb2bf"
const stone = "#7d8799"
const malibu = "#61afef"
const sage = "#98c379"
const whiskey = "#d19a66"
const violet = "#c678dd"
export const blackTheme = EditorView.theme(
{
"&": {
fontSize: "var(--body-font-size)",
},
".cm-content": {
caretColor: "var(--secondary-light-color)",
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
},
"&.cm-focused .cm-cursor": {
borderLeftColor: "var(--secondary-light-color)",
},
"&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection":
{ backgroundColor: "var(--primary-light-color)" },
".cm-panels": {
backgroundColor: "var(--primary-dark-color)",
color: "var(--secondary-light-color)",
},
".cm-panels.cm-panels-top": { borderBottom: "2px solid black" },
".cm-panels.cm-panels-bottom": { borderTop: "2px solid black" },
".cm-activeLine": { backgroundColor: "var(--primary-light-color)" },
".cm-searchMatch": {
backgroundColor: "#72a1ff59",
outline: "1px solid #457dff",
},
".cm-selectionMatch": { backgroundColor: "#aafe661a" },
"&.cm-focused .cm-matchingBracket, &.cm-focused .cm-nonmatchingBracket": {
backgroundColor: "#bad0f847",
outline: "1px solid #515a6b",
},
".cm-gutters": {
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
borderColor: "var(--divider-light-color)",
},
".cm-lineNumbers": {
minWidth: "3em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter": {
minWidth: "2em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter .cm-gutterElement": {
textAlign: "center",
},
".cm-line": {
paddingLeft: "0.5em",
paddingRight: "0.5em",
},
".cm-activeLineGutter": {
backgroundColor: "var(--primary-dark-color)",
},
},
{
dark: true,
}
)
export const blackHighlightStyle = HighlightStyle.define([
{ tag: t.keyword, color: violet },
{
tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
color: coral,
},
{ tag: [t.function(t.variableName), t.labelName], color: malibu },
{ tag: [t.color, t.constant(t.name), t.standard(t.name)], color: whiskey },
{ tag: [t.definition(t.name), t.separator], color: ivory },
{
tag: [
t.typeName,
t.className,
t.number,
t.changed,
t.annotation,
t.modifier,
t.self,
t.namespace,
],
color: chalky,
},
{
tag: [
t.operator,
t.operatorKeyword,
t.url,
t.escape,
t.regexp,
t.link,
t.special(t.string),
],
color: cyan,
},
{ tag: [t.meta, t.comment], color: stone },
{ tag: t.strong, fontWeight: "bold" },
{ tag: t.emphasis, fontStyle: "italic" },
{ tag: t.strikethrough, textDecoration: "line-through" },
{ tag: t.link, color: stone, textDecoration: "underline" },
{ tag: t.heading, fontWeight: "bold", color: coral },
{ tag: [t.atom, t.bool, t.special(t.variableName)], color: whiskey },
{ tag: [t.processingInstruction, t.string, t.inserted], color: sage },
{ tag: t.invalid, color: invalid },
])
export const blackMode: Extension = [blackTheme, blackHighlightStyle]

122
packages/hoppscotch-app/helpers/editor/themes/darkTheme.ts
View File

@@ -1,122 +0,0 @@
import { EditorView } from "@codemirror/view"
import { Extension } from "@codemirror/state"
import { HighlightStyle, tags as t } from "@codemirror/highlight"
const chalky = "#e5c07b"
const coral = "#e06c75"
const cyan = "#56b6c2"
const invalid = "#ffffff"
const ivory = "#abb2bf"
const stone = "#7d8799"
const malibu = "#61afef"
const sage = "#98c379"
const whiskey = "#d19a66"
const violet = "#c678dd"
export const darkTheme = EditorView.theme(
{
"&": {
fontSize: "var(--body-font-size)",
},
".cm-content": {
caretColor: "var(--secondary-light-color)",
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
},
"&.cm-focused .cm-cursor": {
borderLeftColor: "var(--secondary-light-color)",
},
"&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection":
{ backgroundColor: "var(--primary-light-color)" },
".cm-panels": {
backgroundColor: "var(--primary-dark-color)",
color: "var(--secondary-light-color)",
},
".cm-panels.cm-panels-top": { borderBottom: "2px solid black" },
".cm-panels.cm-panels-bottom": { borderTop: "2px solid black" },
".cm-activeLine": { backgroundColor: "var(--primary-light-color)" },
".cm-searchMatch": {
backgroundColor: "#72a1ff59",
outline: "1px solid #457dff",
},
".cm-selectionMatch": { backgroundColor: "#aafe661a" },
"&.cm-focused .cm-matchingBracket, &.cm-focused .cm-nonmatchingBracket": {
backgroundColor: "#bad0f847",
outline: "1px solid #515a6b",
},
".cm-gutters": {
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
borderColor: "var(--divider-light-color)",
},
".cm-lineNumbers": {
minWidth: "3em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter": {
minWidth: "2em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter .cm-gutterElement": {
textAlign: "center",
},
".cm-line": {
paddingLeft: "0.5em",
paddingRight: "0.5em",
},
".cm-activeLineGutter": {
backgroundColor: "var(--primary-dark-color)",
},
},
{
dark: true,
}
)
export const darkHighlightStyle = HighlightStyle.define([
{ tag: t.keyword, color: violet },
{
tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
color: coral,
},
{ tag: [t.function(t.variableName), t.labelName], color: malibu },
{ tag: [t.color, t.constant(t.name), t.standard(t.name)], color: whiskey },
{ tag: [t.definition(t.name), t.separator], color: ivory },
{
tag: [
t.typeName,
t.className,
t.number,
t.changed,
t.annotation,
t.modifier,
t.self,
t.namespace,
],
color: chalky,
},
{
tag: [
t.operator,
t.operatorKeyword,
t.url,
t.escape,
t.regexp,
t.link,
t.special(t.string),
],
color: cyan,
},
{ tag: [t.meta, t.comment], color: stone },
{ tag: t.strong, fontWeight: "bold" },
{ tag: t.emphasis, fontStyle: "italic" },
{ tag: t.strikethrough, textDecoration: "line-through" },
{ tag: t.link, color: stone, textDecoration: "underline" },
{ tag: t.heading, fontWeight: "bold", color: coral },
{ tag: [t.atom, t.bool, t.special(t.variableName)], color: whiskey },
{ tag: [t.processingInstruction, t.string, t.inserted], color: sage },
{ tag: t.invalid, color: invalid },
])
export const darkMode: Extension = [darkTheme, darkHighlightStyle]

120
packages/hoppscotch-app/helpers/editor/themes/lightTheme.ts
View File

@@ -1,120 +0,0 @@
import { EditorView } from "@codemirror/view"
import { Extension } from "@codemirror/state"
import { HighlightStyle, tags as t } from "@codemirror/highlight"
const chalky = "#e5c07b"
const coral = "#e06c75"
const cyan = "#56b6c2"
const invalid = "#ffffff"
const ivory = "#abb2bf"
const stone = "#7d8799"
const malibu = "#61afef"
const sage = "#98c379"
const whiskey = "#d19a66"
const violet = "#c678dd"
export const lightTheme = EditorView.theme(
{
"&": {
fontSize: "var(--body-font-size)",
},
".cm-content": {
caretColor: "var(--secondary-light-color)",
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
},
"&.cm-focused .cm-cursor": {
borderLeftColor: "var(--secondary-light-color)",
},
"&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection":
{ backgroundColor: "var(--primary-light-color)" },
".cm-panels": {
backgroundColor: "var(--primary-dark-color)",
color: "var(--secondary-light-color)",
},
".cm-panels.cm-panels-top": { borderBottom: "2px solid black" },
".cm-panels.cm-panels-bottom": { borderTop: "2px solid black" },
".cm-activeLine": { backgroundColor: "var(--primary-light-color)" },
".cm-searchMatch": {
backgroundColor: "#72a1ff59",
outline: "1px solid #457dff",
},
".cm-selectionMatch": { backgroundColor: "#aafe661a" },
"&.cm-focused .cm-matchingBracket, &.cm-focused .cm-nonmatchingBracket": {
backgroundColor: "#bad0f847",
outline: "1px solid #515a6b",
},
".cm-gutters": {
fontFamily: "var(--font-mono)",
backgroundColor: "var(--primary-color)",
borderColor: "var(--divider-light-color)",
},
".cm-lineNumbers": {
minWidth: "3em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter": {
minWidth: "2em",
color: "var(--secondary-light-color)",
},
".cm-foldGutter .cm-gutterElement": {
textAlign: "center",
},
".cm-line": {
paddingLeft: "0.5em",
paddingRight: "0.5em",
},
".cm-activeLineGutter": {
backgroundColor: "var(--primary-dark-color)",
},
},
{ dark: false }
)
export const lightHighlightStyle = HighlightStyle.define([
{ tag: t.keyword, color: violet },
{
tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
color: coral,
},
{ tag: [t.function(t.variableName), t.labelName], color: malibu },
{ tag: [t.color, t.constant(t.name), t.standard(t.name)], color: whiskey },
{ tag: [t.definition(t.name), t.separator], color: ivory },
{
tag: [
t.typeName,
t.className,
t.number,
t.changed,
t.annotation,
t.modifier,
t.self,
t.namespace,
],
color: chalky,
},
{
tag: [
t.operator,
t.operatorKeyword,
t.url,
t.escape,
t.regexp,
t.link,
t.special(t.string),
],
color: cyan,
},
{ tag: [t.meta, t.comment], color: stone },
{ tag: t.strong, fontWeight: "bold" },
{ tag: t.emphasis, fontStyle: "italic" },
{ tag: t.strikethrough, textDecoration: "line-through" },
{ tag: t.link, color: stone, textDecoration: "underline" },
{ tag: t.heading, fontWeight: "bold", color: coral },
{ tag: [t.atom, t.bool, t.special(t.variableName)], color: whiskey },
{ tag: [t.processingInstruction, t.string, t.inserted], color: sage },
{ tag: t.invalid, color: invalid },
])
export const lightMode: Extension = [lightHighlightStyle, lightHighlightStyle]

9
packages/hoppscotch-app/package.json
View File

@@ -35,20 +35,13 @@
"dependencies": {
"@apollo/client": "^3.4.16",
"@codemirror/autocomplete": "^0.19.4",
"@codemirror/closebrackets": "^0.19.0",
"@codemirror/basic-setup": "^0.19.0",
"@codemirror/commands": "^0.19.5",
"@codemirror/comment": "^0.19.0",
"@codemirror/fold": "^0.19.1",
"@codemirror/gutter": "^0.19.4",
"@codemirror/highlight": "^0.19.6",
"@codemirror/history": "^0.19.0",
"@codemirror/lang-javascript": "^0.19.2",
"@codemirror/lang-json": "^0.19.1",
"@codemirror/language": "^0.19.3",
"@codemirror/lint": "^0.19.2",
"@codemirror/matchbrackets": "^0.19.3",
"@codemirror/rectangular-selection": "^0.19.1",
"@codemirror/search": "^0.19.2",
"@codemirror/state": "^0.19.3",
"@codemirror/text": "^0.19.5",
"@codemirror/view": "^0.19.12",

38
pnpm-lock.yaml generated
View File

@@ -21,20 +21,13 @@ importers:
'@babel/core': ^7.16.0
'@babel/preset-env': ^7.16.0
'@codemirror/autocomplete': ^0.19.4
'@codemirror/closebrackets': ^0.19.0
'@codemirror/basic-setup': ^0.19.0
'@codemirror/commands': ^0.19.5
'@codemirror/comment': ^0.19.0
'@codemirror/fold': ^0.19.1
'@codemirror/gutter': ^0.19.4
'@codemirror/highlight': ^0.19.6
'@codemirror/history': ^0.19.0
'@codemirror/lang-javascript': ^0.19.2
'@codemirror/lang-json': ^0.19.1
'@codemirror/language': ^0.19.3
'@codemirror/lint': ^0.19.2
'@codemirror/matchbrackets': ^0.19.3
'@codemirror/rectangular-selection': ^0.19.1
'@codemirror/search': ^0.19.2
'@codemirror/state': ^0.19.3
'@codemirror/text': ^0.19.5
'@codemirror/view': ^0.19.12
@@ -144,20 +137,13 @@ importers:
dependencies:
'@apollo/client': 3.4.16_f3f7eb5e21785ef7d5faca94c1a68824
'@codemirror/autocomplete': 0.19.4
'@codemirror/closebrackets': 0.19.0
'@codemirror/basic-setup': 0.19.0
'@codemirror/commands': 0.19.5
'@codemirror/comment': 0.19.0
'@codemirror/fold': 0.19.1
'@codemirror/gutter': 0.19.4
'@codemirror/highlight': 0.19.6
'@codemirror/history': 0.19.0
'@codemirror/lang-javascript': 0.19.2
'@codemirror/lang-json': 0.19.1
'@codemirror/language': 0.19.3
'@codemirror/lint': 0.19.2
'@codemirror/matchbrackets': 0.19.3
'@codemirror/rectangular-selection': 0.19.1
'@codemirror/search': 0.19.2
'@codemirror/state': 0.19.3
'@codemirror/text': 0.19.5
'@codemirror/view': 0.19.12
@@ -1740,6 +1726,26 @@ packages:
'@lezer/common': 0.15.7
dev: false
/@codemirror/basic-setup/0.19.0:
resolution: {integrity: sha512-Yhrf7fIz8+INHWOhpWeRwbs8fpc0KsydX9baD7TyYqniLVWyTi0Hwm52mr0f5O+k4YaJPeHAgT3x9gzDXZIvOw==}
dependencies:
'@codemirror/autocomplete': 0.19.4
'@codemirror/closebrackets': 0.19.0
'@codemirror/commands': 0.19.5
'@codemirror/comment': 0.19.0
'@codemirror/fold': 0.19.1
'@codemirror/gutter': 0.19.4
'@codemirror/highlight': 0.19.6
'@codemirror/history': 0.19.0
'@codemirror/language': 0.19.3
'@codemirror/lint': 0.19.2
'@codemirror/matchbrackets': 0.19.3
'@codemirror/rectangular-selection': 0.19.1
'@codemirror/search': 0.19.2
'@codemirror/state': 0.19.3
'@codemirror/view': 0.19.12
dev: false
/@codemirror/closebrackets/0.19.0:
resolution: {integrity: sha512-dFWX5OEVYWRNtGaifSbwIAlymnRRjxWMiMbffbAjF7p0zfGHDbdGkiT56q3Xud63h5/tQdSo5dK1iyNTzHz5vg==}
dependencies: