@ledvance/base 1.3.81 → 1.3.82

package/localazy.json

@@ -1200,7 +1200,10 @@
                 "MATCH:setting_set_passwd",
                 "MATCH:camera_user",
                 "MATCH:camera_motiondetection",
-                "MATCH:camera_motiondetectiondescription"
+                "MATCH:camera_motiondetectiondescription",
+                "MATCH:wifi_repeater_title",
+                "MATCH:wifi_repeater_description",
+                "MATCH:wifi_repeater_group_tips"
             ],
             "replacements": {
                 "REGEX:% %1\\$s.*?\\)%": "{0}",

package/package.json

@@ -4,7 +4,7 @@
   "name": "@ledvance/base",
   "pid": [],
   "uiid": "",
-  "version": "1.3.81",
+  "version": "1.3.82",
   "scripts": {
     "prepublishOnly": "python update-localazy.py"
   },

package/src/components/AdvanceCard.tsx

@@ -63,7 +63,7 @@ const AdvanceCard = (props: AdvanceCardProps) => {
       {
         props.children ?
           props.children :
-          <View style={styles.titleBg}>
+          <View accessibilityLabel='AdvanceCard' accessibilityHint={props.data.title} style={styles.titleBg}>
             <Text style={{...styles.title, color: props.theme?.global.fontColor}}>{props.data.title}</Text>
             <Spacer height={cx(8)} />
             {

package/src/components/BallDirectionView.tsx

@@ -1,184 +1,199 @@
-import {Utils} from "tuya-panel-kit";
-import React, {useEffect} from "react";
-import {Image, StyleSheet, TouchableOpacity, View} from "react-native";
+import { Utils } from "tuya-panel-kit";
+import React, { useEffect } from "react";
+import { Image, StyleSheet, TouchableOpacity, View } from "react-native";
 import res from "../res";
-import {useReactive} from "ahooks";
-import {hsv2Hex} from "../utils/index";
-import {cctToColor} from "../utils/cctUtils";
-import {AdjustType, HSV} from '../utils/interface'
+import { useReactive } from "ahooks";
+import { hsv2Hex } from "../utils/index";
+import { cctToColor } from "../utils/cctUtils";
+import { AdjustType, HSV } from '../utils/interface'
 
-const {withTheme} = Utils.ThemeUtils
+const { withTheme } = Utils.ThemeUtils
 const cx = Utils.RatioUtils.convertX;
 
 export enum PaintMode {
-    Top,
-    Bottom,
-    ALL
+  Top,
+  Bottom,
+  ALL
 }
 
 interface BallDirectionProps {
-    theme?: any,
-    adjustType: AdjustType,
-    paintMode: PaintMode,
-    onPaintModeChanged: (paintMode: PaintMode) => void,
-    topColor: HSV,
-    bottomColor: HSV,
-    colorTemp: number,
-    brightness: number,
+  theme?: any,
+  adjustType: AdjustType,
+  paintMode: PaintMode,
+  onPaintModeChanged: (paintMode: PaintMode) => void,
+  topColor: HSV,
+  bottomColor: HSV,
+  colorTemp: number,
+  brightness: number,
 }
 
 const BallDirectionView = (props: BallDirectionProps) => {
-    const {theme, adjustType, paintMode, onPaintModeChanged, topColor, bottomColor, colorTemp, brightness} = props;
-    const state = useReactive({
-        adjustType: adjustType,
-        paintMode: paintMode,
-        halfCircleTopColor: '#ff0000',
-        halfCircleBottomColor: '#00ff00',
-    });
+  const { theme, adjustType, paintMode, onPaintModeChanged, topColor, bottomColor, colorTemp, brightness } = props;
+  const state = useReactive({
+    adjustType: adjustType,
+    paintMode: paintMode,
+    halfCircleTopColor: '#ff0000',
+    halfCircleBottomColor: '#00ff00',
+  });
 
-    useEffect(() => {
-        state.adjustType = adjustType;
-        state.paintMode = paintMode;
-        if (state.adjustType === AdjustType.COLOUR) {
-            state.halfCircleTopColor = hsv2Hex(topColor.h, Math.max(Math.round(topColor.s / 10), 10), 100);
-            state.halfCircleBottomColor = hsv2Hex(bottomColor.h, Math.max(Math.round(bottomColor.s / 10), 10), 100);
-        } else if (state.adjustType === AdjustType.WHITE) {
-            state.halfCircleTopColor = cctToColor(colorTemp, brightness);
-            state.halfCircleBottomColor = cctToColor(colorTemp, brightness);
-        } else {
-            state.halfCircleTopColor = '#FEAC5B';
-            state.halfCircleBottomColor = '#FEAC5B';
-        }
-    }, [adjustType, paintMode, JSON.stringify(topColor), JSON.stringify(bottomColor), colorTemp, brightness]);
+  useEffect(() => {
+    state.adjustType = adjustType;
+    state.paintMode = paintMode;
+    if (state.adjustType === AdjustType.COLOUR) {
+      state.halfCircleTopColor = hsv2Hex(topColor.h, Math.max(Math.round(topColor.s / 10), 10), 100);
+      state.halfCircleBottomColor = hsv2Hex(bottomColor.h, Math.max(Math.round(bottomColor.s / 10), 10), 100);
+    } else if (state.adjustType === AdjustType.WHITE) {
+      state.halfCircleTopColor = cctToColor(colorTemp, brightness);
+      state.halfCircleBottomColor = cctToColor(colorTemp, brightness);
+    } else {
+      state.halfCircleTopColor = '#FEAC5B';
+      state.halfCircleBottomColor = '#FEAC5B';
+    }
+  }, [adjustType, paintMode, JSON.stringify(topColor), JSON.stringify(bottomColor), colorTemp, brightness]);
 
-    const styles = StyleSheet.create({
-        root: {
-            flexDirection: 'row',
-            width: '100%',
-            alignItems: 'center',
-            justifyContent: 'center'
-        },
-        paintModeRoot: {
-            flexDirection: 'column',
-            position: 'absolute',
-            left: cx(24)
-        },
-        paintModeAll: {
-            resizeMode: 'contain',
-            width: '100%',
-            height: '100%',
-            tintColor: state.paintMode === PaintMode.ALL ? props.theme?.icon.primary : props.theme?.icon.normal
-        },
-        paintModeHalf: {
-            resizeMode: 'contain',
-            width: '100%',
-            height: '100%',
-            tintColor: state.paintMode !== PaintMode.ALL ? props.theme?.icon.primary : props.theme?.icon.normal
-        },
-        circleLayout: {
-            marginVertical: cx(10),
-            width: cx(180),
-            height: cx(180)
-        },
-        circleBorder: {
-            position: 'absolute',
-            width: '84%',
-            height: '84%',
-            borderColor: theme?.textInput.line,
-            borderRadius: 100,
-            borderWidth: 2,
-            bottom: '8%',
-            left: '8%',
-            right: '8%',
-            top: '8%',
-        },
-        coloring: {
-            width: '100%',
-            height: '100%',
-            resizeMode: 'contain',
-        },
-        ringUp: {
-            position: 'absolute',
-            width: '100%',
-            height: '56%',
-            resizeMode: 'contain',
-            transform: [{ rotate: '180deg' }]
-        },
-        ringDown: {
-            position: 'absolute',
-            width: '100%',
-            height: '56%',
-            resizeMode: 'contain',
-            bottom: 0
-        },
-        halfCircleDown: {
-            position: 'absolute',
-            width: '60%',
-            left: '20%',
-            right: '20%',
-            bottom: '11%',
-        },
-        halfCircleUp: {
-            position: 'absolute',
-            width: '60%',
-            left: '20%',
-            right: '20%',
-            top: '11%',
-        }
-    });
-    return (<View style={styles.root}>
-        <View style={styles.paintModeRoot}>
-            {state.adjustType === AdjustType.COLOUR &&
-                <TouchableOpacity style={{width: cx(40), height: cx(40)}} onPress={() => {
-                    onPaintModeChanged(PaintMode.Top);
-                }}>
-                    <Image source={{ uri: res.half}} style={styles.paintModeHalf}/>
-                </TouchableOpacity>}
-            <TouchableOpacity
-                style={{width: cx(40), height: cx(40), marginTop: cx(10),}}
-                onPress={() => {
-                    onPaintModeChanged(PaintMode.ALL);
-                }}>
-                <Image source={{ uri: res.all }} style={styles.paintModeAll}/>
-            </TouchableOpacity>
-        </View>
-        <View style={styles.circleLayout}>
-            <View style={styles.circleBorder}/>
-            {state.paintMode === PaintMode.ALL &&
-                <Image source={{ uri: res.coloring}} style={styles.coloring}/>}
-            {state.paintMode === PaintMode.Top &&
-                <Image source={{ uri: res.ringdown}} style={styles.ringUp}/>}
-            {state.paintMode === PaintMode.Bottom &&
-                <Image source={{ uri: res.ringdown}} style={styles.ringDown}/>}
-            <TouchableOpacity
-                style={styles.halfCircleUp}
-                disabled={state.paintMode === PaintMode.ALL}
-                onPress={() => {
-                    onPaintModeChanged(PaintMode.Top);
-                }}>
-                <Image source={res.halfcircle} style={{
-                    width: '100%',
-                    resizeMode: 'contain',
-                    tintColor: state.halfCircleTopColor
-                }}/>
+  const styles = StyleSheet.create({
+    root: {
+      flexDirection: 'row',
+      width: '100%',
+      alignItems: 'center',
+      justifyContent: 'center'
+    },
+    paintModeRoot: {
+      flexDirection: 'column',
+      position: 'absolute',
+      left: cx(24)
+    },
+    paintModeAll: {
+      resizeMode: 'contain',
+      width: '100%',
+      height: '100%',
+      tintColor: state.paintMode === PaintMode.ALL ? props.theme?.icon.primary : props.theme?.icon.normal
+    },
+    paintModeHalf: {
+      resizeMode: 'contain',
+      width: '100%',
+      height: '100%',
+      tintColor: state.paintMode !== PaintMode.ALL ? props.theme?.icon.primary : props.theme?.icon.normal
+    },
+    circleLayout: {
+      marginVertical: cx(10),
+      width: cx(180),
+      height: cx(180)
+    },
+    circleBorder: {
+      position: 'absolute',
+      width: '84%',
+      height: '84%',
+      borderColor: theme?.textInput.line,
+      borderRadius: 100,
+      borderWidth: 2,
+      bottom: '8%',
+      left: '8%',
+      right: '8%',
+      top: '8%',
+    },
+    coloring: {
+      width: '100%',
+      height: '100%',
+      resizeMode: 'contain',
+    },
+    ringUp: {
+      position: 'absolute',
+      width: '100%',
+      height: '56%',
+      resizeMode: 'contain',
+      transform: [{ rotate: '180deg' }]
+    },
+    ringDown: {
+      position: 'absolute',
+      width: '100%',
+      height: '56%',
+      resizeMode: 'contain',
+      bottom: 0
+    },
+    halfCircleDown: {
+      position: 'absolute',
+      width: '60%',
+      left: '20%',
+      right: '20%',
+      bottom: '11%',
+    },
+    halfCircleUp: {
+      position: 'absolute',
+      width: '60%',
+      left: '20%',
+      right: '20%',
+      top: '11%',
+    }
+  });
+  return (<View style={styles.root}>
+    <View style={styles.paintModeRoot}>
+      {state.adjustType === AdjustType.COLOUR &&
+        <TouchableOpacity
+          accessibilityLabel="HalfCircleButton"
+          accessibilityHint="HalfCircle"
+          accessibilityState={{ checked: [PaintMode.Top, PaintMode.Bottom].includes(state.paintMode) }}
+          style={{ width: cx(40), height: cx(40) }}
+          onPress={() => {
+            onPaintModeChanged(PaintMode.Top);
+          }}
+        >
+          <Image source={{ uri: res.half }} style={styles.paintModeHalf} />
+        </TouchableOpacity>}
+      <TouchableOpacity
+        accessibilityLabel="AllCircleButton"
+        accessibilityHint="AllCircle"
+        accessibilityState={{ checked: state.paintMode === PaintMode.ALL }}
+        style={{ width: cx(40), height: cx(40), marginTop: cx(10), }}
+        onPress={() => {
+          onPaintModeChanged(PaintMode.ALL);
+        }}>
+        <Image source={{ uri: res.all }} style={styles.paintModeAll} />
+      </TouchableOpacity>
+    </View>
+    <View style={styles.circleLayout}>
+      <View style={styles.circleBorder} />
+      {state.paintMode === PaintMode.ALL &&
+        <Image source={{ uri: res.coloring }} style={styles.coloring} />}
+      {state.paintMode === PaintMode.Top &&
+        <Image source={{ uri: res.ringdown }} style={styles.ringUp} />}
+      {state.paintMode === PaintMode.Bottom &&
+        <Image source={{ uri: res.ringdown }} style={styles.ringDown} />}
+      <TouchableOpacity
+        accessibilityLabel="HalfCircle"
+        accessibilityHint="TopHalfCircle"
+        accessibilityState={{ checked: state.paintMode === PaintMode.Top, disabled: state.paintMode === PaintMode.ALL }}
+        style={styles.halfCircleUp}
+        disabled={state.paintMode === PaintMode.ALL}
+        onPress={() => {
+          onPaintModeChanged(PaintMode.Top);
+        }}>
+        <Image source={res.halfcircle} style={{
+          width: '100%',
+          resizeMode: 'contain',
+          tintColor: state.halfCircleTopColor
+        }} />
 
-            </TouchableOpacity>
+      </TouchableOpacity>
 
-            <TouchableOpacity
-                style={styles.halfCircleDown}
-                disabled={state.paintMode === PaintMode.ALL}
-                onPress={() => {
-                    onPaintModeChanged(PaintMode.Bottom);
-                }}>
-                <Image source={res.halfcircle} style={{
-                    width: '100%',
-                    resizeMode: 'contain',
-                    transform: [{rotate: '180deg'}],
-                    tintColor: state.halfCircleBottomColor
-                }}/>
-            </TouchableOpacity>
-        </View>
-    </View>)
+      <TouchableOpacity
+        accessibilityLabel="HalfCircle"
+        accessibilityHint="BottomHalfCircle"
+        accessibilityState={{ checked: state.paintMode === PaintMode.Bottom, disabled: state.paintMode === PaintMode.ALL }}
+        style={styles.halfCircleDown}
+        disabled={state.paintMode === PaintMode.ALL}
+        onPress={() => {
+          onPaintModeChanged(PaintMode.Bottom);
+        }}>
+        <Image source={res.halfcircle} style={{
+          width: '100%',
+          resizeMode: 'contain',
+          transform: [{ rotate: '180deg' }],
+          tintColor: state.halfCircleBottomColor
+        }} />
+      </TouchableOpacity>
+    </View>
+  </View>)
 }
 
 export default withTheme(BallDirectionView) as React.ComponentType<BallDirectionProps>

package/src/components/DeleteButton.tsx

@@ -23,7 +23,7 @@ const DeleteButton = (props: DeleteButtonProps) => {
       accessibilityHint={text}
       accessibilityState={{disabled}}
       disabled={disabled}
-      onPress={onPress}
+      onPress={disabled ? undefined : onPress}
       style={[{
         width: '100%',
         height: cx(50),

package/src/components/DiySceneNodeView.tsx

@@ -71,6 +71,9 @@ const DiySceneNodeView = (props: DiySceneNodeProps) => {
   return (
     <View style={styles.circleLayout}>
       <TouchableOpacity
+        accessibilityLabel="HalfCircleButton"
+        accessibilityHint={'Top'}
+        accessibilityState={{ checked: isCurrent && position === 'Top' }}
         style={styles.halfCircleUp}
         onPress={() => {
           onChangePosition("Top")
@@ -84,6 +87,9 @@ const DiySceneNodeView = (props: DiySceneNodeProps) => {
         { (isCurrent && position === 'Top') && <Image source={{uri: res.halfborder}} style={styles.borderTop} />}
       </TouchableOpacity>
       <TouchableOpacity
+        accessibilityLabel="HalfCircleButton"
+        accessibilityHint={'Bottom'}
+        accessibilityState={{ checked: isCurrent && position === 'Bottom' }}
         style={styles.halfCircleDown}
         onPress={() => {
           onChangePosition("Bottom")

package/src/components/DrawToolView.tsx

@@ -149,6 +149,9 @@ const DrawToolView = (props: DrawToolViewProps) => {
           <View style={styles.container}>
               <View style={styles.adjustButtons}>
                   <TouchableOpacity
+                      accessibilityLabel='AdjustButton'
+                      accessibilityHint='1'
+                      accessibilityState={{ checked: props.adjustType === 1 }}
                       onPress={() => {
                         props.setAdjustType(1)
                       }}>
@@ -157,6 +160,9 @@ const DrawToolView = (props: DrawToolViewProps) => {
                           source={{ uri: res.ic_paint_bucket}} />
                   </TouchableOpacity>
                 {!props.hideDisableLight && <TouchableOpacity
+                    accessibilityLabel='AdjustButton'
+                      accessibilityHint='3'
+                      accessibilityState={{ checked: props.adjustType === 3 }}
                     onPress={() => {
                       props.setAdjustType(3)
                     }}>
@@ -165,6 +171,9 @@ const DrawToolView = (props: DrawToolViewProps) => {
                         source={{uri: res.ic_disabled_light}} />
                 </TouchableOpacity>}
                 {!props.hideColorize && <TouchableOpacity
+                    accessibilityLabel='AdjustButton'
+                    accessibilityHint='2'
+                    accessibilityState={{ checked: props.adjustType === 2 }}
                     onPress={() => {
                       props.setAdjustType(2)
                     }}>
@@ -173,6 +182,8 @@ const DrawToolView = (props: DrawToolViewProps) => {
                         source={{uri: res.ic_colorize}} />
                 </TouchableOpacity>}
                 {!props.hideLedNum && <TouchableOpacity
+                    accessibilityLabel='LedNumInput'
+                    accessibilityHint={`${props.ledNum || 5}`}
                     onPress={() => {
                       state.visible = true
                     }}
@@ -250,6 +261,7 @@ const DrawToolView = (props: DrawToolViewProps) => {
                     text={I18n.getLang('auto_scan_system_wifi_confirm')}
                     style={{ width: cx(150), height: cx(40), backgroundColor: ledNumValidator(state.ledNum) ? props.theme?.button.primary : props.theme?.button.disabled }}
                     textStyle={{ fontSize: cx(14) }}
+                    disabled={!ledNumValidator(state.ledNum)}
                     onPress={() => {
                       if (!ledNumValidator(state.ledNum)) return
                       props.setLedNum(state.ledNum)

package/src/components/MoodStripAdjustView.tsx

@@ -83,6 +83,8 @@ const MoodStripAdjustView = (props: MoodStripAdjustViewProps) => {
               props.favoriteScenes.map((sceneInfo: DiySceneInfo) => {
                 return (
                   <TouchableOpacity
+                    accessibilityLabel="SceneItem"
+                    accessibilityHint={`${sceneInfo.id}`}
                     key={sceneInfo.id}
                     onPress={() => {
                       props.onFavoriteSceneChange(sceneInfo)
@@ -104,6 +106,8 @@ const MoodStripAdjustView = (props: MoodStripAdjustViewProps) => {
                           <View style={{justifyContent: 'center', alignItems: 'center', width: '100%', height: '100%'}}>
                             {props.favoriteScenes.length > 3 &&
                                 <TouchableOpacity
+                                    accessibilityLabel="FavoriteSceneDeleteButton"
+                                    accessibilityHint={`${sceneInfo.id}`}
                                     style={{position: 'absolute', top: cx(5), right: cx(5)}}
                                     onPress={() => {
                                       props.onFavoriteSceneRemove && props.onFavoriteSceneRemove(sceneInfo)

package/src/components/OptionGroup.tsx

@@ -73,7 +73,7 @@ const OptionGroup = (props: OptionGroupProps) => {
     return (
       <TouchableOpacity
         accessibilityLabel={"OptionItem"}
-        accessibilityHint={props.value}
+        accessibilityHint={`${props.value}`}
         accessibilityState={{checked: props.enable}}
         onPress={() => props.onPress && props.onPress(props.value)}
       >

package/src/components/OsramFanAdjustView.tsx

@@ -0,0 +1,93 @@
+import React from "react"
+import { View, Text, TouchableOpacity, Image } from "react-native"
+import LdvSwitch from "./ldvSwitch"
+import I18n from "@i18n"
+import LdvSlider from "./ldvSlider"
+import Spacer from "./Spacer"
+import ThemeType from "config/themeType"
+import { Utils } from "tuya-panel-kit"
+import Popup from "./Popup"
+import res from "@res"
+import Segmented from "./Segmented"
+
+const cx = Utils.RatioUtils.convertX
+const { withTheme } = Utils.ThemeUtils
+
+interface OsramFanAdjustProps {
+  theme?: ThemeType
+  hideFanSwitch?: boolean
+  fanSwitch: boolean
+  setFanSwitch: (v: boolean) => void
+  fanSpeed: number
+  minSpeed?: number
+  maxSpeed?: number
+  onFanSpeedChange?: (v: number) => void
+  setFanSpeed: (v: number) => void
+  fanMode: 'fresh' | 'nature'
+  setFanMode: (v: 'fresh' | 'nature') => void
+}
+
+const OsramFanAdjustView = (props: OsramFanAdjustProps) => {
+  const { hideFanSwitch = false, fanSwitch, setFanSwitch, fanSpeed, onFanSpeedChange, setFanSpeed, minSpeed = 1, maxSpeed = 3, fanMode, setFanMode } = props
+  return (
+    <View>
+      {
+        !hideFanSwitch && <LdvSwitch
+          title={I18n.getLang('add_new_dynamic_mood_ceiling_fan_field_headline')}
+          enable={fanSwitch}
+          setEnable={setFanSwitch}
+        />
+      }
+      {
+        fanSwitch && (
+          <>
+            <LdvSlider
+              title={I18n.getLang('add_new_dynamic_mood_ceiling_fan_field_text')}
+              subTitleStr={`${fanSpeed}/${maxSpeed}`}
+              value={fanSpeed}
+              min={minSpeed}
+              max={maxSpeed}
+              onValueChange={onFanSpeedChange}
+              onSlidingComplete={setFanSpeed}
+            />
+            <Spacer />
+            <View style={{ marginHorizontal: cx(16) }}>
+              <View style={{ flexDirection: 'row', marginBottom: cx(2), alignItems: 'center' }}>
+                <Text style={{ marginRight: cx(5), color: props.theme?.global.fontColor }}>{I18n.getLang('ceiling_fan_tile_uvc_fan_mode')}</Text>
+                <TouchableOpacity onPress={() => Popup({
+                  title: I18n.getLang('ceiling_fan_mode_info_headline'),
+                  confirmText: I18n.getLang('ceiling_fan_direction_info_button_label'),
+                  content: <View>
+                    <Text style={{
+                      fontWeight: 'bold',
+                      color: props.theme?.global.fontColor,
+                    }}>{I18n.getLang('ceiling_fan_mode_info_description_text')}</Text>
+                    <Spacer />
+                    <Text style={{ color: props.theme?.global.fontColor }}>{I18n.getLang('ceiling_fan_mode_info_option_1_headline')}</Text>
+                    <Text style={{ color: props.theme?.global.fontColor }}>{I18n.getLang('ceiling_fan_mode_info_option_1_text')}</Text>
+                    <Spacer />
+                    <Text style={{ color: props.theme?.global.fontColor }}>{I18n.getLang('ceiling_fan_mode_info_option_2_headline')}</Text>
+                    <Text style={{ color: props.theme?.global.fontColor }}>{I18n.getLang('ceiling_fan_mode_info_option_2_text')}</Text>
+                  </View>,
+                })}>
+                  <Image style={{ width: cx(16), height: cx(16), tintColor: props.theme?.icon.primary }} source={{ uri: res.ic_info }} />
+                </TouchableOpacity>
+              </View>
+              <Segmented
+                options={[
+                  { label: I18n.getLang('ceiling_fan_tile_uvc_fan_mode_opt_1'), value: 'fresh' },
+                  { label: I18n.getLang('ceiling_fan_tile_uvc_fan_mode_opt_2'), value: 'nature' },
+                ]}
+                value={fanMode}
+                onChange={setFanMode}
+              />
+            </View>
+            <Spacer />
+          </>
+        )
+      }
+    </View>
+  )
+}
+
+export default withTheme(OsramFanAdjustView)

package/src/components/Page.tsx

@@ -70,7 +70,11 @@ const Page = (props: PageProps) => {
 
   return (
     <>
-      <View style={[{ flex: 1, position: 'relative', backgroundColor: props.theme?.global.background }, props.style]}>
+      <View
+        accessibilityLabel='Page'
+        accessibilityHint={props.headlineText} 
+        style={[{ flex: 1, position: 'relative', backgroundColor: props.theme?.global.background }, props.style]}
+      >
         <LDVTopBar
           title={props.backText}
           onBackPress={

package/src/components/Popup.tsx

@@ -26,6 +26,8 @@ const InformationPopup = (props: InformationPopupProps) => {
           }}>{props.title}</Text>
         </View>
         <TouchableOpacity
+          accessibilityLabel='PopupCloseButton'
+          accessibilityHint={props.confirmText}
           style={{
             flexDirection: 'column-reverse',
             alignItems: 'center',

package/src/components/Segmented.tsx

@@ -58,7 +58,7 @@ const Segmented = (props: SegmentedProps) => {
       {props.options && props.options.map((item, idx) => (
         <TouchableOpacity
           accessibilityLabel={"Segmented"}
-          accessibilityHint={item.value}
+          accessibilityHint={`${item.value}`}
           accessibilityState={{checked: item.value === props.value}}
           style={[
             styles.segmented_item,