[mod] latest deps

bundles/src/lsp.js

@@ -1,10 +1,15 @@
 import { EditorState } from '@codemirror/state';
+
+import { lineNumbers, highlightActiveLineGutter, highlightSpecialChars, drawSelection, rectangularSelection, crosshairCursor, highlightActiveLine, keymap, EditorView } from '@codemirror/view';
+
 import { openSearchPanel, highlightSelectionMatches, searchKeymap } from '@codemirror/search';
 import { openLintPanel, lintGutter, lintKeymap, linter, setDiagnostics, } from "@codemirror/lint"
 import { indentWithTab, history, defaultKeymap, historyKeymap } from '@codemirror/commands';
-import { foldGutter, indentOnInput, indentUnit, bracketMatching, foldKeymap, syntaxHighlighting, defaultHighlightStyle } from '@codemirror/language';
+import { foldGutter, indentOnInput, indentUnit, bracketMatching, foldKeymap, StreamLanguage } from '@codemirror/language';
+
 import { closeBrackets, autocompletion, closeBracketsKeymap, completionKeymap } from '@codemirror/autocomplete';
-import { lineNumbers, highlightActiveLineGutter, highlightSpecialChars, drawSelection, dropCursor, rectangularSelection, crosshairCursor, highlightActiveLine, keymap, EditorView } from '@codemirror/view';
+
+import { xQuery } from "@codemirror/legacy-modes/mode/xquery"
 
 // Theme
 import { oneDark } from "@codemirror/theme-one-dark";
@@ -17,6 +22,7 @@ function simpleWebSocketTransport(uri) {
     let handlers = [];
     return new Promise(function (resolve, reject) {
         let sock = new WebSocket(uri);
+  
         sock.onmessage = e => { for (let h of handlers) h(e.data.toString()); };
         sock.onerror = e => reject(e);
         sock.onopen = () => resolve({
@@ -58,8 +64,7 @@ const baseExts = [
         ...searchKeymap,
         ...lintKeymap
     ]),
-    xml(),
+    StreamLanguage.define(xQuery)
-    syntaxHighlighting(defaultHighlightStyle, { fallback: true })
 ];
 
 function createEditorState(initialContents, extensions, options = {}) {
@@ -77,44 +82,40 @@ function createEditorView(state, parent) {
     return new EditorView({ state, parent });
 }
 
-class xqLinter {
-    constructor(parameters) {
-        this.fred = parameters;
-    }
-}
 function debouncedChangeListener({ delay = 750, onChange }) {
     let timeoutId = null;
     let lastContent = '';
-    
-    return EditorView.updateListener.of(update => {
-      if (update.docChanged) {
-        const currentContent = update.state.doc.toString();
-        
-        if (timeoutId) {
-          clearTimeout(timeoutId);
-        }
-        
-        timeoutId = setTimeout(() => {
-          if (currentContent !== lastContent) {
-            lastContent = currentContent;
-            onChange(currentContent, update.state);
-          }
-        }, delay);
-      }
-    });
-  };
 
-  function listCommands(view) {
+    return EditorView.updateListener.of(update => {
+        if (update.docChanged) {
+            const currentContent = update.state.doc.toString();
+
+            if (timeoutId) {
+                clearTimeout(timeoutId);
+            }
+
+            timeoutId = setTimeout(() => {
+                if (currentContent !== lastContent) {
+                    lastContent = currentContent;
+                    onChange(currentContent, update.state);
+                }
+            }, delay);
+        }
+    });
+};
+
+// map cmd->{keybings,fn}
+function listCommands(view) {
     const commands = new Map();
     const keymaps = view.state.facet(keymap);
     for (let km of keymaps) {
         for (let binding of km) {
-            if (binding.run && binding.run.name ) {
+            if (binding.run && binding.run.name) {
-                commands.set(binding.run.name ,{key:binding.key,fn:binding.run});
+                commands.set(binding.run.name, { key: binding.key, fn: binding.run });
             }
         }
     }
     return commands;
 };
 
-export { createEditorState, createEditorView, openSearchPanel, openLintPanel, languageServerSupport, baseExts, simpleWebSocketTransport, linter, LSPPlugin, setDiagnostics, xqLinter, LSPClient,debouncedChangeListener,listCommands };
+export { createEditorState, createEditorView, openSearchPanel, openLintPanel, languageServerSupport, baseExts, simpleWebSocketTransport, linter, LSPPlugin, setDiagnostics, LSPClient, debouncedChangeListener, listCommands };

package-lock.json

@@ -5,16 +5,17 @@
   "packages": {
     "": {
       "dependencies": {
-        "@codemirror/commands": "^6.1.2",
+        "@codemirror/commands": "^6.8.1",
-        "@codemirror/lang-javascript": "^6.1.1",
+        "@codemirror/lang-javascript": "^6.2.4",
         "@codemirror/lang-markdown": "^6.3.4",
         "@codemirror/lang-xml": "^6.1.0",
         "@codemirror/language-data": "^6.5.1",
+        "@codemirror/legacy-modes": "^6.5.1",
         "@codemirror/lint": "^6.8.5",
-        "@codemirror/lsp-client": "^6.0.0",
+        "@codemirror/lsp-client": "^6.1.0",
-        "@codemirror/search": "^6.2.3",
+        "@codemirror/search": "^6.5.11",
         "@codemirror/theme-one-dark": "^6.1.0",
-        "@codemirror/view": "^6.6.0",
+        "@codemirror/view": "^6.38.1",
         "ace-builds": "^1.43.2",
         "ace-linters": "^1.8.3"
       },

package.json

@@ -1,15 +1,16 @@
 {
   "dependencies": {
-    "@codemirror/commands": "^6.1.2",
+    "@codemirror/commands": "^6.8.1",
-    "@codemirror/lang-javascript": "^6.1.1",
+    "@codemirror/lang-javascript": "^6.2.4",
     "@codemirror/lang-markdown": "^6.3.4",
     "@codemirror/lang-xml": "^6.1.0",
     "@codemirror/language-data": "^6.5.1",
+    "@codemirror/legacy-modes": "^6.5.1",
     "@codemirror/lint": "^6.8.5",
-    "@codemirror/lsp-client": "^6.0.0",
+    "@codemirror/lsp-client": "^6.1.0",
-    "@codemirror/search": "^6.2.3",
+    "@codemirror/search": "^6.5.11",
     "@codemirror/theme-one-dark": "^6.1.0",
-    "@codemirror/view": "^6.6.0",
+    "@codemirror/view": "^6.38.1",
     "ace-builds": "^1.43.2",
     "ace-linters": "^1.8.3"
   },

webapp/static/clients/codemirror/index.html

@@ -15,8 +15,8 @@
 <body>
     <nav class="navbar bg-body-tertiary">
         <div class="container-fluid">
-            <a class="navbar-brand">XQuery 4.0 LSP client</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>
@@ -73,8 +73,8 @@
 
             <div class="col flex-grow-1" style="overflow: auto;">
                 <div class="navbar py-0 bg-light">
-                   
+
-                      <div class="btn-group mr-2" role="group" aria-label="First group">
+                    <div class="btn-group mr-2" role="group" aria-label="First group">
                         <label for="file">File:</label>
                         <input id="iFile" type="url" value="file:///some/file.xqm" />
                         <select id="language">
@@ -84,7 +84,7 @@
                             <option value="xml">xml</option>
                         </select>
                         <label for="symbols">Symbols:</label><select id="symbols" disabled="disabled"></select>
-                        </div>
+                    </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>
@@ -118,10 +118,11 @@
             <button id="connect">connect</button>
         </div>
     </dialog>
-
+    <popup-info id="popHelp">hhhh</popup-info>
     <dialog id="popSettings" popover>
         <header>Editor configuration
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"
+                onclick="$('popSettings').hidePopover(); "></button>
         </header>
         <div class="modal-body">
             @TODO

webapp/static/clients/codemirror/popover.js

@@ -10,72 +10,21 @@ class PopupInfo extends HTMLElement {
       const shadow = this.attachShadow({ mode: "open" });
   
       // Create spans
-      const wrapper = document.createElement("span");
+      const dialog = document.createElement("dialog");
-      wrapper.setAttribute("class", "wrapper");
+      dialog.setAttribute("id", this.getAttribute("id"));
-  
+      dialog.setAttribute("popover","popover");
-      const icon = document.createElement("span");
+      const header = document.createElement("header");
-      icon.setAttribute("class", "icon");
+      header.innerText="HEADE"
-      icon.setAttribute("tabindex", 0);
+      const main = document.createElement("main");
-  
+      main.innerText="MAIN"
-      const info = document.createElement("span");
+      const footer = document.createElement("footer");
-      info.setAttribute("class", "info");
+      footer.innerText="WWW"
-  
+      dialog.appendChild(header);
-      // Take attribute content and put it inside the info span
+      dialog.appendChild(main);
-      const text = this.getAttribute("data-text");
+      dialog.appendChild(footer)
-      info.textContent = text;
-  
-      // Insert icon
-      let imgUrl;
-      if (this.hasAttribute("img")) {
-        imgUrl = this.getAttribute("img");
-      } else {
-        imgUrl = "img/default.png";
-      }
-  
-      const img = document.createElement("img");
-      img.src = imgUrl;
-      icon.appendChild(img);
-  
-      // Create some CSS to apply to the shadow dom
-      const style = document.createElement("style");
-      console.log(style.isConnected);
-  
-      style.textContent = `
-        .wrapper {
-          position: relative;
-        }
-  
-        .info {
-          font-size: 0.8rem;
-          width: 200px;
-          display: inline-block;
-          border: 1px solid black;
-          padding: 10px;
-          background: white;
-          border-radius: 10px;
-          opacity: 0;
-          transition: 0.6s all;
-          position: absolute;
-          bottom: 20px;
-          left: 10px;
-          z-index: 3;
-        }
-  
-        img {
-          width: 1.2rem;
-        }
-  
-        .icon:hover + .info, .icon:focus + .info {
-          opacity: 1;
-        }
-      `;
-  
       // Attach the created elements to the shadow dom
-      shadow.appendChild(style);
+      shadow.appendChild(dialog);
-      console.log(style.isConnected);
+      
-      shadow.appendChild(wrapper);
-      wrapper.appendChild(icon);
-      wrapper.appendChild(info);
     }
   }
   

webapp/static/clients/codemirror/script.js

@@ -72,7 +72,7 @@ function connect() {
             client = new lsp.LSPClient().connect(transport);
             $("popConnect").hidePopover(); 
             connectStatus(true);
-            let extLsp = lsp.languageServerSupport(client, file, "xquery");
+            let extLsp = lsp.languageServerSupport(client, file, "XXXXX");
             extLint = lsp.linter(null,{ autoPanel: true });
             const doc = view.state.doc.toString();
             const state = lsp.createEditorState(doc, [...lsp.baseExts, extLsp, extLint,