OpenGraphAwareInput >> TextInput Props

[VooduVibe]

Description of the issue

Hi Osedea team and contributors. Thank you for this great kit. I am just trying to figure out how to pass some of the typical TextInput props through the OpenGraphAwareInput component. For example:

placeholder="Type your post..."
placeholderTextColor="#d6d6d6"
maxLength={240}
numberOfLines={3}
autoCapitalize="sentences"

Code snippet

I have tried the above props as follows, but it seems that these props are unsupported:

<OpenGraphAwareInput
   containerStyle ={styles.inputContainer}
   placeholder="Type your post..."
   placeholderTextColor="#d6d6d6"
   maxLength={240}
   numberOfLines={3}
   autoCapitalize="sentences"/>

My apologies, I am not an expert so any guidance or alternative treatments that would allow me to customise the aware input box would be very much appreciated. Thank you in advance.

Versions

• React Native version: 0.60.5
• react-native-opengraph-kit version: 3.0.0

[adrienthiery]

Hi there,

You're right, this one would need a bit of a refresher.

I don't have the availability to do the change right now, but the solution would be to add the following change to : https://github.com/Osedea/react-native-opengraph-kit/blob/master/OpenGraphAwareInput.js

+     const { containerStyle, iconStyle, iconSource, onIconPress, textInputStyle, ...rest } = this.props;
        return (
-            <View style={[styles.container, this.props.containerStyle]}>
+            <View style={[styles.container, containerStyle]}>
                <TextInput
                    onChange={this.handleTextInputChange}
-                    style={[styles.input, this.props.textInputStyle]}
+                    style={[styles.input, textInputStyle]}
                    {...rest}
                />
                {ogDataToDisplay.map((meta, i) => (
                    <OpenGraphDisplay
                        key={i}
                        data={meta}
                        onIconPress={
                            this.props.showIcon
-                                ? this.props.onIconPress
+                                ? onIconPress
                                  || this.handleDismissOpengraph
                                : null
                        }
+                        iconSource={iconSource}
-                        iconSource={this.props.iconSource}
+                        iconStyle={iconStyle}
-                        iconStyle={this.props.iconStyle}
                    />
                ))}
            </View>

Would you be up for creating a PR ? 😄