4d:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"RegistryDependencies"] 4e:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"FilesView"] 4f:T24e9,"use client" import * as React from "react" import { Check, Loader2, MapPin, X } from "lucide-react" import { cva } from "class-variance-authority" import { cn } from "@/lib/utils" import { Skeleton } from "@/components/ui/skeleton" import { Popover, PopoverContent, PopoverTrigger, } from "@/components/ui/popover" import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, } from "@/components/ui/command" import { Badge } from "@/components/ui/ds-badge" import { Button } from "@/components/ui/ds-button" import type { UILocale } from "@/lib/ui-i18n" // ── Types ────────────────────────────────────────────────────────────────── export interface LocationSuggestion { id: string label: string description?: string lat?: number lng?: number /** Additional metadata (city, state, country, etc.) */ meta?: Record } export interface LocationPickerProps extends Omit< React.HTMLAttributes, "onChange" > { value?: LocationSuggestion | null onChange?: (value: LocationSuggestion | null) => void /** * Async search function — called with the query string. * Should return a list of suggestions. * Connect any API here: Google Places, Mapbox, ViaCEP, etc. */ onSearch?: (query: string) => Promise placeholder?: string searchPlaceholder?: string disabled?: boolean loading?: boolean clearable?: boolean locale?: UILocale } // ── Variants ─────────────────────────────────────────────────────────────── export const locationPickerContainerVariants = cva("relative w-full", { variants: {}, }) export const locationPickerTriggerVariants = cva( [ "flex h-9 w-full items-center gap-2 rounded-lg border border-input bg-background px-3 py-2", "text-sm text-foreground ring-offset-background", "has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-ring has-[:focus-visible]:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-50", ].join(" "), { variants: {}, } ) // ── LocationPicker ───────────────────────────────────────────────────────── export function LocationPicker({ value, onChange, onSearch, placeholder = "Select location…", searchPlaceholder = "Search address…", disabled = false, loading = false, clearable = true, locale = "en-US", className, ...props }: LocationPickerProps) { void locale const [open, setOpen] = React.useState(false) const [query, setQuery] = React.useState("") const [suggestions, setSuggestions] = React.useState([]) const [searching, setSearching] = React.useState(false) const debounceRef = React.useRef | null>(null) const handleSearch = React.useCallback( (q: string) => { setQuery(q) if (!onSearch) return if (debounceRef.current) clearTimeout(debounceRef.current) if (!q.trim()) { setSuggestions([]) return } setSearching(true) debounceRef.current = setTimeout(async () => { try { const results = await onSearch(q) setSuggestions(results) } catch { setSuggestions([]) } finally { setSearching(false) } }, 300) }, [onSearch] ) const handleSelect = (suggestion: LocationSuggestion) => { onChange?.(suggestion) setOpen(false) setQuery("") setSuggestions([]) } const handleClear = (e: React.MouseEvent) => { e.stopPropagation() onChange?.(null) } // ── Loading ───────────────────────────────────────────────────────────── if (loading) { return } return (

{ if (e.key === "Enter" || e.key === " ") { e.preventDefault() if (!disabled) setOpen(true) } }} > {value ? (

{value.label} {value.description && ( {value.description} )}

) : ( {placeholder} )}

{clearable && value && ( )}

{searching && (

Searching…

)} {!searching && query && suggestions.length === 0 && ( {onSearch ? "No results found." : "Start typing to search."} )} {!searching && suggestions.length > 0 && ( {suggestions.map((s) => ( handleSelect(s)} className="flex items-start gap-3 py-2" >

{s.label} {s.description && ( {s.description} )} {s.meta && (

{Object.entries(s.meta).map(([k, v]) => ( {v} ))}

)}

{value?.id === s.id && ( )} ))} )} {!query && !searching && !value && (

Type an address to search

)} {/* Selected meta badges */} {value?.meta && (

{Object.entries(value.meta).map(([k, v]) => ( {k}: {v} ))}

)}

) } 4c:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L4d",null,{"namespace":"@lema-ds","registryDependencies":["skeleton","popover","command","badge","button","ui-i18n"]}]]}],null]}],["$","$L4e",null,{"files":[{"path":"components/ds/location-picker.tsx","content":"$4f","type":"registry:ui","target":"components/ui/ds-location-picker.tsx"}],"className":"h-[70svh] min-h-80"}]]}]