React Native need <Text> to appear next to the pressable checkbox not inside

Question

I need that the Text appears next to the pressable checkbox not inside it... How can i do this using styles and not changing the code structure?

return (
<Pressable
  style={[{ opacity: disabled ? 0.5 : 1 }, 
  styles.checkboxBase, checked && styles.checkboxChecked]}
  onPress={onPress}>

            <View style={[styles.checkboxContainer, style]}>
                {checked && <Icon size={16} name="bullet" 
                color="gray" />}
            </View>
            <Text style={styles.text}>{label}</Text>
        </Pressable>
    );
}

const styles = StyleSheet.create({
    checkboxBase: {
        width: 24,
        height: 24,
    },

    checkboxChecked: {
        justifyContent: "center",
        alignItems: "center",
    },

    checkboxContainer: {
        flexDirection: "row",
        color: "red",
    },
    text: {},
});

Answer 1

Pressable is like a view with TouhcableOpacity. You have to put text and Pressable inside a partent probability in a view like this.

<View style={{flex-direction:'row'}}>
  <Pressable>
  <Icon />
  </Pressable>
  <Text></Text>
</View>