[add] format keymap

README.md

@@ -17,16 +17,17 @@ In principle, the LSP can be used in any environment that can make use of a LSP
 Samples using common browser based code editors are available. The `CodeMirror 6` sample is the most functional.
 
 These examples are self contained (no internet access required). Some make use of recent html features, for instance [popovertarget](https://caniuse.com/?search=popovertarget)
-### Using `CodeMirror6` https://codemirror.net/
+### `CodeMirror6` https://codemirror.net/
 * `webapp/static/codemirror` A test html page using the [CodeMirror6 editor](https://codemirror.net/)  that connects to the BaseX LSP instance
 
 #### uses
 * https://codemirror.net/docs/ref/#lsp-client
-#### alternatives
+* [https://github.com/codemirror/legacy-modes/](https://github.com/codemirror/legacy-modes/blob/main/README.md#modexquery)  `xquery` mode provides browser based syntax highlighting (XQuery 3.1?)
+#### alternative LSP interfaces
 * https://github.com/FurqanSoftware/codemirror-languageserver
 * https://hjr265.me/blog/codemirror-lsp/
   
-### Using `Ace Editor`
+###  `Ace Editor`
 * `webapp/static/ace` A test html page using the [Ace editor](https://ace.c9.io/)  that connects to the BaseX LSP instance
 @TODO fix
 #### Uses
@@ -43,7 +44,7 @@ I needed `set NODE_OPTIONS=--max_old_space_size=8192` for build to complete
 Or `node --max-old-space-size=8192 node_modules/webpack-dev-serve
 r/bin/webpack-dev-server.js`
 
-### Monaco
+### `Monaco editor`
 @TODO create
 https://socket.dev/npm/package/monaco-editor
 
@@ -58,7 +59,7 @@ State is held in [websocket attributes](https://docs.basex.org/main/WebSocket_Fu
 |file-{uuid}|name of websocket attribute with textDocument|
 |parse-{uuid}|name of websocket attribute with parse tree XML|
 
-#### Grammar source
+#### XQuery 4.0 parser
 The ebnf is taken from Gunther Rademacher's rex-parser-generator
 [XQuery-40.ebnf](https://github.com/GuntherRademacher/rex-parser-generator/blob/main/docs/sample-grammars/XQuery-40.ebnf)
 

bundles/src/lsp.js

@@ -16,7 +16,8 @@ import { foldGutter, indentOnInput, indentUnit, bracketMatching, foldKeymap,
 
 import { closeBrackets, autocompletion, closeBracketsKeymap, completionKeymap } from '@codemirror/autocomplete';
 
-import { LSPClient, LSPPlugin, languageServerSupport, languageServerExtensions,formatDocument } from "@codemirror/lsp-client";
+import { LSPClient, LSPPlugin, languageServerSupport, languageServerExtensions,
+    formatDocument,formatKeymap } from "@codemirror/lsp-client";
 
 import { xQuery } from "@codemirror/legacy-modes/mode/xquery"
 
@@ -112,4 +113,4 @@ function listCommands(view) {
 
 export { baseExts, EditorView, EditorState, StateEffect, LSPPlugin, LSPClient, 
      openSearchPanel, openLintPanel, languageServerSupport, languageServerExtensions,
-     simpleWebSocketTransport, linter,  formatDocument, debouncedChangeListener, listCommands };
+     simpleWebSocketTransport, linter,  formatDocument,keymap,formatKeymap, debouncedChangeListener, listCommands };

webapp/static/clients/codemirror/index.html

@@ -86,14 +86,23 @@
                         <label for="symbols">Symbols:</label><select id="symbols" disabled="disabled"></select>
                     </div>
                     <div class="btn-group btn-group-sm " role="group" aria-label="Second group">
-                        <button id="search" type="button" class="btn btn-light"><i class="bi bi-search"></i></button>
+
-                        <button id="lint" type="button" class="btn btn-light"><i class="bi bi-info-square"></i></button>
+                        <button id="search" title="Search" type="button" class="btn btn-light"><i
-                        <button id="sync" type="button" class="btn btn-light">
+                                class="bi bi-search"></i></button>
+
+                        <button id="lint" title="Diagnostics" type="button" class="btn btn-light"><i
+                                class="bi bi-info-square"></i></button>
+
+                        <button id="sync" title="Sync changes to server" type="button" class="btn btn-light">
                             <i class="bi bi-arrow-repeat"></i>
                         </button>
                     </div>
                     <div class="btn-group" role="group" aria-label="Third group">
-                        <button id="format" type="button" class="btn btn-light" title="Format"><i
+
+                        <button id="syntax" type="button" class="btn btn-light" title="Syntax"><i
+                                class="bi bi-chat"></i></button>
+
+                        <button id="format" type="button" class="btn btn-light" title="Format (Shift-Alt-f)"><i
                                 class="bi bi-justify-left"></i></button>
 
                         <button type="button" class="btn btn-light" popovertarget="popSettings" title="Settings">

webapp/static/clients/codemirror/lsp.bundle.js

@@ -30109,6 +30109,8 @@ ${text}</tr>
   exports.baseExts = baseExts;
   exports.debouncedChangeListener = debouncedChangeListener;
   exports.formatDocument = formatDocument;
+  exports.formatKeymap = formatKeymap;
+  exports.keymap = keymap;
   exports.languageServerExtensions = languageServerExtensions;
   exports.languageServerSupport = languageServerSupport;
   exports.linter = linter;

webapp/static/clients/codemirror/script.js

@@ -91,7 +91,8 @@ function connect() {
 
             view.dispatch({
                 effects: lsp.StateEffect.appendConfig.of(
-                    [lsp.linter(null, { autoPanel: true }), ...extLsp, up])
+                    [lsp.linter(null, { autoPanel: true }), ...extLsp, up,
+                        lsp.keymap.of([...lsp.formatKeymap])])
             })
         })
         .catch(r => { connectStatus(false); alert("connection failed: " + server) });