chirag04 / react-native-tooltip Goto Github PK

What used to be a warning: Warning: PropTypes has been moved to a separate package is now a removal, and redbox error in RN 0.49.3:

Need a fix like https://github.com/clauderic/react-native-highlight-words/pull/4/files

I need to show the custom option in the first position inside the menu.

This section gives the following error:
TypeError: undefined is not an object (evaluating 'Object.keys(_reactNative.TouchableHighlight.propTypes)')

1、Duplicate interface definition for class 'RCTView'
2、Property has a previous declaration

"react": "15.4.1",
"react-native": "0.40.0",

I'm dropping in Tooltip as a replacement for my existing components, iterated as rows inside a listview over a data array. For example, a row:

<ToolTip onLayout={(e) => console.log(index, `Summary ${rowID} onLayout:`, e.nativeEvent.layout)}>
  <Text ...>
</ToolTip>

console logs would return for each row, e.nativeEvent.layout.width and .height as expected. .x and .y however always return 0, while TouchableHighlight returns the x,y coordinates of the rendered component as documented (React Native).

Is this a bug that e.nativeEvent.layout is not fully inherited from TouchableHighlight, or rather, the parent touchablewithoutfeedback?

how to make new line if text to long
thanks

in my react-native version 0.39 this library not works.

I had to do magic to find the correct version and with a lot of luck, I found that the compatible version of this library that is version of react was 4.1.0.

It would be of great help with table with these specifications, thanks

Plugin gives error native component does not exist, please check screenshot attached

Versions:
react-native-cli: 2.0.1
react-native: 0.51.0

Hi, author and contributors. Do you think it's possible that tooltip provides a callback invoked when it got dismissed? it's quite important when I try to combine it with redux and make it driven by state.

I am working on a project where I need to show UIMenuController with custom option when user selects some html content in a WebView, when I place the webView inside ToolTip, it should work but It doesn't, Instead It won't even let WebView to Render.

Points to be noted:

• I am Using alinz/react-native-webview-bridge Library for WebView and It pretty much works.
• I want to add a custom option in the UIMenuController that performs some operation on the WebView contents.

Hey,

I am trying to change tooltip styling but seems like there is no option to change. Is there any way to modify styling of tooltip ?

Thanks,

The (Screenshot) links aren't working.

Suggestion: Add a podspec file to the package to enable auto-linking support for react-native 0.60 >

Hey there! First of all, thanks for this cool library. It has been working great.

We are having an issue when displaying the tooltip the first time after the user opens the app.

The tooltip dissapears that first time. After that, it works correctly:

The code is simple:

export default class ContextMenu extends React.PureComponent {
  componentWillUnmount() {
    if (this.ref) {
      this.ref.hideMenu();
      delete this.ref;
    }
  }

  setRef = (ref) => {
    if (!ref) {
      return;
    }

    this.ref = ref;
    if (ref) {
      setTimeout(() => {
        if (this.ref) {
          this.ref.showMenu();
        }
      }, 100);
    }
  }

  render() {
    const actions = getActions(this.props);

    return (
      <ToolTip
        actions={actions}
        ref={this.setRef}
      >
        <View />
      </ToolTip>
    );
  }
}

Note that we had to introduce that delay because the tooltip doesn't appear when placed in componentDidMount.
I tried to debug this, as I thought that a hideMenu() was being called, but it wasn't. showMenu() is called correctly and then the context menu disappears without a call to hideMenu().

Any help would be appreciated, thanks!

Is there an event for blur? (when not selecting anything from the tooltip?)

Thanks.

Getting RCTSparseArray.h file not found. It looks like RN dropped it.
facebook/react-native@fa0b45c

Any chance for an update?

How to get selected text onPress?

Thanks

This is a great plugin but having it work only on IOS makes it not as useful. Any plans on making this work on Android as well?

Thanks!

Tapping on the element, steals the focus and dismisses the keyboard. Is there a way I can prevent this from happening? keyboardShouldPersistTaps={true} didn't work...

Please support on Android
Thanks you!

Hello @chirag04, thanks for this project. It is no longer working and some people have tried fixing it but you might be too busy to manage the PRs on this project.

It would be nice if you could add some collaborators that could fix and maintain this project. Maybe one of the contributors or someone that has a PR open?

@imartingraham
@jrichardlai
@jedt
@doronpr
@fungilation
@jeremyeaton89
@enahum
@msftsvachon

Chrome console output, on RN 0.46.2:

ExceptionsManager.js:71 Warning: React.createClass is no longer supported. Use a plain JavaScript class instead. If you're not yet ready to migrate, create-react-class is available on npm as a drop-in replacement. (https://fb.me/migrating-from-react-create-class)
reactConsoleErrorHandler | @ | ExceptionsManager.js:71
-- | -- | --
  | printWarning | @ | warning.js:36
  | warning | @ | warning.js:60
  | get | @ | react.development.js:2125
  | (anonymous) | @ | ToolTip.ios.js:24
  | loadModuleImplementation | @ | require.js:174
  | guardedLoadModule | @ | require.js:126
  | _require | @ | require.js:110
  | (anonymous) | @ | components.js:53
  | loadModuleImplementation | @ | require.js:174
  | guardedLoadModule | @ | require.js:126
  | _require | @ | require.js:110
  | (anonymous) | @ | index.ios.js:86
  | loadModuleImplementation | @ | require.js:174
  | guardedLoadModule | @ | require.js:119
  | _require | @ | require.js:110
  | (anonymous) | @ | redux-logger.js:1
  | executeApplicationScript | @ | debuggerWorker.js:40
  | (anonymous) | @ | debuggerWorker.js:65

A sample PR to fix: https://github.com/maxs15/react-native-modalbox/pull/148/files

I've created an issue and a pull request to fix this issue on React Native.

I am posting this here because I've encountered this issue when working with this library.

I trigger the tooltip programmatically when user touches container. But the container will be "highlighted", even if I tried to set some properties like underlayColor='transparent'.
I wonder how can I remove the highlight effect.

Warnings are thrown in RN 0.25
Put together a fix: #13
Can you merge?

I have using this module getting this Like as below screen shot.

Undefined is Not an Object('evaluating ToolTipMenu.Show')

I have use this Code

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  Alert,
  AlertIos,
  Image,
  PixelRatio,
  Coordinates,
  TouchableOpacity,
  NativeModules,
  View
} from 'react-native';
var Dimensions = require('Dimensions');
var windowSize = Dimensions.get('window');
var ToolTip = require('react-native-tooltip');
var ToolTipMenu = NativeModules.ToolTipMenu;

export default class index extends Component {
  constructor(props) {
    super(props)
    this.state={
      xcor:null,
      ycor:null,
      corx:'',
      array:[],
      count: 0

    }
  }


handlePress(evt){
  var array =this.state.array
  var count = 0
  console.log("Coordinates",`x coord = ${evt.nativeEvent.locationX}`);
  console.log("Coordinates",`y coord = ${evt.nativeEvent.locationY}`);
  var cordinates = {
    "xcor":evt.nativeEvent.locationX,
    "ycor":evt.nativeEvent.locationY}
  array.push(cordinates)
  this.setState({
    array:array
  })

 /* this.setState({
    xcor:evt.nativeEvent.locationX,
    ycor:evt.nativeEvent.locationY,
    corx:evt.nativeEvent.locationX
  })*/
}

  render() {
    var array =[];
    if(this.state.array.length != 0){
      this.state.array.map((res)=>{
        array.push(
          <View style={styles.textinputContainer}>
          <ToolTip
            ref='theToolTip'
            actions={[
              {text: 'xcor', onPress: () => { this.setState({input: 'x pressed'}) }},
              {text: 'ycor', onPress: () => { this.setState({input: 'y pressed'}) }}
            ]}
            underlayColor='transparent'
            longPress={false}
            arrowDirection='down'
            style={styles.textinput}
          >
           <View style={{position:"relative",flex:1,left:res.xcor,top:res.ycor}}>
            <Image source={require('./logo.png')} style={{resizeMode:'cover',width:50,height:50}}>
            </Image>
          </View>
          </ToolTip>
        </View>
          
          )
      })
    }
    return (
      <View style={styles.container}>
      <View style={{position:'absolute'}}>
      <TouchableOpacity onPress={(evt) => this.handlePress(evt)}>
      <Image source={require('./back1.jpg')} style={{resizeMode:'cover',width:windowSize.width,height:windowSize.height}}>
        </Image>
         </TouchableOpacity>
      
        </View>
       
        {this.state.array.length != 0 ?(
          <View>
          {array}
      </View>
          ):(<View></View>)
         }
         
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
   
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  textinputContainer: {
    marginTop: 20,
    justifyContent: 'center',
    alignItems: 'center',
  },
  textinput: {
    width: 60,
    //marginVertical: 2,
    //marginHorizontal: 2,
    borderWidth: 1 / PixelRatio.get(),
    borderRadius: 5,
    borderColor: '#c7c7cc',
    padding: 2,
    fontSize: 14,
    backgroundColor: 'white',
  }
});

module.exports=index;

Receiving this error when trying to build:

/[...]/node_modules/react-native-tooltip/ToolTipMenu/RCTToolTipText.m:27:23: No visible @interface for 'RCTEventDispatcher' declares the selector 'sendTextEventWithType:reactTag:text:eventCount:'

Any ideas?