onPress feedback

[uladkasach]

it would be great to be able to provide some sort of onPress feedback for the user.

one option could be having a renderComponent method, similar to a renderText method, to overwrite the default. Usage could be as follows:

  private renderComponent = (text, onPress) => {
    return <TouchableOpacity onPress={onPress}>{text}x</TouchableOpacity>; // or whatever other touchable response component user wants to use, e.g., react-native-material-ripple
  };

  public render() {
    const { children } = this.props;
    return (
      <ParsedText
        selectable={this.props.selectable}
        style={{
          color: Colors.text.primary,
          fontSize: 16,
        }}
        parse={[
          { type: 'url', style: clickableStyle, onPress: this.handleUrlPress, renderComponent: this.renderComponent },
          { type: 'phone', style: clickableStyle, onPress: this.handlePhonePress, renderComponent: this.renderComponent },
          { type: 'email', style: clickableStyle, onPress: this.handleEmailPress, renderComponent: this.renderComponent },
        ]}
        childrenProps={{ allowFontScaling: false }}
      >
        {children}
      </ParsedText>

[fbartho]

This is an interesting idea @uladkasach.

One problem, however is that many components (including Image) are not allowed to be nested inside of a Text Component on some platform.

If you still want this, I'd be happy to review an appropriate PR. It is not however high priority for me to implement this myself at this time.

If you don't want this, please let me know so we can close this ticket. Thanks!

If you find a bug or have a PR, I'm working on a new release in #79

[fbartho]

I'm going to close this ticket in favor of the older #37 -- please feel free to comment back if we should reopen this!

[unknwngera]

@fbartho hi, is this lib still maintaining? i think this prop (renderComponent) could accept at least a text component to overwrite the default, eg i have my custom text component with special logic inside