Bulk editor (#45)

Bulk editor for all pair editors except multipart/form-data

src-web/components/core/Editor/Editor.tsx

@@ -102,7 +102,7 @@ export const Editor = forwardRef<EditorView | undefined, EditorProps>(function E
   // Use ref so we can update the handler without re-initializing the editor
   const handleChange = useRef<EditorProps['onChange']>(onChange);
   useEffect(() => {
-    handleChange.current = onChange;
+    handleChange.current = onChange ? onChange : onChange;
   }, [onChange]);
 
   // Use ref so we can update the handler without re-initializing the editor

src-web/components/core/Editor/extensions.ts

@@ -35,6 +35,7 @@ import { graphql, graphqlLanguageSupport } from 'cm6-graphql';
 import { EditorView } from 'codemirror';
 import type { Environment, Workspace } from '../../../lib/models';
 import type { EditorProps } from './index';
+import { pairs } from './pairs/extension';
 import { text } from './text/extension';
 import { twig } from './twig/extension';
 import { url } from './url/extension';
@@ -71,6 +72,7 @@ const syntaxExtensions: Record<string, LanguageSupport> = {
   'application/xml': xml(),
   'text/xml': xml(),
   url: url(),
+  pairs: pairs(),
 };
 
 export function getLanguageExtension({

src-web/components/core/Editor/pairs/extension.ts

@@ -0,0 +1,11 @@
+import { LanguageSupport, LRLanguage } from '@codemirror/language';
+import { parser } from './pairs';
+
+const urlLanguage = LRLanguage.define({
+  parser,
+  languageData: {},
+});
+
+export function pairs() {
+  return new LanguageSupport(urlLanguage, []);
+}

src-web/components/core/Editor/pairs/highlight.ts

@@ -0,0 +1,7 @@
+import { styleTags, tags as t } from '@lezer/highlight';
+
+export const highlight = styleTags({
+  Sep: t.bracket,
+  Key: t.attributeName,
+  Value: t.string,
+});

src-web/components/core/Editor/pairs/pairs.grammar

@@ -0,0 +1,9 @@
+@top pairs { (Key? Sep Value)* }
+
+@tokens {
+  Sep { ":" }
+  Key { ![:]+ }
+  Value { ![\n]+ }
+}
+
+@external propSource highlight from "./highlight"

src-web/components/core/Editor/pairs/pairs.ts

@@ -0,0 +1,19 @@
+// This file was generated by lezer-generator. You probably shouldn't edit it.
+import {LRParser} from "@lezer/lr"
+import {highlight} from "./highlight"
+export const parser = LRParser.deserialize({
+  version: 14,
+  states: "!QQQOPOOOYOQO'#CaO_OPO'#CaQQOPOOOOOO,58{,58{OdOQO,58{OOOO-E6_-E6_OOOO1G.g1G.g",
+  stateData: "i~OQQORPO~OSSO~ORTO~OSVO~O",
+  goto: "]UPPPPPVQRORUR",
+  nodeNames: "⚠ pairs Key Sep Value",
+  maxTerm: 6,
+  propSources: [highlight],
+  skippedNodes: [0],
+  repeatNodeCount: 1,
+  tokenData: "#oRRVOYhYZ!UZ![h![!]#[!];'Sh;'S;=`#U<%lOhRoVQPSQOYhYZ!UZ![h![!]!m!];'Sh;'S;=`#U<%lOhP!ZSQPO![!U!];'S!U;'S;=`!g<%lO!UP!jP;=`<%l!UQ!rSSQOY!mZ;'S!m;'S;=`#O<%lO!mQ#RP;=`<%l!mR#XP;=`<%lhR#cSRPSQOY!mZ;'S!m;'S;=`#O<%lO!m",
+  tokenizers: [0, 1],
+  topRules: {"pairs":[0,1]},
+  tokenPrec: 0
+})
+