Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 35 additions & 0 deletions readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ This package includes different tools that support you with common tasks.
- [Usage](#usage)
- [useInterval](#useinterval)
- [Async Data](#async-data)
- [LocationProvider](#locationprovider)
- [Build & Publish](#build--publish)
- [Information](#information)

Expand Down Expand Up @@ -114,6 +115,40 @@ const MyCommponent = () => {
}
```

### LocationProvider

This part includes a React context that fetches the geolocation at a given interval.

```tsx
import { LocationProvider } from '@aboutbits/react-toolbox'

const MyApp = () => {

return (
<LocationProvider highAccuracy={true} delay={20000}>
{children}
</LocationProvider>
)
}
```

The context provider takes two props:
- `highAccuracy`: defines if the location should be fetched with high accuracy. Read more on the [Geolocation API doc](https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API).
- `delay`: the delay in milliseconds between each fetch

```tsx
import { useContext } from 'react'
import { LocationContext } from '@aboutbits/react-toolbox'

const MyComponent = () => {
const { location } = useContext(LocationContext)

return location
? <div>Your location is: {location.coords.latitude}, {location.coords.longitude}</div>
: <div>Unable to get your location</div>
}
```

## Build & Publish

To publish the package commit all changes and push them to main. Then run one of the following commands locally:
Expand Down