React Native Classnames

Usage

// ...
import cn from 'react-native-classnames';
 
class ReactNativeComponent extends Component {
    renderRow = (item, something, index) => {
        const StoreItemStyles = cn(style, 'StoreItem', {StoreItemFirst: index === '0'});
        return (
            <TouchableHighlight
                onPress={() => this.props.onForward(item.id)}
                accessibilityLabel={`StoreItem StoreItem_${index}`}>
                <View style={StoreItemStyles}>
                    <Text style={style.StoreItemName} accessibilityLabel="StoreItemName">
                        {item.name}
                    </Text>
                </View>
            </TouchableHighlight>
        );
    }
 
    render() {
        return (
            <View style={style.StoreListWrapper}>
                <ListView
                    dataSource={this.props.stores}
                    renderRow={this.renderRow}
                    initialListSize={10}
                    accessibilityLabel="StoreList"
                    enableEmptySections
                />
            </View>
        );
    }
}
 
const style = {
    StoreListWrapper: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
    },
    StoreItem: {
        marginTop: 15,
        marginLeft: 0,
        width: 400,
        backgroundColor: '#c3c3c3',
        flex: 1,
        alignItems: 'center',
    },
    StoreItemFirst: {
        marginTop: 0,
    },
    StoreItemName: {
        color: '#fff',
        textAlign: 'center',
        fontSize: 20,
        margin: 10,
    },
};