Add code editor for maputnik (#1426)

## Launch Checklist

This PR adds the ability to look at the entire style and edit it in a
code editor that supports syntax highlight, errors, search and more.

- Resolves #820

CC: @Kanahiro as I know you did something similar, probably has better
performance...

After:
<img width="1920" height="937" alt="image"
src="https://github.com/user-attachments/assets/f925cf92-2623-4390-8f75-14d7f6a79171"
/>


 - [x] Briefly describe the changes in this PR.
 - [x] Link to related issues.
- [x] Include before/after visuals or gifs if this PR includes visual
changes.
 - [x] Write tests for all new functionality.
 - [x] Add an entry to `CHANGELOG.md` under the `## main` section.

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Co-authored-by: Frank Elsinga <frank@elsinga.de>

src/locales/de/translation.json

@@ -31,11 +31,15 @@
   "Maputnik on GitHub": "Maputnik auf GitHub",
   "Open": "Öffnen",
   "Save": "Speichern",
+  "Code Editor": "Code-Editor",
   "Data Sources": "Datenquellen",
   "Style Settings": "Stileinstellungen",
+  "Global State": "Globaler Zustand",
   "View": "Ansicht",
   "Color accessibility": "Farbzugänglichkeit",
   "Help": "Hilfe",
+  "Close": "Schließen",
+  "Click to close the editor": "Klicken Sie hier, um den Editor zu schließen",
   "Comments for the current layer. This is non-standard and not in the spec.": "Kommentare zur aktuellen Ebene. Das ist nicht standardmäßig und nicht in der Spezifikation.",
   "Comments": "Kommentare",
   "Comment...": "Dein Kommentar...",
@@ -56,7 +60,6 @@
   "Delete filter block": "Filterblock löschen",
   "Add value": "Wert hinzufügen",
   "Remove array item": "Element aus Array entfernen",
-  "Press <1>ESC</1> to lose focus": "Drück <1>ESC</1>, um den Fokus zu verlieren",
   "Must provide protocol: <1>https://</1>": "Protokoll erforderlich: <1>https://</1>",
   "Must provide protocol: <1>http://</1> or <3>https://</3>": "Protokoll erforderlich: <1>http://</1> oder <3>https://</3>",
   "CORS policy won't allow fetching resources served over http from https, use a <1>https://</1> domain": "Die CORS-Politik erlaubt es nicht, Ressourcen über http von https zu laden, benutze eine <1>https://</1>-Domain",
@@ -96,6 +99,12 @@
   "Save the JSON style to your computer.": "Speichere den JSON Stil auf deinem Computer.",
   "Save as": "Speichern unter",
   "Create HTML": "HTML erstellen",
+  "Key": "Schlüssel",
+  "Value": "Wert",
+  "Remove variable": "Variable entfernen",
+  "Global State Variables": "Globale Zustandsvariablen",
+  "No global state variables defined. Add variables to create reusable values in your style.": "Keine globalen Zustandsvariablen definiert. Füge Variablen hinzu, um wiederverwendbare Werte in deinem Stil zu erstellen.",
+  "Add Variable": "Variable hinzufügen",
   "Cancel": "Abbrechen",
   "Open Style": "Stil öffnen",
   "Open local Style": "Lokalen Stil öffnen",
@@ -121,9 +130,10 @@
   "Light intensity": "Lichtintensität",
   "Light position": "Lichtposition",
   "Terrain source": "Geländequelle",
-  "Terrain exaggeration": "Gelände-Übertreibung",
+  "Terrain exaggeration": "Geländeüberhöhung",
   "Transition delay": "Übergangsverzögerung",
   "Transition duration": "Übergangsdauer",
+  "Projection": "Projektion",
   "Open Layers (experimental)": "Ebenen öffnen (experimentell)",
   "Shortcuts menu": "Shortcuts-Menü",
   "Open modal": "Modale Fenster öffnen",
@@ -201,10 +211,8 @@
   "Radius": "Radius",
   "Color": "Farbe",
   "Outline color": "Umrissfarbe",
-  "Language": "Sprache",
   "Width": "Breite",
   "Height": "Höhe",
   "Field": "Feld",
-  "Size": "Größe",
-  "Press <1>ESC</1> to lose focus of any input box": "Drück <1>ESC</1>, um den Fokus von jedem Eingabefeld zu verlieren"
+  "Size": "Größe"
 }