
Product
Introducing Module Reachability: Focus on the Vulnerabilities That Matter
Module Reachability filters out unreachable CVEs so you can focus on vulnerabilities that actually matter to your application.
material-ui-search-bar
Advanced tools
See this component in action
npm i --save material-ui-search-bar
Note: If you're still using Material-UI v3, please install v0.x of the search bar using npm i --save material-ui-search-bar@beta
The SearchBar
is a controlled input, meaning that you need to keep the input state. This allows for much flexibility, e.g. you can change and clear the search input just by changing its props.
import SearchBar from "material-ui-search-bar";
// *snip*
return (
<SearchBar
value={this.state.value}
onChange={(newValue) => this.setState({ value: newValue })}
onRequestSearch={() => doSomethingWith(this.state.value)}
/>
);
Name | Type | Default | Description |
---|---|---|---|
cancelOnEscape | bool | Whether to clear search on escape | |
classes* | object | Override or extend the styles applied to the component. | |
className | string | '' | Custom top-level class |
closeIcon | node | <ClearIcon style={{ color: grey[500] }} /> | Override the close icon. |
disabled | bool | false | Disables text field. |
onCancelSearch | func | Fired when the search is cancelled. | |
onChange | func | Fired when the text value changes. | |
onRequestSearch | func | Fired when the search icon is clicked. | |
placeholder | string | 'Search' | Sets placeholder text for the embedded text field. |
searchIcon | node | <SearchIcon style={{ color: grey[500] }} /> | Override the search icon. |
style | object | null | Override the inline-styles of the root element. |
value | string | '' | The value of the text field. |
* required property
Any other properties supplied will be spread to the underlying Input
component.
The files included in this repository are licensed under the MIT license.
FAQs
Material style search bar
The npm package material-ui-search-bar receives a total of 6,474 weekly downloads. As such, material-ui-search-bar popularity was classified as popular.
We found that material-ui-search-bar demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Module Reachability filters out unreachable CVEs so you can focus on vulnerabilities that actually matter to your application.
Product
Socket is introducing a new way to organize repositories and apply repository-specific security policies.
Research
Security News
Socket researchers uncovered malicious npm and PyPI packages that steal crypto wallet credentials using Google Analytics and Telegram for exfiltration.