import React from 'react';
import { Tooltip } from 'reactstrap';

export default class Example extends React.Component {
  constructor(props) {
    super(props);

    this.toggle = this.toggle.bind(this);
    this.state = {
      tooltipOpen: false
    };
  }

  toggle() {
    this.setState({
      tooltipOpen: !this.state.tooltipOpen
    });
  }

  render() {
    const id = "Tooltip Example"
    return (
      <div>
        <p>Somewhere in here is a <a href="#" id={id}>tooltip</a>.</p>
        <Tooltip placement="right" isOpen={this.state.tooltipOpen} target={id} toggle={this.toggle}>
          Hello world!
        </Tooltip>
      </div>
    );
  }
}

TypeError: this._target is null

export function getTarget(target) {
  if (isFunction(target)) {
    return target();
  }

  if (typeof target === 'string' && document) {
    let selection = document.querySelector(target);
    if (selection === null) {
      select = document.querySelector(`#${target}`);
      if (selection === null) {
        select = document.getElementById(target);
        if (selection === null) {
          throw new Error(`The target '{target}' could not be identified in the dom, tip: check spelling`);
        }
      }
    }
    return selection;
  }

  return target;
}