diff --git a/public/app/core/services/withFocusedPanelId.ts b/public/app/core/services/withFocusedPanelId.ts index 857144ee706..9c67c0c71ca 100644 --- a/public/app/core/services/withFocusedPanelId.ts +++ b/public/app/core/services/withFocusedPanelId.ts @@ -2,6 +2,14 @@ export function withFocusedPanel(fn: (panelId: number) => void) { return () => { const elements = document.querySelectorAll(':hover'); + // Handle keyboard focus first + const focusedGridElement = document.activeElement?.closest('[data-panelid]'); + + if (focusedGridElement instanceof HTMLElement && focusedGridElement.dataset?.panelid) { + fn(parseInt(focusedGridElement.dataset?.panelid, 10)); + return; + } + for (let i = elements.length - 1; i > 0; i--) { const element = elements[i]; if (element instanceof HTMLElement && element.dataset?.panelid) { diff --git a/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts b/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts index 99123eaf9ca..3a111f3421a 100644 --- a/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts +++ b/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts @@ -146,6 +146,16 @@ export function setupKeyboardShortcuts(scene: DashboardScene) { export function withFocusedPanel(scene: DashboardScene, fn: (vizPanel: VizPanel) => void) { return () => { const elements = document.querySelectorAll(':hover'); + const focusedGridElement = document.activeElement?.closest('[data-viz-panel-key]'); + + if (focusedGridElement instanceof HTMLElement && focusedGridElement.dataset?.vizPanelKey) { + const panelKey = focusedGridElement.dataset?.vizPanelKey; + const vizPanel = sceneGraph.findObject(scene, (o) => o.state.key === panelKey); + if (vizPanel && vizPanel instanceof VizPanel) { + fn(vizPanel); + return; + } + } for (let i = elements.length - 1; i > 0; i--) { const element = elements[i];