From ac21aa9579fcdbfecef85ef319bd51d4541fe530 Mon Sep 17 00:00:00 2001
From: Dariusz L <dl122@wp.pl>
Date: Wed, 2 Jul 2025 09:33:13 +0200
Subject: [PATCH] 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.
---
 js/CanvasLayersPanel.js | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/js/CanvasLayersPanel.js b/js/CanvasLayersPanel.js
index 77b0ca8..47b4707 100644
--- a/js/CanvasLayersPanel.js
+++ b/js/CanvasLayersPanel.js
@@ -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;