quodatum/basex-lsp
1
0
Fork 0
Code Issues 12 Activity Actions

[fix] list selection

Browse source
This commit is contained in:
Andy Bunce 2025-10-06 10:49:43 +01:00
parent de11f318e9
commit d98420c8d9
1 changed files with 10 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
webapp/static/clients/codemirror/list.js
View file

@ -8,18 +8,18 @@ class ListComponent extends HTMLElement {
#iconKinds; //array from kind integer to codicon name
constructor() {
super();
this.#shadow = this.attachShadow({ mode: "open" ,delegatesFocus: true});
this.#shadow = this.attachShadow({ mode: "open", delegatesFocus: true });
this.#data = [];
this.#iconKinds = [];
this.render();
}
setData(newData,icons, append = false) {
setData(newData, icons, append = false) {
if (!Array.isArray(newData)) {
console.warn("Invalid format, expected an array.");
return;
}
this.#iconKinds=icons;
this.#iconKinds = icons;
this.#data = append ? this.#data.concat(newData) : structuredClone(newData);
this.render();
}
@ -34,14 +34,17 @@ class ListComponent extends HTMLElement {
/* Render the list items #data */
render() {
const list = document.createElement('ul');
list.style="max-height:80cqh;overflow: auto;";
const shad=this.#shadow;
list.style = "max-height:80cqh;overflow: auto;";
const shad = this.#shadow;
this.#data.forEach((item, index) => {
const listItem = document.createElement('li');
listItem.innerHTML = `<a href="#"><i class='codicon codicon-${this.#iconKinds[item.kind]}'></i>
<span>${item.name} - ${item.detail}</span></a>`;
// Adding a click event listener for user interaction
listItem.addEventListener('click', () => {
listItem.addEventListener('click', function (e) {
shad.querySelectorAll('li.selected').forEach(item => { item.className = ''; });
e.currentTarget.className = 'selected';
console.log('Item clicked:', item, listItem);
// You can dispatch a custom event here if needed.
this.dispatchEvent(new CustomEvent('itemSelected', {
@ -50,12 +53,6 @@ class ListComponent extends HTMLElement {
composed: true
}));
});
list.addEventListener('click', function (e) {
if (e.target.tagName === 'LI') {
shad.querySelectorAll('li.selected').forEach(item=>{item.className = '';});
e.target.className = 'selected';
}
});
list.appendChild(listItem);
});