Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Icon in initValue instead of a string #120

Open
georgeMorales opened this issue Sep 7, 2019 · 5 comments
Open

Icon in initValue instead of a string #120

georgeMorales opened this issue Sep 7, 2019 · 5 comments

Comments

@georgeMorales
Copy link

Would it be possible to set an icon as initialValue? A few months ago, thanks to your help, I was able to put it in the drop-down list but now I also need it in initValue. It works but an warning appears...
Warning: Failed prop type: Invalid prop initValue of type object supplied to ModalSelector, expected string.

@peacechen
Copy link
Owner

The warning should be a simple fix. The propType needs to change to accept either a string or object.

Looking through the code, I'm surprised that an icon works for initValue. Would you mind posting a code snippet?

@georgeMorales
Copy link
Author

georgeMorales commented Sep 7, 2019

This is an example...
I don't know what version I use of this library ... I think you sent me this update last time
"git + https: //github.com/peacechen/react-native-modal-selector.git"
Thank you
`import React from 'react';
import {
View,
StyleSheet,
Text
} from 'react-native';
import ModalSelector from 'react-native-modal-selector';
import Icon from 'react-native-vector-icons/Ionicons';
import { fonts } from '../baseStyles/base';

const FieldPickerCategoryRecipe = props => {

const { input: { onChange, value }, children, meta: { touched, error } } = props;

const category = <Icon name="md-contrast" size={40} color="lightgrey" />;
let initialValue = category;
if (value !== '') {
    initialValue = value;
}


let index = 0;
const data = [
    //{ key: index++, label: 'Aperitivos' },
    { key: index++, label: 'Almuerzo' },
    { key: index++, label: 'Cena' },
    //{ key: index++, label: 'Postres' },    
];
return (
    <View style={{flex:1, padding:5, alignItems: 'center'}}>

       
        <ModalSelector
            data={data}
            initValue={initialValue}
            initValueTextStyle={{color: 'grey', fontFamily: fonts.secundary}}
            onChange={(option) => onChange(option.label, option.index)}
            //supportedOrientations={['landscape']}
            accessible={true}
            scrollViewAccessibilityLabel={'Scrollable options'}
            cancelButtonAccessibilityLabel={'Cancel Button'}
            //style={{backgroundColor: '#F05451'}}
            //selectStyle={{borderColor: '#F05451'}}
            selectTextStyle={{fontSize: 16, fontFamily: fonts.secundary}}
            //overlayStyle={{flex: 1, padding: '5%', justifyContent: 'center', backgroundColor:'#F05451'}}
            //sectionStyle={{borderColor: '#F05451'}} // no hace nada
            sectionTextStyle={{fontFamily: fonts.primary}} 
            optionTextStyle={{color: 'grey', fontFamily: fonts.primary}}
            optionContainerStyle={{backgroundColor:'#fff'}}
            //onChange={(option)=>{ alert(`${option.label} (${option.key}) nom nom nom`) }} 
            cancelStyle={{backgroundColor:'#fff'}}
            cancelTextStyle={{color: 'grey', fontFamily: fonts.terciary}}
            cancelText="Cancelar"
        />
        {touched && error && <View style={styles.containerErrors}><Text style={styles.errors}>{error}</Text></View>}
    </View>
);

}

@peacechen
Copy link
Owner

I see, a <Text> component can have an Icon within it 😄

All that needs to be changed is the propType for initValue, along with the documentation. Would you be interested in submitting a PR? This line should be modified:
https://github.com/peacechen/react-native-modal-selector/blob/master/index.js#L32

... to

    initValue:                      PropTypes.oneOf([PropTypes.string, PropTypes.object]),

... and the Readme updated to show initValue supports both String and Object types.

@georgeMorales
Copy link
Author

What is a PR? I don't understand very well what you mean ...
If in the index file of the library I change initValue: PropTypes.string, to initValue: PropTypes.oneOf ([PropTypes.string, PropTypes.object]),
Is the problem fixed?

@peacechen
Copy link
Owner

Fork this project, make the changes to the code & Readme, then create a pull request.
https://help.github.com/en/articles/creating-a-pull-request

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants