@arkyn/components 3.0.1-beta.100 → 3.0.1-beta.102

package/dist/components/searchPlaces.d.ts

@@ -1,4 +1,5 @@
-import { AutocompleteProps } from "@react-google-maps/api";
+import type { StandaloneSearchBoxProps } from "@react-google-maps/api";
+import { JSX } from "react";
 import { InputProps } from "./input";
 /**
  * Props for the SearchPlaces component.
@@ -8,14 +9,14 @@ import { InputProps } from "./input";
  * @property {(place: PlaceData) => void} [onPlaceChanged] - Callback fired when a place is selected from the autocomplete suggestions
  */
 type SearchPlacesProps = {
-    options?: AutocompleteProps["options"];
+    options?: StandaloneSearchBoxProps["options"];
     onChange?: (e: string) => void;
     onPlaceChanged?: (e: {
         street: string;
         city: string;
         state: string;
-        district: string;
-        cep: string;
+        neighborhood: string;
+        postalCode: string;
         stateShortName: string;
         streetNumber: string;
         coordinates: {
@@ -29,7 +30,7 @@ type SearchPlacesProps = {
  *
  * This component integrates with Google Maps API to provide address autocomplete functionality.
  * When a user selects a place from the suggestions, it extracts and returns structured address data
- * including street, city, state, district, postal code, and geographic coordinates.
+ * including street, city, state, neighborhood, postal code, and geographic coordinates.
  *
  * @component
  * @example
@@ -43,8 +44,8 @@ type SearchPlacesProps = {
  *     //   street: "Rua exemplo",
  *     //   city: "São Paulo",
  *     //   state: "São Paulo",
- *     //   district: "Centro",
- *     //   cep: "01310-100",
+ *     //   neighborhood: "Centro",
+ *     //   postalCode: "01310-100",
  *     //   stateShortName: "SP",
  *     //   streetNumber: "123",
  *     //   coordinates: { lat: -23.5505, lng: -46.6333 }
@@ -65,6 +66,6 @@ type SearchPlacesProps = {
  * @requires Google Maps JavaScript API with Places library loaded
  * @requires @react-google-maps/api package
  */
-declare function SearchPlaces(props: SearchPlacesProps): import("react/jsx-runtime").JSX.Element;
+declare function SearchPlaces(props: SearchPlacesProps): JSX.Element;
 export { SearchPlaces };
 //# sourceMappingURL=searchPlaces.d.ts.map

package/dist/components/searchPlaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"searchPlaces.d.ts","sourceRoot":"","sources":["../../src/components/searchPlaces.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAEzE,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAY5C;;;;;;GAMG;AACH,KAAK,iBAAiB,GAAG;IACvB,OAAO,CAAC,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;QACjB,GAAG,EAAE,MAAM,CAAC;QACZ,cAAc,EAAE,MAAM,CAAC;QACvB,YAAY,EAAE,MAAM,CAAC;QACrB,WAAW,EAAE;YAAE,GAAG,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,CAAC;KAC3C,KAAK,IAAI,CAAC;CACZ,GAAG,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,iBAAS,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAiE7C;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"searchPlaces.d.ts","sourceRoot":"","sources":["../../src/components/searchPlaces.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAEvE,OAAO,EAAE,GAAG,EAAY,MAAM,OAAO,CAAC;AACtC,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAY5C;;;;;;GAMG;AACH,KAAK,iBAAiB,GAAG;IACvB,OAAO,CAAC,EAAE,wBAAwB,CAAC,SAAS,CAAC,CAAC;IAC9C,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,CAAC;QACrB,UAAU,EAAE,MAAM,CAAC;QACnB,cAAc,EAAE,MAAM,CAAC;QACvB,YAAY,EAAE,MAAM,CAAC;QACrB,WAAW,EAAE;YAAE,GAAG,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,CAAC;KAC3C,KAAK,IAAI,CAAC;CACZ,GAAG,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,iBAAS,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CAmF3D;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/searchPlaces.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Autocomplete } from "@react-google-maps/api";
+import { StandaloneSearchBox } from "@react-google-maps/api";
 import { useState } from "react";
 import { Input } from "./input";
 /**
@@ -7,7 +7,7 @@ import { Input } from "./input";
  *
  * This component integrates with Google Maps API to provide address autocomplete functionality.
  * When a user selects a place from the suggestions, it extracts and returns structured address data
- * including street, city, state, district, postal code, and geographic coordinates.
+ * including street, city, state, neighborhood, postal code, and geographic coordinates.
  *
  * @component
  * @example
@@ -21,8 +21,8 @@ import { Input } from "./input";
  *     //   street: "Rua exemplo",
  *     //   city: "São Paulo",
  *     //   state: "São Paulo",
- *     //   district: "Centro",
- *     //   cep: "01310-100",
+ *     //   neighborhood: "Centro",
+ *     //   postalCode: "01310-100",
  *     //   stateShortName: "SP",
  *     //   streetNumber: "123",
  *     //   coordinates: { lat: -23.5505, lng: -46.6333 }
@@ -63,22 +63,37 @@ function SearchPlaces(props) {
                 return data.short_name;
             return "";
         }
+        function findDataByMultipleTypes(keys) {
+            for (const key of keys) {
+                const data = address_components.find((item) => item.types.includes(key));
+                if (data)
+                    return data.long_name;
+            }
+            return "";
+        }
         if (place) {
             const street = findData("route");
             const streetNumber = findData("street_number");
-            const district = findData("sublocality_level_1");
+            const neighborhood = findDataByMultipleTypes([
+                "sublocality_level_1",
+                "sublocality",
+                "neighborhood",
+            ]);
             const city = findData("administrative_area_level_2");
             const state = findData("administrative_area_level_1");
             const stateShortName = findDataShort("administrative_area_level_1");
-            const cep = findData("postal_code");
+            const postalCode = findDataByMultipleTypes([
+                "postal_code",
+                "postal_code_prefix",
+            ]);
             const lat = place.geometry?.location?.lat();
             const lng = place.geometry?.location?.lng();
             const sendPlace = {
                 street,
                 city,
                 state,
-                district,
-                cep,
+                neighborhood,
+                postalCode,
                 streetNumber,
                 stateShortName,
                 coordinates: { lat, lng },
@@ -86,6 +101,6 @@ function SearchPlaces(props) {
             onPlaceChanged && onPlaceChanged(sendPlace);
         }
     };
-    return (_jsx(Autocomplete, { onLoad: handleLoad, onPlaceChanged: handlePlacesChanged, options: options, children: _jsx(Input, { type: "text", onChange: (e) => onChange && onChange(e.target.value), ...rest }) }));
+    return (_jsx(StandaloneSearchBox, { onLoad: handleLoad, onPlacesChanged: handlePlacesChanged, options: options, children: _jsx(Input, { type: "text", autoComplete: "off", onChange: (e) => onChange && onChange(e.target.value), ...rest }) }));
 }
 export { SearchPlaces };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arkyn/components",
-  "version": "3.0.1-beta.100",
+  "version": "3.0.1-beta.102",
   "main": "./dist/bundle.js",
   "module": "./dist/bundle.js",
   "types": "./dist/index.d.ts",