@react-native-ama/core 1.1.3 → 1.1.4

package/dist/src/components/AutofocusContainer.d.ts

@@ -1,9 +1,16 @@
 import * as React from 'react';
-import { ViewProps } from 'react-native';
-type AutofocusContainerProps = React.PropsWithChildren<({
+import { TouchableWithoutFeedbackProps, ViewProps } from 'react-native';
+import { PickAccessibleProps } from '@react-native-ama/internal';
+type TouchableAccessibleProps = PickAccessibleProps<TouchableWithoutFeedbackProps>;
+export type AutofocusContainerProps = React.PropsWithChildren<(({
     wrapChildrenInAccessibleView?: true;
 } & ViewProps) | {
     wrapChildrenInAccessibleView: false;
+}) & {
+    /**
+     * touchableContainerAccessibilityProps is provided as a workaround for any accessibility props that need to be passed to the TouchableWithoutFeedback component which are not recognized on the accessible view.
+     */
+    touchableContainerAccessibilityProps?: TouchableAccessibleProps;
 }>;
-export declare const AutofocusContainer: ({ children, wrapChildrenInAccessibleView, ...viewProps }: AutofocusContainerProps) => React.JSX.Element;
+export declare const AutofocusContainer: ({ children, wrapChildrenInAccessibleView, touchableContainerAccessibilityProps, ...viewProps }: AutofocusContainerProps) => React.JSX.Element;
 export {};

package/dist/src/components/AutofocusContainer.js

@@ -39,7 +39,7 @@ const React = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const useFocus_1 = require("../hooks/useFocus");
 const AutofocusContainer = (_a) => {
-    var { children, wrapChildrenInAccessibleView = true } = _a, viewProps = __rest(_a, ["children", "wrapChildrenInAccessibleView"]);
+    var { children, wrapChildrenInAccessibleView = true, touchableContainerAccessibilityProps } = _a, viewProps = __rest(_a, ["children", "wrapChildrenInAccessibleView", "touchableContainerAccessibilityProps"]);
     const containerRef = React.useRef(null);
     const { setFocus } = (0, useFocus_1.useFocus)();
     React.useEffect(() => {
@@ -47,11 +47,11 @@ const AutofocusContainer = (_a) => {
             setFocus(containerRef.current);
         }, 0);
     }, [setFocus]);
-    return wrapChildrenInAccessibleView ? (<react_native_1.TouchableWithoutFeedback ref={containerRef}>
+    return wrapChildrenInAccessibleView ? (<react_native_1.TouchableWithoutFeedback ref={containerRef} {...touchableContainerAccessibilityProps}>
       <react_native_1.View accessible={true} testID="autofocusContainer.accessibleView" {...viewProps}>
         {children}
       </react_native_1.View>
-    </react_native_1.TouchableWithoutFeedback>) : (<react_native_1.TouchableWithoutFeedback ref={containerRef}>
+    </react_native_1.TouchableWithoutFeedback>) : (<react_native_1.TouchableWithoutFeedback ref={containerRef} {...touchableContainerAccessibilityProps}>
       {children}
     </react_native_1.TouchableWithoutFeedback>);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-ama/core",
-  "version": "1.1.3",
+  "version": "1.1.4",
   "description": "Accessible Mobile App Library for React Native",
   "react-native": "src/index",
   "types": "dist/src/index.d.ts",
@@ -26,7 +26,7 @@
     "postinstall": "node ./src/postinstall.js"
   },
   "dependencies": {
-    "@react-native-ama/internal": "~1.1.3"
+    "@react-native-ama/internal": "~1.1.4"
   },
   "peerDependencies": {
     "react": "*",

package/src/components/AutofocusContainer.tsx

@@ -1,20 +1,37 @@
 import * as React from 'react';
-import { TouchableWithoutFeedback, View, ViewProps } from 'react-native';
+import {
+  TouchableWithoutFeedback,
+  TouchableWithoutFeedbackProps,
+  View,
+  ViewProps,
+} from 'react-native';
 
 import { useFocus } from '../hooks/useFocus';
+import { PickAccessibleProps } from '@react-native-ama/internal';
 
-type AutofocusContainerProps = React.PropsWithChildren<
-  | ({
-      wrapChildrenInAccessibleView?: true;
-    } & ViewProps)
-  | {
-      wrapChildrenInAccessibleView: false;
-    }
+type TouchableAccessibleProps =
+  PickAccessibleProps<TouchableWithoutFeedbackProps>;
+
+export type AutofocusContainerProps = React.PropsWithChildren<
+  (
+    | ({
+        wrapChildrenInAccessibleView?: true;
+      } & ViewProps)
+    | {
+        wrapChildrenInAccessibleView: false;
+      }
+  ) & {
+    /**
+     * touchableContainerAccessibilityProps is provided as a workaround for any accessibility props that need to be passed to the TouchableWithoutFeedback component which are not recognized on the accessible view.
+     */
+    touchableContainerAccessibilityProps?: TouchableAccessibleProps;
+  }
 >;
 
 export const AutofocusContainer = ({
   children,
   wrapChildrenInAccessibleView = true,
+  touchableContainerAccessibilityProps,
   ...viewProps
 }: AutofocusContainerProps) => {
   const containerRef = React.useRef(null);
@@ -27,7 +44,9 @@ export const AutofocusContainer = ({
   }, [setFocus]);
 
   return wrapChildrenInAccessibleView ? (
-    <TouchableWithoutFeedback ref={containerRef}>
+    <TouchableWithoutFeedback
+      ref={containerRef}
+      {...touchableContainerAccessibilityProps}>
       <View
         accessible={true}
         testID="autofocusContainer.accessibleView"
@@ -36,7 +55,9 @@ export const AutofocusContainer = ({
       </View>
     </TouchableWithoutFeedback>
   ) : (
-    <TouchableWithoutFeedback ref={containerRef}>
+    <TouchableWithoutFeedback
+      ref={containerRef}
+      {...touchableContainerAccessibilityProps}>
       {children}
     </TouchableWithoutFeedback>
   );