[add] format keymap

This commit is contained in:
Andy Bunce 2025-08-29 15:27:18 +01:00
parent 3833219e99
commit 83c80a4b8f
6 changed files with 30 additions and 16 deletions

View file

@ -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)

View file

@ -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 };

View file

@ -15,8 +15,8 @@
<body>
<nav class="navbar bg-body-tertiary">
<div class="container-fluid">
<a id="help" class="navbar-brand" >XQuery 4.0 LSP client
<button popovertarget="popHelp"><i class="bi bi-info-circle"></i></button></a>
<a id="help" class="navbar-brand">XQuery 4.0 LSP client
<button popovertarget="popHelp"><i class="bi bi-info-circle"></i></button></a>
<ul class="nav nav-pills">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Editor</a>
@ -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="sync" type="button" class="btn btn-light">
<button id="search" title="Search" type="button" class="btn btn-light"><i
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">
@ -112,7 +121,7 @@
</header>
<div class="modal-body">
<div id="state">🔴</div>
<input id="iServer" type="text" style="width:25em" />
<input id="iServer" type="text" style="width:25em" />
</div>
<div class="modal-footer">
<button id="connect">connect</button>

View file

@ -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;

File diff suppressed because one or more lines are too long

View file

@ -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) });