react-input-link v0.0.5

React Input Link

ReactInputLink is a replacement for the base input react component capable of rendering a child (link, button...) inside the input itself. It supports the same props of react input.

var InputLink = require('react-input-link');

React.renderComponent(
  <div>
    <InputLink {...inputProps}>
      <a href="/forgot-password">Forgot?</a>
    </InputLink>
  </div>,
  document.body);

Live Demo

more examples here

###Install

npm install --save react-input-link

###Under the hood The JSX is structured as follows:

<div>
  <input/>
  <div>
    {this.props.children}
  </div>
</div>

Inside componentDidMount ReactInputLink gets height and width of the child div wrapper and uses them to position it correctly inside the input and to give the correct right padding to the input itself.