From ecd34b669c70e6b7ce6d63e8e7dd6721507ca05f Mon Sep 17 00:00:00 2001
From: MxKevinBeqo <kevin.beqo@mendix.com>
Date: Tue, 14 Apr 2026 15:39:12 +0200
Subject: [PATCH] fix(intro-screen-native): fix talkback/voiceover for
 pagination

---
 .../intro-screen-native/CHANGELOG.md          |  7 ++++++-
 .../intro-screen-native/package.json          |  2 +-
 .../src/SwipeableContainer.tsx                | 19 ++++++++++++++++---
 .../intro-screen-native/src/package.xml       |  2 +-
 4 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/packages/pluggableWidgets/intro-screen-native/CHANGELOG.md b/packages/pluggableWidgets/intro-screen-native/CHANGELOG.md
index 767049e5d..9b1f8fdf5 100644
--- a/packages/pluggableWidgets/intro-screen-native/CHANGELOG.md
+++ b/packages/pluggableWidgets/intro-screen-native/CHANGELOG.md
@@ -6,10 +6,15 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+-   We fixed an issue with the TalkBack/VoiceOver traversal in the IntroScreen widget, where the order was not correct.
+
 ## [4.1.1] - 2026-1-19
 
 ### Fixed
-- We fixed an issue where using the conditional visibility on the IntroScreen would cause the widget not to render.
+
+-   We fixed an issue where using the conditional visibility on the IntroScreen would cause the widget not to render.
 
 ## [4.1.0] - 2025-9-9
 
diff --git a/packages/pluggableWidgets/intro-screen-native/package.json b/packages/pluggableWidgets/intro-screen-native/package.json
index c085ec872..12641a05f 100644
--- a/packages/pluggableWidgets/intro-screen-native/package.json
+++ b/packages/pluggableWidgets/intro-screen-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "intro-screen-native",
   "widgetName": "IntroScreen",
-  "version": "4.1.1",
+  "version": "4.1.2",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
diff --git a/packages/pluggableWidgets/intro-screen-native/src/SwipeableContainer.tsx b/packages/pluggableWidgets/intro-screen-native/src/SwipeableContainer.tsx
index 3a9184e19..dc64775da 100644
--- a/packages/pluggableWidgets/intro-screen-native/src/SwipeableContainer.tsx
+++ b/packages/pluggableWidgets/intro-screen-native/src/SwipeableContainer.tsx
@@ -111,8 +111,17 @@ export const SwipeableContainer = (props: SwipeableContainerProps): ReactElement
         onSlideChange(index, activeIndexBeforeChange);
     };
 
-    const renderItem = ({ item }: any): ReactElement => {
-        return <View style={[{ width, flex: 1 }]}>{item.content}</View>;
+    const renderItem = ({ item, index }: any): ReactElement => {
+        const isActive = index === activeIndex;
+        return (
+            <View
+                style={[{ width, flex: 1 }]}
+                importantForAccessibility={isActive ? "auto" : "no-hide-descendants"}
+                accessibilityElementsHidden={!isActive}
+            >
+                {item.content}
+            </View>
+        );
     };
 
     const renderButton = (
@@ -269,6 +278,9 @@ export const SwipeableContainer = (props: SwipeableContainerProps): ReactElement
                                         : props.styles.dotStyle
                                 ]}
                                 onPress={() => onPaginationPress(i)}
+                                accessibilityRole="button"
+                                accessibilityLabel={`Go to slide ${i + 1}`}
+                                accessibilityState={{ selected: rtlSafeIndex(i) === activeIndex }}
                             />
                         ))}
                     {!hidePagination && paginationOverflow && (
@@ -331,9 +343,10 @@ export const SwipeableContainer = (props: SwipeableContainerProps): ReactElement
                 renderItem={renderItem}
                 onMomentumScrollEnd={onMomentumScrollEnd}
                 scrollEventThrottle={50}
-                extraData={width}
+                extraData={[width, activeIndex]}
                 onLayout={onLayout}
                 keyExtractor={(_: any, index: number) => "screen_key_" + index}
+                importantForAccessibility="no"
             />
             {renderPagination()}
         </View>
diff --git a/packages/pluggableWidgets/intro-screen-native/src/package.xml b/packages/pluggableWidgets/intro-screen-native/src/package.xml
index 0a38098ff..1af8b2355 100644
--- a/packages/pluggableWidgets/intro-screen-native/src/package.xml
+++ b/packages/pluggableWidgets/intro-screen-native/src/package.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <package xmlns="http://www.mendix.com/package/1.0/">
-    <clientModule name="IntroScreen" version="4.1.1" xmlns="http://www.mendix.com/clientModule/1.0/">
+    <clientModule name="IntroScreen" version="4.1.2" xmlns="http://www.mendix.com/clientModule/1.0/">
         <widgetFiles>
             <widgetFile path="IntroScreen.xml" />
         </widgetFiles>