GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → nutboltu → React Search Field

nutboltu / React Search Field

Licence: mit
An elegant search field component for React.

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

react

React Search Field

dependencies Status Actions Status Follow @nutboltu

NPM

An elegant search field component for React.

See Demo and Documentation.

Screenshot

Props

The component takes the following props.

Prop Type Description
classNames string Additional classnames for the component
searchText string Initial search value of the input
placeholder string placeholder for the search input
onChange function Callback function to invoke when the user press any key. The function should contain two parameters(value, event).
onEnter function Callback function to invoke when the user press enter after pressing few keys. The function should contain two parameters(value, event).
onSearchClick function Callback function to invoke when the user click the search button. The function should contain one parameter(value).
onBlur function Callback function to invoke when the user blurs the search box. The function should contain two parameters(value, event).

Installation

npm install react-search-field --save

Usage

import SearchField from "react-search-field";

<SearchField
  placeholder="Search..."
  onChange={onChange}
  searchText="This is initial search text"
  classNames="test-class"
/>

Run

npm start

License

MIT Licensed. Copyright (c) Farhad Yasir 2018.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].