import React from 'react';


export default class SearchPanel extends React.Component {
  static defaultProps = {
    filterValue: '',
  };

  constructor(props) {
    super(props);
    this.state = {
      filterValue: props.filterValue,
    };
  }

  setFilter = (filterValue) => {
    this.setState({ filterValue });
    this.props.onChange(filterValue);
  }

  render() {
    const { filterValue } = this.state;
    return (
      <div className='omni-table__search-panel'>
        <input
          /* type='search' */
          value={filterValue || ''}
          onChange={(e) => {
            this.setFilter(e.target.value || undefined);
          }}
          placeholder={this.props.placeholder || ''}
        />
      </div>
    );
  }
}