Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
react-google-geocoding
Advanced tools
react-google-geocoding - npm Package Compare versions
Comparing version 0.1.3 to 0.2.0
@@ -1,1 +0,1 @@ | ||
| "use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react"));exports.usePlacesPredictions=function(e){var r=t.default.useRef(null),u=t.default.useState([]),n=u[0],o=u[1],i=t.default.useState(!1),c=i[0],l=i[1],a=t.default.useState(null),f=a[0];return a[1],t.default.useEffect((function(){void 0!==window&&window.google&&(r.current=new window.google.maps.places.AutocompleteService)}),[]),t.default.useEffect((function(){try{if(!e.input)return;if(!r.current)throw new Error("Autocomplete Service not initialized");l(!0),r.current.getPlacePredictions(e,(function(e){o(e||[]),l(!1)}))}catch(e){console.error(e)}}),[e.input]),{predictions:n,loading:c,error:f}}; | ||
| "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("tslib").__exportStar(require("./use-place-predictions"),exports); |
@@ -1,1 +0,1 @@ | ||
| export * from "./use-places-predictions"; | ||
| export * from "./use-place-predictions"; |
@@ -1,1 +0,1 @@ | ||
| import e from"react";var t=function(t){var r=e.useRef(null),o=e.useState([]),n=o[0],i=o[1],c=e.useState(!1),u=c[0],l=c[1],a=e.useState(null),f=a[0];return a[1],e.useEffect((function(){void 0!==window&&window.google&&(r.current=new window.google.maps.places.AutocompleteService)}),[]),e.useEffect((function(){try{if(!t.input)return;if(!r.current)throw new Error("Autocomplete Service not initialized");l(!0),r.current.getPlacePredictions(t,(function(e){i(e||[]),l(!1)}))}catch(e){console.error(e)}}),[t.input]),{predictions:n,loading:u,error:f}};export{t as usePlacesPredictions}; | ||
| Object.defineProperty(exports,"__esModule",{value:!0}),require("tslib").__exportStar(require("./use-place-predictions"),exports); |
| { | ||
| "name": "react-google-geocoding", | ||
| "version": "0.1.3", | ||
| "version": "0.2.0", | ||
| "main": "dist/index.cjs.js", | ||
@@ -5,0 +5,0 @@ "module": "dist/index.esm.js", |
| # react-google-hooks | ||
| `react-google-hooks` is a React library designed to simplify the integration of the Google Places and Geocoding APIs. | ||
| It provides custom hooks for fetching place predictions and geocoding information with support for loading and error handling. | ||
| `react-google-hooks` is a React library that makes it easy to work with Google Places and Geocoding APIs. It provides simple, ready-to-use hooks for fetching place predictions and geocoding information, helping developers quickly integrate these features into their applications. The library is also designed with future expansion in mind, with plans to add support for more Google services through additional hooks. | ||
@@ -33,7 +32,7 @@ ## Installation | ||
| 1. **usePlacesPredictions** - Fetches place predictions based on a query. | ||
| 1. **usePlacePredictions** - Fetches place predictions based on a query. | ||
| ## `usePlacesPredictions` Hook | ||
| ## `usePlacePredictions` Hook | ||
| The `usePlacesPredictions` hook allows you to get autocomplete predictions based on user input. | ||
| The `usePlacePredictions` hook allows you to get autocomplete predictions based on user input. | ||
| It's ideal for enhancing forms or search inputs with location suggestions. | ||
@@ -45,14 +44,17 @@ | ||
| | Parameter | Type | Required | Default | Description | | ||
| | ---------------------- | --------------------------------------------------------------------------------------------------- | -------- | ----------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| | `input` | string | Yes | N/A | The text string on which to search for predictions. | | ||
| | `inputOffset` | number | No | N/A | A zero-based Unicode character offset of `input` indicating the cursor position. Defaults to the length of the input if not specified. | | ||
| | `language` | string | No | Browser's language preference | The language in which to return results. Results may be mixed if input language differs from specified language or translation isn't available. | | ||
| | `includedPrimaryTypes` | PlaceType[] | No | All Place types | An array of up to 5 primary place types (e.g., ['restaurant']). If no types are specified, all Place types are returned. | | ||
| | `includedRegionCodes` | RegionCode[] | No | N/A | An array of up to 15 CLDR two-character region codes to filter results. If combined with `locationRestriction`, results are within the intersection. | | ||
| | `locationBias` | google.maps.LatLng, google.maps.LatLngLiteral, google.maps.LatLngBounds, google.maps.Circle, string | No | IP-based | Bias results to a specific location. At most one of `locationBias` or `locationRestriction` should be set. | | ||
| | `locationRestriction` | google.maps.LatLngBounds, google.maps.LatLngBoundsLiteral | No | IP-based | Restrict results to a specific location. At most one of `locationBias` or `locationRestriction` should be set. | | ||
| | `origin` | google.maps.LatLng, google.maps.LatLngLiteral | No | N/A | The origin point for calculating geodesic distance to the destination. If omitted, geodesic distance will not be returned. | | ||
| | `region` | RegionCode | No | N/A | A CLDR two-character region code affecting address formatting, result ranking, and returned results. Does not restrict to the specified region. | | ||
| | `sessionToken` | google.maps.places.AutocompleteSessionToken | No | N/A | A token identifying an Autocomplete session for billing purposes. Must generate a new token for each session to avoid incorrect billing. | | ||
| | Parameter | Type | Required | Default | Description | | ||
| | ---------------------- | ------------------------------------------------------------------------------------------------------------- | -------- | ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| | `input` | `string` | Yes | N/A | The text string on which to search for predictions. | | ||
| | `inputOffset` | `number` | No | N/A | A zero-based Unicode character offset of `input` indicating the cursor position. Defaults to the length of the input if not specified. | | ||
| | `language` | `string` | No | Browser's language preference | The language in which to return results. Results may be mixed if input language differs from specified language or translation isn't available. | | ||
| | `includedPrimaryTypes` | `PlaceType[]` | No | All Place types | An array of up to 5 primary place types (e.g., ['restaurant']). If no types are specified, all Place types are returned. | | ||
| | `includedRegionCodes` | `RegionCode[]` | No | N/A | An array of up to 15 CLDR two-character region codes to filter results. If combined with `locationRestriction`, results are within the intersection. | | ||
| | `locationBias` | `google.maps.LatLng`, `google.maps.LatLngLiteral`, `google.maps.LatLngBounds`, `google.maps.Circle`, `string` | No | IP-based | Bias results to a specific location. At most one of `locationBias` or `locationRestriction` should be set. | | ||
| | `locationRestriction` | `google.maps.LatLngBounds`, `google.maps.LatLngBoundsLiteral` | No | IP-based | Restrict results to a specific location. At most one of `locationBias` or `locationRestriction` should be set. | | ||
| | `origin` | `google.maps.LatLng`, `google.maps.LatLngLiteral` | No | N/A | The origin point for calculating geodesic distance to the destination. If omitted, geodesic distance will not be returned. | | ||
| | `region` | `RegionCode` | No | N/A | A CLDR two-character region code affecting address formatting, result ranking, and returned results. Does not restrict to the specified region. | | ||
| | `sessionToken` | `google.maps.places.AutocompleteSessionToken` | No | N/A | A token identifying an Autocomplete session for billing purposes. Must generate a new token for each session to avoid incorrect billing. | | ||
| | `location` | `google.maps.LatLng` | No | N/A | Location for prediction biasing. Predictions will be biased towards the given `location` and `radius`. Alternatively, `bounds` can be used. **Deprecated** as of May 2023. Use `locationBias` and `locationRestriction` instead. | | ||
| | `radius` | `number` | No | N/A | The radius of the area used for prediction biasing in meters. Must always be accompanied by a `location` property. Alternatively, `bounds` can be used. **Deprecated** as of May 2023. Use `locationBias` and `locationRestriction` instead. | | ||
| | `bounds` | `google.maps.LatLngBounds`, `google.maps.LatLngBoundsLiteral` | No | N/A | Bounds for prediction biasing. Predictions will be biased towards, but not restricted to, the given `bounds`. Both `location` and `radius` will be ignored if `bounds` is set. **Deprecated** as of May 2023. Use `locationBias` and `locationRestriction` instead. | | ||
@@ -63,7 +65,7 @@ ### Returns | ||
| | Property | Type | Description | | ||
| | ------------- | ------- | ---------------------------------------------------------------- | | ||
| | `predictions` | Array | An array of place prediction objects from the Google Places API. | | ||
| | `loading` | boolean | Indicates if the API request is in progress. | | ||
| | `error` | string | An error message if the autocomplete service fails. | | ||
| | Property | Type | Description | | ||
| | ------------- | --------- | --------------------------------------------------------------------------------------------------------------- | | ||
| | `predictions` | `Array` | An array of place prediction objects from the Google Places API. | | ||
| | `isLoading` | `boolean` | Indicates if the API request is in progress. | | ||
| | `status` | `string` | The status of the request, which is a key of `google.maps.places.PlacesServiceStatus` or `null` if unavailable. | | ||
@@ -76,10 +78,9 @@ ### Example Usage | ||
| import React, { useState } from "react"; | ||
| import { usePlacesAutocomplete } from "react-google-geocoding"; | ||
| import { usePlacePredictions } from "react-google-hooks"; | ||
| const PlacesAutocompleteExample = () => { | ||
| const [query, setQuery] = useState(""); | ||
| const { predictions, loading, error } = usePlacePredictions({ | ||
| const { predictions, isLoading, status } = usePlacePredictions({ | ||
| input: "Shimla", | ||
| language: "en", | ||
| region: "US", | ||
| }); | ||
@@ -96,3 +97,2 @@ | ||
| {loading && <p>Loading...</p>} | ||
| {error && <p style={{ color: "red" }}>Error: {error}</p>} | ||
| <ul> | ||
@@ -141,3 +141,3 @@ {predictions.map((prediction) => ( | ||
| - [GitHub Repository](https://github.com/Raghuboi/react-google-geocoding) | ||
| - [GitHub Repository](https://github.com/Raghuboi/react-google-hooks) | ||
| - [Google Cloud Console](https://console.cloud.google.com/) |
@@ -1,1 +0,1 @@ | ||
| export * from "./use-places-predictions"; | ||
| export * from "./use-place-predictions"; |
| { | ||
| "compilerOptions": { | ||
| "target": "ES5", | ||
| "module": "ESNext", | ||
| "module": "NodeNext", | ||
| "declaration": true, | ||
@@ -9,3 +9,4 @@ "outDir": "dist", | ||
| "jsx": "react", | ||
| "esModuleInterop": true | ||
| "esModuleInterop": true, | ||
| "moduleResolution": "NodeNext" | ||
| }, | ||
@@ -12,0 +13,0 @@ "include": ["src"], |
New alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Fixed alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by42.84%
50279
- Number of package files
- increased by47.06%
25
- Lines of code
- increased by38.31%
834
- Number of low quality alerts
- decreased by-33.33%
2
No dependency changes