chore: update dependencies for React Native 0.77.3 and add accessibility role to Touchable components

Author: vadymv-mendix

packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-js-unit.json

@@ -27,6 +27,8 @@
     "output": "./dist/testresults/TESTS-Jest.xml"
   },
   "devDependencies": {
+    "react-native": "0.77.3",
+    "react": "^18.2.0",
     "@mendix/pluggable-widgets-tools": "^10.15.0"
   },
   "dependencies": {

packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-js.json

@@ -22,6 +22,8 @@
     "release": "pluggable-widgets-tools release:native"
   },
   "devDependencies": {
+    "react-native": "0.77.3",
+    "react": "^18.2.0",
     "@mendix/pluggable-widgets-tools": "^10.15.0"
   },
   "dependencies": {

packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-ts-unit.json

@@ -27,6 +27,8 @@
     "output": "./dist/testresults/TESTS-Jest.xml"
   },
   "devDependencies": {
+    "react-native": "0.77.3",
+    "react": "^18.2.0",
     "@mendix/pluggable-widgets-tools": "^10.15.0",
     "@types/big.js": "^6.0.2",
     "@types/jest": "^29.0.0"

packages/generator-widget/generators/app/templates/packages/__tests__/outputs/package_native.json-ts.json

@@ -22,6 +22,8 @@
     "release": "pluggable-widgets-tools release:native"
   },
   "devDependencies": {
+    "react-native": "0.77.3",
+    "react": "^18.2.0",
     "@mendix/pluggable-widgets-tools": "^10.15.0",
     "@types/big.js": "^6.0.2"
   },

packages/generator-widget/generators/app/templates/packages/package_native.json.ejs

@@ -27,6 +27,8 @@
     "output": "./dist/testresults/TESTS-Jest.xml"
   },<% } %>
   "devDependencies": {
+    "react-native": "0.77.3",
+    "react": "^18.2.0",
     "@mendix/pluggable-widgets-tools": "^10.15.0"<% if (isLanguageTS) { %>,
     "@types/big.js": "^6.0.2"<% if (hasUnitTests) { %>,
     "@types/jest": "^29.0.0"<% } %><% } %>

packages/generator-widget/generators/app/templates/pluggable/native/fullTemplateJs/src/components/Badge.jsx.ejs

@@ -13,7 +13,7 @@ export class Badge extends Component {
 
         return (
             <View style={this.styles.container}>
-                <Touchable style={this.styles.badge} onPress={this.props.onClick} useForeground={true}>
+                <Touchable accessibilityRole={"button"} style={this.styles.badge} onPress={this.props.onClick} useForeground={true}>
                     {this.renderContent()}
                 </Touchable>
             </View>

packages/generator-widget/generators/app/templates/pluggable/native/fullTemplateJsFn/src/components/Badge.jsx.ejs

@@ -22,7 +22,7 @@ export function Badge({ value, style, onClick }) {
 
     return (
         <View style={styles.container}>
-            <Touchable style={styles.badge} onPress={onClick} useForeground={true}>
+            <Touchable accessibilityRole={"button"} style={styles.badge} onPress={onClick} useForeground={true}>
                 {renderContent}
             </Touchable>
         </View>

packages/generator-widget/generators/app/templates/pluggable/native/fullTemplateTs/src/components/Badge.tsx.ejs

@@ -19,7 +19,7 @@ export class Badge extends Component<BadgeProps> {
 
         return (
             <View style={this.styles.container}>
-                <Touchable style={this.styles.badge} onPress={this.props.onClick} useForeground={true}>
+                <Touchable accessibilityRole={"button"} style={this.styles.badge} onPress={this.props.onClick} useForeground={true}>
                     {this.renderContent()}
                 </Touchable>
             </View>

packages/generator-widget/generators/app/templates/pluggable/native/fullTemplateTsFn/src/components/Badge.tsx.ejs

@@ -28,7 +28,7 @@ export function Badge({ value, style, onClick }: BadgeProps): ReactElement {
 
     return (
         <View style={styles.container}>
-            <Touchable style={styles.badge} onPress={onClick} useForeground={true}>
+            <Touchable accessibilityRole={"button"} style={styles.badge} onPress={onClick} useForeground={true}>
                 {renderContent}
             </Touchable>
         </View>