| 64 | } |
| 65 | |
| 66 | #setupSort() { |
| 67 | this.#headers = Array.from(this.#table.querySelectorAll('thead th[data-sort]')); |
| 68 | |
| 69 | this.#headers.forEach(header => { |
| 70 | header.scope = header.scope || 'col'; |
| 71 | |
| 72 | let button = header.querySelector(':scope > [data-table-sort-button]'); |
| 73 | if (!button) { |
| 74 | button = document.createElement('button'); |
| 75 | button.type = 'button'; |
| 76 | button.setAttribute('data-table-sort-button', ''); |
| 77 | |
| 78 | while (header.firstChild) { |
| 79 | button.appendChild(header.firstChild); |
| 80 | } |
| 81 | header.appendChild(button); |
| 82 | } |
| 83 | |
| 84 | button.addEventListener('click', () => this.#sortBy(header), { signal: this.#controller.signal }); |
| 85 | }); |
| 86 | } |
| 87 | |
| 88 | #setupFilter() { |
| 89 | this.#filter?.addEventListener('input', () => this.#applyFilter(), { signal: this.#controller.signal }); |