Enable keyboard interaction in layers panel

Added tabIndex to the panel container to allow keyboard focus and attached a keydown event listener to forward keyboard events to the main interaction handler. This improves accessibility and enables keyboard-based layer deletion from the panel.
This commit is contained in:
Dariusz L
2025-07-02 09:33:13 +02:00
parent cae24310db
commit ac21aa9579

View File

@@ -29,6 +29,7 @@ export class CanvasLayersPanel {
// Główny kontener panelu
this.container = document.createElement('div');
this.container.className = 'layers-panel';
this.container.tabIndex = 0; // Umożliwia fokus na panelu
this.container.innerHTML = `
<div class="layers-panel-header">
<span class="layers-panel-title">Warstwy</span>
@@ -49,6 +50,14 @@ export class CanvasLayersPanel {
// Setup event listeners dla przycisków
this.setupControlButtons();
// Dodaj listener dla klawiatury, aby usuwanie działało z panelu
this.container.addEventListener('keydown', (e) => {
// Przekaż zdarzenie do głównego handlera interakcji
if (this.canvas.canvasInteractions) {
this.canvas.canvasInteractions.handleKeyDown(e);
}
});
log.debug('Panel structure created');
return this.container;