How to use the react-overlays/lib/utils/createChainedFunction function in react-overlays

To help you get started, we’ve selected a few react-overlays examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github NDLANO / learningpath-frontend / src / common / tooltip / OverlayTrigger.jsx View on Github external
const triggerProps = trigger.props;

    // create in render otherwise owner is lost...
    this.overlay = this.getOverlay();

    const props = {
      onMouseOver: createChainedFunction(
        this.handleShow,
        triggerProps.onMouseOver,
      ),
      onMouseOut: createChainedFunction(
        this.handleHide,
        triggerProps.onMouseOut,
      ),
      onFocus: createChainedFunction(this.handleShow, triggerProps.onFocus),
      onBlur: createChainedFunction(this.handleHide, triggerProps.onBlur),
      'aria-describedby': this.props.overlay.props.id,
    };

    return cloneElement(trigger, props);
  }
}
github NDLANO / learningpath-frontend / src / common / tooltip / OverlayTrigger.jsx View on Github external
render() {
    const trigger = React.Children.only(this.props.children);
    const triggerProps = trigger.props;

    // create in render otherwise owner is lost...
    this.overlay = this.getOverlay();

    const props = {
      onMouseOver: createChainedFunction(
        this.handleShow,
        triggerProps.onMouseOver,
      ),
      onMouseOut: createChainedFunction(
        this.handleHide,
        triggerProps.onMouseOut,
      ),
      onFocus: createChainedFunction(this.handleShow, triggerProps.onFocus),
      onBlur: createChainedFunction(this.handleHide, triggerProps.onBlur),
      'aria-describedby': this.props.overlay.props.id,
    };

    return cloneElement(trigger, props);
  }
}
github NDLANO / learningpath-frontend / src / common / tooltip / OverlayTrigger.jsx View on Github external
const trigger = React.Children.only(this.props.children);
    const triggerProps = trigger.props;

    // create in render otherwise owner is lost...
    this.overlay = this.getOverlay();

    const props = {
      onMouseOver: createChainedFunction(
        this.handleShow,
        triggerProps.onMouseOver,
      ),
      onMouseOut: createChainedFunction(
        this.handleHide,
        triggerProps.onMouseOut,
      ),
      onFocus: createChainedFunction(this.handleShow, triggerProps.onFocus),
      onBlur: createChainedFunction(this.handleHide, triggerProps.onBlur),
      'aria-describedby': this.props.overlay.props.id,
    };

    return cloneElement(trigger, props);
  }
}
github NDLANO / learningpath-frontend / src / common / tooltip / OverlayTrigger.jsx View on Github external
render() {
    const trigger = React.Children.only(this.props.children);
    const triggerProps = trigger.props;

    // create in render otherwise owner is lost...
    this.overlay = this.getOverlay();

    const props = {
      onMouseOver: createChainedFunction(
        this.handleShow,
        triggerProps.onMouseOver,
      ),
      onMouseOut: createChainedFunction(
        this.handleHide,
        triggerProps.onMouseOut,
      ),
      onFocus: createChainedFunction(this.handleShow, triggerProps.onFocus),
      onBlur: createChainedFunction(this.handleHide, triggerProps.onBlur),
      'aria-describedby': this.props.overlay.props.id,
    };

    return cloneElement(trigger, props);
  }
}
github instructure / instructure-ui / lib / util / RootCloseWrapper.js View on Github external
render () {
    const {
      noWrap,
      children
    } = this.props

    const child = Children.only(children)

    if (noWrap) {
      return safeCloneElement(child, {
        onClick: createChainedFunction(this._suppressRootCloseHandler, child.props.onClick)
      })
    }

    // Wrap the child in a new element, so the child won't have to handle
    // potentially combining multiple onClick listeners.

    /* eslint-disable
      jsx-a11y/onclick-has-role,
      jsx-a11y/onclick-has-focus,
      jsx-a11y/click-events-have-key-events
    */
    return (
      <div>
        {child}
      </div>
    )