@myrjfa/ui 2.1.8 → 2.2.0

package/dist/components/location/LocationPicker.js

@@ -0,0 +1,415 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import dynamic from "next/dynamic";
+import { Loader2, MapPin, Navigation, X } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+const DEFAULT_POSITION = [20.5937, 78.9629];
+const MIN_ARCGIS_SCORE = 80;
+const GOOGLE_FALLBACK_TIMEOUT_MS = 3000;
+const LOCATION_PROVIDER = (process.env.NEXT_PUBLIC_LOCATION_PROVIDER ||
+    process.env.NEXT_PUBLIC_MAPS_PROVIDER ||
+    "osm").toLowerCase();
+const GOOGLE_MAPS_API_KEY = process.env.NEXT_PUBLIC_GOOGLE_MAPS_API_KEY || "";
+const LeafletMap = dynamic(() => import("./leafletMap"), {
+    ssr: false,
+    loading: () => (_jsx("div", { className: "flex h-[300px] w-full items-center justify-center bg-gray-50", children: _jsx(Loader2, { className: "h-6 w-6 animate-spin text-gray-300" }) })),
+});
+function getCity(address) {
+    return (address === null || address === void 0 ? void 0 : address.city) || (address === null || address === void 0 ? void 0 : address.town) || (address === null || address === void 0 ? void 0 : address.village) || (address === null || address === void 0 ? void 0 : address.county) || "";
+}
+function isFiniteCoordinate(latitude, longitude) {
+    return Number.isFinite(Number(latitude)) && Number.isFinite(Number(longitude));
+}
+async function findNominatimLocation(query) {
+    const res = await fetch(`https://nominatim.openstreetmap.org/search?q=${encodeURIComponent(query)}&format=json&addressdetails=1&limit=1`, { headers: { "Accept-Language": "en" } });
+    const data = (await res.json());
+    return data[0] || null;
+}
+function getLocationProvider() {
+    return LOCATION_PROVIDER === "google" && GOOGLE_MAPS_API_KEY ? "google" : "osm";
+}
+function withTimeout(promise, timeoutMs, label) {
+    return new Promise((resolve, reject) => {
+        const timeout = window.setTimeout(() => {
+            reject(new Error(`${label} timed out after ${timeoutMs}ms`));
+        }, timeoutMs);
+        promise.then((value) => {
+            window.clearTimeout(timeout);
+            resolve(value);
+        }, (error) => {
+            window.clearTimeout(timeout);
+            reject(error);
+        });
+    });
+}
+function loadGoogleMapsApi() {
+    var _a, _b;
+    if (typeof window === "undefined") {
+        return Promise.reject(new Error("Google Maps API can only load in the browser."));
+    }
+    if ((_b = (_a = window.google) === null || _a === void 0 ? void 0 : _a.maps) === null || _b === void 0 ? void 0 : _b.places)
+        return Promise.resolve();
+    if (window.__trippeazeGoogleMapsPromise)
+        return window.__trippeazeGoogleMapsPromise;
+    window.__trippeazeGoogleMapsPromise = new Promise((resolve, reject) => {
+        const existingScript = document.getElementById("trippeaze-google-maps-api");
+        if (existingScript) {
+            existingScript.addEventListener("load", () => resolve(), { once: true });
+            existingScript.addEventListener("error", () => reject(new Error("Failed to load Google Maps API.")), { once: true });
+            return;
+        }
+        const script = document.createElement("script");
+        script.id = "trippeaze-google-maps-api";
+        script.src = `https://maps.googleapis.com/maps/api/js?key=${encodeURIComponent(GOOGLE_MAPS_API_KEY)}&libraries=places&loading=async`;
+        script.async = true;
+        script.defer = true;
+        script.onload = () => resolve();
+        script.onerror = () => reject(new Error("Failed to load Google Maps API."));
+        document.head.appendChild(script);
+    });
+    return window.__trippeazeGoogleMapsPromise;
+}
+function parseGoogleAddressComponents(components = []) {
+    const findLong = (type) => { var _a; return ((_a = components.find((component) => { var _a; return (_a = component.types) === null || _a === void 0 ? void 0 : _a.includes(type); })) === null || _a === void 0 ? void 0 : _a.long_name) || ""; };
+    return {
+        city: findLong("locality") || findLong("postal_town") || findLong("administrative_area_level_3"),
+        state: findLong("administrative_area_level_1"),
+        country: findLong("country"),
+        postalCode: findLong("postal_code"),
+    };
+}
+async function fetchGoogleSuggestions(query) {
+    await loadGoogleMapsApi();
+    return new Promise((resolve) => {
+        const service = new window.google.maps.places.AutocompleteService();
+        service.getPlacePredictions({
+            input: query,
+        }, (predictions, status) => {
+            if (status !== window.google.maps.places.PlacesServiceStatus.OK || !predictions) {
+                resolve([]);
+                return;
+            }
+            resolve(predictions.map((prediction) => ({
+                display_name: prediction.description,
+                placeId: prediction.place_id,
+                isGoogleSuggest: true,
+            })));
+        });
+    });
+}
+async function getGooglePlaceDetails(place) {
+    await loadGoogleMapsApi();
+    return new Promise((resolve) => {
+        const service = new window.google.maps.places.PlacesService(document.createElement("div"));
+        service.getDetails({
+            placeId: place.placeId,
+            fields: ["place_id", "formatted_address", "geometry", "address_components"],
+        }, (details, status) => {
+            var _a;
+            if (status !== window.google.maps.places.PlacesServiceStatus.OK || !((_a = details === null || details === void 0 ? void 0 : details.geometry) === null || _a === void 0 ? void 0 : _a.location)) {
+                resolve(null);
+                return;
+            }
+            const addressParts = parseGoogleAddressComponents(details.address_components);
+            resolve({
+                searchAddress: details.formatted_address || place.display_name,
+                address: details.formatted_address || place.display_name,
+                latitude: details.geometry.location.lat(),
+                longitude: details.geometry.location.lng(),
+                placeId: details.place_id || place.placeId,
+                ...addressParts,
+            });
+        });
+    });
+}
+async function reverseGoogleLocation(latitude, longitude) {
+    await loadGoogleMapsApi();
+    return new Promise((resolve) => {
+        const geocoder = new window.google.maps.Geocoder();
+        geocoder.geocode({ location: { lat: latitude, lng: longitude } }, (results, status) => {
+            if (status !== "OK" || !(results === null || results === void 0 ? void 0 : results[0])) {
+                resolve(null);
+                return;
+            }
+            const result = results[0];
+            const addressParts = parseGoogleAddressComponents(result.address_components);
+            resolve({
+                searchAddress: result.formatted_address,
+                address: result.formatted_address,
+                latitude,
+                longitude,
+                placeId: result.place_id,
+                ...addressParts,
+            });
+        });
+    });
+}
+export default function LocationPicker({ value, onChange, placeholder = "Search your location", required = false, label = "Location", }) {
+    var _a, _b;
+    const [searchValue, setSearchValue] = useState((value === null || value === void 0 ? void 0 : value.searchAddress) || (value === null || value === void 0 ? void 0 : value.address) || "");
+    const [suggestions, setSuggestions] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [mapVisible, setMapVisible] = useState(Boolean((value === null || value === void 0 ? void 0 : value.latitude) && (value === null || value === void 0 ? void 0 : value.longitude)));
+    const [showDropdown, setShowDropdown] = useState(false);
+    const [lat, setLat] = useState((_a = value === null || value === void 0 ? void 0 : value.latitude) !== null && _a !== void 0 ? _a : DEFAULT_POSITION[0]);
+    const [lng, setLng] = useState((_b = value === null || value === void 0 ? void 0 : value.longitude) !== null && _b !== void 0 ? _b : DEFAULT_POSITION[1]);
+    const [lastLocation, setLastLocation] = useState(value !== null && value !== void 0 ? value : null);
+    const debounceRef = useRef(null);
+    const lastEmittedRef = useRef(null);
+    useEffect(() => {
+        if (!value)
+            return;
+        const lastEmitted = lastEmittedRef.current;
+        if (lastEmitted &&
+            value.address === lastEmitted.address &&
+            value.latitude === lastEmitted.latitude &&
+            value.longitude === lastEmitted.longitude) {
+            return;
+        }
+        const nextSearchValue = value.searchAddress || value.address || "";
+        setSearchValue(nextSearchValue);
+        if (Number.isFinite(value.latitude) && Number.isFinite(value.longitude)) {
+            setLat(value.latitude);
+            setLng(value.longitude);
+            setMapVisible(true);
+            setLastLocation(value);
+        }
+    }, [value]);
+    useEffect(() => {
+        return () => {
+            if (debounceRef.current)
+                clearTimeout(debounceRef.current);
+        };
+    }, []);
+    const emitLocation = (location) => {
+        const nextLocation = {
+            ...location,
+            address: location.searchAddress,
+        };
+        setLastLocation(nextLocation);
+        lastEmittedRef.current = nextLocation;
+        onChange(nextLocation);
+    };
+    const fetchOsmSuggestions = async (query) => {
+        const arcgisRes = await fetch(`https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/suggest?text=${encodeURIComponent(query)}&f=json&maxSuggestions=8`);
+        const arcgisData = await arcgisRes.json();
+        const arcgisSuggestions = (arcgisData.suggestions || []).map((suggestion) => ({
+            display_name: suggestion.text,
+            magicKey: suggestion.magicKey,
+            isArcgisSuggest: true,
+        }));
+        if (arcgisSuggestions.length > 0) {
+            return arcgisSuggestions;
+        }
+        const nominatimRes = await fetch(`https://nominatim.openstreetmap.org/search?q=${encodeURIComponent(query)}&format=json&addressdetails=1&limit=8`, { headers: { "Accept-Language": "en" } });
+        return (await nominatimRes.json());
+    };
+    const emitOsmSuggestion = async (place) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+        if ("isArcgisSuggest" in place) {
+            const res = await fetch(`https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/findAddressCandidates?SingleLine=${encodeURIComponent(place.display_name)}&magicKey=${encodeURIComponent(place.magicKey)}&f=json&outFields=Match_addr,City,Region,Country,Postal&maxLocations=1`);
+            const data = await res.json();
+            const candidate = (_a = data.candidates) === null || _a === void 0 ? void 0 : _a[0];
+            const fallback = !candidate || candidate.score < MIN_ARCGIS_SCORE
+                ? await findNominatimLocation(place.display_name)
+                : null;
+            const selectedLat = fallback ? Number.parseFloat(fallback.lat || "") : Number((_b = candidate === null || candidate === void 0 ? void 0 : candidate.location) === null || _b === void 0 ? void 0 : _b.y);
+            const selectedLng = fallback ? Number.parseFloat(fallback.lon || "") : Number((_c = candidate === null || candidate === void 0 ? void 0 : candidate.location) === null || _c === void 0 ? void 0 : _c.x);
+            if (!isFiniteCoordinate(selectedLat, selectedLng))
+                return false;
+            setLat(selectedLat);
+            setLng(selectedLng);
+            setMapVisible(true);
+            emitLocation({
+                searchAddress: place.display_name,
+                latitude: selectedLat,
+                longitude: selectedLng,
+                placeId: place.magicKey,
+                city: fallback ? getCity(fallback.address) : ((_d = candidate.attributes) === null || _d === void 0 ? void 0 : _d.City) || "",
+                state: fallback ? ((_e = fallback.address) === null || _e === void 0 ? void 0 : _e.state) || "" : ((_f = candidate.attributes) === null || _f === void 0 ? void 0 : _f.Region) || "",
+                country: fallback ? ((_g = fallback.address) === null || _g === void 0 ? void 0 : _g.country) || "" : ((_h = candidate.attributes) === null || _h === void 0 ? void 0 : _h.Country) || "",
+                postalCode: fallback ? ((_j = fallback.address) === null || _j === void 0 ? void 0 : _j.postcode) || "" : ((_k = candidate.attributes) === null || _k === void 0 ? void 0 : _k.Postal) || "",
+            });
+            return true;
+        }
+        const selectedLat = Number.parseFloat(place.lat || "");
+        const selectedLng = Number.parseFloat(place.lon || "");
+        if (!Number.isFinite(selectedLat) || !Number.isFinite(selectedLng))
+            return false;
+        setLat(selectedLat);
+        setLng(selectedLng);
+        setMapVisible(true);
+        emitLocation({
+            searchAddress: place.display_name,
+            latitude: selectedLat,
+            longitude: selectedLng,
+            placeId: ((_l = place.place_id) === null || _l === void 0 ? void 0 : _l.toString()) || "",
+            city: getCity(place.address),
+            state: ((_m = place.address) === null || _m === void 0 ? void 0 : _m.state) || "",
+            country: ((_o = place.address) === null || _o === void 0 ? void 0 : _o.country) || "",
+            postalCode: ((_p = place.address) === null || _p === void 0 ? void 0 : _p.postcode) || "",
+        });
+        return true;
+    };
+    const emitOsmReverseLocation = async (nextLat, nextLng) => {
+        var _a, _b, _c, _d;
+        const res = await fetch(`https://nominatim.openstreetmap.org/reverse?lat=${nextLat}&lon=${nextLng}&format=json&addressdetails=1`, { headers: { "Accept-Language": "en" } });
+        const place = (await res.json());
+        const nextSearchAddress = place.display_name || searchValue;
+        setSearchValue(nextSearchAddress);
+        emitLocation({
+            searchAddress: nextSearchAddress,
+            latitude: nextLat,
+            longitude: nextLng,
+            placeId: ((_a = place.place_id) === null || _a === void 0 ? void 0 : _a.toString()) || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.placeId),
+            city: getCity(place.address) || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.city),
+            state: ((_b = place.address) === null || _b === void 0 ? void 0 : _b.state) || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.state),
+            country: ((_c = place.address) === null || _c === void 0 ? void 0 : _c.country) || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.country),
+            postalCode: ((_d = place.address) === null || _d === void 0 ? void 0 : _d.postcode) || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.postalCode),
+        });
+    };
+    const fetchSuggestions = async (query) => {
+        if (!query.trim() || query.trim().length < 3) {
+            setSuggestions([]);
+            return;
+        }
+        setLoading(true);
+        try {
+            if (getLocationProvider() === "google") {
+                try {
+                    const googleSuggestions = await withTimeout(fetchGoogleSuggestions(query), GOOGLE_FALLBACK_TIMEOUT_MS, "Google geocoding suggestions");
+                    if (googleSuggestions.length > 0) {
+                        setSuggestions(googleSuggestions);
+                        return;
+                    }
+                }
+                catch (googleError) {
+                    console.error("Google geocoding suggestions failed, falling back to OSM:", googleError);
+                }
+            }
+            setSuggestions(await fetchOsmSuggestions(query));
+        }
+        catch (error) {
+            console.error("Geocoding error:", error);
+            setSuggestions([]);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleInputChange = (event) => {
+        const nextValue = event.target.value;
+        setSearchValue(nextValue);
+        setShowDropdown(true);
+        if (debounceRef.current)
+            clearTimeout(debounceRef.current);
+        debounceRef.current = setTimeout(() => {
+            fetchSuggestions(nextValue);
+        }, 400);
+    };
+    const handleSelectSuggestion = async (place) => {
+        setSearchValue(place.display_name);
+        setSuggestions([]);
+        setShowDropdown(false);
+        setLoading(true);
+        try {
+            if ("isGoogleSuggest" in place) {
+                try {
+                    const googleLocation = await withTimeout(getGooglePlaceDetails(place), GOOGLE_FALLBACK_TIMEOUT_MS, "Google place details");
+                    if (googleLocation) {
+                        setLat(googleLocation.latitude);
+                        setLng(googleLocation.longitude);
+                        setMapVisible(true);
+                        emitLocation({
+                            searchAddress: googleLocation.searchAddress || googleLocation.address,
+                            latitude: googleLocation.latitude,
+                            longitude: googleLocation.longitude,
+                            placeId: googleLocation.placeId,
+                            city: googleLocation.city,
+                            state: googleLocation.state,
+                            country: googleLocation.country,
+                            postalCode: googleLocation.postalCode,
+                        });
+                        return;
+                    }
+                }
+                catch (googleError) {
+                    console.error("Google place details failed, falling back to OSM:", googleError);
+                }
+                const fallback = await findNominatimLocation(place.display_name);
+                if (fallback)
+                    await emitOsmSuggestion(fallback);
+                return;
+            }
+            if ("isArcgisSuggest" in place) {
+                await emitOsmSuggestion(place);
+                return;
+            }
+            await emitOsmSuggestion(place);
+        }
+        catch (error) {
+            console.error("Error selecting location:", error);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleMapChange = async (nextLat, nextLng) => {
+        setLat(nextLat);
+        setLng(nextLng);
+        setMapVisible(true);
+        try {
+            if (getLocationProvider() === "google") {
+                try {
+                    const googleLocation = await withTimeout(reverseGoogleLocation(nextLat, nextLng), GOOGLE_FALLBACK_TIMEOUT_MS, "Google reverse geocoding");
+                    if (googleLocation) {
+                        const nextSearchAddress = googleLocation.searchAddress || googleLocation.address;
+                        setSearchValue(nextSearchAddress);
+                        emitLocation({
+                            searchAddress: nextSearchAddress,
+                            latitude: nextLat,
+                            longitude: nextLng,
+                            placeId: googleLocation.placeId || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.placeId),
+                            city: googleLocation.city || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.city),
+                            state: googleLocation.state || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.state),
+                            country: googleLocation.country || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.country),
+                            postalCode: googleLocation.postalCode || (lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.postalCode),
+                        });
+                        return;
+                    }
+                }
+                catch (googleError) {
+                    console.error("Google reverse geocoding failed, falling back to OSM:", googleError);
+                }
+            }
+            await emitOsmReverseLocation(nextLat, nextLng);
+        }
+        catch (error) {
+            console.error("Reverse geocoding error:", error);
+            emitLocation({
+                searchAddress: searchValue,
+                latitude: nextLat,
+                longitude: nextLng,
+                placeId: lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.placeId,
+                city: lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.city,
+                state: lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.state,
+                country: lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.country,
+                postalCode: lastLocation === null || lastLocation === void 0 ? void 0 : lastLocation.postalCode,
+            });
+        }
+    };
+    const handleClear = () => {
+        setSearchValue("");
+        setSuggestions([]);
+        setShowDropdown(false);
+        setMapVisible(false);
+        setLastLocation(null);
+    };
+    return (_jsxs("div", { className: "relative flex flex-col gap-3", children: [label && (_jsxs("label", { className: "block text-xs font-bold uppercase tracking-widest text-gray-400", children: [label, " ", required && _jsx("span", { className: "text-red-500", children: "*" })] })), _jsxs("div", { className: "relative z-20", children: [_jsx("div", { className: "absolute left-4 top-1/2 -translate-y-1/2 text-gray-400", children: loading ? _jsx(Loader2, { className: "h-4 w-4 animate-spin" }) : _jsx(MapPin, { className: "h-4 w-4" }) }), _jsx("input", { type: "text", value: searchValue, onChange: handleInputChange, onFocus: () => {
+                            if (searchValue.length > 2)
+                                setShowDropdown(true);
+                        }, onBlur: () => setTimeout(() => setShowDropdown(false), 200), placeholder: placeholder, required: required, className: "w-full rounded-2xl border-2 border-gray-200 px-4 py-3 pl-10 pr-10 text-sm font-semibold text-gray-900 transition focus:border-primary focus:outline-none" }), searchValue && (_jsx("button", { type: "button", onClick: handleClear, className: "absolute right-4 top-1/2 -translate-y-1/2 text-gray-400 transition hover:text-gray-700", "aria-label": "Clear selected location", children: _jsx(X, { className: "h-4 w-4" }) })), showDropdown && suggestions.length > 0 && (_jsx("div", { className: "absolute left-0 top-[105%] z-[1000] max-h-64 w-full overflow-y-auto overflow-x-hidden rounded-2xl border border-gray-100 bg-white shadow-xl", children: suggestions.map((place, index) => (_jsxs("button", { type: "button", onMouseDown: (event) => {
+                                event.preventDefault();
+                                handleSelectSuggestion(place);
+                            }, className: "flex w-full items-start gap-3 border-b border-gray-50 px-5 py-3 text-left transition last:border-0 hover:bg-gray-50", children: [_jsx(MapPin, { className: "mt-0.5 h-4 w-4 flex-shrink-0 text-gray-400" }), _jsx("span", { className: "line-clamp-2 text-sm font-medium text-gray-700", children: place.display_name })] }, ("place_id" in place && place.place_id) || ("magicKey" in place && place.magicKey) || index))) }))] }), mapVisible && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "relative z-10 h-[300px] w-full overflow-hidden rounded-2xl border-2 border-gray-200 shadow-sm", children: [_jsx(LeafletMap, { position: [lat, lng], onMarkerDrag: handleMapChange }), lastLocation && (_jsxs("div", { className: "pointer-events-none absolute bottom-3 left-3 right-3 z-[1000] flex items-center gap-2 rounded-xl border border-gray-100 bg-white/90 px-3 py-2 shadow-md backdrop-blur-sm", children: [_jsx(Navigation, { className: "h-3.5 w-3.5 flex-shrink-0 text-primary" }), _jsx("p", { className: "flex-1 truncate text-xs font-semibold text-gray-700", children: searchValue }), _jsxs("span", { className: "flex-shrink-0 text-[10px] text-gray-400", children: [lat.toFixed(5), ", ", lng.toFixed(5)] })] }))] }), _jsx("p", { className: "text-xs text-gray-400", children: "Drag the pin, click the map, or pan and zoom to mark the exact location." })] })), !mapVisible && (_jsxs("p", { className: "flex items-center gap-1.5 text-xs text-gray-400", children: [_jsx(MapPin, { className: "h-3 w-3" }), "Search for a location to view and adjust it on the map."] }))] }));
+}

package/dist/components/location/LocationPreview.d.ts

@@ -0,0 +1,11 @@
+interface LocationPreviewProps {
+    latitude: number;
+    longitude: number;
+    address?: string;
+    title?: string;
+    /** Height of map in px */
+    mapHeight?: number;
+}
+export default function LocationPreview({ latitude, longitude, address, title, mapHeight, }: LocationPreviewProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=LocationPreview.d.ts.map

package/dist/components/location/LocationPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LocationPreview.d.ts","sourceRoot":"","sources":["../../../src/components/location/LocationPreview.tsx"],"names":[],"mappings":"AAKA,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0BAA0B;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAcD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,QAAQ,EACR,SAAS,EACT,OAAO,EACP,KAAkB,EAClB,SAAe,GAChB,EAAE,oBAAoB,2CAsDtB"}

package/dist/components/location/LocationPreview.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import dynamic from "next/dynamic";
+import { MapPin, Navigation, ExternalLink, Loader2 } from "lucide-react";
+const MapPreview = dynamic(() => import("./MapPreview"), {
+    ssr: false,
+    loading: () => (_jsxs("div", { className: "w-full h-full bg-gray-50 flex flex-col items-center justify-center gap-2", children: [_jsx(Loader2, { className: "w-6 h-6 text-gray-300 animate-spin" }), _jsx("span", { className: "text-gray-400 text-xs font-bold uppercase tracking-widest", children: "Loading Map" })] })),
+});
+export default function LocationPreview({ latitude, longitude, address, title = "Location", mapHeight = 240, }) {
+    const googleMapsUrl = `https://www.google.com/maps?q=${latitude},${longitude}`;
+    return (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("h3", { className: "font-black text-gray-900 text-lg flex items-center gap-2", children: [_jsx(MapPin, { className: "w-5 h-5 text-primary" }), title] }), _jsxs("a", { href: googleMapsUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1.5 text-xs font-bold text-primary bg-primary/10 px-3 py-1.5 rounded-full hover:bg-primary/20 transition", children: [_jsx(Navigation, { className: "w-3 h-3" }), "Get Directions", _jsx(ExternalLink, { className: "w-3 h-3" })] })] }), address && (_jsxs("p", { className: "text-sm text-gray-500 font-semibold flex items-start gap-2", children: [_jsx(MapPin, { className: "w-4 h-4 text-gray-400 flex-shrink-0 mt-0.5" }), address] })), _jsxs("div", { className: "rounded-2xl overflow-hidden border border-gray-200 shadow-sm relative z-0", style: { height: mapHeight }, children: [_jsx(MapPreview, { latitude: latitude, longitude: longitude }), _jsxs("a", { href: googleMapsUrl, target: "_blank", rel: "noopener noreferrer", className: "absolute bottom-3 right-3 flex items-center gap-1.5 bg-white text-primary font-bold text-xs px-3 py-1.5 rounded-xl shadow-md border border-gray-100 hover:bg-primary hover:text-white transition z-[1000]", children: [_jsx(ExternalLink, { className: "w-3 h-3" }), "Open in Maps"] })] }), _jsxs("p", { className: "text-xs text-gray-400 flex items-center gap-1", children: [_jsx(MapPin, { className: "w-3 h-3" }), latitude.toFixed(5), ", ", longitude.toFixed(5)] })] }));
+}

package/dist/components/location/MapPicker.d.ts

@@ -0,0 +1,9 @@
+import "leaflet/dist/leaflet.css";
+interface MapPickerProps {
+    latitude: number;
+    longitude: number;
+    onChange: (lat: number, lng: number) => void;
+}
+export default function MapPicker({ latitude, longitude, onChange, }: MapPickerProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MapPicker.d.ts.map

package/dist/components/location/MapPicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapPicker.d.ts","sourceRoot":"","sources":["../../../src/components/location/MapPicker.tsx"],"names":[],"mappings":"AAWA,OAAO,0BAA0B,CAAC;AAalC,UAAU,cAAc;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AA2CD,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE,cAAc,2CAahB"}

package/dist/components/location/MapPicker.js

@@ -0,0 +1,40 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { MapContainer, TileLayer, Marker, useMapEvents, useMap, } from "react-leaflet";
+import L from "leaflet";
+import "leaflet/dist/leaflet.css";
+// Fix leaflet default icon issue in React
+delete L.Icon.Default.prototype._getIconUrl;
+L.Icon.Default.mergeOptions({
+    iconRetinaUrl: "https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-icon-2x.png",
+    iconUrl: "https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-icon.png",
+    shadowUrl: "https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-shadow.png",
+});
+function LocationMarker({ position, onChange, }) {
+    const markerRef = useRef(null);
+    const map = useMap();
+    useEffect(() => {
+        // Only trigger flyTo when the position changes significantly, else it stutters on drag
+        if (map.distance(map.getCenter(), position) > 20) {
+            map.setView(position, map.getZoom(), { animate: true });
+        }
+    }, [position, map]);
+    useMapEvents({
+        click(e) {
+            onChange(e.latlng.lat, e.latlng.lng);
+        },
+    });
+    return (_jsx(Marker, { draggable: true, position: position, eventHandlers: {
+            dragend: (e) => {
+                const marker = e.target;
+                if (marker) {
+                    const { lat, lng } = marker.getLatLng();
+                    onChange(lat, lng);
+                }
+            },
+        }, ref: markerRef }));
+}
+export default function MapPicker({ latitude, longitude, onChange, }) {
+    return (_jsxs(MapContainer, { center: [latitude, longitude], zoom: 13, className: "w-full h-full z-0", children: [_jsx(TileLayer, { url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" }), _jsx(LocationMarker, { position: [latitude, longitude], onChange: onChange })] }));
+}

package/dist/components/location/MapPreview.d.ts

@@ -0,0 +1,8 @@
+import "leaflet/dist/leaflet.css";
+interface MapPreviewProps {
+    latitude: number;
+    longitude: number;
+}
+export default function MapPreview({ latitude, longitude }: MapPreviewProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MapPreview.d.ts.map

package/dist/components/location/MapPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapPreview.d.ts","sourceRoot":"","sources":["../../../src/components/location/MapPreview.tsx"],"names":[],"mappings":"AAIA,OAAO,0BAA0B,CAAC;AAgBlC,UAAU,eAAe;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,eAAe,2CAoB1E"}

package/dist/components/location/MapPreview.js

@@ -0,0 +1,17 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MapContainer, TileLayer, Marker } from "react-leaflet";
+import L from "leaflet";
+import "leaflet/dist/leaflet.css";
+// Fix leaflet default icon issue in React
+if (typeof window !== "undefined") {
+    delete L.Icon.Default.prototype._getIconUrl;
+    L.Icon.Default.mergeOptions({
+        iconRetinaUrl: "https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-icon-2x.png",
+        iconUrl: "https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-icon.png",
+        shadowUrl: "https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-shadow.png",
+    });
+}
+export default function MapPreview({ latitude, longitude }) {
+    return (_jsxs(MapContainer, { center: [latitude, longitude], zoom: 15, className: "w-full h-full z-0", scrollWheelZoom: false, dragging: false, doubleClickZoom: false, boxZoom: false, keyboard: false, touchZoom: false, zoomControl: false, children: [_jsx(TileLayer, { url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" }), _jsx(Marker, { position: [latitude, longitude], interactive: false })] }));
+}

package/dist/components/location/PlaceLinkInline.d.ts

@@ -0,0 +1,14 @@
+interface Props {
+    city?: string;
+    state?: string;
+    country?: string;
+    area?: string;
+    landmark?: string;
+    path?: string;
+    label?: string;
+    className?: string;
+    showIcon?: boolean;
+}
+export default function PlaceLinkInline({ city, state, country, area, landmark, path, label, className, showIcon, }: Props): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=PlaceLinkInline.d.ts.map

package/dist/components/location/PlaceLinkInline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlaceLinkInline.d.ts","sourceRoot":"","sources":["../../../src/components/location/PlaceLinkInline.tsx"],"names":[],"mappings":"AAQA,UAAU,KAAK;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,KAAK,EACL,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,SAAS,EACT,QAAe,GAChB,EAAE,KAAK,kDAqCP"}

package/dist/components/location/PlaceLinkInline.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import Link from "next/link";
+import { MapPin } from "lucide-react";
+import { cn } from "@myrjfa/state/dist/lib/utils";
+import { resolvePlaceLink } from "@myrjfa/state/dist/lib/placeActions";
+export default function PlaceLinkInline({ city, state, country, area, landmark, path, label, className, showIcon = true, }) {
+    const [href, setHref] = useState("");
+    const [resolvedName, setResolvedName] = useState("");
+    useEffect(() => {
+        if (path) {
+            setHref(`/places/${String(path).replace(/^\/+|\/+$/g, "")}`);
+            return undefined;
+        }
+        let ignore = false;
+        resolvePlaceLink({ city, state, country, area, landmark, path }).then((result) => {
+            if (ignore || !result.success || !result.resolution)
+                return;
+            setHref(result.resolution.href);
+            setResolvedName(result.resolution.place.name);
+        });
+        return () => {
+            ignore = true;
+        };
+    }, [area, city, country, landmark, path, state]);
+    if (!href)
+        return null;
+    return (_jsxs(Link, { href: href, className: cn("inline-flex items-center gap-1.5 text-sm font-semibold text-primary hover:text-primary/80 transition", className), children: [showIcon ? _jsx(MapPin, { className: "w-4 h-4" }) : null, label || `View in ${resolvedName || "Place Page"}`] }));
+}

package/dist/components/location/leafletMap.d.ts

@@ -0,0 +1,8 @@
+import "leaflet/dist/leaflet.css";
+interface LeafletMapProps {
+    position: [number, number];
+    onMarkerDrag: (lat: number, lng: number) => void;
+}
+export default function LeafletMap({ position, onMarkerDrag }: LeafletMapProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=leafletMap.d.ts.map

package/dist/components/location/leafletMap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"leafletMap.d.ts","sourceRoot":"","sources":["../../../src/components/location/leafletMap.tsx"],"names":[],"mappings":"AAGA,OAAO,0BAA0B,CAAC;AAkBlC,UAAU,eAAe;IACvB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC3B,YAAY,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD;AA4DD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,eAAe,2CAkC7E"}