[A11y] - Switching image using the Enter key

Add the ability to switch the displayed image in the gallery by pressing the Enter key on one of the thumbnails.
wix-incubator · Mar 14, 2024 · 9bd3bfe · 9bd3bfe
1 parent a0dabe4
commit 9bd3bfe
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/packages/gallery/src/components/gallery/proGallery/navigationPanel.js b/packages/gallery/src/components/gallery/proGallery/navigationPanel.js
@@ -51,6 +51,7 @@ class NavigationPanel extends React.Component {
       activeIndexOffsetMemory: this.activeIndexOffsetMemory,
       prevActiveIndex: this.prevActiveIndex,
     });
+    const enterKey = 'Enter';
 
     this.prevActiveIndex = activeIndex;
     this.activeIndexOffsetMemory = activeIndexOffsetMemory;
@@ -111,6 +112,11 @@ class NavigationPanel extends React.Component {
                 data-key={thumbnailItem.id}
                 style={itemStyle}
                 onClick={() => this.scrollToThumbnail(idx)}
+                onKeyDown={(e) => {
+                  if (e.key === enterKey) {
+                    this.scrollToThumbnail(idx);
+                  }
+                }}
               >
                 {thumbnailItem.type === 'text' ? (
                   <TextItem