[add] file read

bundles/cm6/lsp.js

@@ -4,7 +4,7 @@ import { EditorState, StateEffect, Compartment } from '@codemirror/state';
 import {
     lineNumbers, highlightActiveLineGutter, highlightWhitespace,
     drawSelection, rectangularSelection, crosshairCursor, highlightActiveLine,
-    keymap, dropCursor, EditorView
+    keymap, dropCursor, EditorView,tooltips
 } from '@codemirror/view';
 
 import { openSearchPanel, highlightSelectionMatches, searchKeymap } from '@codemirror/search';
@@ -90,7 +90,7 @@ const baseExts = [
     drawSelection(),
     dropCursor(),
     EditorState.allowMultipleSelections.of(true),
-
+    tooltips({   }), // clipped
     keymap.of([indentWithTab]),
     indentOnInput(),
     syntaxHighlighting(defaultHighlightStyle, { fallback: true }),

package-lock.json

@@ -17,6 +17,8 @@
         "@codemirror/theme-one-dark": "^6.1.0",
         "@codemirror/view": "^6.38.1",
         "@replit/codemirror-minimap": "^0.5.2",
+        "@zenfs/core": "^2.4.2",
+        "@zenfs/dom": "^1.1.7",
         "ace-builds": "^1.43.2",
         "ace-linters": "^1.8.3",
         "beercss": "^3.12.3"
@@ -1087,6 +1089,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/node": {
+      "version": "24.9.1",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.9.1.tgz",
+      "integrity": "sha512-QoiaXANRkSXK6p0Duvt56W208du4P9Uye9hWLWgGMDTEoKPhuenzNcC4vGUmrNkiOKTlIrBoyNQYNpSwfEZXSg==",
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~7.16.0"
+      }
+    },
     "node_modules/@types/resolve": {
       "version": "1.20.2",
       "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.2.tgz",
@@ -1094,6 +1105,70 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@xterm/xterm": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@xterm/xterm/-/xterm-5.5.0.tgz",
+      "integrity": "sha512-hqJHYaQb5OptNunnyAnkHyM8aCjZ1MEIDTQu1iIbbTD/xops91NB5yq1ZK/dC2JDbVWtF23zUtl9JE2NqwT87A==",
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/@zenfs/core": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/@zenfs/core/-/core-2.4.2.tgz",
+      "integrity": "sha512-vqSX3Og0vz92uUkC2/FTZTp8zoP+5A0ZRyUKpdxBmpBASJsaM/2xEeYtT+OTfv5RVxgAGFnaK4g2EzBST6KOYA==",
+      "license": "LGPL-3.0-or-later",
+      "dependencies": {
+        "@types/node": "^24.1.0",
+        "buffer": "^6.0.3",
+        "eventemitter3": "^5.0.1",
+        "kerium": "^1.3.4",
+        "memium": "^0.3.10",
+        "readable-stream": "^4.5.2",
+        "utilium": "^2.5.0"
+      },
+      "bin": {
+        "make-index": "scripts/make-index.js",
+        "zci": "scripts/ci-cli.js",
+        "zenfs-test": "scripts/test.js"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://github.com/sponsors/james-pre"
+      }
+    },
+    "node_modules/@zenfs/dom": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/@zenfs/dom/-/dom-1.1.7.tgz",
+      "integrity": "sha512-16FlIIBCeWEGr/As+1eRLZw0w2IDQAbXiVzFQqrfw7R2yd60jUpeiT6JYzsyzX2jChDcNg3sQ5cvnj2hPZgs8w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://github.com/sponsors/james-pre"
+      },
+      "peerDependencies": {
+        "@zenfs/core": "^2.1.0",
+        "kerium": "^1.3.4",
+        "utilium": "^2.0.0"
+      }
+    },
+    "node_modules/abort-controller": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/abort-controller/-/abort-controller-3.0.0.tgz",
+      "integrity": "sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==",
+      "license": "MIT",
+      "dependencies": {
+        "event-target-shim": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=6.5"
+      }
+    },
     "node_modules/ace-builds": {
       "version": "1.43.4",
       "resolved": "https://registry.npmjs.org/ace-builds/-/ace-builds-1.43.4.tgz",
@@ -1137,15 +1212,59 @@
         "node": ">=0.4.0"
       }
     },
+    "node_modules/base64-js": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
+      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/beercss": {
-      "version": "3.12.12",
+      "version": "3.12.13",
-      "resolved": "https://registry.npmjs.org/beercss/-/beercss-3.12.12.tgz",
+      "resolved": "https://registry.npmjs.org/beercss/-/beercss-3.12.13.tgz",
-      "integrity": "sha512-xjlBAaKQljk0BI1ld9D4U6yf1lIqNrRwKJQKAXXw2BQLSTctZeBdTfPQQjffkty+QpC2PYeVxT6DtJVwqfVasw==",
+      "integrity": "sha512-zsg15us8pSLTupIOzFFJqpJ7eJDLV6whsxT6GcRYGnYaF0ka45+HQ/u3+ldSUkCeyA5J24g6csEuMW8tqrI/0w==",
       "license": "MIT",
       "dependencies": {
         "material-dynamic-colors": "^1.1.2"
       }
     },
+    "node_modules/buffer": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz",
+      "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "base64-js": "^1.3.1",
+        "ieee754": "^1.2.1"
+      }
+    },
     "node_modules/buffer-from": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
@@ -1264,6 +1383,30 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/event-target-shim": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-5.0.1.tgz",
+      "integrity": "sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/eventemitter3": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
+      "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==",
+      "license": "MIT"
+    },
+    "node_modules/events": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
+      "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8.x"
+      }
+    },
     "node_modules/find-up": {
       "version": "6.3.0",
       "resolved": "https://registry.npmjs.org/find-up/-/find-up-6.3.0.tgz",
@@ -1341,6 +1484,26 @@
         "node": "^14.13.1 || >=16.0.0"
       }
     },
+    "node_modules/ieee754": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
+      "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
     "node_modules/is-core-module": {
       "version": "2.16.1",
       "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
@@ -1371,6 +1534,19 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/kerium": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/kerium/-/kerium-1.3.7.tgz",
+      "integrity": "sha512-3pFGohBrDeGkxBvRJ1FKrkN6HpiLAvHRZ4rk5zZUExzslgDZm/iijDRKXTHHJpyHQaBlOFxVnpqYp76u5qmQSg==",
+      "license": "MIT",
+      "dependencies": {
+        "utilium": "^2.0.0"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://github.com/sponsors/james-pre"
+      }
+    },
     "node_modules/locate-path": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-7.2.0.tgz",
@@ -1431,6 +1607,20 @@
         "material-dynamic-colors": "cli.js"
       }
     },
+    "node_modules/memium": {
+      "version": "0.3.10",
+      "resolved": "https://registry.npmjs.org/memium/-/memium-0.3.10.tgz",
+      "integrity": "sha512-7LdicWe1tGBLrstNXdcH1Wh2iiAC4u8eU/iGuBvoVAkG20qU2d8bQk3/y40FIrM6mk5N+hpiqFI7PmOlR1hNOg==",
+      "license": "LGPL-3.0-or-later",
+      "dependencies": {
+        "kerium": "^1.3.2",
+        "utilium": "^2.0.0"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://github.com/sponsors/james-pre"
+      }
+    },
     "node_modules/minify": {
       "version": "9.2.0",
       "resolved": "https://registry.npmjs.org/minify/-/minify-9.2.0.tgz",
@@ -1558,6 +1748,31 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/process": {
+      "version": "0.11.10",
+      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
+      "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6.0"
+      }
+    },
+    "node_modules/readable-stream": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-4.7.0.tgz",
+      "integrity": "sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg==",
+      "license": "MIT",
+      "dependencies": {
+        "abort-controller": "^3.0.0",
+        "buffer": "^6.0.3",
+        "events": "^3.3.0",
+        "process": "^0.11.10",
+        "string_decoder": "^1.3.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      }
+    },
     "node_modules/readjson": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/readjson/-/readjson-2.2.2.tgz",
@@ -1583,13 +1798,13 @@
       }
     },
     "node_modules/resolve": {
-      "version": "1.22.10",
+      "version": "1.22.11",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.11.tgz",
-      "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==",
+      "integrity": "sha512-RfqAvLnMl313r7c9oclB1HhUEAezcpLjz95wFH4LVuhk9JF/r22qmVP9AMmOU4vMX7Q8pN8jwNg/CSpdFnMjTQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "is-core-module": "^2.16.0",
+        "is-core-module": "^2.16.1",
         "path-parse": "^1.0.7",
         "supports-preserve-symlinks-flag": "^1.0.0"
       },
@@ -1660,6 +1875,26 @@
         "pnpm": ">=6"
       }
     },
+    "node_modules/safe-buffer": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/simport": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/simport/-/simport-1.2.0.tgz",
@@ -1695,6 +1930,15 @@
         "source-map": "^0.6.0"
       }
     },
+    "node_modules/string_decoder": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
+      "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
+      "license": "MIT",
+      "dependencies": {
+        "safe-buffer": "~5.2.0"
+      }
+    },
     "node_modules/style-mod": {
       "version": "4.1.3",
       "resolved": "https://registry.npmjs.org/style-mod/-/style-mod-4.1.3.tgz",
@@ -1782,6 +2026,31 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/undici-types": {
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.16.0.tgz",
+      "integrity": "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==",
+      "license": "MIT"
+    },
+    "node_modules/utilium": {
+      "version": "2.5.3",
+      "resolved": "https://registry.npmjs.org/utilium/-/utilium-2.5.3.tgz",
+      "integrity": "sha512-iJ4JVfjNGKJEcYYv5deZ/4cOQtBFZEzfpgA6BX0Qva2ax73Uy2LBbbDKVQQorZxUtq3EHdX01p94oc78/8SEew==",
+      "license": "LGPL-3.0-or-later",
+      "dependencies": {
+        "eventemitter3": "^5.0.1"
+      },
+      "bin": {
+        "lice": "scripts/lice.js"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://github.com/sponsors/james-pre"
+      },
+      "optionalDependencies": {
+        "@xterm/xterm": "^5.5.0"
+      }
+    },
     "node_modules/vscode-jsonrpc": {
       "version": "8.2.0",
       "resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-8.2.0.tgz",

package.json

@@ -12,6 +12,8 @@
     "@codemirror/theme-one-dark": "^6.1.0",
     "@codemirror/view": "^6.38.1",
     "@replit/codemirror-minimap": "^0.5.2",
+    "@zenfs/core": "^2.4.2",
+    "@zenfs/dom": "^1.1.7",
     "ace-builds": "^1.43.2",
     "ace-linters": "^1.8.3",
     "beercss": "^3.12.3"

webapp/lsp/context.xqm

@@ -18,7 +18,7 @@ declare function ctx:map($fn as element(fos:function))
 {
   $fn!map{
    "label":string(@name),
-   "kind": 3,
+   "kind": $lspt:CompletionItemKindMap("Function"),
    "detail":string($fn/fos:summary/*),
    "documentation":`{ ctx:summary(.) } <a href="{ $ctx:doclink }{ string(@name) }" target="_blank">Spec</a>`
                    !lspt:MarkupContent("markdown",.)

webapp/static/clients/codemirror/grail.html

@@ -64,7 +64,10 @@
 
             </nav>
         </header>
-        <nav class="page-nav">
+      
+
+        <main class="page-main" style="overflow: auto;">
+              <nav class="page-nav">
             <div class="navbar py-0 bg-light">
 
                 <div class="btn-group mr-2" role="group" aria-label="First group">
@@ -97,23 +100,29 @@
                     <button type="button" class="btn btn-light" popovertarget="popSettings" title="Settings">
                         <i class="codicon codicon-settings"></i></button>
                 </div>
+
                 <div class="btn-group" role="group" aria-label="Third group">
                     <button id="fullscreen" title="Full screen editor" type="button" class="btn btn-light">
                         <i class="codicon codicon-screen-full"></i>
                     </button>
-                    <button id="syntax" type="button" class="btn btn-light" title="Unused"><i
-                            class="codicon codicon-comment"></i></button>
 
-                    <button id="wordAt" type="button" class="btn btn-light" title="word at">
+                    <button id="bnNew" type="button" class="btn btn-light" title="New file"><i
-                        <i>1</i></button>
+                            class="codicon codicon-new-file"></i></button>
 
-                    <button id="unused3" type="button" class="btn btn-light" title="unused3">
+                    <button id="bnRead" type="button" class="btn btn-light" title="LOad local file"><i
-                        <i>3</i></button>
+                            class="codicon codicon-cloud-upload"></i></button>
+                    <input type="file" id="fileElem" multiple accept="*/*" style="display: none;"/>
+
+                    <button id="bnSave" type="button" class="btn btn-light" title="save view">
+                       <i class="codicon codicon-git-stash"></i></button>
+
+                    <button id="bnLoad" type="button" class="btn btn-light" title="load view">
+                      <i class="codicon codicon-git-stash-pop"></i></button>
+                    <button id="bnWordAt" type="button" class="btn btn-light" title="word at">
+                       <i class="codicon codicon-whole-word"></i></button>
                 </div>
             </div>
         </nav>
-
-        <main class="page-main" style="overflow: auto;">
             <!-- Editor goes in here -->
             <div id="editor"></div>
         </main>
@@ -138,7 +147,7 @@
                 <summary>Messages 
                     <i  id="msgIcon" class='codicon codicon-kebab-vertical' style="float:right"></i>
                 </summary>
-                <div id="msg">(msgs)<i class='codicon codicon-symbol-method'></i></div>
+                <qd-list id="msgList" style="flex-grow:1;"></qd-list>
             </details>
         </aside>
 

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

@@ -13958,6 +13958,12 @@ var lsp = (function (exports) {
           return true;
       }
   }
+  /**
+  Creates an extension that configures tooltip behavior.
+  */
+  function tooltips(config = {}) {
+      return tooltipConfig.of(config);
+  }
   function windowSpace(view) {
       let docElt = view.dom.ownerDocument.documentElement;
       return { top: 0, left: 0, bottom: docElt.clientHeight, right: docElt.clientWidth };
@@ -31359,7 +31365,7 @@ ${text}</tr>
       drawSelection(),
       dropCursor(),
       EditorState.allowMultipleSelections.of(true),
-
+      tooltips({   }), // clipped
       keymap.of([indentWithTab]),
       indentOnInput(),
       syntaxHighlighting(defaultHighlightStyle, { fallback: true }),

webapp/static/clients/codemirror/script.js

@@ -5,7 +5,9 @@ const view = new lsp.EditorView({
 let doc = "xquery version '3.1';\n(:~ comment:)\nmodule namespace pdfbox='ns';\n";
 var client;
 var extLint;
-
+var workspace={
+  "file:///some/file.xqm":null
+};
 
 function $(id) { return document.getElementById(id) };
 
@@ -41,7 +43,7 @@ $("search").onclick = e => lsp.openSearchPanel(view);
 $("fullscreen").onclick = e => $("editor").requestFullscreen();
 
 
-$("wordAt").onclick = e => {
+$("bnWordAt").onclick = e => {
     let pos = view.state.selection.main.head;
     let w = view.state.wordAt(pos);
     alert("wordAt " + JSON.stringify(w));
@@ -82,10 +84,16 @@ $("lint").onclick = async e => {
 };
 
 $("sync").onclick = e => { client.sync(); console.log("XXXsync"); };
-
+$("bnSave").onclick = e => { workspace[iFile]=view.state; };
-$("format").onclick = e => {
+$("bnLoad").onclick = e => { const v=workspace[iFile];if(v)view.setState(v)};
-    console.log("FMT", lsp.formatDocument(view));
+$("bnRead").onclick = e => { const c=$("fileElem");
-};
+                             c.click();
+                             const f=c.files[0];
+                             if(!f)return;
+                             c.value=null;
+                             alert(f.name);
+                            };
+$("format").onclick = e => { console.log("FMT", lsp.formatDocument(view));};
 
 $("load").onchange = e => {
     const url = e.target.value;
@@ -112,6 +120,7 @@ $("msgIcon").onclick=e=>{
     alert("NOT YET")
 };
 
+
 function updateSettings(event) {
     event.preventDefault();
 
@@ -177,12 +186,11 @@ function incoming(msg) {
 
 function log(rpc) {
     console.log("<-", rpc)
-    if (rpc.id) return
+    if (rpc.id) return;
-    const text = rpc.method;
+    const when=(new Date()).toISOString();
-    const li = document.createElement("li");
+    const msg = {name:rpc.method, detail:when.substring(1+when.indexOf("T")), kind:23 /* event */ };
-    const n = $("traffic").childElementCount + " ";
+    //name,details,kind
-    li.appendChild(document.createTextNode(n + text));
+    $("msgList").setData([msg],true)
-    $("traffic").insertBefore(li, $("traffic").firstChild)
 };
 
 function formFromStore(name) {

webapp/static/clients/codemirror/wc-qd-list.js

@@ -1,6 +1,6 @@
 /* Define a web component providing a settable and selectable list
  $("symList").setData(r, append = false);
- where r is array of objects with properties name,details,kind
+ where r is array of objects with properties name,detail,kind
 
 https://stackoverflow.com/questions/50404970/web-components-pass-data-to-and-from
 https://www.w3schools.com/howto/howto_js_treeview.asp
@@ -64,9 +64,7 @@ class ListComponent extends HTMLElement {
 
     /* Render the list items #data */
     render() {
-        const list = document.createElement('ul');
+        // eventhandler for click and keyboard, updates usage of selected class and raises event
-        list.style = "overflow: auto;";
-
         const select = e => {
             if(e.type ==="keyup" && !(e.key==="Enter" )) return;
             this.#shadow.querySelectorAll('li.selected').forEach(item => { item.className = ''; });
@@ -80,6 +78,9 @@ class ListComponent extends HTMLElement {
                 composed: true
             }));
         };
+        // create list and items
+         const list = document.createElement('ul');
+        list.style = "overflow: auto;"; 
         this.#data.forEach((item, index) => {
             const listItem = document.createElement('li');
             const icon=this.#iconKinds[item.kind];