diff --git a/packages/frontend-core/src/components/grid/layout/Grid.svelte b/packages/frontend-core/src/components/grid/layout/Grid.svelte
index 39a67d44eb..3d5bf01bf9 100644
--- a/packages/frontend-core/src/components/grid/layout/Grid.svelte
+++ b/packages/frontend-core/src/components/grid/layout/Grid.svelte
@@ -80,6 +80,7 @@
loading,
rowHeight,
contentLines,
+ gridFocused,
} = context
// Keep stores up to date
@@ -116,6 +117,8 @@
class:is-reordering={$isReordering}
class:stripe={$config.stripeRows}
style="--row-height:{$rowHeight}px; --default-row-height:{DefaultRowHeight}px; --gutter-width:{GutterWidth}px; --max-cell-render-height:{MaxCellRenderHeight}px; --max-cell-render-width-overflow:{MaxCellRenderWidthOverflow}px; --content-lines:{$contentLines};"
+ on:mouseenter={() => gridFocused.set(true)}
+ on:mouseleave={() => gridFocused.set(false)}
>
{#if showControls}
diff --git a/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte b/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
index a210e125ff..c4b7c598cd 100644
--- a/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
+++ b/packages/frontend-core/src/components/grid/overlays/KeyboardManager.svelte
@@ -15,6 +15,7 @@
selectedRows,
config,
menu,
+ gridFocused,
} = getContext("grid")
const ignoredOriginSelectors = [
@@ -24,6 +25,11 @@
// Global key listener which intercepts all key events
const handleKeyDown = e => {
+ // Ignore completely if the grid is not focused
+ if (!$gridFocused) {
+ return
+ }
+
// Avoid processing events sourced from certain origins
if (e.target?.closest) {
for (let selector of ignoredOriginSelectors) {
diff --git a/packages/frontend-core/src/components/grid/stores/ui.js b/packages/frontend-core/src/components/grid/stores/ui.js
index b62e883437..eeea8fff43 100644
--- a/packages/frontend-core/src/components/grid/stores/ui.js
+++ b/packages/frontend-core/src/components/grid/stores/ui.js
@@ -15,6 +15,7 @@ export const createStores = () => {
const hoveredRowId = writable(null)
const rowHeight = writable(DefaultRowHeight)
const previousFocusedRowId = writable(null)
+ const gridFocused = writable(false)
// Derive the current focused row ID
const focusedRowId = derived(
@@ -46,6 +47,7 @@ export const createStores = () => {
previousFocusedRowId,
hoveredRowId,
rowHeight,
+ gridFocused,
selectedRows: {
...selectedRows,
actions: {