# react-modern-search-dropdown

> Modern React search dropdown having name, logo and website

Latest version **1.0.2** (published 2020-12-06) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-modern-search-dropdown
pnpm add react-modern-search-dropdown
yarn add react-modern-search-dropdown
bun add react-modern-search-dropdown
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2020-12-06 |
| First published | 2020-12-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 96.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | saish007 |

## Links

- npm: https://www.npmjs.com/package/react-modern-search-dropdown
- npm.io page: https://npm.io/package/react-modern-search-dropdown

## Recent versions

- 1.0.2 (latest) — 2020-12-06
- 1.0.1 — 2020-12-06
- 1.0.0 — 2020-12-06

## README

# react-modern-search-dropdown component
![Screenshot](https://github.com/saish-shinde-007/react-modern-search-dropdown/blob/main/react-search-dropdown.png)
# Install the react-modern-search-dropdown component
`````
npm i react-modern-search-dropdown
`````
# Usage
```
import React, { Component } from 'react'
 
import SearchDropdown from 'react-modern-search-dropdown';

const MENU = [
    {
        name: 'Amazon',
        logoUrl: 'https://logo.clearbit.com/amazon.com/',
        domain: 'https://www.amazon.com'
    },
    {
        name: 'Apple',
        logoUrl: 'https://logo.clearbit.com/apple.com/',
        domain: 'https://www.apple.com'
    },
    {
        name: 'Google',
        logoUrl: 'https://logo.clearbit.com/google.com/',
        domain: 'https://www.google.com'
    },
    {
        name: 'Netflix',
        logoUrl: 'https://logo.clearbit.com/netflix.com/',
        domain: 'https://www.netflix.com'
    },
    {
        name: 'Facebook',
        logoUrl: 'https://logo.clearbit.com/facebook.com/',
        domain: 'https://www.facebook.com'
    }
];

class SearchExample extends Component {
  render () {
    return (
        <SearchDropdown dropdownList={MENU} width={400} />
    )
  }
}
```

# Props

| Prop  | Usage |
| ------------- | ------------- |
| dropdownList  | It takes an array of contents(name, logoURL, domain) and on the name the search query is applied.|
| width  | It's a numerical(px) value which decides the horizontal space taken by the search bar.|


# License
MIT © [saish007](https://github.com/saish-shinde-007/react-modern-search-dropdown)

# Keywords
none

---
_Source: https://npm.io/package/react-modern-search-dropdown · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._