react-input-children
TypeScript icon, indicating that this package has built-in type declarations

5.0.0 • Public • Published

React Input Children

InputChildren 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.

import InputChildren from 'react-input-children';
 
React.renderComponent(
  <div>
    <InputChildren {...inputProps}>
      <a href="/forgot-password">Forgot?</a>
    </InputChildren>
  </div>,
  document.body);

Screenshot

Live Examples

Install

npm install --save react-input-children

Under the hood

The JSX is structured as follows:

<div>
  <input/>
  <div>
    {children}
  </div>
</div>

Inside componentDidMount InputChildren 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.

Package Sidebar

Install

npm i react-input-children

Weekly Downloads

65

Version

5.0.0

License

ISC

Unpacked Size

27.4 kB

Total Files

15

Last publish

Collaborators

  • pedrodim
  • marcopiii
  • gabro
  • veej
  • giogonzo
  • tpetrucciani
  • malpenzibo
  • federico.ercoles