Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/eliseekn/react-native-openstreetmap-search-places
A React Native component to search places using OpenStreetMap
https://github.com/eliseekn/react-native-openstreetmap-search-places
Last synced: about 1 month ago
JSON representation
A React Native component to search places using OpenStreetMap
- Host: GitHub
- URL: https://github.com/eliseekn/react-native-openstreetmap-search-places
- Owner: eliseekn
- License: mit
- Created: 2024-05-10T08:28:26.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2024-08-09T10:24:05.000Z (5 months ago)
- Last Synced: 2024-08-09T11:54:21.363Z (5 months ago)
- Language: TypeScript
- Size: 1.69 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# OpenStreetMapSearchPlace
[![NPM version](https://img.shields.io/npm/v/react-native-openstreetmap-search-places.svg?style=flat)](https://www.npmjs.com/package/react-native-openstreetmap-search-places)
[![NPM downloads](https://img.shields.io/npm/dm/react-native-openstreetmap-search-places.svg?style=flat)](https://npmjs.org/package/react-native-openstreetmap-search-places)A React Native component to search places using OpenStreetMap
## Demo
## Requirements
```bash
node v20.13.1
```## Installation
```bash
npm install react-native-openstreetmap-search-places
```
```bash
yarn add react-native-openstreetmap-search-places
```## Usage
```tsx
import {useState} from 'react'
import {OpenStreetMapSearchPlace, LocationType} from 'react-native-openstreetmap-search-places'const MyComponent = () => {
const [location, setLocation] = useState(undefined)return (
)
}export default MyComponent
```## Props
| Property | Type | Required | Description |
|------------------------|----------------------|----------|----------------------------------------------------------------------------------------------------------------------|
| location | LocationType | True | Location data of searched value |
| setLocation | function | True | Set location value of searched value |
| lang | String | False | Language used to search places (default en) |
| noResultFoundText | String | False | Text to display when no result found |
| placeHolder | String | False | Input text component placeholder |
| searchPlaceHolder | String | False | Search input text placeholder |
| mode | String | True | Text input style display (eg: outlined or flat) |
| style | StyleProp | False | Input text component style |
| contentStyle | StyleProp | False | Input text component content style |
| outlineStyle | StyleProp | False | Input text component outline style |
| searchBarStyle | StyleProp | False | Search bar component style |
| searchBarInputStyle | StyleProp | False | Search input text component style |
| searchResultLabelStyle | StyleProp | False | Search result label style |
| modalStyle | StyleProp | False | Search results modal custom style |
| loaderColor | String | False | Loader color (default blue) |
| loaderSize | String or Number | True | Loader size (eg: 12, small or large) |
| loaderColor | String | True | Loader color |
| modalBgColor | String | True | Modal background color |
| dismissable | Boolean | True | Set if modal dismissable |
| icon | String | False | Input text component left icon. [(See icons list)](https://callstack.github.io/react-native-paper/docs/guides/icons) |
| iconSize | Number | False | Input text component left icon size |## License
The MIT License (MIT). Please see [License File](LICENSE.md) for more information.
## Changelog
Please see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.