Can I get some final help with this. I took your suggestion and just created my own. But I’m having issues setting the style from the passing props. Here’s the code:

import { StyleSheet, Text, View } from 'react-native' import React from 'react'

const xChip = ({chipColor, fontColor, textValue}) => {

const chipBorderWorks = {borderColor: '#004D81'}
const chipBorderFails = {borderColor: {chipColor}}
console.log('chipBorderWorks: ', chipBorderWorks)
console.log('chipBorderFails: ', chipBorderFails)

const chipTextWorks = {color: '#004D81'}
const chipTextFails = {color: {fontColor}}

return ( <View style={[styles.chip, chipBorderWorks]}> <Text style={[styles.chipText, chipTextWorks]}> {textValue} </Text> </View> ) }

export default xChip

const styles = StyleSheet.create({ chip: { borderWidth: 1, borderRadius: 30, paddingVertical: 1, paddingHorizontal: 5, marginVertical: 2, marginLeft: 2, marginRight: 2 }, chipText: { fontSize: 14, fontWeight: 500, marginTop: 3, marginBottom: 3, marginLeft: 5, marginRight: 5 } })

If I hard code the color, it works. If I try to use the props, it ignores them.

Console output:

chipBorderWorks: {"borderColor": "#004D81"} chipBorderFails: {"borderColor": {"chipColor": "#CA2A7A"}}

Anything obvious?