@ied/dropdown

Dropdown

Install

yarn add @ied/dropdown

Use

import React, { Component, Fragment } from 'react'
import { render } from 'react-dom'

import Dropdown, { positions } from '@ied/dropdown'

class App extends Component {
  state = {
    dropdown: false
  }

  toggleDropdown = () => {
    this.setState({ dropdown: !this.state.dropdown })
  }

  render() {
    return (
      <Fragment>
        <input
          onFocus={this.toggleDropdown}
          onBlur={this.toggleDropdown}
          id="xyz"
        />
        {this.state.dropdown && (
          <Dropdown target="xyz" position={positions.BOTTOM_RIGHT}>
            // Your content
          </Dropdown>
        )}
      </Fragment>
    )
  }
}

const root = document.getElementById('root')

if (root) {
  render(<App />, root)
}

Types

type Props = {
  children: React$Node,
  target: string,
  position?: string,
  className?: string,
  style?: {}
}