@multiplatform.one/forms 7.7.4 → 7.8.0

package/dist/esm/fields/Geolocation/index.native.js

@@ -1,20 +1,45 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ensureFocusVisibleRing, useResolvedKnobs } from "@multiplatform.one/theme";
-import { NavigationArrowIcon } from "@phosphor-icons/react";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { Spinner, Text, View, XStack, YStack, isWeb } from "tamagui";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ensureFocusVisibleRing, pressTargetHitSlop, useResolvedKnobs, useGlyphColor } from "@multiplatform.one/theme";
+import { MagnifyingGlassIcon, MapPinIcon, NavigationArrowIcon, XIcon } from "@phosphor-icons/react";
+import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { ScrollView, Spinner, Text, View, XStack, YStack, isWeb } from "tamagui";
 import { AdaptivePopup } from "../../AdaptivePopup/index.native.js";
 import { Button } from "../../Button/index.native.js";
 import { Field, FieldLayout } from "../../fieldLayout.native.js";
-import { FloatingPanel } from "../../FloatingPanel/index.native.js";
-import { GeolocationMap } from "./GeolocationMap.native.js";
-import { detectGeoShape, formatGeoValue, parseGeoValue } from "./geoValue.native.js";
+import { FloatingPanel, useViewportGtSm } from "../../FloatingPanel/index.native.js";
 import { Input as InputParts } from "../../InputParts/index.native.js";
 import { Skeleton } from "../../Skeleton/index.native.js";
+import { GeolocationMap } from "./GeolocationMap.native.js";
+import { createNativeSearchFocus } from "./nativeSearchFocus.native.js";
+import { detectGeoShape, formatGeoValue, parseGeoValue } from "./geoValue.native.js";
 import { queryPermissionState } from "../../shared/capabilityPreflight.native.js";
 import { formCommonColors, formInputColors } from "../../shared/colorRamps.native.js";
 import { t } from "../../shared/t.native.js";
+import { pressSlopProps } from "../../shared/pressSlopProps.native.js";
+import { useIsInTableCell } from "../../shared/tableCellContext.native.js";
+import { zIndex } from "../../shared/zIndex.native.js";
 import { clampRadiusForLargeComponent, getFieldError, getFieldHeight, mergeFieldHandler, useFormField, useResolvedValidators } from "../../shared/utils.native.js";
+import { clampLat, clampLng, formatCoordPair, formatPlace, parseLatLngPair, resolveGeocoder } from "./geocoder.native.js";
+import { clampLat as clampLat2, clampLng as clampLng2, formatCoordPair as formatCoordPair2, formatPlace as formatPlace2, parseLatLngPair as parseLatLngPair2, resolveGeocoder as resolveGeocoder2 } from "./geocoder.native.js";
+function _instanceof(left, right) {
+  "@swc/helpers - instanceof";
+
+  if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
+    return !!right[Symbol.hasInstance](left);
+  } else {
+    return left instanceof right;
+  }
+}
+function coordinateKey(param) {
+  var {
+    lat,
+    lng
+  } = param;
+  return `${lat},${lng}`;
+}
+var SEARCH_DEBOUNCE_MS = 300;
+var COORD_LINE_HEIGHT = 28;
+var RESULTS_PANEL_SHADOW = "0px 8px 28px rgba(0,0,0,0.12), 0px 2px 6px rgba(0,0,0,0.04)";
 async function preflightGeolocation() {
   if (typeof navigator === "undefined" || !navigator.geolocation) {
     var insecure = typeof window !== "undefined" && window.isSecureContext === false;
@@ -47,15 +72,6 @@ function mapGeolocationError(err) {
   }
   return err.message || t("Failed to get location");
 }
-function clampLat(val) {
-  return Math.max(-90, Math.min(90, val));
-}
-function clampLng(val) {
-  return Math.max(-180, Math.min(180, val));
-}
-function formatCoordChip(lat, lng) {
-  return `${lat.toFixed(4)}, ${lng.toFixed(4)}`;
-}
 function tryParseCoord(text, clamp) {
   var trimmed = text.trim();
   if (trimmed === "" || trimmed === "-" || trimmed === "." || trimmed === "-.") return void 0;
@@ -212,8 +228,143 @@ function ExpandedMapView(param) {
   });
 }
 var overlayFocusRing = ensureFocusVisibleRing({
-  outlineOffset: -2
+  outlineOffset: 0
 });
+function ResultRow(param) {
+  var {
+    testID,
+    label,
+    description,
+    onPress,
+    disabled
+  } = param;
+  return /* @__PURE__ */_jsxs(YStack, {
+    testID,
+    role: "option",
+    "aria-selected": false,
+    "aria-disabled": disabled || void 0,
+    ...(isWeb ? {
+      tabIndex: disabled ? -1 : 0,
+      onKeyDown: function onKeyDown(event) {
+        if (disabled) return;
+        if (event.key === "Enter" || event.key === " ") {
+          event.preventDefault();
+          onPress();
+        } else if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+          var _ref;
+          var _event_currentTarget_parentElement, _rows_;
+          event.preventDefault();
+          var rows = [...((_ref = (_event_currentTarget_parentElement = event.currentTarget.parentElement) === null || _event_currentTarget_parentElement === void 0 ? void 0 : _event_currentTarget_parentElement.querySelectorAll("[role='option']:not([aria-disabled='true'])")) !== null && _ref !== void 0 ? _ref : [])];
+          var index = rows.indexOf(event.currentTarget);
+          (_rows_ = rows[(index + (event.key === "ArrowDown" ? 1 : -1) + rows.length) % rows.length]) === null || _rows_ === void 0 ? void 0 : _rows_.focus();
+        }
+      }
+    } : {}),
+    minHeight: description ? 62 : 44,
+    justifyContent: "center",
+    paddingHorizontal: "$3",
+    paddingVertical: description ? "$2" : 0,
+    cursor: disabled ? "not-allowed" : "pointer",
+    hoverStyle: disabled ? void 0 : {
+      backgroundColor: "$color3"
+    },
+    pressStyle: disabled ? void 0 : {
+      backgroundColor: "$color3"
+    },
+    onPress: disabled ? void 0 : onPress,
+    opacity: disabled ? 0.5 : 1,
+    children: [/* @__PURE__ */_jsx(Text, {
+      fontSize: "$4",
+      lineHeight: 25,
+      color: "$color12",
+      children: label
+    }), description ? /* @__PURE__ */_jsx(Text, {
+      fontSize: "$3",
+      lineHeight: 24,
+      color: formCommonColors.muted,
+      children: description
+    }) : null]
+  });
+}
+function StatusRow(param) {
+  var {
+    children,
+    testID
+  } = param;
+  return /* @__PURE__ */_jsx(XStack, {
+    testID,
+    minHeight: 44,
+    alignItems: "center",
+    paddingHorizontal: "$3",
+    role: "status",
+    children: /* @__PURE__ */_jsx(Text, {
+      fontSize: "$4",
+      lineHeight: 25,
+      color: formCommonColors.muted,
+      children
+    })
+  });
+}
+function SearchResultsList(param) {
+  var {
+    listId,
+    status,
+    query,
+    results,
+    pair,
+    onLocate,
+    onPick,
+    onPickPair,
+    locateDisabled
+  } = param;
+  var showLocate = status === "idle" || status === "results" || pair != null;
+  return /* @__PURE__ */_jsxs(YStack, {
+    testID: "geolocation-results",
+    id: listId,
+    overflow: "hidden",
+    ...(isWeb ?
+    // role="listbox" is a valid ARIA role but outside RN's `Role` union;
+    // this web-only bag forwards it to the DOM node (house Record cast).
+    {
+      role: "listbox"
+    } : void 0),
+    children: [showLocate ? /* @__PURE__ */_jsx(ResultRow, {
+      testID: "geolocation-use-location",
+      label: t("Use my current location"),
+      onPress: onLocate,
+      disabled: locateDisabled
+    }) : null, status === "searching" ? /* @__PURE__ */_jsx(StatusRow, {
+      testID: "geolocation-search-status",
+      children: t("Searching\u2026")
+    }) : null, status === "error" ? /* @__PURE__ */_jsx(StatusRow, {
+      testID: "geolocation-search-status",
+      children: t("Search is unavailable \u2014 check your connection")
+    }) : null, status === "empty" && !pair ? /* @__PURE__ */_jsx(StatusRow, {
+      testID: "geolocation-search-status",
+      children: t('No places match "{{query}}"', {
+        query
+      })
+    }) : null, pair ? /* @__PURE__ */_jsx(ResultRow, {
+      testID: "geolocation-coord-result",
+      label: t("Go to {{pair}}", {
+        pair: formatCoordPair(pair.lat, pair.lng)
+      }),
+      description: t("Exact coordinates \u2014 no address"),
+      onPress: function onPress() {
+        return onPickPair(pair.lat, pair.lng);
+      }
+    }) : null, status === "results" ? results.map(function (result, index) {
+      return /* @__PURE__ */_jsx(ResultRow, {
+        testID: `geolocation-result-${index}`,
+        label: result.label,
+        description: result.description,
+        onPress: function onPress() {
+          return onPick(result);
+        }
+      }, `${result.lat},${result.lng},${index}`);
+    }) : null]
+  });
+}
 function GeoMapSurface(param) {
   var {
     id,
@@ -258,7 +409,7 @@ function GeoMapSurface(param) {
   };
   var handleMapKeyDown = function handleMapKeyDown2(event) {
     if (!interactive) return;
-    if (event.key === "Enter") {
+    if (event.key === "Enter" && hasValue) {
       event.preventDefault();
       setCoordsOpen(true);
       return;
@@ -278,7 +429,68 @@ function GeoMapSurface(param) {
     disabled,
     knobProps
   }) : null;
-  return /* @__PURE__ */_jsxs(_Fragment, {
+  var coordLine = readOnly || disabled ? /* @__PURE__ */_jsx(XStack, {
+    testID: "geolocation-coordline",
+    alignItems: "center",
+    minHeight: COORD_LINE_HEIGHT,
+    paddingHorizontal: "$2",
+    hitSlop: pressTargetHitSlop(COORD_LINE_HEIGHT),
+    children: /* @__PURE__ */_jsx(Text, {
+      fontFamily: "$mono",
+      fontSize: 12,
+      lineHeight: 22,
+      color: formCommonColors.muted,
+      children: hasValue ? formatCoordPair(mapLat, mapLng) : t("Enter coordinates")
+    })
+  }) : /* @__PURE__ */_jsx(FloatingPanel, {
+    open: coordsOpen,
+    onOpenChange: handleCoordsOpenChange,
+    disabled,
+    fitContent: false,
+    sizing: "fill",
+    contentPadding: "none",
+    trigger: /* @__PURE__ */_jsx(XStack, {
+      testID: "geolocation-coordline",
+      alignItems: "center",
+      minHeight: COORD_LINE_HEIGHT,
+      paddingHorizontal: "$2",
+      cursor: "pointer",
+      ...pressSlopProps(COORD_LINE_HEIGHT, true),
+      hoverStyle: {
+        backgroundColor: "$color3"
+      },
+      focusVisibleStyle: overlayFocusRing,
+      ...(isWeb ? {
+        tabIndex: 0,
+        role: "button",
+        "aria-label": t("Edit coordinates"),
+        onKeyDown: function onKeyDown(event) {
+          if (event.key === "Enter" || event.key === " ") {
+            event.preventDefault();
+            setCoordsOpen(true);
+          }
+        }
+      } : {}),
+      children: /* @__PURE__ */_jsx(Text, {
+        fontFamily: "$mono",
+        fontSize: 12,
+        lineHeight: 22,
+        color: formCommonColors.muted,
+        children: hasValue ? formatCoordPair(mapLat, mapLng) : t("Enter coordinates")
+      })
+    }),
+    children: /* @__PURE__ */_jsx(CoordinatesPanel, {
+      lat: mapLat,
+      lng: mapLng,
+      knobProps,
+      required,
+      hasError,
+      flushRef: coordsFlushRef,
+      onCommit: onCommitCoordinates
+    })
+  });
+  return /* @__PURE__ */_jsxs(YStack, {
+    gap: "$2",
     children: [/* @__PURE__ */_jsxs(YStack, {
       testID: "geolocation-map",
       id,
@@ -300,7 +512,7 @@ function GeoMapSurface(param) {
         tabIndex: 0,
         role: "application",
         "aria-label": t("Location map"),
-        "aria-valuetext": hasValue ? formatCoordChip(mapLat, mapLng) : t("No location set"),
+        "aria-valuetext": hasValue ? formatCoordPair(mapLat, mapLng) : t("No location set"),
         onKeyDown: handleMapKeyDown
       } : {}),
       children: [customMap !== null && customMap !== void 0 ? customMap : /* @__PURE__ */_jsx(GeolocationMap, {
@@ -311,62 +523,34 @@ function GeoMapSurface(param) {
         disabled,
         readOnly,
         hasValue
-      }), /* Chip is the coordinates editor trigger (Apple/Google compact pattern). */
-      readOnly ? /* @__PURE__ */_jsx(View, {
+      }), !hasValue && !locateErrorOpen ? /* @__PURE__ */_jsxs(YStack, {
+        testID: "geolocation-empty",
         position: "absolute",
-        top: "$2",
-        insetInlineStart: "$2",
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
         zIndex: 2,
-        backgroundColor: "$background",
-        opacity: 0.92,
-        paddingHorizontal: "$2",
-        paddingVertical: "$1",
-        ...knobProps.borderRadius,
-        children: /* @__PURE__ */_jsx(Text, {
-          testID: "geolocation-coords-chip",
-          fontSize: "$1",
+        alignItems: "center",
+        justifyContent: "center",
+        gap: "$2",
+        pointerEvents: "box-none",
+        children: [/* @__PURE__ */_jsx(Text, {
           ...knobProps.body,
           color: formCommonColors.muted,
-          children: hasValue ? formatCoordChip(mapLat, mapLng) : t("No location set")
-        })
-      }) : /* @__PURE__ */_jsx(View, {
-        position: "absolute",
-        top: "$2",
-        insetInlineStart: "$2",
-        zIndex: 2,
-        children: /* @__PURE__ */_jsx(FloatingPanel, {
-          open: coordsOpen,
-          onOpenChange: handleCoordsOpenChange,
-          disabled,
-          fitContent: true,
-          sizing: "fill",
-          contentPadding: "none",
-          trigger: /* @__PURE__ */_jsx(Button, {
-            size: "$2",
-            disabled,
-            backgroundColor: "$background",
-            opacity: 0.92,
-            testID: "geolocation-coords-chip",
-            "aria-label": t("Edit coordinates"),
-            focusVisibleStyle: overlayFocusRing,
-            onPress: isWeb && !disabled ? function () {
-              return setCoordsOpen(true);
-            } : void 0,
-            children: /* @__PURE__ */_jsx(Button.Text, {
-              children: hasValue ? formatCoordChip(mapLat, mapLng) : t("Set location")
-            })
-          }),
-          children: /* @__PURE__ */_jsx(CoordinatesPanel, {
-            lat: mapLat,
-            lng: mapLng,
-            knobProps,
-            required,
-            hasError,
-            flushRef: coordsFlushRef,
-            onCommit: onCommitCoordinates
+          pointerEvents: "none",
+          children: t("No location set")
+        }), !readOnly && !disabled ? /* @__PURE__ */_jsx(Button, {
+          size: "$4",
+          onPress: onUseMyLocation,
+          disabled: locating,
+          testID: "geolocation-empty-locate",
+          "aria-label": t("Use my current location"),
+          children: /* @__PURE__ */_jsx(Button.Text, {
+            children: t("Use my current location")
           })
-        })
-      }), handleExpand && expandIcon && /* @__PURE__ */_jsx(View, {
+        }) : null]
+      }) : null, handleExpand && expandIcon && /* @__PURE__ */_jsx(View, {
         position: "absolute",
         top: "$2",
         insetInlineEnd: "$2",
@@ -377,13 +561,12 @@ function GeoMapSurface(param) {
           disabled,
           onPress: handleExpand,
           backgroundColor: "$background",
-          opacity: 0.92,
           "aria-label": t("Expand map"),
           focusVisibleStyle: overlayFocusRing,
+          hitSlop: pressTargetHitSlop(32),
           children: expandIcon
         })
-      }), /* Locate overlay (bottom-end) — LC-19 preflight runs on press */
-      !readOnly && !locateErrorOpen && /* @__PURE__ */_jsx(View, {
+      }), !readOnly && !locateErrorOpen && /* @__PURE__ */_jsx(View, {
         position: "absolute",
         bottom: "$2",
         insetInlineEnd: "$2",
@@ -394,19 +577,14 @@ function GeoMapSurface(param) {
           disabled: disabled || locating,
           onPress: onUseMyLocation,
           backgroundColor: "$background",
-          opacity: 0.92,
           icon: locating ? /* @__PURE__ */_jsx(Spinner, {
             size: "small"
           }) : locationIcon,
           "aria-label": locating ? t("Locating") : t("Locate"),
-          focusVisibleStyle: overlayFocusRing
+          focusVisibleStyle: overlayFocusRing,
+          hitSlop: pressTargetHitSlop(32)
         })
-      }),
-      /*
-        LC-19: locate error stays on the map (Retry + Close) — never
-        mount-fail-unmount, never a layout-jumping sibling under the field.
-      */
-      locateErrorOpen && /* @__PURE__ */_jsxs(YStack, {
+      }), locateErrorOpen && /* @__PURE__ */_jsxs(YStack, {
         testID: "geolocation-locate-panel",
         position: "absolute",
         bottom: "$2",
@@ -439,7 +617,7 @@ function GeoMapSurface(param) {
           })]
         })]
       })]
-    }), expandIcon && /* @__PURE__ */_jsx(AdaptivePopup, {
+    }), coordLine, expandIcon && /* @__PURE__ */_jsx(AdaptivePopup, {
       open: expanded,
       onOpenChange: setExpanded,
       title: t("Select Location"),
@@ -455,9 +633,46 @@ function GeoMapSurface(param) {
     })]
   });
 }
-var defaultLocationIcon = /* @__PURE__ */_jsx(NavigationArrowIcon, {
-  size: 16
-});
+function CellFace(param) {
+  var {
+    address,
+    coordinates,
+    onOpen
+  } = param;
+  var glyphColor = useGlyphColor();
+  var text = address ? address : coordinates ? formatCoordPair(coordinates.lat, coordinates.lng) : t("No location set");
+  return /* @__PURE__ */_jsxs(XStack, {
+    testID: "geolocation-cell-face",
+    ...(isWeb && onOpen ? {
+      tabIndex: 0,
+      role: "button",
+      "aria-label": t("Edit location"),
+      onKeyDown: function onKeyDown(event) {
+        if (event.key === "Enter" || event.key === " ") {
+          event.preventDefault();
+          onOpen();
+        }
+      }
+    } : {}),
+    alignItems: "center",
+    gap: "$2",
+    minHeight: 44,
+    minWidth: 0,
+    flex: 1,
+    children: [/* @__PURE__ */_jsx(MapPinIcon, {
+      size: 14,
+      color: glyphColor
+    }), /* @__PURE__ */_jsx(Text, {
+      fontSize: "$3",
+      lineHeight: 24,
+      color: "$color12",
+      numberOfLines: 1,
+      flex: 1,
+      minWidth: 0,
+      children: text
+    })]
+  });
+}
 function Geolocation(param) {
   var {
     name,
@@ -476,11 +691,14 @@ function Geolocation(param) {
     onBlur,
     disabled,
     readOnly,
-    locationIcon = defaultLocationIcon,
+    locationIcon,
     expandIcon,
     renderMap,
     skeleton,
-    compact
+    compact,
+    geocode: geocodeProp,
+    reverseGeocode: reverseGeocodeProp,
+    geocoder
   } = param;
   var {
     resolvedForm,
@@ -492,14 +710,87 @@ function Geolocation(param) {
     compact
   });
   var resolvedValidators = useResolvedValidators(required, validators, label, name);
+  var glyphColor = useGlyphColor();
+  var resolvedLocationIcon = locationIcon === void 0 ? /* @__PURE__ */_jsx(NavigationArrowIcon, {
+    size: 16,
+    color: glyphColor
+  }) : locationIcon;
+  var inTableCell = useIsInTableCell();
+  var viewportGtSm = useViewportGtSm();
+  var shouldUseSheet = !isWeb || !viewportGtSm;
+  var {
+    geocode,
+    reverseGeocode
+  } = resolveGeocoder({
+    geocode: geocodeProp,
+    reverseGeocode: reverseGeocodeProp,
+    geocoder
+  });
+  var searchEnabled = Boolean(geocode) && !disabled && !readOnly;
+  var listId = useId();
   var [locatePhase, setLocatePhase] = useState("idle");
   var [locateError, setLocateError] = useState(null);
   var [preflightError, setPreflightError] = useState();
+  var [address, setAddress] = useState(null);
+  var [query, setQuery] = useState("");
+  var [resultsOpen, setResultsOpen] = useState(false);
+  var [searchStatus, setSearchStatus] = useState("idle");
+  var [results, setResults] = useState([]);
+  var [cellOpen, setCellOpen] = useState(false);
   var preflightingRef = useRef(false);
   var onValueChangeRef = useRef(function () {});
   var currentValueRef = useRef("");
+  var searchGenRef = useRef(0);
+  var reverseGenRef = useRef(0);
+  var searchRootRef = useRef(null);
+  var searchInputRef = useRef(null);
+  var sheetSearchInputRef = useRef(null);
+  var closingSearchRef = useRef(false);
+  var [nativeSearchFocus] = useState(createNativeSearchFocus);
+  var skipResultsReturnFocusRef = useRef(true);
+  var closeSearch = useCallback(function () {
+    var restoreFocus = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
+    var _searchInputRef_current;
+    if (!isWeb) nativeSearchFocus.dismiss();
+    closingSearchRef.current = true;
+    setResultsOpen(false);
+    if (isWeb && restoreFocus) (_searchInputRef_current = searchInputRef.current) === null || _searchInputRef_current === void 0 ? void 0 : _searchInputRef_current.focus({
+      preventScroll: true
+    });
+    closingSearchRef.current = false;
+  }, [nativeSearchFocus]);
+  var queryIsAddressRef = useRef(true);
+  var selectedPlaceRef = useRef(null);
+  var locateGenRef = useRef(0);
+  var interactiveRef = useRef(!disabled && !readOnly);
+  interactiveRef.current = !disabled && !readOnly;
+  var cancelLocate = useCallback(function () {
+    ++locateGenRef.current;
+    setLocatePhase("idle");
+    setLocateError(null);
+  }, []);
+  useEffect(function () {
+    if (disabled || readOnly) cancelLocate();
+  }, [disabled, readOnly, cancelLocate]);
+  useEffect(function () {
+    return function () {
+      ++locateGenRef.current;
+      ++reverseGenRef.current;
+      ++searchGenRef.current;
+    };
+  }, []);
+  var applyAddress = useCallback(function (next, intoQuery) {
+    setAddress(next);
+    if (intoQuery) {
+      var _ref;
+      queryIsAddressRef.current = true;
+      setQuery((_ref = next === null || next === void 0 ? void 0 : next.label) !== null && _ref !== void 0 ? _ref : "");
+    }
+  }, []);
   var requestPosition = useCallback(function () {
     var _navigator;
+    if (!interactiveRef.current) return;
+    var gen = ++locateGenRef.current;
     if (!((_navigator = navigator) === null || _navigator === void 0 ? void 0 : _navigator.geolocation)) {
       setLocateError(t("Geolocation unavailable: not supported in this browser."));
       setLocatePhase("error");
@@ -508,6 +799,9 @@ function Geolocation(param) {
     setLocatePhase("locating");
     setLocateError(null);
     navigator.geolocation.getCurrentPosition(function (position) {
+      if (gen !== locateGenRef.current || !interactiveRef.current) return;
+      selectedPlaceRef.current = null;
+      queryIsAddressRef.current = true;
       var lat = clampLat(position.coords.latitude);
       var lng = clampLng(position.coords.longitude);
       var previous = currentValueRef.current;
@@ -517,20 +811,25 @@ function Geolocation(param) {
       }, detectGeoShape(previous), previous));
       setLocatePhase("idle");
       setLocateError(null);
+      closeSearch();
+      setCellOpen(false);
     }, function (err) {
+      if (gen !== locateGenRef.current || !interactiveRef.current) return;
       setLocateError(mapGeolocationError(err));
       setLocatePhase("error");
     }, {
       enableHighAccuracy: true,
       timeout: 1e4
     });
-  }, []);
+  }, [closeSearch]);
   var startLocate = useCallback(async function () {
     if (disabled || readOnly) return;
     if (preflightingRef.current || locatePhase === "locating") return;
     preflightingRef.current = true;
+    var gen = ++locateGenRef.current;
     try {
       var result = await preflightGeolocation();
+      if (gen !== locateGenRef.current || !interactiveRef.current) return;
       if (result.ok) {
         setPreflightError(void 0);
         requestPosition();
@@ -543,12 +842,108 @@ function Geolocation(param) {
       preflightingRef.current = false;
     }
   }, [disabled, readOnly, locatePhase, requestPosition]);
+  var runReverse = useCallback(async function (lat, lng) {
+    var gen = ++reverseGenRef.current;
+    if (lat === void 0 || lng === void 0) {
+      selectedPlaceRef.current = null;
+      applyAddress(null, queryIsAddressRef.current);
+      return;
+    }
+    var key = coordinateKey({
+      lat,
+      lng
+    });
+    var selected = selectedPlaceRef.current;
+    if ((selected === null || selected === void 0 ? void 0 : selected.key) === key) {
+      applyAddress({
+        key,
+        label: formatPlace(selected.place)
+      }, queryIsAddressRef.current);
+      return;
+    }
+    applyAddress(null, queryIsAddressRef.current);
+    if (!reverseGeocode) {
+      return;
+    }
+    try {
+      var result = await reverseGeocode({
+        lat,
+        lng
+      });
+      if (gen !== reverseGenRef.current) return;
+      applyAddress(result ? {
+        key,
+        label: formatPlace(result)
+      } : null, queryIsAddressRef.current);
+    } catch (unused) {
+      if (gen !== reverseGenRef.current) return;
+      applyAddress(null, queryIsAddressRef.current);
+    }
+  }, [reverseGeocode, applyAddress]);
+  var runSearch = useCallback(async function (text) {
+    if (!geocode) return;
+    var gen = ++searchGenRef.current;
+    setSearchStatus("searching");
+    try {
+      var next = await geocode({
+        query: text
+      });
+      if (gen !== searchGenRef.current) return;
+      setResults(next);
+      setSearchStatus(next.length > 0 ? "results" : "empty");
+    } catch (unused) {
+      if (gen !== searchGenRef.current) return;
+      setResults([]);
+      setSearchStatus("error");
+    }
+  }, [geocode]);
+  useEffect(function () {
+    ++searchGenRef.current;
+    if (!searchEnabled || !resultsOpen) return;
+    var trimmed = query.trim();
+    if (queryIsAddressRef.current) return;
+    if (!trimmed) {
+      setSearchStatus("idle");
+      setResults([]);
+      return;
+    }
+    if (parseLatLngPair(trimmed)) {
+      setSearchStatus("idle");
+      setResults([]);
+      return;
+    }
+    var handle = setTimeout(function () {
+      void runSearch(trimmed);
+    }, SEARCH_DEBOUNCE_MS);
+    return function () {
+      clearTimeout(handle);
+      ++searchGenRef.current;
+    };
+  }, [query, resultsOpen, searchEnabled, runSearch]);
+  useEffect(function () {
+    if (!resultsOpen || shouldUseSheet) return;
+    var onDoc = function onDoc2(event) {
+      var root = searchRootRef.current;
+      if (root && _instanceof(event.target, Node) && root.contains(event.target)) return;
+      closeSearch(false);
+    };
+    var onKey = function onKey2(event) {
+      if (event.key === "Escape") closeSearch();
+    };
+    document.addEventListener("mousedown", onDoc);
+    document.addEventListener("keydown", onKey);
+    return function () {
+      document.removeEventListener("mousedown", onDoc);
+      document.removeEventListener("keydown", onKey);
+    };
+  }, [resultsOpen, shouldUseSheet, closeSearch]);
   var makeHandlers = useCallback(function (currentValue, onValueChange) {
     onValueChangeRef.current = onValueChange;
     currentValueRef.current = currentValue;
     var coordinates = parseGeoValue(currentValue);
     var shape = detectGeoShape(currentValue);
     var write = function write2(lat, lng) {
+      cancelLocate();
       onValueChange(formatGeoValue({
         lat: clampLat(lat),
         lng: clampLng(lng)
@@ -556,55 +951,318 @@ function Geolocation(param) {
     };
     return {
       coordinates,
-      onCommitCoordinates: write,
-      onMapChange: write,
+      onCommitCoordinates: function onCommitCoordinates(lat, lng) {
+        write(lat, lng);
+        selectedPlaceRef.current = null;
+        queryIsAddressRef.current = true;
+      },
+      onMapChange: function onMapChange(lat, lng) {
+        write(lat, lng);
+        selectedPlaceRef.current = null;
+        queryIsAddressRef.current = true;
+      },
       onUseMyLocation: function onUseMyLocation() {
         void startLocate();
       },
       onRetryLocate: function onRetryLocate() {
         requestPosition();
       },
-      onCloseLocate: function onCloseLocate() {
-        setLocatePhase("idle");
-        setLocateError(null);
+      onCloseLocate: cancelLocate,
+      onPick: function onPick(result) {
+        ++reverseGenRef.current;
+        var place = {
+          ...result,
+          lat: clampLat(result.lat),
+          lng: clampLng(result.lng)
+        };
+        selectedPlaceRef.current = {
+          key: coordinateKey(place),
+          place
+        };
+        write(result.lat, result.lng);
+        queryIsAddressRef.current = true;
+        setQuery(formatPlace(result));
+        closeSearch();
+        setCellOpen(false);
+        setSearchStatus("idle");
+      },
+      onPickPair: function onPickPair(lat, lng) {
+        write(lat, lng);
+        selectedPlaceRef.current = null;
+        queryIsAddressRef.current = true;
+        closeSearch();
+        setCellOpen(false);
+        setSearchStatus("idle");
+      },
+      onClear: function onClear() {
+        cancelLocate();
+        ++searchGenRef.current;
+        ++reverseGenRef.current;
+        selectedPlaceRef.current = null;
+        onValueChange("");
+        applyAddress(null, true);
+        setQuery("");
+        setResults([]);
+        setSearchStatus("idle");
       }
     };
-  }, [startLocate, requestPosition]);
+  }, [startLocate, requestPosition, cancelLocate, applyAddress, closeSearch]);
   var mapHeight = getFieldHeight(size !== null && size !== void 0 ? size : knobProps.sizeToken, compact ? 4 : 5);
-  if (skeleton) {
-    return /* @__PURE__ */_jsx(FieldLayout, {
-      id,
-      label,
-      size,
-      knobProps,
-      children: /* @__PURE__ */_jsx(Skeleton, {
-        variant: "rounded",
-        width: "100%",
-        height: mapHeight
+  var displayError = error || preflightError;
+  var renderSearch = function renderSearch2(handlers) {
+    var opts = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+    var showClear = Boolean(query) && !disabled && !readOnly;
+    var inputRef = opts.sheetHeader ? sheetSearchInputRef : searchInputRef;
+    var activateNativeSearch = function activateNativeSearch2() {
+      var focusInput = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
+      var _nativeInput_isFocused;
+      nativeSearchFocus.activate();
+      if (!searchEnabled || opts.editingCell) return;
+      var nativeInput = inputRef.current;
+      if (nativeInput === null || nativeInput === void 0 ? void 0 : (_nativeInput_isFocused = nativeInput.isFocused) === null || _nativeInput_isFocused === void 0 ? void 0 : _nativeInput_isFocused.call(nativeInput)) setResultsOpen(true);else if (focusInput) nativeInput === null || nativeInput === void 0 ? void 0 : nativeInput.focus();
+    };
+    var clearSearch = function clearSearch2() {
+      var _inputRef_current;
+      handlers.onClear();
+      closingSearchRef.current = true;
+      if (isWeb) (_inputRef_current = inputRef.current) === null || _inputRef_current === void 0 ? void 0 : _inputRef_current.focus({
+        preventScroll: true
+      });
+      closingSearchRef.current = false;
+    };
+    return /* @__PURE__ */_jsx(InputParts, {
+      size: size || knobProps.sizeToken,
+      children: /* @__PURE__ */_jsxs(InputParts.Box, {
+        disabled: disabled || !searchEnabled,
+        // Keep the square Clear target pressable across the frame's border.
+        style: {
+          overflow: "visible"
+        },
+        ...(opts.sheetHeader ? {
+          borderWidth: 0,
+          borderBottomWidth: 1,
+          borderRadius: 0
+        } : {}),
+        children: [/* @__PURE__ */_jsx(InputParts.Section, {
+          children: /* @__PURE__ */_jsx(InputParts.Icon, {
+            adornment: "leading",
+            children: /* @__PURE__ */_jsx(MagnifyingGlassIcon, {
+              size: 16
+            })
+          })
+        }), /* @__PURE__ */_jsx(InputParts.Section, {
+          children: /* @__PURE__ */_jsx(InputParts.Area, {
+            ref: inputRef,
+            value: query,
+            disabled: disabled || !searchEnabled,
+            placeholder: t("Search address or place"),
+            "aria-label": t("Search for a location"),
+            role: "combobox",
+            "aria-haspopup": "listbox",
+            "aria-expanded": resultsOpen,
+            "aria-controls": listId,
+            "aria-autocomplete": "list",
+            "data-testid": "geolocation-search",
+            onChangeText: function onChangeText(text) {
+              if (!isWeb) nativeSearchFocus.activate();
+              ++searchGenRef.current;
+              queryIsAddressRef.current = false;
+              setResults([]);
+              setSearchStatus("idle");
+              setQuery(text);
+              if (searchEnabled) setResultsOpen(true);
+            },
+            onKeyDown: function onKeyDown(event) {
+              if (event.key === "ArrowDown") {
+                var _document_getElementById_querySelector, _document_getElementById;
+                if (searchEnabled) setResultsOpen(true);
+                event.preventDefault();
+                (_document_getElementById = document.getElementById(listId)) === null || _document_getElementById === void 0 ? void 0 : (_document_getElementById_querySelector = _document_getElementById.querySelector("[role='option']:not([aria-disabled='true'])")) === null || _document_getElementById_querySelector === void 0 ? void 0 : _document_getElementById_querySelector.focus();
+              }
+            },
+            onClick: function onClick() {
+              if (searchEnabled) setResultsOpen(true);
+            },
+            ...(!isWeb ? {
+              onPressIn: function onPressIn() {
+                return activateNativeSearch();
+              },
+              onAccessibilityTap: function onAccessibilityTap() {
+                return activateNativeSearch(true);
+              },
+              onBlur: function onBlur2() {
+                return nativeSearchFocus.blur(!!opts.sheetHeader, resultsOpen);
+              }
+            } : {}),
+            onFocus: function onFocus() {
+              if (searchEnabled && !opts.editingCell && !closingSearchRef.current && (isWeb || nativeSearchFocus.canOpen(!!opts.sheetHeader))) setResultsOpen(true);
+            }
+          })
+        }), showClear ? /* @__PURE__ */_jsx(InputParts.Section, {
+          children: /* @__PURE__ */_jsx(InputParts.Button, {
+            glyphRing: true,
+            onPress: clearSearch,
+            onKeyDown: function onKeyDown(event) {
+              if (event.key === "Enter" || event.key === " ") {
+                event.preventDefault();
+                event.stopPropagation();
+                clearSearch();
+              }
+            },
+            "aria-label": t("Clear location"),
+            testID: "geolocation-search-clear",
+            children: /* @__PURE__ */_jsx(InputParts.Icon, {
+              children: /* @__PURE__ */_jsx(XIcon, {
+                size: 14
+              })
+            })
+          })
+        }) : null]
       })
     });
-  }
-  var displayError = error || preflightError;
-  if (!resolvedForm || !name) {
-    var handlers = makeHandlers(value || "", function (v) {
-      return onChange === null || onChange === void 0 ? void 0 : onChange(v);
+  };
+  var renderResults = function renderResults2(handlers) {
+    return /* @__PURE__ */_jsx(SearchResultsList, {
+      listId,
+      status: searchStatus,
+      query: query.trim(),
+      results,
+      pair: parseLatLngPair(query),
+      onLocate: handlers.onUseMyLocation,
+      onPick: handlers.onPick,
+      onPickPair: handlers.onPickPair,
+      locateDisabled: disabled || locatePhase === "locating"
     });
-    return /* @__PURE__ */_jsx(FieldLayout, {
-      id,
-      label,
-      labelProps,
-      error: displayError,
-      helperText,
-      required,
-      size,
-      knobProps,
-      onBlur,
-      // LC-40: FieldLayout owns the dimWhole assembly dim (keepLabel pins
-      // the sibling label/helper readable) — it needs the disabled state.
-      disabled,
-      children: /* @__PURE__ */_jsx(GeoMapSurface, {
+  };
+  var renderFormBody = function renderFormBody1(currentValue, onValueChange) {
+    var editingCell = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false,
+      resolvedError = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : displayError;
+    var _ref, _ref1;
+    var handlers = makeHandlers(currentValue, onValueChange);
+    var coordinates = handlers.coordinates;
+    var key = coordinates ? coordinateKey(coordinates) : null;
+    var selected = selectedPlaceRef.current;
+    var displayAddress = (_ref = (_ref1 = (selected === null || selected === void 0 ? void 0 : selected.key) === key ? formatPlace(selected.place) : null) !== null && _ref1 !== void 0 ? _ref1 : (address === null || address === void 0 ? void 0 : address.key) === key ? address.label : null) !== null && _ref !== void 0 ? _ref : coordinates ? formatCoordPair(coordinates.lat, coordinates.lng) : null;
+    if (inTableCell && !editingCell) {
+      var face = /* @__PURE__ */_jsx(CellFace, {
+        address: displayAddress,
+        coordinates,
+        onOpen: !disabled && !readOnly ? function () {
+          return setCellOpen(true);
+        } : void 0
+      });
+      if (readOnly || disabled) return face;
+      return /* @__PURE__ */_jsx(FloatingPanel, {
+        open: cellOpen,
+        onOpenChange: setCellOpen,
+        disabled,
+        fitContent: false,
+        contentPadding: "none",
+        trigger: face,
+        children: /* @__PURE__ */_jsx(YStack, {
+          minWidth: 260,
+          maxWidth: 420,
+          children: renderFormBody(currentValue, onValueChange, true, resolvedError)
+        })
+      });
+    }
+    if (readOnly) {
+      return /* @__PURE__ */_jsxs(YStack, {
+        gap: "$2",
+        children: [/* @__PURE__ */_jsxs(XStack, {
+          testID: "geolocation-readonly-address",
+          alignItems: "center",
+          gap: "$2",
+          minHeight: 25,
+          children: [/* @__PURE__ */_jsx(MapPinIcon, {
+            size: 14,
+            color: glyphColor
+          }), /* @__PURE__ */_jsx(Text, {
+            fontSize: "$4",
+            lineHeight: 25,
+            color: "$color12",
+            children: displayAddress !== null && displayAddress !== void 0 ? displayAddress : t("No location set")
+          })]
+        }), /* @__PURE__ */_jsx(GeoMapSurface, {
+          id,
+          coordinates,
+          onCommitCoordinates: handlers.onCommitCoordinates,
+          onUseMyLocation: handlers.onUseMyLocation,
+          onRetryLocate: handlers.onRetryLocate,
+          onCloseLocate: handlers.onCloseLocate,
+          onMapChange: handlers.onMapChange,
+          disabled: !!disabled,
+          readOnly: true,
+          locatePhase,
+          locateError,
+          knobProps,
+          locationIcon: resolvedLocationIcon,
+          expandIcon,
+          renderMap,
+          required,
+          hasError: !!resolvedError,
+          mapHeight
+        })]
+      });
+    }
+    var resultsPanel = resultsOpen && searchEnabled ? shouldUseSheet ? /* @__PURE__ */_jsx(FloatingPanel, {
+      open: resultsOpen,
+      onOpenChange: function onOpenChange(open) {
+        return open ? setResultsOpen(true) : closeSearch();
+      },
+      onNativeShow: function onNativeShow() {
+        var _sheetSearchInputRef_current;
+        return (_sheetSearchInputRef_current = sheetSearchInputRef.current) === null || _sheetSearchInputRef_current === void 0 ? void 0 : _sheetSearchInputRef_current.focus();
+      },
+      skipReturnFocusRef: skipResultsReturnFocusRef,
+      sheet: true,
+      sheetFill: true,
+      scrollable: true,
+      contentPadding: "none",
+      header: renderSearch(handlers, {
+        sheetHeader: true
+      }),
+      trigger: /* @__PURE__ */_jsx(View, {
+        testID: "geolocation-sheet-trigger",
+        height: 1,
+        width: "100%"
+      }),
+      children: /* @__PURE__ */_jsx(YStack, {
+        testID: "geolocation-results-sheet",
+        children: renderResults(handlers)
+      })
+    }) : /* @__PURE__ */_jsx(YStack, {
+      position: "absolute",
+      top: "100%",
+      left: 0,
+      right: 0,
+      zIndex: zIndex.dropdown,
+      backgroundColor: "$color1",
+      borderWidth: 1,
+      borderColor: formInputColors.border.base,
+      borderRadius: knobProps.borderRadius.borderRadius,
+      overflow: "hidden",
+      style: {
+        boxShadow: RESULTS_PANEL_SHADOW
+      },
+      children: /* @__PURE__ */_jsx(ScrollView, {
+        maxHeight: mapHeight * 1.5,
+        children: renderResults(handlers)
+      })
+    }) : null;
+    return /* @__PURE__ */_jsxs(YStack, {
+      gap: "$2",
+      children: [/* @__PURE__ */_jsxs(YStack, {
+        ref: searchRootRef,
+        position: "relative",
+        testID: "geolocation-search-anchor",
+        "data-sheet": shouldUseSheet ? "true" : "false",
+        children: [renderSearch(handlers, {
+          editingCell
+        }), resultsPanel]
+      }), /* @__PURE__ */_jsx(GeoMapSurface, {
         id,
-        coordinates: handlers.coordinates,
+        coordinates,
         onCommitCoordinates: handlers.onCommitCoordinates,
         onUseMyLocation: handlers.onUseMyLocation,
         onRetryLocate: handlers.onRetryLocate,
@@ -615,15 +1273,60 @@ function Geolocation(param) {
         locatePhase,
         locateError,
         knobProps,
-        locationIcon,
+        locationIcon: resolvedLocationIcon,
         expandIcon,
         renderMap,
         required,
-        hasError: !!displayError,
+        hasError: !!resolvedError,
         mapHeight
+      })]
+    });
+  };
+  if (skeleton) {
+    return /* @__PURE__ */_jsx(FieldLayout, {
+      id,
+      label,
+      size,
+      knobProps,
+      children: /* @__PURE__ */_jsxs(YStack, {
+        gap: "$2",
+        children: [/* @__PURE__ */_jsx(Skeleton, {
+          variant: "rounded",
+          width: "100%",
+          height: 44
+        }), /* @__PURE__ */_jsx(Skeleton, {
+          variant: "rounded",
+          width: "100%",
+          height: mapHeight
+        })]
       })
     });
   }
+  var wrap = function wrap2(currentValue, onValueChange, resolvedError, fieldBlur) {
+    var coordinates = parseGeoValue(currentValue);
+    var taughtHelper = helperText !== null && helperText !== void 0 ? helperText : !coordinates && !readOnly ? t("Search, tap the map, or use your location.") : void 0;
+    return /* @__PURE__ */_jsxs(FieldLayout, {
+      id,
+      label,
+      labelProps,
+      error: resolvedError !== null && resolvedError !== void 0 ? resolvedError : displayError,
+      helperText: inTableCell ? void 0 : taughtHelper,
+      required,
+      size,
+      knobProps,
+      onBlur: fieldBlur !== null && fieldBlur !== void 0 ? fieldBlur : onBlur,
+      disabled,
+      children: [/* @__PURE__ */_jsx(GeolocationValueSync, {
+        value: currentValue,
+        runReverse
+      }), renderFormBody(currentValue, onValueChange, false, resolvedError)]
+    });
+  };
+  if (!resolvedForm || !name) {
+    return wrap(value || "", function (v) {
+      return onChange === null || onChange === void 0 ? void 0 : onChange(v);
+    });
+  }
   return /* @__PURE__ */_jsx(Field, {
     form: resolvedForm,
     name,
@@ -631,45 +1334,25 @@ function Geolocation(param) {
     validators: resolvedValidators,
     children: function children(field) {
       var resolvedError = getFieldError(field, displayError);
-      var handlers2 = makeHandlers(field.state.value || "", function (v) {
+      return wrap(field.state.value || "", function (v) {
         field.handleChange(v);
         onChange === null || onChange === void 0 ? void 0 : onChange(v);
-      });
-      return /* @__PURE__ */_jsx(FieldLayout, {
-        id,
-        label,
-        labelProps,
-        error: resolvedError,
-        helperText,
-        required,
-        size,
-        knobProps,
-        onBlur: mergeFieldHandler(field, "handleBlur", onBlur),
-        // LC-40: see standalone branch — FieldLayout carries dimWhole.
-        disabled,
-        children: /* @__PURE__ */_jsx(GeoMapSurface, {
-          id,
-          coordinates: handlers2.coordinates,
-          onCommitCoordinates: handlers2.onCommitCoordinates,
-          onUseMyLocation: handlers2.onUseMyLocation,
-          onRetryLocate: handlers2.onRetryLocate,
-          onCloseLocate: handlers2.onCloseLocate,
-          onMapChange: handlers2.onMapChange,
-          disabled: !!disabled,
-          readOnly: !!readOnly,
-          locatePhase,
-          locateError,
-          knobProps,
-          locationIcon,
-          expandIcon,
-          renderMap,
-          required,
-          hasError: !!resolvedError,
-          mapHeight
-        })
-      });
+      }, resolvedError, mergeFieldHandler(field, "handleBlur", onBlur));
     }
   });
 }
-export { Geolocation, preflightGeolocation };
+function GeolocationValueSync(param) {
+  var {
+    value,
+    runReverse
+  } = param;
+  var coords = parseGeoValue(value);
+  var key = coords ? coordinateKey(coords) : "";
+  useEffect(function () {
+    var next = parseGeoValue(value);
+    void runReverse(next === null || next === void 0 ? void 0 : next.lat, next === null || next === void 0 ? void 0 : next.lng);
+  }, [key, value, runReverse]);
+  return null;
+}
+export { Geolocation, clampLat2 as clampLat, clampLng2 as clampLng, formatCoordPair2 as formatCoordPair, formatPlace2 as formatPlace, parseLatLngPair2 as parseLatLngPair, preflightGeolocation, resolveGeocoder2 as resolveGeocoder };
 //# sourceMappingURL=index.native.js.map