@momo-kits/stepper 0.111.1-rc.7 → 0.112.1-beta.0

package/NumberView.tsx

@@ -10,6 +10,7 @@ const NumberView: FC<StepperValueProps> = ({
   editable = false,
   onValueChange,
   disabled,
+  accessibilityLabel,
 }) => {
   const {theme} = useContext(ApplicationContext);
   const sizeStyle =
@@ -39,6 +40,10 @@ const NumberView: FC<StepperValueProps> = ({
         onChangeText={onValueChange}
         keyboardType={'number-pad'}
         selectionColor={theme.colors.primary}
+        accessibilityLabel={accessibilityLabel}
+        accessibilityState={{
+          disabled: !editable,
+        }}
       />
     </View>
   );

package/StepperButton.tsx

@@ -9,6 +9,7 @@ const StepperButton: FC<StepperButtonProps> = ({
   sign = '+',
   size = 'large',
   onPress,
+  accessibilityLabel,
 }) => {
   const {theme} = useContext(ApplicationContext);
 
@@ -20,7 +21,9 @@ const StepperButton: FC<StepperButtonProps> = ({
     : theme.colors.primary;
 
   return (
-    <TouchableOpacity disabled={disabled} onPress={onPress} style={[sizeStyle]}>
+    <TouchableOpacity accessibilityLabel={accessibilityLabel} accessibilityState={{
+      disabled,
+    }} disabled={disabled} onPress={onPress} style={[sizeStyle]}>
       <Icon size={22} color={buttonColor} source={buttonIcon} />
     </TouchableOpacity>
   );

package/index.tsx

@@ -21,6 +21,10 @@ const Stepper = forwardRef(
       step = 1,
       editable = false,
       onValueChange,
+      accessibilityLabel,
+      accessbibilityLabelMinus,
+      accessbibilityLabelPlus,
+      accessbibilityLabelNumber
     }: StepperProps,
     ref
   ) => {
@@ -92,12 +96,13 @@ const Stepper = forwardRef(
     const viewStatus = getViewDisabledStatus();
 
     return (
-      <View style={styles.stepper}>
+      <View style={styles.stepper} accessibilityLabel={accessibilityLabel}>
         <StepperButton
           onPress={onMinus}
           sign={'-'}
           size={size}
           disabled={viewStatus.minus}
+          accessibilityLabel={accessbibilityLabelMinus}
         />
         <NumberView
           onValueChange={_onValueChange}
@@ -105,11 +110,13 @@ const Stepper = forwardRef(
           value={value}
           disabled={viewStatus.number}
           editable={editable}
+          accessibilityLabel={accessbibilityLabelNumber}
         />
         <StepperButton
           onPress={onPlus}
           size={size}
           disabled={viewStatus.plus}
+          accessibilityLabel={accessbibilityLabelPlus}
         />
       </View>
     );

package/package.json

@@ -1,20 +1,20 @@
 {
-  "name": "@momo-kits/stepper",
-  "version": "0.111.1-rc.7",
-  "private": false,
-  "main": "index.tsx",
-  "dependencies": {},
-  "peerDependencies": {
-    "@momo-kits/foundation": "latest",
-    "prop-types": "^15.7.2",
-    "react": "16.9.0",
-    "react-native": ">=0.55"
-  },
-  "devDependencies": {
-    "@momo-platform/versions": "4.1.11"
-  },
-  "license": "MoMo",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  }
+    "name": "@momo-kits/stepper",
+    "version": "0.112.1-beta.0",
+    "private": false,
+    "main": "index.tsx",
+    "dependencies": {},
+    "peerDependencies": {
+        "@momo-kits/foundation": "latest",
+        "prop-types": "^15.7.2",
+        "react": "16.9.0",
+        "react-native": ">=0.55"
+    },
+    "devDependencies": {
+        "@momo-platform/versions": "4.1.11"
+    },
+    "license": "MoMo",
+    "publishConfig": {
+        "registry": "https://registry.npmjs.org/"
+    }
 }

package/types.ts

@@ -25,6 +25,11 @@ export type StepperButtonProps = {
    * A callback function that is triggered when the button is pressed.
    */
   onPress: () => void;
+
+  /**
+   * Optional. Assign accessibility label to the button for automated testing.
+   */
+  accessibilityLabel?: string;
 };
 
 /**
@@ -58,6 +63,11 @@ export type StepperValueProps = {
    * Optional. A callback function that is triggered when the value changes, receiving the new value as a parameter.
    */
   onValueChange?: (value: string) => void;
+
+  /**
+   * Optional. Assign accessibility label to the button for automated testing.
+   */
+  accessibilityLabel?: string;
 };
 
 /**
@@ -111,6 +121,26 @@ export type StepperProps = {
    * Optional. Custom styles to apply to the Stepper component. Can be used to adjust the visual presentation or layout.
    */
   style?: ViewStyle | ViewStyle[];
+
+  /**
+   * Optional. Assign accessibility label to the button for automated testing.
+   */
+  accessibilityLabel?: string;
+
+  /**
+   * Optional. Assign accessibility label to the button for automated testing.
+   */
+  accessbibilityLabelPlus?: string;
+
+  /**
+   * Optional. Assign accessibility label to the button for automated testing.
+   */
+  accessbibilityLabelMinus?: string;
+
+  /**
+   * Optional. Assign accessibility label to the button for automated testing.
+   */
+  accessbibilityLabelNumber?: string;
 };
 
 /**