{"id":32038,"date":"2025-12-12T11:27:41","date_gmt":"2025-12-12T17:27:41","guid":{"rendered":"https:\/\/wpengine.com\/builders\/?p=32038"},"modified":"2026-01-14T17:53:51","modified_gmt":"2026-01-14T23:53:51","slug":"nuxt-smart-search-ai-acf-geolocation","status":"publish","type":"post","link":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/","title":{"rendered":"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js"},"content":{"rendered":"\n<p>Building an intelligent, location-aware search experience can be very complex\u2014it requires wrangling coordinates from the CMS, securing API keys, and stitching together server-side search logic with a responsive frontend map. Generic search results are no longer enough; your users demand answers that are hyper-local and AI-compatible.<br><br>This step-by-step guide will walk you through an existing demo, detailing a <strong>headless, geo-aware search experience<\/strong> built with <strong>Nuxt 3<\/strong>, <strong>ACF (Advanced Custom Fields)<\/strong>, its Google Map field (for latitude\/longitude data), and <strong>Smart Search AI&#8217;s geo filtering API<\/strong>.<\/p>\n\n\n\n<p>If you prefer video format, here is the video related to this article:<\/p>\n\n\n\n<iframe class=\"youtube-video\"  src=\"https:\/\/www.youtube.com\/embed\/sJCm6gabV94\" title=\"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js\" frameborder=\"0\" style=\"display: block; margin: auto; width: 100%; height: 400px;\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n\n\n\n<p><br><\/p>\n\n\n\n<div class=\"wp-block-group has-polar-background-color has-background is-layout-flow wp-container-core-group-is-layout-1 wp-block-group-is-layout-flow\" style=\"padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--40)\">\n<p class=\"has-large-font-size\"><strong>Table of Contents<\/strong><\/p>\n\n\n\n<ul id=\"Prerequisites\" class=\"wp-block-list\">\n<li id=\"Prerequisites\"><a href=\"#prerequisites\">Prerequisites<\/a><\/li>\n\n\n\n<li><a href=\"#steps-for-setup\">Steps for setting up<\/a><\/li>\n\n\n\n<li id=\"steps-for-setting-up\"><a href=\"#maps-usage\">Maps Usage<\/a><\/li>\n\n\n\n<li><a href=\"#server-connection\">Server Connection<\/a><\/li>\n\n\n\n<li><a href=\"#graphql-queries\">GraphQL Queries<\/a><\/li>\n\n\n\n<li><a href=\"#google-map-component\">Google Map Component<\/a><\/li>\n\n\n\n<li><a href=\"#feature-map-page\">Feature Map Page<\/a><\/li>\n\n\n\n<li><a href=\"#test-the-map\">Test The Map<\/a><\/li>\n\n\n\n<li><a href=\"#conlusion\">Conclusion<\/a> <\/li>\n<\/ul>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"prerequisites\">Prerequisites<\/h2>\n\n\n\n<p>To benefit from this article, you should be familiar with the basics of working with the command line, <a href=\"https:\/\/wpengine.com\/builders\/headless-roadmap\/\">headless WordPress<\/a> development, <a href=\"http:\/\/next.js\">Nuxt.js<\/a>, and the WP Engine <a href=\"https:\/\/wpengine.com\/support\/wp-engine-user-portal\/\">User Portal<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"steps-for-setup\">Steps for setting up:<\/h3>\n\n\n\n<p>1. Set up <a href=\"https:\/\/wpengine.com\/wordpress-hosting\/\">an account on WP Engine<\/a> and get a WordPress install running.&nbsp; Log in to your WP Admin.<\/p>\n\n\n\n<div class=\"wp-block-group has-base-color has-heliotrope-background-color has-text-color has-background has-link-color wp-elements-60580c77f35127ab4c58efd3ae854863 has-global-padding is-layout-constrained wp-container-core-group-is-layout-3 wp-block-group-is-layout-constrained\" style=\"border-radius:12px;margin-bottom:var(--wp--preset--spacing--30);padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--30)\">\n<div class=\"wp-block-group alignwide is-content-justification-left is-layout-flex wp-container-core-group-is-layout-2 wp-block-group-is-layout-flex\" style=\"padding-top:0;padding-right:0;padding-bottom:0;padding-left:0\">\n<p style=\"font-size:26px;font-style:normal;font-weight:700;letter-spacing:-1px;line-height:1\">Headless<br>Platform<\/p>\n\n\n\n<p class=\"has-small-font-size wp-container-content-1\" style=\"line-height:1.5\">The all-in-one platform for <br>radically fast headless sites.<\/p>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-right is-nowrap is-layout-flex wp-container-core-buttons-is-layout-1 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button is-style-outline-base\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/wpeng.in\/headless-platform\/\" style=\"border-radius:99px;padding-top:10px;padding-right:24px;padding-bottom:10px;padding-left:24px\" target=\"_blank\" rel=\"noreferrer noopener\">Try for free \u2192<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<p>2. Add a Smart Search license. Refer to the docs <a href=\"https:\/\/wpengine.com\/support\/wp-engine-smart-search\/#Enable\">here<\/a> to add a license.<\/p>\n\n\n\n<p>3. In the WP Admin, go to <strong>WP Engine Smart Search &gt; Settings<\/strong>.&nbsp; You will find your Smart Search GraphQL endpoint and access token here.&nbsp; Copy and save it.&nbsp; We will need it for our environment variables for the frontend.&nbsp; You should see this page:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"547\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1024x547.png\" alt=\"\" class=\"wp-image-32039\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1024x547.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-300x160.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-768x410.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1536x821.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><br>4. Go to <strong>Plugins<\/strong> in your WP Admin page and search for \u201cACF\u201d.&nbsp; Click on \u201cACF\u201d and then download the plugin. Once downloaded, activate it.<br><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"393\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1-1024x393.png\" alt=\"\" class=\"wp-image-32040\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1-1024x393.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1-300x115.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1-768x295.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1-1536x589.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Now that we have ACF installed, we can make our custom post type and custom fields for our locations. For this example, I added random BBQ restaurants and a bar in Austin, Texas.<\/p>\n\n\n\n<div class=\"wp-block-group has-base-color has-text-color has-background has-link-color wp-elements-b3b5111bd1ed80257b6afde7f6c47e8c has-global-padding is-layout-constrained wp-container-core-group-is-layout-5 wp-block-group-is-layout-constrained\" style=\"border-radius:12px;background-color:#0076dc;margin-bottom:var(--wp--preset--spacing--30);padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--30)\">\n<div class=\"wp-block-group alignwide is-content-justification-left is-layout-flex wp-container-core-group-is-layout-4 wp-block-group-is-layout-flex\" style=\"padding-top:0;padding-right:0;padding-bottom:0;padding-left:0\">\n<div class=\"wp-block-outermost-icon-block\"><div class=\"icon-container\" style=\"width:80px\"><svg fill=\"none\" viewBox=\"0 0 80 36\" aria-label=\"ACF logo\"><path fill=\"currentColor\" d=\"M64.169 35.437h-8.673V.427h23.118v8.152H64.169v6.248h13.615v7.95H64.169v12.662-.002Z\"><\/path><path fill=\"currentColor\" d=\"M53.208 20.744h8.596c-1.272 8.911-8.74 14.805-17.787 14.805-9.907 0-17.974-7.45-17.974-17.483-.02-2.333.43-4.646 1.325-6.799a17.22 17.22 0 0 1 3.882-5.722A17.972 17.972 0 0 1 44.017.436c8.964 0 16.64 5.939 17.731 14.707h-8.587c-2.582-9.932-18.671-8.96-18.671 2.923 0 11.885 16.29 12.76 18.718 2.68v-.002Z\" opacity=\".05\"><\/path><path fill=\"currentColor\" d=\"M51.449 20.744c-1.475 5.014-6.724 7.994-11.89 6.746-5.17-1.253-8.409-6.28-7.336-11.39 1.072-5.113 6.071-8.48 11.323-7.628A9.366 9.366 0 0 1 49.16 11.4a9.656 9.656 0 0 1 2.24 3.742h8.337C58.645 6.354 50.948.436 42.006.436a17.97 17.97 0 0 0-12.77 5.106 17.214 17.214 0 0 0-3.884 5.725 17.302 17.302 0 0 0-1.324 6.802c0 10.032 8.02 17.48 17.98 17.48 9.04 0 16.487-5.894 17.781-14.805h-8.341.001Z\"><\/path><path fill=\"currentColor\" d=\"M25.544 30.344h-12.07l-1.972 5.088H2.266L16.4.389h6.16l14.697 35.054h-9.752l-1.964-5.1h.003Zm-8.639-8.674-.302.79h5.86l-.204-.593-2.728-7.515-2.626 7.318Z\" opacity=\".05\"><\/path><path fill=\"currentColor\" d=\"M23.258 30.344H11.21l-1.972 5.088H0L14.136.389h6.16l14.697 35.054h-9.748l-1.987-5.1ZM14.64 21.67l-.301.79h5.86l-.205-.593-2.727-7.515-2.626 7.318h-.001Z\"><\/path><\/svg><\/div><\/div>\n\n\n\n<p class=\"has-small-font-size wp-container-content-3\" style=\"line-height:1.5\">Advanced custom fields to build <br>with WordPress your way.<\/p>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-right is-nowrap is-layout-flex wp-container-core-buttons-is-layout-2 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button is-style-outline-base\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/wpeng.in\/acf-builders\/\" style=\"border-radius:99px;padding-top:10px;padding-right:24px;padding-bottom:10px;padding-left:24px\" target=\"_blank\" rel=\"noreferrer noopener\">Download \u2192<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<p>5. Before we use the Google Map ACF field, we need to register our <a href=\"https:\/\/developers.google.com\/maps\/documentation\/javascript\/get-api-key\">Google Map API key<\/a> to WordPress.&nbsp; Here are the docs from ACF on how to do this: <a href=\"https:\/\/www.advancedcustomfields.com\/resources\/google-map\/#requirements\">https:\/\/www.advancedcustomfields.com\/resources\/google-map\/#requirements.<\/a>&nbsp; Save that API key because we will need it for the frontend as well.<\/p>\n\n\n\n<p>In this example, I added my Google Map API key to my theme\u2019s <code>functions.php<\/code> file.<br><\/p>\n\n\n\n<p>6. Click on <strong>ACF <\/strong>on the side menu.&nbsp; It will give you menu options. Next, click on <strong>Post Types.<\/strong> You will see the page below<strong>.&nbsp; <\/strong>Let\u2019s make a post type called<strong> \u201cLocations\u201d.&nbsp; <\/strong>Go ahead and fill in the necessary fields to create it.&nbsp; You can leave the default settings as they are once you fill in the fields.&nbsp;&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"557\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-2-1024x557.png\" alt=\"\" class=\"wp-image-32041\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-2-1024x557.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-2-300x163.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-2-768x418.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-2-1536x835.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-2.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>7. Next, let\u2019s add the custom fields that will live in our locations custom post type.&nbsp; Click on <strong>Field Groups<\/strong> from the ACF side menu. You can name the field group \u201cLocation Details.\u201d It will take you to the create field groups page. Click on the<strong> Add New<\/strong> button.&nbsp; It will give you some fields to fill out.&nbsp;<\/p>\n\n\n\n<p>8. The first field we will make is the <strong>\u201cAddress\u201d<\/strong> field.&nbsp; This will be a text field type.&nbsp; The field label and name will be \u201caddress\u201d.&nbsp; Set its post type equal to <strong>Location<\/strong>.<\/p>\n\n\n\n<p>9. The second field is where our geo coordinates go.&nbsp; Create a field called <strong>\u201clocation\u201d<\/strong>.&nbsp; This field type will be a Google Map. Select it from the field menu.&nbsp; The label and name will both be <strong>\u201clocation\u201d<\/strong>.&nbsp; For the default location of the map, you can put whatever you like.&nbsp; For this example, I put the coordinates of Austin, TX.&nbsp; Make sure this one is also equal to the location Post type as well.&nbsp;<br><\/p>\n\n\n\n<p>These will be our two custom fields and it will be under the Location Details field group:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"573\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-3-1024x573.png\" alt=\"\" class=\"wp-image-32042\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-3-1024x573.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-3-300x168.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-3-768x430.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-3-1536x860.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-3.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>10. Next, navigate to the <strong>WP Engine AI Toolkit<\/strong> option in the side menu.&nbsp; We need to configure our search model.&nbsp; Go to <strong>Configuration<\/strong>. Select the <strong>Hybrid<\/strong> card. Add the <code>post_content<\/code>, <code>post_title<\/code>, and <code>locationDetails.address<\/code>&nbsp; fields in the <strong>Hybrid settings<\/strong> section. We are going to use these fields as our AI-powered field for hybrid searches. Make sure to hit <strong>Save Configuration<\/strong> afterward.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"586\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-4-1024x586.png\" alt=\"\" class=\"wp-image-32043\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-4-1024x586.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-4-300x172.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-4-768x439.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-4-1536x878.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-4.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"280\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-5-1024x280.png\" alt=\"\" class=\"wp-image-32044\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-5-1024x280.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-5-300x82.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-5-768x210.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-5-1536x420.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-5.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>11. Now, we need to weight the fields that we want Smart Search AI to prioritize. Scroll down to the relevancy sliders and put some weight on the <code>post_content<\/code>, <code>post_title<\/code>, <code>locationDetails.address<\/code> and <code>locationDetails.location<\/code>.&nbsp; This will tell our search what to prioritize when our users search for locations.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"333\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-6-1024x333.png\" alt=\"\" class=\"wp-image-32045\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-6-1024x333.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-6-300x98.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-6-768x250.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-6-1536x499.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-6.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"158\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-7-1024x158.png\" alt=\"\" class=\"wp-image-32046\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-7-1024x158.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-7-300x46.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-7-768x119.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-7-1536x237.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-7.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>12. After saving the configuration, head on over to the <strong>Index data<\/strong> page, then click <strong>\u201cIndex Now\u201d<\/strong>.<em>&nbsp; <\/em>It will give you this success message once completed<em> :<\/em><br><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"616\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-8-1024x616.png\" alt=\"\" class=\"wp-image-32047\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-8-1024x616.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-8-300x181.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-8-768x462.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-8-1536x924.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-8.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><br>13. If you want to test it out to make sure you are getting the geolocation coordinates for latitude and longitude data from WordPress, you can run a cURL command against the GraphQL endpoint with the access token that SSAI gives you.&nbsp; Here is a command you can copy. Once you swap out your search endpoint and access token in the command, you can paste it in your terminal:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>curl -X POST <span class=\"hljs-string\">\"$SEARCH_ENDPOINT\"<\/span> \\(swap out your endpoint here)\n<\/span><\/span><span class='shcb-loc'><span>  -H <span class=\"hljs-string\">\"Content-Type: application\/json\"<\/span> \\\n<\/span><\/span><span class='shcb-loc'><span>  -H <span class=\"hljs-string\">\"Authorization: Bearer $SEARCH_ACCESS_TOKEN\"<\/span> \\(swap your token here)\n<\/span><\/span><span class='shcb-loc'><span>  -d <span class=\"hljs-string\">'{<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">    \"query\": \"query FindNearCircle($query: String!, $centerLat: Float!, $centerLon: Float!, $maxDistance: Distance!, $limit: Int) { find(query: $query, semanticSearch: { searchBias: 7, fields: &#91;\\\"post_title\\\", \\\"post_content\\\", \\\"locationDetails.address\\\"] }, geoConstraints: { circles: &#91;{ center: { lat: $centerLat, lon: $centerLon }, maxDistance: $maxDistance }] }, orderBy: &#91;{ field: \\\"_score\\\", direction: desc }, { field: \\\"post_date_gmt\\\", direction: desc }], limit: $limit, options: { includeFields: &#91;\\\"post_title\\\", \\\"coordinates\\\", \\\"locationDetails.coordinates\\\", \\\"locationDetails.address\\\", \\\"permalink\\\"] }) { total documents { id sort data } } }\",<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">    \"variables\": {<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">      \"query\": \"*\",<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">      \"centerLat\": 30.2672,<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">      \"centerLon\": -97.7431,<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">      \"maxDistance\": \"10mi\",<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">      \"limit\": 3<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">    }<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\">  }'<\/span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>14. We need to set the frontend up now.&nbsp; The <a href=\"http:\/\/nuxt.js\">Nuxt.js<\/a> frontend boilerplate will contain a project that already renders a page with a map and some location filters. Clone <a href=\"https:\/\/github.com\/Fran-A-Dev\/smart-search-headlesswp-ecomm\/tree\/starting-point-boilerplate\">the Nuxt repo starting point <\/a>by copying and pasting this command in your terminal:<br><\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>npx degit Fran-A-Dev\/smart-searchai-geo-filtering-nuxt<span class=\"hljs-comment\">#main<\/span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><br>Once you clone it, navigate into the directory and install the project dependencies:<\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>cd my-project\n<\/span><\/span><span class='shcb-loc'><span>npm install\n<\/span><\/span><\/code><\/span><\/pre>\n\n\n<p><br><\/p>\n\n\n\n<p><br>15. Create a <code>.env<\/code> file inside the root of the Nuxt project. Open that file and paste in these environment variables<strong><em> (the ones you saved from steps 3 and 5) <\/em><\/strong>:<br><\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-3\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>SEARCH_ENDPOINT=\"<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">your<\/span> <span class=\"hljs-attr\">ssai<\/span> <span class=\"hljs-attr\">graphql<\/span> <span class=\"hljs-attr\">endpoint<\/span> <span class=\"hljs-attr\">here<\/span>&gt;<\/span>\"\n<\/span><\/span><span class='shcb-loc'><span>SEARCH_ACCESS_TOKEN=\"<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">your<\/span> <span class=\"hljs-attr\">smart<\/span> <span class=\"hljs-attr\">search<\/span> <span class=\"hljs-attr\">ai<\/span> <span class=\"hljs-attr\">access<\/span> <span class=\"hljs-attr\">token<\/span> <span class=\"hljs-attr\">here<\/span>&gt;<\/span>\"\n<\/span><\/span><span class='shcb-loc'><span>GOOGLE_MAPS_API_KEY=\"<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">your<\/span> <span class=\"hljs-attr\">google<\/span> <span class=\"hljs-attr\">maps<\/span> <span class=\"hljs-attr\">api<\/span> <span class=\"hljs-attr\">key<\/span> <span class=\"hljs-attr\">here<\/span>&gt;<\/span>\"\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-3\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><br><br><br>16. Next, let&#8217;s update how our Nuxt app will build and run the site.&nbsp; Go to your <code>nuxt.config.ts<\/code> file in the root and update it accordingly:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-4\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-comment\">\/\/ nuxt.config.ts<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">export<\/span> <span class=\"hljs-keyword\">default<\/span> defineNuxtConfig({\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">compatibilityDate<\/span>: <span class=\"hljs-string\">\"2025-10-17\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">modules<\/span>: &#91;<span class=\"hljs-string\">\"@nuxtjs\/tailwindcss\"<\/span>],\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">css<\/span>: &#91;<span class=\"hljs-string\">\"~\/assets\/css\/main.css\"<\/span>],\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">runtimeConfig<\/span>: {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ Server-only (private) values<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">searchAccessToken<\/span>: process.env.SEARCH_ACCESS_TOKEN,\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">searchEndpoint<\/span>: process.env.SEARCH_ENDPOINT,\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ Public values available on client<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">public<\/span>: {\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">googleMapsApiKey<\/span>: process.env.GOOGLE_MAPS_API_KEY,\n<\/span><\/span><span class='shcb-loc'><span>    },\n<\/span><\/span><span class='shcb-loc'><span>  },\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">devtools<\/span>: { <span class=\"hljs-attr\">enabled<\/span>: <span class=\"hljs-literal\">true<\/span> },\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">nitro<\/span>: {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">experimental<\/span>: {\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">websocket<\/span>: <span class=\"hljs-literal\">false<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    },\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ Note: no `fetch` key here\u2014set timeout\/retry per-request in $fetch options.<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  },\n<\/span><\/span><span class='shcb-loc'><span>});\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-4\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><br>We are done with the setup steps to create the boilerplate starting point.&nbsp; In your terminal, run <code>npm run dev<\/code> and visit <a href=\"http:\/\/localhost:3000\/geo-search\">http:\/\/localhost:3000\/geo-search<\/a> to make sure it works.&nbsp; You should see this:<br><br><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"600\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-9-1024x600.png\" alt=\"\" class=\"wp-image-32048\" srcset=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-9-1024x600.png 1024w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-9-300x176.png 300w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-9-768x450.png 768w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-9-1536x900.png 1536w, https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-9.png 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"maps-usage\">Maps Usage<\/h2>\n\n\n\n<p>You\u2019re not locked into any single map library for the UI. This demo uses the Google Maps JavaScript API, but you can swap in <a href=\"https:\/\/docs.mapbox.com\/mapbox-gl-js\/guides\/\">Mapbox GL JS<\/a>, <a href=\"https:\/\/maplibre.org\/\">MapLibre GL<\/a>, <a href=\"https:\/\/leafletjs.com\/\">Leaflet<\/a>, or any other JavaScript map component that can display markers from <code>{ lat, lon }<\/code> pairs and emit click\/drag events.&nbsp;<\/p>\n\n\n\n<p>The Smart Search piece is library-agnostic: your page just needs a center point (lat\/lon) and a radius or bounds to construct the geoConstraints in the GraphQL query. If your chosen map exposes the current bounds, you can also power a bounding-box search; if it supports geolocation, you can seed the center from the user\u2019s position. The only UI changes are in your map wrapper (marker rendering, event wiring); the server call and GraphQL stay the same.<\/p>\n\n\n\n<p>On the WordPress side, you can also use any approach that yields clean latitude\/longitude data. ACF fields, a dedicated map plugin, or a custom meta box are all fine\u2014as long as you can persist numeric lat and lon for each location and expose them via REST or GraphQL (WPGraphQL, custom REST fields, or a small plugin).&nbsp;<\/p>\n\n\n\n<p>For Smart Search\u2019s geo filters to work, ensure those values land in your index as a top-level coordinates field with the shape { lat: number, lon: number } (or an array of such objects). If a map plugin stores coordinates under a different key or nested structure, normalize them during indexing (e.g., via a transform hook or a tiny MU\/regular plugin) so the index has coordinates at the top level.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"server-connection\">Server Connection<\/h2>\n\n\n\n<p>The first thing we need to do is to go over the server endpoint that will be our secure proxy for SSAI and the client. Navigate to <code>server\/api\/<a href=\"http:\/\/search.post.ts\">search.post.ts<\/a><\/code>.  You will see this file:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-5\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-comment\">\/\/ server\/api\/search.post.ts<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">import<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>  defineEventHandler,\n<\/span><\/span><span class='shcb-loc'><span>  readBody,\n<\/span><\/span><span class='shcb-loc'><span>  createError,\n<\/span><\/span><span class='shcb-loc'><span>  setResponseStatus,\n<\/span><\/span><span class='shcb-loc'><span>} <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">\"h3\"<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>type GraphQLBody = {\n<\/span><\/span><span class='shcb-loc'><span>  query?: string;\n<\/span><\/span><span class='shcb-loc'><span>  variables?: Record&lt;string, any&gt;;\n<\/span><\/span><span class='shcb-loc'><span>};\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>type GraphQLResponse&lt;T = unknown&gt; = {\n<\/span><\/span><span class='shcb-loc'><span>  data?: T;\n<\/span><\/span><span class='shcb-loc'><span>  errors?: unknown;\n<\/span><\/span><span class='shcb-loc'><span>};\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">export<\/span> <span class=\"hljs-keyword\">default<\/span> defineEventHandler(<span class=\"hljs-keyword\">async<\/span> (event) =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> { searchEndpoint, searchAccessToken } = useRuntimeConfig();\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!searchEndpoint || !searchAccessToken) {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">throw<\/span> createError({\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">statusCode<\/span>: <span class=\"hljs-number\">500<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">statusMessage<\/span>: <span class=\"hljs-string\">\"Smart Search not configured\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    });\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> body = <span class=\"hljs-keyword\">await<\/span> readBody&lt;GraphQLBody&gt;(event);\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!body?.query || <span class=\"hljs-keyword\">typeof<\/span> body.query !== <span class=\"hljs-string\">\"string\"<\/span>) {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">throw<\/span> createError({\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">statusCode<\/span>: <span class=\"hljs-number\">400<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">statusMessage<\/span>: <span class=\"hljs-string\">\"Missing GraphQL query\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    });\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">try<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> resp = <span class=\"hljs-keyword\">await<\/span> $fetch&lt;GraphQLResponse&gt;(searchEndpoint, {\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">method<\/span>: <span class=\"hljs-string\">\"POST\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">headers<\/span>: {\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-string\">\"Content-Type\"<\/span>: <span class=\"hljs-string\">\"application\/json\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">Authorization<\/span>: <span class=\"hljs-string\">`Bearer <span class=\"hljs-subst\">${searchAccessToken}<\/span>`<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      },\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-comment\">\/\/ Ensure variables is always an object (some servers reject undefined)<\/span>\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">body<\/span>: { <span class=\"hljs-attr\">query<\/span>: body.query, <span class=\"hljs-attr\">variables<\/span>: body.variables ?? {} },\n<\/span><\/span><span class='shcb-loc'><span>    });\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ If GraphQL returned errors, surface them with a 502 so the client can show detail<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (resp?.errors) {\n<\/span><\/span><span class='shcb-loc'><span>      setResponseStatus(event, <span class=\"hljs-number\">502<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-keyword\">return<\/span> resp;\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">return<\/span> resp; <span class=\"hljs-comment\">\/\/ { data }<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  } <span class=\"hljs-keyword\">catch<\/span> (err: any) {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ Log enough for debugging without leaking secrets<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-built_in\">console<\/span>.error(<span class=\"hljs-string\">\"Smart Search API Error\"<\/span>, {\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">status<\/span>: err?.status,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">statusText<\/span>: err?.statusText,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">message<\/span>: err?.message,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">data<\/span>: err?.data,\n<\/span><\/span><span class='shcb-loc'><span>    });\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">throw<\/span> createError({\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">statusCode<\/span>: err?.status || <span class=\"hljs-number\">502<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">statusMessage<\/span>: <span class=\"hljs-string\">\"Smart Search request failed\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">data<\/span>: err?.data ?? <span class=\"hljs-literal\">null<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    });\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>});\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-5\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>This code reads the Smart Search endpoint and access token from the Nuxt runtime config and fails with a 500 if either is missing.&nbsp;<\/p>\n\n\n\n<p>It then parses the incoming request body and validates that a GraphQL query string is present, otherwise returning a 400. The handler forwards the request to Smart Search using <code>$fetch<\/code>, always sending a proper JSON GraphQL payload with the Bearer token and a guaranteed variables object.<\/p>\n\n\n\n<p>By centralizing the HTTP call here, every client in your app can POST to <code>\/api\/search<\/code> with a consistent contract. If Smart Search AI responds with a GraphQL errors array, the endpoint sets an HTTP 502 and returns the error payload untouched for debugging.<\/p>\n\n\n\n<p>On success, it simply relays the upstream <code>{ data } <\/code>to the caller. Operational failures\u2014network issues, timeouts, upstream 5xx\u2014are logged with safe metadata and rethrown as a structured <code>h3<\/code> error.<\/p>\n\n\n\n<p>This pattern improves security, avoids CORS complications, and keeps your access token server-only.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"graphql-queries\">GraphQL Queries<\/h2>\n\n\n\n<p>The next file we will go over is our GraphQL queries.&nbsp; Head to <code>graphql\/<a href=\"http:\/\/queries.ts\">queries.ts<\/a><\/code> and open up the file:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-6\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>\/\/ graphql\/queries.ts\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>\/** Fields we want back from Smart Search documents. Adjust to your index shape. *\/\n<\/span><\/span><span class='shcb-loc'><span>export const DEFAULT_INCLUDE_FIELDS = &#91;\n<\/span><\/span><span class='shcb-loc'><span>  \"post_title\",\n<\/span><\/span><span class='shcb-loc'><span>  \"address\", \/\/ top-level if you mapped it during indexing\n<\/span><\/span><span class='shcb-loc'><span>  \"coordinates\", \/\/ top-level geo field that Smart Search uses\n<\/span><\/span><span class='shcb-loc'><span>  \"post_url\", \/\/ or \"permalink\" if your index uses that key\n<\/span><\/span><span class='shcb-loc'><span>] as const;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>\/** Compose an optional semanticSearch block only if enabled. *\/\n<\/span><\/span><span class='shcb-loc'><span>export const SEMANTIC_BLOCK = `\n<\/span><\/span><span class='shcb-loc'><span>  $semanticBias: Int = 0\n<\/span><\/span><span class='shcb-loc'><span>  $semanticFields: &#91;String!] = &#91;]\n<\/span><\/span><span class='shcb-loc'><span>` as const;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>export const SEMANTIC_ARG = `\n<\/span><\/span><span class='shcb-loc'><span>  semanticSearch: { searchBias: $semanticBias, fields: $semanticFields }\n<\/span><\/span><span class='shcb-loc'><span>` as const;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>\/** ---------- 1) Circle (nearby) search with optional semantic &amp; pagination ---------- *\/\n<\/span><\/span><span class='shcb-loc'><span>export const FIND_NEAR_CIRCLE = \/* GraphQL *\/ `\n<\/span><\/span><span class='shcb-loc'><span>  query FindNearCircle(\n<\/span><\/span><span class='shcb-loc'><span>    $query: String!\n<\/span><\/span><span class='shcb-loc'><span>    $centerLat: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $centerLon: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $maxDistance: Distance!\n<\/span><\/span><span class='shcb-loc'><span>    $limit: Int = 20\n<\/span><\/span><span class='shcb-loc'><span>    $searchAfter: &#91;String!]\n<\/span><\/span><span class='shcb-loc'><span>    $filter: String\n<\/span><\/span><span class='shcb-loc'><span>    $includeFields: &#91;String!] = &#91;]\n<\/span><\/span><span class='shcb-loc'><span>    ${SEMANTIC_BLOCK}\n<\/span><\/span><span class='shcb-loc'><span>  ) {\n<\/span><\/span><span class='shcb-loc'><span>    find(\n<\/span><\/span><span class='shcb-loc'><span>      query: $query\n<\/span><\/span><span class='shcb-loc'><span>      ${SEMANTIC_ARG}\n<\/span><\/span><span class='shcb-loc'><span>      filter: $filter\n<\/span><\/span><span class='shcb-loc'><span>      geoConstraints: {\n<\/span><\/span><span class='shcb-loc'><span>        circles: &#91;\n<\/span><\/span><span class='shcb-loc'><span>          { center: { lat: $centerLat, lon: $centerLon }, maxDistance: $maxDistance }\n<\/span><\/span><span class='shcb-loc'><span>        ]\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>      orderBy: &#91;\n<\/span><\/span><span class='shcb-loc'><span>        { field: \"_score\", direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>        { field: \"post_date_gmt\", direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>      ]\n<\/span><\/span><span class='shcb-loc'><span>      limit: $limit\n<\/span><\/span><span class='shcb-loc'><span>      searchAfter: $searchAfter\n<\/span><\/span><span class='shcb-loc'><span>      options: { includeFields: $includeFields }\n<\/span><\/span><span class='shcb-loc'><span>    ) {\n<\/span><\/span><span class='shcb-loc'><span>      total\n<\/span><\/span><span class='shcb-loc'><span>      documents {\n<\/span><\/span><span class='shcb-loc'><span>        id\n<\/span><\/span><span class='shcb-loc'><span>        score\n<\/span><\/span><span class='shcb-loc'><span>        sort\n<\/span><\/span><span class='shcb-loc'><span>        data\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>`;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>\/** ---------- 2) Bounding-box search with optional semantic &amp; pagination ---------- *\/\n<\/span><\/span><span class='shcb-loc'><span>export const FIND_IN_BBOX = \/* GraphQL *\/ `\n<\/span><\/span><span class='shcb-loc'><span>  query FindInBoundingBox(\n<\/span><\/span><span class='shcb-loc'><span>    $query: String!\n<\/span><\/span><span class='shcb-loc'><span>    $swLat: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $swLon: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $neLat: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $neLon: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $limit: Int = 20\n<\/span><\/span><span class='shcb-loc'><span>    $searchAfter: &#91;String!]\n<\/span><\/span><span class='shcb-loc'><span>    $filter: String\n<\/span><\/span><span class='shcb-loc'><span>    $includeFields: &#91;String!] = &#91;]\n<\/span><\/span><span class='shcb-loc'><span>    ${SEMANTIC_BLOCK}\n<\/span><\/span><span class='shcb-loc'><span>  ) {\n<\/span><\/span><span class='shcb-loc'><span>    find(\n<\/span><\/span><span class='shcb-loc'><span>      query: $query\n<\/span><\/span><span class='shcb-loc'><span>      ${SEMANTIC_ARG}\n<\/span><\/span><span class='shcb-loc'><span>      filter: $filter\n<\/span><\/span><span class='shcb-loc'><span>      geoConstraints: {\n<\/span><\/span><span class='shcb-loc'><span>        boundingBoxes: &#91;\n<\/span><\/span><span class='shcb-loc'><span>          { southwest: { lat: $swLat, lon: $swLon }, northeast: { lat: $neLat, lon: $neLon } }\n<\/span><\/span><span class='shcb-loc'><span>        ]\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>      orderBy: &#91;\n<\/span><\/span><span class='shcb-loc'><span>        { field: \"_score\", direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>        { field: \"post_date_gmt\", direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>      ]\n<\/span><\/span><span class='shcb-loc'><span>      limit: $limit\n<\/span><\/span><span class='shcb-loc'><span>      searchAfter: $searchAfter\n<\/span><\/span><span class='shcb-loc'><span>      options: { includeFields: $includeFields }\n<\/span><\/span><span class='shcb-loc'><span>    ) {\n<\/span><\/span><span class='shcb-loc'><span>      total\n<\/span><\/span><span class='shcb-loc'><span>      documents {\n<\/span><\/span><span class='shcb-loc'><span>        id\n<\/span><\/span><span class='shcb-loc'><span>        score\n<\/span><\/span><span class='shcb-loc'><span>        sort\n<\/span><\/span><span class='shcb-loc'><span>        data\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>`;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>\/** ---------- Helper types for DX ---------- *\/\n<\/span><\/span><span class='shcb-loc'><span>export interface FindNearCircleVars {\n<\/span><\/span><span class='shcb-loc'><span>  query: string;\n<\/span><\/span><span class='shcb-loc'><span>  centerLat: number;\n<\/span><\/span><span class='shcb-loc'><span>  centerLon: number;\n<\/span><\/span><span class='shcb-loc'><span>  maxDistance: string; \/\/ Distance! scalar, e.g. \"5mi\", \"2km\"\n<\/span><\/span><span class='shcb-loc'><span>  limit?: number;\n<\/span><\/span><span class='shcb-loc'><span>  searchAfter?: string&#91;];\n<\/span><\/span><span class='shcb-loc'><span>  filter?: string; \/\/ e.g., \"post_type:location\"\n<\/span><\/span><span class='shcb-loc'><span>  includeFields?: string&#91;];\n<\/span><\/span><span class='shcb-loc'><span>  semanticBias?: number; \/\/ 0..10\n<\/span><\/span><span class='shcb-loc'><span>  semanticFields?: string&#91;]; \/\/ &#91;\"post_title\", \"post_content\"] etc., if configured\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>export interface FindInBBoxVars\n<\/span><\/span><span class='shcb-loc'><span>  extends Omit<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">FindNearCircleVars,<\/span> \"<span class=\"hljs-attr\">centerLat<\/span>\" | \"<span class=\"hljs-attr\">centerLon<\/span>\" | \"<span class=\"hljs-attr\">maxDistance<\/span>\"&gt;<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>  swLat: number;\n<\/span><\/span><span class='shcb-loc'><span>  swLon: number;\n<\/span><\/span><span class='shcb-loc'><span>  neLat: number;\n<\/span><\/span><span class='shcb-loc'><span>  neLon: number;\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>\/** Normalize coordinates to an array of points for mapping. *\/\n<\/span><\/span><span class='shcb-loc'><span>export type Point = { lat: number; lon: number };\n<\/span><\/span><span class='shcb-loc'><span>export function normalizeCoordinates(raw: unknown): Point&#91;] {\n<\/span><\/span><span class='shcb-loc'><span>  if (!raw) return &#91;];\n<\/span><\/span><span class='shcb-loc'><span>  if (Array.isArray(raw)) {\n<\/span><\/span><span class='shcb-loc'><span>    return raw\n<\/span><\/span><span class='shcb-loc'><span>      .map((p) =&gt; (p &amp;&amp; typeof p === \"object\" ? (p as any) : null))\n<\/span><\/span><span class='shcb-loc'><span>      .filter(Boolean)\n<\/span><\/span><span class='shcb-loc'><span>      .filter((p) =&gt; typeof p.lat === \"number\" &amp;&amp; typeof p.lon === \"number\");\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>  if (typeof raw === \"object\" &amp;&amp; raw !== null) {\n<\/span><\/span><span class='shcb-loc'><span>    const p = raw as any;\n<\/span><\/span><span class='shcb-loc'><span>    if (typeof p.lat === \"number\" &amp;&amp; typeof p.lon === \"number\") {\n<\/span><\/span><span class='shcb-loc'><span>      return &#91;p as Point];\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>  return &#91;];\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-6\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>This module centralizes the GraphQL queries and helpers your Nuxt app uses to perform geo-aware searches against Smart Search AI.&nbsp; This is a lot of code. Let\u2019s break it down.<\/p>\n\n\n\n<p>It declares a <code>DEFAULT_INCLUDE_FIELDS<\/code> array so you can consistently request the minimal document fields you need back\u2014titles, address, a top-level coordinates geo field, and a URL.&nbsp;<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-7\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-keyword\">export<\/span> <span class=\"hljs-keyword\">const<\/span> DEFAULT_INCLUDE_FIELDS = &#91;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-string\">\"post_title\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-string\">\"address\"<\/span>, <span class=\"hljs-comment\">\/\/ top-level if you mapped it during indexing<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-string\">\"coordinates\"<\/span>, <span class=\"hljs-comment\">\/\/ top-level geo field that Smart Search uses<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-string\">\"post_url\"<\/span>, <span class=\"hljs-comment\">\/\/ or \"permalink\" if your index uses that key<\/span>\n<\/span><\/span><span class='shcb-loc'><span>] <span class=\"hljs-keyword\">as<\/span> <span class=\"hljs-keyword\">const<\/span>;\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-7\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>It introduces a small semantic-search stanza <code>(SEMANTIC_BLOCK and SEMANTIC_ARG) <\/code>that can be injected into queries, letting you toggle semantic bias and fields without duplicating query text.&nbsp;<\/p>\n\n\n\n<p><br>The first query, <code>FIND_NEAR_CIRCLE<\/code>, searches within a circle by passing a center latitude\/longitude and a <code>Distance! <\/code>scalar (e.g., &#8220;5mi&#8221;), and supports optional filters (like <code>post_type:location<\/code>), semantic options, result limits, and cursor pagination via <code>searchAfter<\/code>.&nbsp;<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-8\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>export <span class=\"hljs-keyword\">const<\/span> SEMANTIC_BLOCK = `\n<\/span><\/span><span class='shcb-loc'><span>  $semanticBias: Int = <span class=\"hljs-number\">0<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  $semanticFields: &#91;String!] = &#91;]\n<\/span><\/span><span class='shcb-loc'><span>` <span class=\"hljs-keyword\">as<\/span> <span class=\"hljs-keyword\">const<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>export <span class=\"hljs-keyword\">const<\/span> SEMANTIC_ARG = `\n<\/span><\/span><span class='shcb-loc'><span>  semanticSearch: { searchBias: $semanticBias, fields: $semanticFields }\n<\/span><\/span><span class='shcb-loc'><span>` <span class=\"hljs-keyword\">as<\/span> <span class=\"hljs-keyword\">const<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** ---------- 1) Circle (nearby) search with optional semantic &amp; pagination ---------- *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span>export <span class=\"hljs-keyword\">const<\/span> FIND_NEAR_CIRCLE = <span class=\"hljs-comment\">\/* GraphQL *\/<\/span> `\n<\/span><\/span><span class='shcb-loc'><span>  query FindNearCircle(\n<\/span><\/span><span class='shcb-loc'><span>    $query: String!\n<\/span><\/span><span class='shcb-loc'><span>    $centerLat: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $centerLon: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $maxDistance: Distance!\n<\/span><\/span><span class='shcb-loc'><span>    $limit: Int = <span class=\"hljs-number\">20<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    $searchAfter: &#91;String!]\n<\/span><\/span><span class='shcb-loc'><span>    $filter: String\n<\/span><\/span><span class='shcb-loc'><span>    $includeFields: &#91;String!] = &#91;]\n<\/span><\/span><span class='shcb-loc'><span>    ${SEMANTIC_BLOCK}\n<\/span><\/span><span class='shcb-loc'><span>  ) {\n<\/span><\/span><span class='shcb-loc'><span>    find(\n<\/span><\/span><span class='shcb-loc'><span>      query: $query\n<\/span><\/span><span class='shcb-loc'><span>      ${SEMANTIC_ARG}\n<\/span><\/span><span class='shcb-loc'><span>      filter: $filter\n<\/span><\/span><span class='shcb-loc'><span>      geoConstraints: {\n<\/span><\/span><span class='shcb-loc'><span>        circles: &#91;\n<\/span><\/span><span class='shcb-loc'><span>          { center: { lat: $centerLat, lon: $centerLon }, maxDistance: $maxDistance }\n<\/span><\/span><span class='shcb-loc'><span>        ]\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>      orderBy: &#91;\n<\/span><\/span><span class='shcb-loc'><span>        { field: <span class=\"hljs-string\">\"_score\"<\/span>, direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>        { field: <span class=\"hljs-string\">\"post_date_gmt\"<\/span>, direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>      ]\n<\/span><\/span><span class='shcb-loc'><span>      limit: $limit\n<\/span><\/span><span class='shcb-loc'><span>      searchAfter: $searchAfter\n<\/span><\/span><span class='shcb-loc'><span>      options: { includeFields: $includeFields }\n<\/span><\/span><span class='shcb-loc'><span>    ) {\n<\/span><\/span><span class='shcb-loc'><span>      total\n<\/span><\/span><span class='shcb-loc'><span>      documents {\n<\/span><\/span><span class='shcb-loc'><span>        id\n<\/span><\/span><span class='shcb-loc'><span>        score\n<\/span><\/span><span class='shcb-loc'><span>        sort\n<\/span><\/span><span class='shcb-loc'><span>        data\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>`;\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-8\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>The second query, <code>FIND_IN_BBOX<\/code>, performs the same search semantics within a bounding box using southwest and northeast corners. Both queries sort primarily <code>by _score<\/code> and secondarily by <code>post_date_gmt<\/code> to keep results relevant and time-sensible. Each query accepts an <code>includeFields<\/code> list, which is forwarded to the <code>options.includeFields<\/code> parameter so you can control payload size per request.&nbsp;<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-9\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>export <span class=\"hljs-keyword\">const<\/span> FIND_IN_BBOX = <span class=\"hljs-comment\">\/* GraphQL *\/<\/span> `\n<\/span><\/span><span class='shcb-loc'><span>  query FindInBoundingBox(\n<\/span><\/span><span class='shcb-loc'><span>    $query: String!\n<\/span><\/span><span class='shcb-loc'><span>    $swLat: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $swLon: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $neLat: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $neLon: Float!\n<\/span><\/span><span class='shcb-loc'><span>    $limit: Int = <span class=\"hljs-number\">20<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    $searchAfter: &#91;String!]\n<\/span><\/span><span class='shcb-loc'><span>    $filter: String\n<\/span><\/span><span class='shcb-loc'><span>    $includeFields: &#91;String!] = &#91;]\n<\/span><\/span><span class='shcb-loc'><span>    ${SEMANTIC_BLOCK}\n<\/span><\/span><span class='shcb-loc'><span>  ) {\n<\/span><\/span><span class='shcb-loc'><span>    find(\n<\/span><\/span><span class='shcb-loc'><span>      query: $query\n<\/span><\/span><span class='shcb-loc'><span>      ${SEMANTIC_ARG}\n<\/span><\/span><span class='shcb-loc'><span>      filter: $filter\n<\/span><\/span><span class='shcb-loc'><span>      geoConstraints: {\n<\/span><\/span><span class='shcb-loc'><span>        boundingBoxes: &#91;\n<\/span><\/span><span class='shcb-loc'><span>          { southwest: { lat: $swLat, lon: $swLon }, northeast: { lat: $neLat, lon: $neLon } }\n<\/span><\/span><span class='shcb-loc'><span>        ]\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>      orderBy: &#91;\n<\/span><\/span><span class='shcb-loc'><span>        { field: <span class=\"hljs-string\">\"_score\"<\/span>, direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>        { field: <span class=\"hljs-string\">\"post_date_gmt\"<\/span>, direction: desc }\n<\/span><\/span><span class='shcb-loc'><span>      ]\n<\/span><\/span><span class='shcb-loc'><span>      limit: $limit\n<\/span><\/span><span class='shcb-loc'><span>      searchAfter: $searchAfter\n<\/span><\/span><span class='shcb-loc'><span>      options: { includeFields: $includeFields }\n<\/span><\/span><span class='shcb-loc'><span>    ) {\n<\/span><\/span><span class='shcb-loc'><span>      total\n<\/span><\/span><span class='shcb-loc'><span>      documents {\n<\/span><\/span><span class='shcb-loc'><span>        id\n<\/span><\/span><span class='shcb-loc'><span>        score\n<\/span><\/span><span class='shcb-loc'><span>        sort\n<\/span><\/span><span class='shcb-loc'><span>        data\n<\/span><\/span><span class='shcb-loc'><span>      }\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>`;\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-9\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>The file defines TypeScript interfaces (<code>FindNearCircleVars<\/code> and <code>FindInBBoxVars<\/code>) that describe the expected variables, including the <code>Distance!<\/code> value expressed as a string and optional semantic parameters.&nbsp;<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-10\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-keyword\">export<\/span> interface FindNearCircleVars {\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">query<\/span>: string;\n<\/span><\/span><span class='shcb-loc'><span>  centerLat: number;\n<\/span><\/span><span class='shcb-loc'><span>  centerLon: number;\n<\/span><\/span><span class='shcb-loc'><span>  maxDistance: string; <span class=\"hljs-comment\">\/\/ Distance! scalar, e.g. \"5mi\", \"2km\"<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  limit?: number;\n<\/span><\/span><span class='shcb-loc'><span>  searchAfter?: string&#91;];\n<\/span><\/span><span class='shcb-loc'><span>  filter?: string; <span class=\"hljs-comment\">\/\/ e.g., \"post_type:location\"<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  includeFields?: string&#91;];\n<\/span><\/span><span class='shcb-loc'><span>  semanticBias?: number; <span class=\"hljs-comment\">\/\/ 0..10<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  semanticFields?: string&#91;]; <span class=\"hljs-comment\">\/\/ &#91;\"post_title\", \"post_content\"] etc., if configured<\/span>\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">export<\/span> interface FindInBBoxVars\n<\/span><\/span><span class='shcb-loc'><span>  extends Omit&lt;FindNearCircleVars, <span class=\"hljs-string\">\"centerLat\"<\/span> | <span class=\"hljs-string\">\"centerLon\"<\/span> | <span class=\"hljs-string\">\"maxDistance\"<\/span>&gt; {\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">swLat<\/span>: number;\n<\/span><\/span><span class='shcb-loc'><span>  swLon: number;\n<\/span><\/span><span class='shcb-loc'><span>  neLat: number;\n<\/span><\/span><span class='shcb-loc'><span>  neLon: number;\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-10\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>A small utility, <code>normalizeCoordinates<\/code>, normalizes either a single point or an array of points into a consistent <code>{lat, lon}[]<\/code> shape, which simplifies rendering map markers.&nbsp;<br><\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>export type Point = { lat: number; lon: number };\n<\/span><\/span><span class='shcb-loc'><span>export function normalizeCoordinates(raw: unknown): Point&#91;] {\n<\/span><\/span><span class='shcb-loc'><span>  if (!raw) return &#91;];\n<\/span><\/span><span class='shcb-loc'><span>  if (Array.isArray(raw)) {\n<\/span><\/span><span class='shcb-loc'><span>    return raw\n<\/span><\/span><span class='shcb-loc'><span>      .map((p) =&gt; (p &amp;&amp; typeof p === \"object\" ? (p as any) : null))\n<\/span><\/span><span class='shcb-loc'><span>      .filter(Boolean)\n<\/span><\/span><span class='shcb-loc'><span>      .filter((p) =&gt; typeof p.lat === \"number\" &amp;&amp; typeof p.lon === \"number\");\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>  if (typeof raw === \"object\" &amp;&amp; raw !== null) {\n<\/span><\/span><span class='shcb-loc'><span>    const p = raw as any;\n<\/span><\/span><span class='shcb-loc'><span>    if (typeof p.lat === \"number\" &amp;&amp; typeof p.lon === \"number\") {\n<\/span><\/span><span class='shcb-loc'><span>      return &#91;p as Point];\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>  return &#91;];\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><\/code><\/span><\/pre>\n\n\n<h2 class=\"wp-block-heading\" id=\"google-map-component\">Google Map Component<\/h2>\n\n\n\n<p>Now, let\u2019s take a look at our Map Component.&nbsp; Head to <code>components\/MapView.client.vue<\/code>:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-11\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script<\/span> <span class=\"hljs-attr\">setup<\/span> <span class=\"hljs-attr\">lang<\/span>=<span class=\"hljs-string\">\"ts\"<\/span>&gt;<\/span><span class=\"javascript\"><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">import<\/span> { onMounted, onBeforeUnmount, ref, watch, toRefs, nextTick } <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">\"vue\"<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">type LatLon = { <span class=\"hljs-attr\">lat<\/span>: number; lon: number };<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">type Marker = LatLon;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> props = defineProps&lt;{<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">  <span class=\"hljs-attr\">center<\/span>: LatLon; <span class=\"hljs-comment\">\/\/ { lat, lon }<\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">  markers: Marker&#91;]; <span class=\"hljs-comment\">\/\/ search results<\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">  userLocation: LatLon | <span class=\"hljs-literal\">null<\/span>; <span class=\"hljs-comment\">\/\/ optional blue dot<\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">}&gt;();<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> emit = defineEmits&lt;{<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">  (<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">    e: <span class=\"hljs-string\">\"boundsChanged\"<\/span>,<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">    <span class=\"hljs-attr\">bbox<\/span>: { <span class=\"hljs-attr\">swLat<\/span>: number; swLon: number; neLat: number; neLon: number },<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">    <span class=\"hljs-attr\">userInitiated<\/span>: boolean<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">  ): <span class=\"hljs-keyword\">void<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">  (e: <span class=\"hljs-string\">\"mapClick\"<\/span>, <span class=\"hljs-attr\">location<\/span>: LatLon): <span class=\"hljs-keyword\">void<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">}&gt;();<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> { center, markers, userLocation } = toRefs(props);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> mapDiv = ref&lt;HTMLDivElement | <span class=\"hljs-literal\">null<\/span>&gt;(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> config = useRuntimeConfig();<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> map: google.maps.Map | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> resultMarkers: google.maps.Marker&#91;] = &#91;];<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> userMarker: google.maps.Marker | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> userInitiatedMove = <span class=\"hljs-literal\">false<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> idleListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> dragListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> zoomListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> clickListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-comment\">\/** Simple debounce to quiet idle emissions *\/<\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">debounce<\/span>&lt;<span class=\"hljs-title\">T<\/span> <span class=\"hljs-title\">extends<\/span> (<span class=\"hljs-params\">...args: any&#91;]<\/span>) =&gt; <span class=\"hljs-title\">void<\/span>&gt;(<span class=\"hljs-params\">fn: T, ms = <span class=\"hljs-number\">150<\/span><\/span>) <\/span>{<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\">  <span class=\"hljs-keyword\">let<\/span> t: number | <span class=\"hljs-literal\">undefined<\/span>;<\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\">  <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-function\">(<span class=\"hljs-params\">...args: Parameters&lt;T&gt;<\/span>) =&gt;<\/span> {<\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">if<\/span> (t) <span class=\"hljs-built_in\">window<\/span>.clearTimeout(t);<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\">    t = <span class=\"hljs-built_in\">window<\/span>.setTimeout(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> fn(...args), ms);<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\">  };<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-comment\">\/** Load Google Maps JS once *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">loadGoogleMaps<\/span>(<span class=\"hljs-params\"><\/span>): <span class=\"hljs-title\">Promise<\/span>&lt;<span class=\"hljs-title\">void<\/span>&gt; <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-built_in\">Promise<\/span>(<span class=\"hljs-function\">(<span class=\"hljs-params\">resolve, reject<\/span>) =&gt;<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">if<\/span> ((globalThis <span class=\"hljs-keyword\">as<\/span> any).google?.maps) <span class=\"hljs-keyword\">return<\/span> resolve();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> key = config.public.googleMapsApiKey;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">if<\/span> (!key) <span class=\"hljs-keyword\">return<\/span> reject(<span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-built_in\">Error<\/span>(<span class=\"hljs-string\">\"Missing GOOGLE_MAPS_API_KEY\"<\/span>));<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> script = <span class=\"hljs-built_in\">document<\/span>.createElement(<span class=\"hljs-string\">\"script\"<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-comment\">\/\/ v=weekly per Google guidance; only `places` is a recognized library here<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    script.src = <span class=\"hljs-string\">`https:\/\/maps.googleapis.com\/maps\/api\/js?key=<span class=\"hljs-subst\">${<span class=\"hljs-built_in\">encodeURIComponent<\/span>(<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">      key<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">    )}<\/span>&amp;libraries=places&amp;v=weekly`<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    script.async = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    script.defer = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    script.onload = <span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> resolve();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">    script.onerror = <span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> reject(<span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-built_in\">Error<\/span>(<span class=\"hljs-string\">\"Failed to load Google Maps JS\"<\/span>));<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-built_in\">document<\/span>.head.appendChild(script);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">  });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">clearResultMarkers<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">for<\/span> (<span class=\"hljs-keyword\">const<\/span> m <span class=\"hljs-keyword\">of<\/span> resultMarkers) m.setMap(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  resultMarkers = &#91;];<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">setResultMarkers<\/span>(<span class=\"hljs-params\">list: Marker&#91;]<\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!map) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  clearResultMarkers();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> bounds = <span class=\"hljs-keyword\">new<\/span> google.maps.LatLngBounds();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">let<\/span> hasAny = <span class=\"hljs-literal\">false<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">for<\/span> (<span class=\"hljs-keyword\">const<\/span> m <span class=\"hljs-keyword\">of<\/span> list) {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">if<\/span> (<span class=\"hljs-keyword\">typeof<\/span> m.lat !== <span class=\"hljs-string\">\"number\"<\/span> || <span class=\"hljs-keyword\">typeof<\/span> m.lon !== <span class=\"hljs-string\">\"number\"<\/span>) <span class=\"hljs-keyword\">continue<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> marker = <span class=\"hljs-keyword\">new<\/span> google.maps.Marker({<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">position<\/span>: { <span class=\"hljs-attr\">lat<\/span>: m.lat, <span class=\"hljs-attr\">lng<\/span>: m.lon },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">title<\/span>: <span class=\"hljs-string\">\"Search result\"<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      map,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    resultMarkers.push(marker);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    bounds.extend(<span class=\"hljs-keyword\">new<\/span> google.maps.LatLng(m.lat, m.lon));<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    hasAny = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-comment\">\/\/ If no user-initiated move, fit the map to the results on fresh updates<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (hasAny &amp;&amp; !userInitiatedMove) {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-comment\">\/\/ If a single result, ensure a sensible zoom<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">if<\/span> (resultMarkers.length === <span class=\"hljs-number\">1<\/span>) {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      map.setCenter({ <span class=\"hljs-attr\">lat<\/span>: list&#91;<span class=\"hljs-number\">0<\/span>].lat, <span class=\"hljs-attr\">lng<\/span>: list&#91;<span class=\"hljs-number\">0<\/span>].lon });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      map.setZoom(<span class=\"hljs-built_in\">Math<\/span>.max(map.getZoom() || <span class=\"hljs-number\">11<\/span>, <span class=\"hljs-number\">13<\/span>));<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    } <span class=\"hljs-keyword\">else<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      map.fitBounds(bounds, <span class=\"hljs-number\">40<\/span>); <span class=\"hljs-comment\">\/\/ 40px padding<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">setUserLocationMarker<\/span>(<span class=\"hljs-params\">loc: LatLon | null<\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!map) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (userMarker) {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    userMarker.setMap(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    userMarker = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!loc) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  userMarker = <span class=\"hljs-keyword\">new<\/span> google.maps.Marker({<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">position<\/span>: { <span class=\"hljs-attr\">lat<\/span>: loc.lat, <span class=\"hljs-attr\">lng<\/span>: loc.lon },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    map,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">title<\/span>: <span class=\"hljs-string\">\"Your location\"<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">icon<\/span>: {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">path<\/span>: google.maps.SymbolPath.CIRCLE,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">scale<\/span>: <span class=\"hljs-number\">10<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">fillColor<\/span>: <span class=\"hljs-string\">\"#4285F4\"<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">fillOpacity<\/span>: <span class=\"hljs-number\">1<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">strokeColor<\/span>: <span class=\"hljs-string\">\"#FFFFFF\"<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">strokeWeight<\/span>: <span class=\"hljs-number\">3<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">const<\/span> emitBoundsChanged = debounce(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!map) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> b = map.getBounds();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!b) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> sw = b.getSouthWest();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> ne = b.getNorthEast();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  emit(<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-string\">\"boundsChanged\"<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    { <span class=\"hljs-attr\">swLat<\/span>: sw.lat(), <span class=\"hljs-attr\">swLon<\/span>: sw.lng(), <span class=\"hljs-attr\">neLat<\/span>: ne.lat(), <span class=\"hljs-attr\">neLon<\/span>: ne.lng() },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    userInitiatedMove<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  );<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  userInitiatedMove = <span class=\"hljs-literal\">false<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">}, <span class=\"hljs-number\">150<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">initMap<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">await<\/span> nextTick();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> el = mapDiv.value;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!el) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">await<\/span> loadGoogleMaps();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  map = <span class=\"hljs-keyword\">new<\/span> google.maps.Map(el, {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">center<\/span>: { <span class=\"hljs-attr\">lat<\/span>: center.value.lat, <span class=\"hljs-attr\">lng<\/span>: center.value.lon },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">zoom<\/span>: <span class=\"hljs-number\">11<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">mapTypeControl<\/span>: <span class=\"hljs-literal\">true<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">streetViewControl<\/span>: <span class=\"hljs-literal\">false<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-attr\">fullscreenControl<\/span>: <span class=\"hljs-literal\">true<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  clickListener = map.addListener(<span class=\"hljs-string\">\"click\"<\/span>, (e: google.maps.MapMouseEvent) =&gt; {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">if<\/span> (!e.latLng) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    emit(<span class=\"hljs-string\">\"mapClick\"<\/span>, { <span class=\"hljs-attr\">lat<\/span>: e.latLng.lat(), <span class=\"hljs-attr\">lon<\/span>: e.latLng.lng() });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  dragListener = map.addListener(<span class=\"hljs-string\">\"dragstart\"<\/span>, () =&gt; {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    userInitiatedMove = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  zoomListener = map.addListener(<span class=\"hljs-string\">\"zoom_changed\"<\/span>, () =&gt; {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    userInitiatedMove = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  idleListener = map.addListener(<span class=\"hljs-string\">\"idle\"<\/span>, emitBoundsChanged);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-comment\">\/\/ Initial render<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  setResultMarkers(markers.value);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  setUserLocationMarker(userLocation.value);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">onMounted(initMap);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">onBeforeUnmount(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (idleListener) idleListener.remove();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (dragListener) dragListener.remove();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (zoomListener) zoomListener.remove();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (clickListener) clickListener.remove();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  clearResultMarkers();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (userMarker) userMarker.setMap(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  map = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">});<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">watch(center, (c) =&gt; {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!map || !c) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  map.setCenter({ <span class=\"hljs-attr\">lat<\/span>: c.lat, <span class=\"hljs-attr\">lng<\/span>: c.lon });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">});<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">watch(<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  markers,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  (list) =&gt; {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    setResultMarkers(list);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  { <span class=\"hljs-attr\">deep<\/span>: <span class=\"hljs-literal\">true<\/span> }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">watch(userLocation, (loc) =&gt; {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  setUserLocationMarker(loc);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">});<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">script<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">template<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-attr\">ref<\/span>=<span class=\"hljs-string\">\"mapDiv\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"h-80 w-full rounded-xl border\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-attr\">role<\/span>=<span class=\"hljs-string\">\"region\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-attr\">aria-label<\/span>=<span class=\"hljs-string\">\"Results map\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">  \/&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-params\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">template<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-11\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>This client-side Vue component encapsulates all Google Maps rendering and interaction for the geo search page. It accepts three props\u2014<code>center <\/code>(the current lat\/lon to focus), <code>markers<\/code> (result points to plot), and an optional <code>userLocation<\/code>\u2014and emits two events: <code>boundsChanged<\/code> (with the current SW\/NE bounding box and whether the user moved the map) and <code>mapClick<\/code> (with the clicked lat\/lon).&nbsp;<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-12\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> props = defineProps&lt;{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-attr\">center<\/span>: LatLon; <span class=\"hljs-comment\">\/\/ { lat, lon }<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  markers: Marker&#91;]; <span class=\"hljs-comment\">\/\/ search results<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  userLocation: LatLon | <span class=\"hljs-literal\">null<\/span>; <span class=\"hljs-comment\">\/\/ optional blue dot<\/span>\n<\/span><\/span><span class='shcb-loc'><span>}&gt;();\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> emit = defineEmits&lt;{\n<\/span><\/span><span class='shcb-loc'><span>  (\n<\/span><\/span><span class='shcb-loc'><span>    e: <span class=\"hljs-string\">\"boundsChanged\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">bbox<\/span>: { <span class=\"hljs-attr\">swLat<\/span>: number; swLon: number; neLat: number; neLon: number },\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">userInitiated<\/span>: boolean\n<\/span><\/span><span class='shcb-loc'><span>  ): <span class=\"hljs-keyword\">void<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  (e: <span class=\"hljs-string\">\"mapClick\"<\/span>, <span class=\"hljs-attr\">location<\/span>: LatLon): <span class=\"hljs-keyword\">void<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>}&gt;();\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-12\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>On mount, it lazily loads the Google Maps JS SDK using the public API key from our Nuxt runtime config, then initializes a map centered on the provided center with UI controls enabled. A small debounced handler throttles the high-volume idle event so your app isn\u2019t spammed with bounds updates while the user pans\/zooms.&nbsp;<br><\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-13\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> { center, markers, userLocation } = toRefs(props);\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> mapDiv = ref&lt;HTMLDivElement | <span class=\"hljs-literal\">null<\/span>&gt;(<span class=\"hljs-literal\">null<\/span>);\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> config = useRuntimeConfig();\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> map: google.maps.Map | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> resultMarkers: google.maps.Marker&#91;] = &#91;];\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> userMarker: google.maps.Marker | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> userInitiatedMove = <span class=\"hljs-literal\">false<\/span>;\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> idleListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> dragListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> zoomListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">let<\/span> clickListener: google.maps.MapsEventListener | <span class=\"hljs-literal\">null<\/span> = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Simple debounce to quiet idle emissions *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">debounce<\/span>&lt;<span class=\"hljs-title\">T<\/span> <span class=\"hljs-title\">extends<\/span> (<span class=\"hljs-params\">...args: any&#91;]<\/span>) =&gt; <span class=\"hljs-title\">void<\/span>&gt;(<span class=\"hljs-params\">fn: T, ms = <span class=\"hljs-number\">150<\/span><\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">let<\/span> t: number | <span class=\"hljs-literal\">undefined<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-function\">(<span class=\"hljs-params\">...args: Parameters&lt;T&gt;<\/span>) =&gt;<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (t) <span class=\"hljs-built_in\">window<\/span>.clearTimeout(t);\n<\/span><\/span><span class='shcb-loc'><span>    t = <span class=\"hljs-built_in\">window<\/span>.setTimeout(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> fn(...args), ms);\n<\/span><\/span><span class='shcb-loc'><span>  };\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Load Google Maps JS once *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">loadGoogleMaps<\/span>(<span class=\"hljs-params\"><\/span>): <span class=\"hljs-title\">Promise<\/span>&lt;<span class=\"hljs-title\">void<\/span>&gt; <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-built_in\">Promise<\/span>(<span class=\"hljs-function\">(<span class=\"hljs-params\">resolve, reject<\/span>) =&gt;<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> ((globalThis <span class=\"hljs-keyword\">as<\/span> any).google?.maps) <span class=\"hljs-keyword\">return<\/span> resolve();\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> key = config.public.googleMapsApiKey;\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (!key) <span class=\"hljs-keyword\">return<\/span> reject(<span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-built_in\">Error<\/span>(<span class=\"hljs-string\">\"Missing GOOGLE_MAPS_API_KEY\"<\/span>));\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-13\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>The result markers are fully managed: existing pins are cleared before new ones are added, map bounds are fitted to the latest results, and a single-result case bumps the zoom to a useful level. A separate \u201cblue dot\u201d marker is maintained for <code>userLocation<\/code>, replacing the previous one whenever the prop changes.&nbsp;<\/p>\n\n\n\n<p>The component tracks whether the user moved the map (<code>userInitiatedMove<\/code>) by listening to dragstart and <code>zoom_changed<\/code>, and forwards that flag with <code>boundsChanged<\/code>.&nbsp;<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-14\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">clearResultMarkers<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">for<\/span> (<span class=\"hljs-keyword\">const<\/span> m <span class=\"hljs-keyword\">of<\/span> resultMarkers) m.setMap(<span class=\"hljs-literal\">null<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>  resultMarkers = &#91;];\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">setResultMarkers<\/span>(<span class=\"hljs-params\">list: Marker&#91;]<\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!map) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  clearResultMarkers();\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> bounds = <span class=\"hljs-keyword\">new<\/span> google.maps.LatLngBounds();\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">let<\/span> hasAny = <span class=\"hljs-literal\">false<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">for<\/span> (<span class=\"hljs-keyword\">const<\/span> m <span class=\"hljs-keyword\">of<\/span> list) {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (<span class=\"hljs-keyword\">typeof<\/span> m.lat !== <span class=\"hljs-string\">\"number\"<\/span> || <span class=\"hljs-keyword\">typeof<\/span> m.lon !== <span class=\"hljs-string\">\"number\"<\/span>) <span class=\"hljs-keyword\">continue<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> marker = <span class=\"hljs-keyword\">new<\/span> google.maps.Marker({\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">position<\/span>: { <span class=\"hljs-attr\">lat<\/span>: m.lat, <span class=\"hljs-attr\">lng<\/span>: m.lon },\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">title<\/span>: <span class=\"hljs-string\">\"Search result\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      map,\n<\/span><\/span><span class='shcb-loc'><span>    });\n<\/span><\/span><span class='shcb-loc'><span>    resultMarkers.push(marker);\n<\/span><\/span><span class='shcb-loc'><span>    bounds.extend(<span class=\"hljs-keyword\">new<\/span> google.maps.LatLng(m.lat, m.lon));\n<\/span><\/span><span class='shcb-loc'><span>    hasAny = <span class=\"hljs-literal\">true<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-comment\">\/\/ If no user-initiated move, fit the map to the results on fresh updates<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (hasAny &amp;&amp; !userInitiatedMove) {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ If a single result, ensure a sensible zoom<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (resultMarkers.length === <span class=\"hljs-number\">1<\/span>) {\n<\/span><\/span><span class='shcb-loc'><span>      map.setCenter({ <span class=\"hljs-attr\">lat<\/span>: list&#91;<span class=\"hljs-number\">0<\/span>].lat, <span class=\"hljs-attr\">lng<\/span>: list&#91;<span class=\"hljs-number\">0<\/span>].lon });\n<\/span><\/span><span class='shcb-loc'><span>      map.setZoom(<span class=\"hljs-built_in\">Math<\/span>.max(map.getZoom() || <span class=\"hljs-number\">11<\/span>, <span class=\"hljs-number\">13<\/span>));\n<\/span><\/span><span class='shcb-loc'><span>    } <span class=\"hljs-keyword\">else<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>      map.fitBounds(bounds, <span class=\"hljs-number\">40<\/span>); <span class=\"hljs-comment\">\/\/ 40px padding<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    }\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">setUserLocationMarker<\/span>(<span class=\"hljs-params\">loc: LatLon | null<\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!map) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (userMarker) {\n<\/span><\/span><span class='shcb-loc'><span>    userMarker.setMap(<span class=\"hljs-literal\">null<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>    userMarker = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!loc) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  userMarker = <span class=\"hljs-keyword\">new<\/span> google.maps.Marker({\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">position<\/span>: { <span class=\"hljs-attr\">lat<\/span>: loc.lat, <span class=\"hljs-attr\">lng<\/span>: loc.lon },\n<\/span><\/span><span class='shcb-loc'><span>    map,\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">title<\/span>: <span class=\"hljs-string\">\"Your location\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">icon<\/span>: {\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">path<\/span>: google.maps.SymbolPath.CIRCLE,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">scale<\/span>: <span class=\"hljs-number\">10<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">fillColor<\/span>: <span class=\"hljs-string\">\"#4285F4\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">fillOpacity<\/span>: <span class=\"hljs-number\">1<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">strokeColor<\/span>: <span class=\"hljs-string\">\"#FFFFFF\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">strokeWeight<\/span>: <span class=\"hljs-number\">3<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    },\n<\/span><\/span><span class='shcb-loc'><span>  });\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> emitBoundsChanged = debounce(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!map) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> b = map.getBounds();\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!b) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> sw = b.getSouthWest();\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> ne = b.getNorthEast();\n<\/span><\/span><span class='shcb-loc'><span>  emit(\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-string\">\"boundsChanged\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    { <span class=\"hljs-attr\">swLat<\/span>: sw.lat(), <span class=\"hljs-attr\">swLon<\/span>: sw.lng(), <span class=\"hljs-attr\">neLat<\/span>: ne.lat(), <span class=\"hljs-attr\">neLon<\/span>: ne.lng() },\n<\/span><\/span><span class='shcb-loc'><span>    userInitiatedMove\n<\/span><\/span><span class='shcb-loc'><span>  );\n<\/span><\/span><span class='shcb-loc'><span>  userInitiatedMove = <span class=\"hljs-literal\">false<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>}, <span class=\"hljs-number\">150<\/span>);\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-14\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>Clicks on the map surface emit precise coordinates so the parent can re-center and re-query. Prop watchers keep the map in sync with application state: updating the center recenters the map, updating the markers re-renders pins and optionally refits the viewport, and updating <code>userLocation<\/code> refreshes the blue dot.&nbsp;<br><\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-15\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">initMap<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">await<\/span> nextTick();\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> el = mapDiv.value;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!el) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">await<\/span> loadGoogleMaps();\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  map = <span class=\"hljs-keyword\">new<\/span> google.maps.Map(el, {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">center<\/span>: { <span class=\"hljs-attr\">lat<\/span>: center.value.lat, <span class=\"hljs-attr\">lng<\/span>: center.value.lon },\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">zoom<\/span>: <span class=\"hljs-number\">11<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">mapTypeControl<\/span>: <span class=\"hljs-literal\">true<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">streetViewControl<\/span>: <span class=\"hljs-literal\">false<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-attr\">fullscreenControl<\/span>: <span class=\"hljs-literal\">true<\/span>,  });\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  clickListener = map.addListener(<span class=\"hljs-string\">\"click\"<\/span>, (e: google.maps.MapMouseEvent) =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (!e.latLng) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>    emit(<span class=\"hljs-string\">\"mapClick\"<\/span>, { <span class=\"hljs-attr\">lat<\/span>: e.latLng.lat(), <span class=\"hljs-attr\">lon<\/span>: e.latLng.lng() });\n<\/span><\/span><span class='shcb-loc'><span>  });\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  dragListener = map.addListener(<span class=\"hljs-string\">\"dragstart\"<\/span>, () =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>    userInitiatedMove = <span class=\"hljs-literal\">true<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  });\n<\/span><\/span><span class='shcb-loc'><span>  zoomListener = map.addListener(<span class=\"hljs-string\">\"zoom_changed\"<\/span>, () =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>    userInitiatedMove = <span class=\"hljs-literal\">true<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  });\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  idleListener = map.addListener(<span class=\"hljs-string\">\"idle\"<\/span>, emitBoundsChanged);\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-15\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>Finally, it performs a cleanup on unmount by removing Google Maps listeners, clearing markers, and nulling references to prevent leaks. The template exposes a single, accessible container that your layout can size with Tailwind.<br><\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-16\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span>  \/\/ Initial render\n<\/span><\/span><span class='shcb-loc'><span>  setResultMarkers(markers.value);\n<\/span><\/span><span class='shcb-loc'><span>  setUserLocationMarker(userLocation.value);\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>onMounted(initMap);\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>onBeforeUnmount(() =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>  if (idleListener) idleListener.remove();\n<\/span><\/span><span class='shcb-loc'><span>  if (dragListener) dragListener.remove();\n<\/span><\/span><span class='shcb-loc'><span>  if (zoomListener) zoomListener.remove();\n<\/span><\/span><span class='shcb-loc'><span>  if (clickListener) clickListener.remove();\n<\/span><\/span><span class='shcb-loc'><span>  clearResultMarkers();\n<\/span><\/span><span class='shcb-loc'><span>  if (userMarker) userMarker.setMap(null);\n<\/span><\/span><span class='shcb-loc'><span>  map = null;\n<\/span><\/span><span class='shcb-loc'><span>});\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>watch(center, (c) =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>  if (!map || !c) return;\n<\/span><\/span><span class='shcb-loc'><span>  map.setCenter({ lat: c.lat, lng: c.lon });\n<\/span><\/span><span class='shcb-loc'><span>});\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>watch(\n<\/span><\/span><span class='shcb-loc'><span>  markers,\n<\/span><\/span><span class='shcb-loc'><span>  (list) =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>    setResultMarkers(list);\n<\/span><\/span><span class='shcb-loc'><span>  },\n<\/span><\/span><span class='shcb-loc'><span>  { deep: true }\n<\/span><\/span><span class='shcb-loc'><span>);\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>watch(userLocation, (loc) =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>  setUserLocationMarker(loc);\n<\/span><\/span><span class='shcb-loc'><span>});\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">script<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">template<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">    <span class=\"hljs-attr\">ref<\/span>=<span class=\"hljs-string\">\"mapDiv\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">    <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"h-80 w-full rounded-xl border\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">    <span class=\"hljs-attr\">role<\/span>=<span class=\"hljs-string\">\"region\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">    <span class=\"hljs-attr\">aria-label<\/span>=<span class=\"hljs-string\">\"Results map\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">  \/&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">template<\/span>&gt;<\/span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-16\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<h2 class=\"wp-block-heading\" id=\"feature-map-page\">Feature Map Page<\/h2>\n\n\n\n<p>We have one more file to go over before testing this out in the browser.&nbsp; It is the page that will render our map and filters.<\/p>\n\n\n\n<p><strong><em>Just a note: You can put the logic and state in this file into a separate file within a <\/em><\/strong><code>composables<\/code><strong><em> folder. This keeps the code cleaner and more reusable.&nbsp; Since this is just an example demo, I put it all in one file.<\/em><\/strong><\/p>\n\n\n\n<p>Head over to <code>pages\/geo-search.vue<\/code> :<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-17\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script<\/span> <span class=\"hljs-attr\">setup<\/span> <span class=\"hljs-attr\">lang<\/span>=<span class=\"hljs-string\">\"ts\"<\/span>&gt;<\/span><span class=\"javascript\"><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">import<\/span> { ref, computed, onMounted } <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">\"vue\"<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">import<\/span> { FIND_NEAR_CIRCLE, DEFAULT_INCLUDE_FIELDS } <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">\"~\/graphql\/queries\"<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">type LatLon = { <span class=\"hljs-attr\">lat<\/span>: number; lon: number };<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">type Doc = { <span class=\"hljs-attr\">id<\/span>: string; score?: number; sort?: string&#91;]; data: any };<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> query = ref(<span class=\"hljs-string\">\"\"<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> addressQuery = ref(<span class=\"hljs-string\">\"\"<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> miles = ref(<span class=\"hljs-number\">10<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> center = ref&lt;LatLon&gt;({ <span class=\"hljs-attr\">lat<\/span>: <span class=\"hljs-number\">30.2672<\/span>, <span class=\"hljs-attr\">lon<\/span>: <span class=\"hljs-number\">-97.7431<\/span> }); <span class=\"hljs-comment\">\/\/ Austin<\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> userLocation = ref&lt;LatLon | <span class=\"hljs-literal\">null<\/span>&gt;(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> docs = ref&lt;Doc&#91;]&gt;(&#91;]);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> total = ref(<span class=\"hljs-number\">0<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> cursor = ref&lt;string&#91;] | <span class=\"hljs-literal\">null<\/span>&gt;(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> loading = ref(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> geocoding = ref(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> hasSearched = ref(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> searchToken = <span class=\"hljs-number\">0<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-comment\">\/** Smart Search variables *\/<\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> maxDistance = computed(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> <span class=\"hljs-string\">`<span class=\"hljs-subst\">${miles.value}<\/span>mi`<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-keyword\">const<\/span> FILTER = <span class=\"hljs-string\">\"post_type:location\"<\/span>;<\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-comment\">\/** Normalize coordinates field that may be object or array *\/<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">normalizeCoordinates<\/span>(<span class=\"hljs-params\">raw: unknown<\/span>): <span class=\"hljs-title\">LatLon<\/span> | <span class=\"hljs-title\">null<\/span> <\/span>{<\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!raw) <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> v = <span class=\"hljs-built_in\">Array<\/span>.isArray(raw) ? raw&#91;<span class=\"hljs-number\">0<\/span>] : raw;<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">    v &amp;&amp;<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">typeof<\/span> v === <span class=\"hljs-string\">\"object\"<\/span> &amp;&amp;<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">typeof<\/span> (v <span class=\"hljs-keyword\">as<\/span> any).lat === <span class=\"hljs-string\">\"number\"<\/span> &amp;&amp;<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">typeof<\/span> (v <span class=\"hljs-keyword\">as<\/span> any).lon === <span class=\"hljs-string\">\"number\"<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  ) {<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> { lat, lon } = v <span class=\"hljs-keyword\">as<\/span> any;<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">return<\/span> { lat, lon };<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  }<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-comment\">\/** Resolve doc -&gt; LatLon for markers *\/<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">docCoordinates<\/span>(<span class=\"hljs-params\">d: Doc<\/span>): <span class=\"hljs-title\">LatLon<\/span> | <span class=\"hljs-title\">null<\/span> <\/span>{<\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-comment\">\/\/ Prefer top-level \"coordinates\" that Smart Search uses for geo filters<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">return<\/span> (<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">    normalizeCoordinates(d?.data?.coordinates) ??<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-comment\">\/\/ fallback if you still return nested shape (not required)<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">    normalizeCoordinates(d?.data?.locationDetails?.coordinates) ??<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-literal\">null<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">  );<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-comment\">\/** Markers for the map *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">const<\/span> markers = computed(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  docs.value<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    .map(docCoordinates)<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    .filter((c): c is LatLon =&gt; !!c)<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    .map(<span class=\"hljs-function\">(<span class=\"hljs-params\">c<\/span>) =&gt;<\/span> ({ <span class=\"hljs-attr\">lat<\/span>: c.lat, <span class=\"hljs-attr\">lon<\/span>: c.lon }))<\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-comment\">\/** Minimal API caller; bubbles GraphQL errors via \/api\/search handler *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">callSearch<\/span>(<span class=\"hljs-params\">body: any<\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> resp = <span class=\"hljs-keyword\">await<\/span> $fetch(<span class=\"hljs-string\">\"\/api\/search\"<\/span>, { <span class=\"hljs-attr\">method<\/span>: <span class=\"hljs-string\">\"POST\"<\/span>, body });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> ((resp <span class=\"hljs-keyword\">as<\/span> any)?.errors) <span class=\"hljs-keyword\">throw<\/span> <span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-built_in\">Error<\/span>(<span class=\"hljs-string\">\"Search returned errors\"<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">return<\/span> (resp <span class=\"hljs-keyword\">as<\/span> any)?.data?.find <span class=\"hljs-keyword\">as<\/span> { <span class=\"hljs-attr\">total<\/span>: number; documents: Doc&#91;] };<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-comment\">\/** Circle geo search (with cursor pagination) *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">runCircle<\/span>(<span class=\"hljs-params\">append = false<\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">const<\/span> token = ++searchToken;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!append) {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    docs.value = &#91;];<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    total.value = <span class=\"hljs-number\">0<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    cursor.value = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  loading.value = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  hasSearched.value = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">try<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> find = <span class=\"hljs-keyword\">await<\/span> callSearch({<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">query<\/span>: FIND_NEAR_CIRCLE,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-attr\">variables<\/span>: {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">query<\/span>: query.value || <span class=\"hljs-string\">\"*\"<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">centerLat<\/span>: center.value.lat,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">centerLon<\/span>: center.value.lon,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">maxDistance<\/span>: maxDistance.value, <span class=\"hljs-comment\">\/\/ Distance! scalar, e.g. \"10mi\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">limit<\/span>: <span class=\"hljs-number\">20<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">searchAfter<\/span>: append ? cursor.value : <span class=\"hljs-literal\">null<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">filter<\/span>: FILTER,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">includeFields<\/span>: &#91;...DEFAULT_INCLUDE_FIELDS],<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-comment\">\/\/ semantic optional; keep off by default unless configured server-side<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">semanticBias<\/span>: <span class=\"hljs-number\">0<\/span>,<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        <span class=\"hljs-attr\">semanticFields<\/span>: &#91;],<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    });<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">if<\/span> (token !== searchToken) <span class=\"hljs-keyword\">return<\/span>; <span class=\"hljs-comment\">\/\/ drop stale page<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-comment\">\/\/ Trust server geo filter; no client-side distance filter needed<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> page = <span class=\"hljs-function\">(<span class=\"hljs-params\">find?.documents ?? &#91;]<\/span>).<span class=\"hljs-params\">filter<\/span>(<span class=\"hljs-params\">(d<\/span>) =&gt;<\/span> docCoordinates(d));<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    docs.value = append ? &#91;...docs.value, ...page] : page;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    total.value = find?.total ?? docs.value.length;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    cursor.value = page.length ? page&#91;page.length - <span class=\"hljs-number\">1<\/span>]?.sort ?? <span class=\"hljs-literal\">null<\/span> : <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">  } <span class=\"hljs-keyword\">catch<\/span> (err) {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    alert(<span class=\"hljs-string\">`Search failed: <span class=\"hljs-subst\">${(err <span class=\"hljs-keyword\">as<\/span> <span class=\"hljs-built_in\">Error<\/span>).message || err}<\/span>`<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">  } <span class=\"hljs-keyword\">finally<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">    <span class=\"hljs-keyword\">if<\/span> (token === searchToken) loading.value = <span class=\"hljs-literal\">false<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">  }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-comment\">\/** BBox search: keep signature for MapView contract (optional to implement later) *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">runBBox<\/span>(<span class=\"hljs-params\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-params\">  _bbox: { swLat: number; swLon: number; neLat: number; neLon: number },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-params\">  _userInitiated: boolean<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-params\"><\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\">  <span class=\"hljs-comment\">\/\/ You can wire FIND_IN_BBOX here later if you want \"map bounds\" search.<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-comment\">\/** Geolocate user and search from there *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">useMyLocation<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!navigator.geolocation)<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">return<\/span> alert(<span class=\"hljs-string\">\"Geolocation is not supported by your browser\"<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\">  navigator.geolocation.getCurrentPosition(<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-function\">(<span class=\"hljs-params\">pos<\/span>) =&gt;<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-keyword\">const<\/span> loc = { <span class=\"hljs-attr\">lat<\/span>: pos.coords.latitude, <span class=\"hljs-attr\">lon<\/span>: pos.coords.longitude };<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      center.value = loc;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      userLocation.value = loc;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      docs.value = &#91;];<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      total.value = <span class=\"hljs-number\">0<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      cursor.value = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      runCircle(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">    (err) =&gt; {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      loading.value = <span class=\"hljs-literal\">false<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-keyword\">if<\/span> (err.code === <span class=\"hljs-number\">1<\/span>)<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        alert(<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">          <span class=\"hljs-string\">\"Location access was denied. Allow location access and try again.\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        );<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-keyword\">else<\/span> <span class=\"hljs-keyword\">if<\/span> (err.code === <span class=\"hljs-number\">2<\/span>)<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        alert(<span class=\"hljs-string\">\"Unable to determine your location. Please try again.\"<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-keyword\">else<\/span> <span class=\"hljs-keyword\">if<\/span> (err.code === <span class=\"hljs-number\">3<\/span>)<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">        alert(<span class=\"hljs-string\">\"Location request timed out. Please try again.\"<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-keyword\">else<\/span> alert(<span class=\"hljs-string\">`Error getting location: <span class=\"hljs-subst\">${err.message}<\/span>`<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    },<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    { <span class=\"hljs-attr\">enableHighAccuracy<\/span>: <span class=\"hljs-literal\">true<\/span>, <span class=\"hljs-attr\">timeout<\/span>: <span class=\"hljs-number\">15000<\/span>, <span class=\"hljs-attr\">maximumAge<\/span>: <span class=\"hljs-number\">0<\/span> }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">  );<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-comment\">\/** Map click: set center &amp; search *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">handleMapClick<\/span>(<span class=\"hljs-params\">loc: LatLon<\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  center.value = loc;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  userLocation.value = loc;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  docs.value = &#91;];<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  total.value = <span class=\"hljs-number\">0<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  cursor.value = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  runCircle(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-comment\">\/** Address \u2192 center via Google Geocoding *\/<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">searchAddress<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">if<\/span> (!addressQuery.value.trim()) <span class=\"hljs-keyword\">return<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">  geocoding.value = <span class=\"hljs-literal\">true<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">  <span class=\"hljs-keyword\">try<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> config = useRuntimeConfig();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">    <span class=\"hljs-keyword\">const<\/span> res = <span class=\"hljs-keyword\">await<\/span> fetch(<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\">      <span class=\"hljs-string\">`https:\/\/maps.googleapis.com\/maps\/api\/geocode\/json?address=<span class=\"hljs-subst\">${<span class=\"hljs-built_in\">encodeURIComponent<\/span>(<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">        addressQuery.value<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\">      )}<\/span>&amp;key=<span class=\"hljs-subst\">${config.public.googleMapsApiKey}<\/span>`<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    );<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    <span class=\"hljs-keyword\">const<\/span> data = <span class=\"hljs-keyword\">await<\/span> res.json();<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    <span class=\"hljs-keyword\">const<\/span> first = data?.results?.&#91;<span class=\"hljs-number\">0<\/span>];<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    <span class=\"hljs-keyword\">if<\/span> (!first) <span class=\"hljs-keyword\">return<\/span> alert(<span class=\"hljs-string\">\"Address not found. Try a different address.\"<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    <span class=\"hljs-keyword\">const<\/span> { lat, lng } = first.geometry.location;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    center.value = { lat, <span class=\"hljs-attr\">lon<\/span>: lng };<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    userLocation.value = { lat, <span class=\"hljs-attr\">lon<\/span>: lng };<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    runCircle(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">  } <span class=\"hljs-keyword\">catch<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    alert(<span class=\"hljs-string\">\"Failed to geocode address. Please try again.\"<\/span>);<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">  } <span class=\"hljs-keyword\">finally<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">    geocoding.value = <span class=\"hljs-literal\">false<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">  }<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\">onMounted(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> {<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  docs.value = &#91;];<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  total.value = <span class=\"hljs-number\">0<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">  cursor.value = <span class=\"hljs-literal\">null<\/span>;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\">});<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">script<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">template<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">main<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"mx-auto max-w-6xl p-6 space-y-6\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h1<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-2xl font-semibold\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">      Geo Filter Smart Search AI Demo with Nuxt.js<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h1<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"grid grid-cols-1 lg:grid-cols-&#91;360px_1fr] gap-6\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">      <span class=\"hljs-comment\">&lt;!-- Controls --&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">      <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">aside<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-4\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-2\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-sm font-medium\"<\/span>&gt;<\/span>Search query<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">input<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">v-model<\/span>=<span class=\"hljs-string\">\"query\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full rounded-xl border px-3 py-2\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\">\"bbq joints, events\u2026\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          \/&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"flex gap-2\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-2\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"runCircle(false)\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            &gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              Search<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-2\"<\/span> @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"useMyLocation\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              Use my location<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-2\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-sm font-medium\"<\/span>&gt;<\/span>Search by address<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">input<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">v-model<\/span>=<span class=\"hljs-string\">\"addressQuery\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full rounded-xl border px-3 py-2\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\">\"123 Main St, Austin, TX\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">keyup.enter<\/span>=<span class=\"hljs-string\">\"searchAddress\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          \/&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full rounded-lg border px-3 py-2\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"searchAddress\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">:disabled<\/span>=<span class=\"hljs-string\">\"geocoding || !addressQuery.trim()\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          &gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            {{ geocoding ? \"Searching...\" : \"Search Address\" }}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-xs text-gray-500\"<\/span>&gt;<\/span>Or click anywhere on the map<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-1\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"block text-sm font-medium\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            &gt;<\/span>Radius: {{ miles }} mi<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          &gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">input<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">type<\/span>=<span class=\"hljs-string\">\"range\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">min<\/span>=<span class=\"hljs-string\">\"1\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">max<\/span>=<span class=\"hljs-string\">\"50\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">step<\/span>=<span class=\"hljs-string\">\"1\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">v-model<\/span>=<span class=\"hljs-string\">\"miles\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">change<\/span>=<span class=\"hljs-string\">\"runCircle(false)\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          \/&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">      <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">aside<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">      <span class=\"hljs-comment\">&lt;!-- Map + Results --&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">      <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">section<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-4\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">MapView<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-attr\">:center<\/span>=<span class=\"hljs-string\">\"{ lon: center.lon, lat: center.lat }\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-attr\">:markers<\/span>=<span class=\"hljs-string\">\"markers\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-attr\">:userLocation<\/span>=<span class=\"hljs-string\">\"userLocation\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          @<span class=\"hljs-attr\">boundsChanged<\/span>=<span class=\"hljs-string\">\"runBBox\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          @<span class=\"hljs-attr\">mapClick<\/span>=<span class=\"hljs-string\">\"handleMapClick\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        \/&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"flex items-center gap-3 text-sm text-gray-600\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">span<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-1\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            {{<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              loading ? \"Loading\u2026\" : `${total} result${total === 1 ? \"\" : \"s\"}`<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            }}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">span<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-2\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"runCircle(true)\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-attr\">:disabled<\/span>=<span class=\"hljs-string\">\"loading || !cursor\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          &gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            Load more<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">ul<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-xl border divide-y\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">li<\/span> <span class=\"hljs-attr\">v-for<\/span>=<span class=\"hljs-string\">\"d in docs\"<\/span> <span class=\"hljs-attr\">:key<\/span>=<span class=\"hljs-string\">\"d.id\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"p-3\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">a<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              <span class=\"hljs-attr\">:href<\/span>=<span class=\"hljs-string\">\"d?.data?.post_url || d?.data?.permalink || '#'\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              <span class=\"hljs-attr\">target<\/span>=<span class=\"hljs-string\">\"_blank\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"font-medium hover:underline\"<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            &gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              {{ d?.data?.post_title || \"Untitled\" }}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">a<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-sm\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              {{ d?.data?.address || d?.data?.locationDetails?.address || \"\" }}<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">v-if<\/span>=<span class=\"hljs-string\">\"docCoordinates(d)\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-xs text-gray-500\"<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">              ({{ docCoordinates(d)?.lat }}, {{ docCoordinates(d)?.lon }})<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">li<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">ul<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">      <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">section<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">    <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">  <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">main<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-subst\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-function\"><span class=\"hljs-function\"><span class=\"hljs-string\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\"><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">template<\/span>&gt;<\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span><\/span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-17\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>This page implements a geo-aware search UI that talks to your<code> \/api\/search<\/code> GraphQL proxy and renders results on a map. It tracks user inputs (text query, address, miles radius) plus map state (center, user location, pagination cursor, loading flags) with Vue refs.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-18\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">script<\/span> <span class=\"hljs-attr\">setup<\/span> <span class=\"hljs-attr\">lang<\/span>=<span class=\"hljs-string\">\"ts\"<\/span>&gt;<\/span><span class=\"javascript\"><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">import<\/span> { ref, computed, onMounted } <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">\"vue\"<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">import<\/span> { FIND_NEAR_CIRCLE, DEFAULT_INCLUDE_FIELDS } <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">\"~\/graphql\/queries\"<\/span>;<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">type LatLon = { <span class=\"hljs-attr\">lat<\/span>: number; lon: number };<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\">type Doc = { <span class=\"hljs-attr\">id<\/span>: string; score?: number; sort?: string&#91;]; data: any };<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> query = ref(<span class=\"hljs-string\">\"\"<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> addressQuery = ref(<span class=\"hljs-string\">\"\"<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> miles = ref(<span class=\"hljs-number\">10<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> center = ref&lt;LatLon&gt;({ <span class=\"hljs-attr\">lat<\/span>: <span class=\"hljs-number\">30.2672<\/span>, <span class=\"hljs-attr\">lon<\/span>: <span class=\"hljs-number\">-97.7431<\/span> }); <span class=\"hljs-comment\">\/\/ Austin<\/span><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> userLocation = ref&lt;LatLon | <span class=\"hljs-literal\">null<\/span>&gt;(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> docs = ref&lt;Doc&#91;]&gt;(&#91;]);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> total = ref(<span class=\"hljs-number\">0<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> cursor = ref&lt;string&#91;] | <span class=\"hljs-literal\">null<\/span>&gt;(<span class=\"hljs-literal\">null<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> loading = ref(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> geocoding = ref(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">const<\/span> hasSearched = ref(<span class=\"hljs-literal\">false<\/span>);<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\"><span class=\"javascript\"><span class=\"hljs-keyword\">let<\/span> searchToken = <span class=\"hljs-number\">0<\/span>;<\/span><\/span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-18\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>A computed <code>maxDistance<\/code> converts the slider to the <code>Distance!<\/code> scalar (e.g., &#8220;10mi&#8221;), and a constant filter scopes results to the location post type. Results from Smart Search are normalized so each document reliably yields a <code>{ lat, lon } <\/code>pair for map markers, regardless of whether coordinates arrives as an object or array.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-19\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Smart Search variables *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> maxDistance = computed(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> <span class=\"hljs-string\">`<span class=\"hljs-subst\">${miles.value}<\/span>mi`<\/span>);\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> FILTER = <span class=\"hljs-string\">\"post_type:location\"<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Normalize coordinates field that may be object or array *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">normalizeCoordinates<\/span>(<span class=\"hljs-params\">raw: unknown<\/span>): <span class=\"hljs-title\">LatLon<\/span> | <span class=\"hljs-title\">null<\/span> <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!raw) <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> v = <span class=\"hljs-built_in\">Array<\/span>.isArray(raw) ? raw&#91;<span class=\"hljs-number\">0<\/span>] : raw;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (\n<\/span><\/span><span class='shcb-loc'><span>    v &amp;&amp;\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">typeof<\/span> v === <span class=\"hljs-string\">\"object\"<\/span> &amp;&amp;\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">typeof<\/span> (v <span class=\"hljs-keyword\">as<\/span> any).lat === <span class=\"hljs-string\">\"number\"<\/span> &amp;&amp;\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">typeof<\/span> (v <span class=\"hljs-keyword\">as<\/span> any).lon === <span class=\"hljs-string\">\"number\"<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  ) {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> { lat, lon } = v <span class=\"hljs-keyword\">as<\/span> any;\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">return<\/span> { lat, lon };\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Resolve doc -&gt; LatLon for markers *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">docCoordinates<\/span>(<span class=\"hljs-params\">d: Doc<\/span>): <span class=\"hljs-title\">LatLon<\/span> | <span class=\"hljs-title\">null<\/span> <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-comment\">\/\/ Prefer top-level \"coordinates\" that Smart Search uses for geo filters<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">return<\/span> (\n<\/span><\/span><span class='shcb-loc'><span>    normalizeCoordinates(d?.data?.coordinates) ??\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ fallback if you still return nested shape (not required)<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    normalizeCoordinates(d?.data?.locationDetails?.coordinates) ??\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-literal\">null<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  );\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Markers for the map *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">const<\/span> markers = computed(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  docs.value\n<\/span><\/span><span class='shcb-loc'><span>    .map(docCoordinates)\n<\/span><\/span><span class='shcb-loc'><span>    .filter((c): c is LatLon =&gt; !!c)\n<\/span><\/span><span class='shcb-loc'><span>    .map(<span class=\"hljs-function\">(<span class=\"hljs-params\">c<\/span>) =&gt;<\/span> ({ <span class=\"hljs-attr\">lat<\/span>: c.lat, <span class=\"hljs-attr\">lon<\/span>: c.lon }))\n<\/span><\/span><span class='shcb-loc'><span>);\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-19\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><\/p>\n\n\n\n<p>The <code>runCircle<\/code> action performs the main \u201cnear me\u201d search with cursor pagination, deduplicates stale responses via a rolling token, and updates totals, docs, and next-page cursors. Users can set the center by clicking the map, using browser geolocation, or geocoding a typed address with Google\u2019s API; each path recenters the map and triggers a fresh search.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-20\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Minimal API caller; bubbles GraphQL errors via \/api\/search handler *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">callSearch<\/span>(<span class=\"hljs-params\">body: any<\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> resp = <span class=\"hljs-keyword\">await<\/span> $fetch(<span class=\"hljs-string\">\"\/api\/search\"<\/span>, { <span class=\"hljs-attr\">method<\/span>: <span class=\"hljs-string\">\"POST\"<\/span>, body });\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> ((resp <span class=\"hljs-keyword\">as<\/span> any)?.errors) <span class=\"hljs-keyword\">throw<\/span> <span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-built_in\">Error<\/span>(<span class=\"hljs-string\">\"Search returned errors\"<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">return<\/span> (resp <span class=\"hljs-keyword\">as<\/span> any)?.data?.find <span class=\"hljs-keyword\">as<\/span> { <span class=\"hljs-attr\">total<\/span>: number; documents: Doc&#91;] };\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Circle geo search (with cursor pagination) *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">runCircle<\/span>(<span class=\"hljs-params\">append = false<\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">const<\/span> token = ++searchToken;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!append) {\n<\/span><\/span><span class='shcb-loc'><span>    docs.value = &#91;];\n<\/span><\/span><span class='shcb-loc'><span>    total.value = <span class=\"hljs-number\">0<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>    cursor.value = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>  loading.value = <span class=\"hljs-literal\">true<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  hasSearched.value = <span class=\"hljs-literal\">true<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">try<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> find = <span class=\"hljs-keyword\">await<\/span> callSearch({\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">query<\/span>: FIND_NEAR_CIRCLE,\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-attr\">variables<\/span>: {\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">query<\/span>: query.value || <span class=\"hljs-string\">\"*\"<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">centerLat<\/span>: center.value.lat,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">centerLon<\/span>: center.value.lon,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">maxDistance<\/span>: maxDistance.value, <span class=\"hljs-comment\">\/\/ Distance! scalar, e.g. \"10mi\"<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">limit<\/span>: <span class=\"hljs-number\">20<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">searchAfter<\/span>: append ? cursor.value : <span class=\"hljs-literal\">null<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">filter<\/span>: FILTER,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">includeFields<\/span>: &#91;...DEFAULT_INCLUDE_FIELDS],\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-comment\">\/\/ semantic optional; keep off by default unless configured server-side<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">semanticBias<\/span>: <span class=\"hljs-number\">0<\/span>,\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-attr\">semanticFields<\/span>: &#91;],\n<\/span><\/span><span class='shcb-loc'><span>      },\n<\/span><\/span><span class='shcb-loc'><span>    });\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (token !== searchToken) <span class=\"hljs-keyword\">return<\/span>; <span class=\"hljs-comment\">\/\/ drop stale page<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-comment\">\/\/ Trust server geo filter; no client-side distance filter needed<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> page = <span class=\"hljs-function\">(<span class=\"hljs-params\">find?.documents ?? &#91;]<\/span>).<span class=\"hljs-params\">filter<\/span>(<span class=\"hljs-params\">(d<\/span>) =&gt;<\/span> docCoordinates(d));\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    docs.value = append ? &#91;...docs.value, ...page] : page;\n<\/span><\/span><span class='shcb-loc'><span>    total.value = find?.total ?? docs.value.length;\n<\/span><\/span><span class='shcb-loc'><span>    cursor.value = page.length ? page&#91;page.length - <span class=\"hljs-number\">1<\/span>]?.sort ?? <span class=\"hljs-literal\">null<\/span> : <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  } <span class=\"hljs-keyword\">catch<\/span> (err) {\n<\/span><\/span><span class='shcb-loc'><span>    alert(<span class=\"hljs-string\">`Search failed: <span class=\"hljs-subst\">${(err <span class=\"hljs-keyword\">as<\/span> <span class=\"hljs-built_in\">Error<\/span>).message || err}<\/span>`<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>  } <span class=\"hljs-keyword\">finally<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (token === searchToken) loading.value = <span class=\"hljs-literal\">false<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** BBox search: keep signature for MapView contract (optional to implement later) *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">runBBox<\/span>(<span class=\"hljs-params\"><\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-params\">  _bbox: { swLat: number; swLon: number; neLat: number; neLon: number },<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-params\">  _userInitiated: boolean<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-params\"><\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-comment\">\/\/ You can wire FIND_IN_BBOX here later if you want \"map bounds\" search.<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Geolocate user and search from there *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">useMyLocation<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!navigator.geolocation)\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">return<\/span> alert(<span class=\"hljs-string\">\"Geolocation is not supported by your browser\"<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>  navigator.geolocation.getCurrentPosition(\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-function\">(<span class=\"hljs-params\">pos<\/span>) =&gt;<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-keyword\">const<\/span> loc = { <span class=\"hljs-attr\">lat<\/span>: pos.coords.latitude, <span class=\"hljs-attr\">lon<\/span>: pos.coords.longitude };\n<\/span><\/span><span class='shcb-loc'><span>      center.value = loc;\n<\/span><\/span><span class='shcb-loc'><span>      userLocation.value = loc;\n<\/span><\/span><span class='shcb-loc'><span>      docs.value = &#91;];\n<\/span><\/span><span class='shcb-loc'><span>      total.value = <span class=\"hljs-number\">0<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>      cursor.value = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>      runCircle(<span class=\"hljs-literal\">false<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>    },\n<\/span><\/span><span class='shcb-loc'><span>    (err) =&gt; {\n<\/span><\/span><span class='shcb-loc'><span>      loading.value = <span class=\"hljs-literal\">false<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-keyword\">if<\/span> (err.code === <span class=\"hljs-number\">1<\/span>)\n<\/span><\/span><span class='shcb-loc'><span>        alert(\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-string\">\"Location access was denied. Allow location access and try again.\"<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        );\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-keyword\">else<\/span> <span class=\"hljs-keyword\">if<\/span> (err.code === <span class=\"hljs-number\">2<\/span>)\n<\/span><\/span><span class='shcb-loc'><span>        alert(<span class=\"hljs-string\">\"Unable to determine your location. Please try again.\"<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-keyword\">else<\/span> <span class=\"hljs-keyword\">if<\/span> (err.code === <span class=\"hljs-number\">3<\/span>)\n<\/span><\/span><span class='shcb-loc'><span>        alert(<span class=\"hljs-string\">\"Location request timed out. Please try again.\"<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-keyword\">else<\/span> alert(<span class=\"hljs-string\">`Error getting location: <span class=\"hljs-subst\">${err.message}<\/span>`<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>    },\n<\/span><\/span><span class='shcb-loc'><span>    { <span class=\"hljs-attr\">enableHighAccuracy<\/span>: <span class=\"hljs-literal\">true<\/span>, <span class=\"hljs-attr\">timeout<\/span>: <span class=\"hljs-number\">15000<\/span>, <span class=\"hljs-attr\">maximumAge<\/span>: <span class=\"hljs-number\">0<\/span> }\n<\/span><\/span><span class='shcb-loc'><span>  );\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Map click: set center &amp; search *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">handleMapClick<\/span>(<span class=\"hljs-params\">loc: LatLon<\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  center.value = loc;\n<\/span><\/span><span class='shcb-loc'><span>  userLocation.value = loc;\n<\/span><\/span><span class='shcb-loc'><span>  docs.value = &#91;];\n<\/span><\/span><span class='shcb-loc'><span>  total.value = <span class=\"hljs-number\">0<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  cursor.value = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  runCircle(<span class=\"hljs-literal\">false<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-comment\">\/** Address \u2192 center via Google Geocoding *\/<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-keyword\">async<\/span> <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span> <span class=\"hljs-title\">searchAddress<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">if<\/span> (!addressQuery.value.trim()) <span class=\"hljs-keyword\">return<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  geocoding.value = <span class=\"hljs-literal\">true<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-keyword\">try<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> config = useRuntimeConfig();\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> res = <span class=\"hljs-keyword\">await<\/span> fetch(\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-string\">`https:\/\/maps.googleapis.com\/maps\/api\/geocode\/json?address=<span class=\"hljs-subst\">${<span class=\"hljs-built_in\">encodeURIComponent<\/span>(<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\"><span class=\"hljs-subst\">        addressQuery.value<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-string\"><span class=\"hljs-subst\">      )}<\/span>&amp;key=<span class=\"hljs-subst\">${config.public.googleMapsApiKey}<\/span>`<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    );\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> data = <span class=\"hljs-keyword\">await<\/span> res.json();\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> first = data?.results?.&#91;<span class=\"hljs-number\">0<\/span>];\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">if<\/span> (!first) <span class=\"hljs-keyword\">return<\/span> alert(<span class=\"hljs-string\">\"Address not found. Try a different address.\"<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-keyword\">const<\/span> { lat, lng } = first.geometry.location;\n<\/span><\/span><span class='shcb-loc'><span>    center.value = { lat, <span class=\"hljs-attr\">lon<\/span>: lng };\n<\/span><\/span><span class='shcb-loc'><span>    userLocation.value = { lat, <span class=\"hljs-attr\">lon<\/span>: lng };\n<\/span><\/span><span class='shcb-loc'><span>    runCircle(<span class=\"hljs-literal\">false<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>  } <span class=\"hljs-keyword\">catch<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    alert(<span class=\"hljs-string\">\"Failed to geocode address. Please try again.\"<\/span>);\n<\/span><\/span><span class='shcb-loc'><span>  } <span class=\"hljs-keyword\">finally<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>    geocoding.value = <span class=\"hljs-literal\">false<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  }\n<\/span><\/span><span class='shcb-loc'><span>}\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>onMounted(<span class=\"hljs-function\"><span class=\"hljs-params\">()<\/span> =&gt;<\/span> {\n<\/span><\/span><span class='shcb-loc'><span>  docs.value = &#91;];\n<\/span><\/span><span class='shcb-loc'><span>  total.value = <span class=\"hljs-number\">0<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>  cursor.value = <span class=\"hljs-literal\">null<\/span>;\n<\/span><\/span><span class='shcb-loc'><span>});\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-20\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>The template wires these behaviors into a simple Tailwind layout with inputs, a distance slider, a <code>MapView<\/code> component for visualization, and a paginated results list that links to each item\u2019s URL.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-21\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-code-table shcb-line-numbers\"><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">template<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">main<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"mx-auto max-w-6xl p-6 space-y-6\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h1<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-2xl font-semibold\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>      Geo Filter Smart Search AI Demo with Nuxt.js\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h1<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"grid grid-cols-1 lg:grid-cols-&#91;360px_1fr] gap-6\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-comment\">&lt;!-- Controls --&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">aside<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-4\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-2\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-sm font-medium\"<\/span>&gt;<\/span>Search query<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">input<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">v-model<\/span>=<span class=\"hljs-string\">\"query\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full rounded-xl border px-3 py-2\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\">\"bbq joints, events\u2026\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          \/&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"flex gap-2\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">              <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-2\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">              @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"runCircle(false)\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            &gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>              Search\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-2\"<\/span> @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"useMyLocation\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>              Use my location\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-2\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-sm font-medium\"<\/span>&gt;<\/span>Search by address<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">input<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">v-model<\/span>=<span class=\"hljs-string\">\"addressQuery\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full rounded-xl border px-3 py-2\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\">\"123 Main St, Austin, TX\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">keyup.enter<\/span>=<span class=\"hljs-string\">\"searchAddress\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          \/&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full rounded-lg border px-3 py-2\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"searchAddress\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">:disabled<\/span>=<span class=\"hljs-string\">\"geocoding || !addressQuery.trim()\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          &gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            {{ geocoding ? \"Searching...\" : \"Search Address\" }}\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-xs text-gray-500\"<\/span>&gt;<\/span>Or click anywhere on the map<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-1\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"block text-sm font-medium\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            &gt;<\/span>Radius: {{ miles }} mi<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          &gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">input<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">type<\/span>=<span class=\"hljs-string\">\"range\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">min<\/span>=<span class=\"hljs-string\">\"1\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">max<\/span>=<span class=\"hljs-string\">\"50\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">step<\/span>=<span class=\"hljs-string\">\"1\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">v-model<\/span>=<span class=\"hljs-string\">\"miles\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"w-full\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">change<\/span>=<span class=\"hljs-string\">\"runCircle(false)\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          \/&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">aside<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-comment\">&lt;!-- Map + Results --&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">section<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"space-y-4\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">MapView<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          <span class=\"hljs-attr\">:center<\/span>=<span class=\"hljs-string\">\"{ lon: center.lon, lat: center.lat }\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          <span class=\"hljs-attr\">:markers<\/span>=<span class=\"hljs-string\">\"markers\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          <span class=\"hljs-attr\">:userLocation<\/span>=<span class=\"hljs-string\">\"userLocation\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          @<span class=\"hljs-attr\">boundsChanged<\/span>=<span class=\"hljs-string\">\"runBBox\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          @<span class=\"hljs-attr\">mapClick<\/span>=<span class=\"hljs-string\">\"handleMapClick\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">        \/&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"flex items-center gap-3 text-sm text-gray-600\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">span<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-1\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            {{\n<\/span><\/span><span class='shcb-loc'><span>              loading ? \"Loading\u2026\" : `${total} result${total === 1 ? \"\" : \"s\"}`\n<\/span><\/span><span class='shcb-loc'><span>            }}\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">span<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-lg border px-3 py-2\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            @<span class=\"hljs-attr\">click<\/span>=<span class=\"hljs-string\">\"runCircle(true)\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            <span class=\"hljs-attr\">:disabled<\/span>=<span class=\"hljs-string\">\"loading || !cursor\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">          &gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            Load more\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">ul<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"rounded-xl border divide-y\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">li<\/span> <span class=\"hljs-attr\">v-for<\/span>=<span class=\"hljs-string\">\"d in docs\"<\/span> <span class=\"hljs-attr\">:key<\/span>=<span class=\"hljs-string\">\"d.id\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"p-3\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">a<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">              <span class=\"hljs-attr\">:href<\/span>=<span class=\"hljs-string\">\"d?.data?.post_url || d?.data?.permalink || '#'\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">              <span class=\"hljs-attr\">target<\/span>=<span class=\"hljs-string\">\"_blank\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">              <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"font-medium hover:underline\"<\/span><\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">            &gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>              {{ d?.data?.post_title || \"Untitled\" }}\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">a<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-sm\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>              {{ d?.data?.address || d?.data?.locationDetails?.address || \"\" }}\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">v-if<\/span>=<span class=\"hljs-string\">\"docCoordinates(d)\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"text-xs text-gray-500\"<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>              ({{ docCoordinates(d)?.lat }}, {{ docCoordinates(d)?.lon }})\n<\/span><\/span><span class='shcb-loc'><span>            <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>          <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">li<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">ul<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>      <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">section<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>    <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span>  <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">main<\/span>&gt;<\/span>\n<\/span><\/span><span class='shcb-loc'><span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">template<\/span>&gt;<\/span>\n<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-21\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>Stoked!!! We are now ready to try the map!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"test-the-map\">Test The Map<\/h2>\n\n\n\n<p><br>Navigate to your terminal.&nbsp; Do not forget to run <code>npm run install<\/code>.&nbsp; Then run <code>npm run dev<\/code>.&nbsp; You should see this in all its glory:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1920\" height=\"1080\" src=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/geofilterssai.gif\" alt=\"\" class=\"wp-image-32049\"\/><\/figure>\n\n\n\n<p><br><\/p>\n\n\n\n<p><br><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"conclusion\">Conclusion<\/h2>\n\n\n\n<p>This project demonstrates the combination of headless architecture, Nuxt.js, and Smart Search AI, proving that map functionality combined with AI is the way for users to find locations using natural language. <\/p>\n\n\n\n<p>We\u2019d love to hear what you build with this\u2014drop into the <a href=\"https:\/\/wpeng.in\/devrel-discord\/\">Headless WordPress Discord <\/a>and share your projects or feedback.&nbsp; Happy Coding!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Building an intelligent, location-aware search experience can be very complex\u2014it requires wrangling coordinates from the CMS, securing API keys, and stitching together server-side search logic with a responsive frontend map. [&hellip;]<\/p>\n","protected":false},"author":20,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_EventAllDay":false,"_EventTimezone":"","_EventStartDate":"","_EventEndDate":"","_EventStartDateUTC":"","_EventEndDateUTC":"","_EventShowMap":false,"_EventShowMapLink":false,"_EventURL":"","_EventCost":"","_EventCostDescription":"","_EventCurrencySymbol":"","_EventCurrencyCode":"","_EventCurrencyPosition":"","_EventDateTimeSeparator":"","_EventTimeRangeSeparator":"","_EventOrganizerID":[],"_EventVenueID":[],"_OrganizerEmail":"","_OrganizerPhone":"","_OrganizerWebsite":"","_VenueAddress":"","_VenueCity":"","_VenueCountry":"","_VenueProvince":"","_VenueState":"","_VenueZip":"","_VenuePhone":"","_VenueURL":"","_VenueStateProvince":"","_VenueLat":"","_VenueLng":"","_VenueShowMap":false,"_VenueShowMapLink":false,"footnotes":""},"categories":[23],"tags":[],"class_list":["post-32038","post","type-post","status-publish","format-standard","hentry","category-headless"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js - Builders<\/title>\n<meta name=\"description\" content=\"Use geolocation search in your headless WordPress site with Nuxt, ACF, and WP Engine Smart Search AI\u2014covering schema, queries, and a clean map UI\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Use Geo-Aware Search with Nuxt.js, ACF &amp; Smart Search AI\" \/>\n<meta property=\"og:description\" content=\"Use location-based results to headless WordPress using WP Engine Smart Search AI, Nuxt, and ACF\u2014schema, indexing, and an interactive map UI.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/\" \/>\n<meta property=\"og:site_name\" content=\"Builders\" \/>\n<meta property=\"article:published_time\" content=\"2025-12-12T17:27:41+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-14T23:53:51+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/ssai-geofilter-api.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Francis Agulto\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@wpebuilders\" \/>\n<meta name=\"twitter:site\" content=\"@wpebuilders\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Francis Agulto\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"36 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/\"},\"author\":{\"name\":\"Francis Agulto\",\"@id\":\"https:\/\/wpengine.com\/builders\/#\/schema\/person\/bcdcb4ac0b215c34b6b30e440a24dc54\"},\"headline\":\"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js\",\"datePublished\":\"2025-12-12T17:27:41+00:00\",\"dateModified\":\"2026-01-14T23:53:51+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/\"},\"wordCount\":2282,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/wpengine.com\/builders\/#organization\"},\"image\":{\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1024x547.png\",\"articleSection\":[\"Headless\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/\",\"url\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/\",\"name\":\"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js - Builders\",\"isPartOf\":{\"@id\":\"https:\/\/wpengine.com\/builders\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1024x547.png\",\"datePublished\":\"2025-12-12T17:27:41+00:00\",\"dateModified\":\"2026-01-14T23:53:51+00:00\",\"description\":\"Use geolocation search in your headless WordPress site with Nuxt, ACF, and WP Engine Smart Search AI\u2014covering schema, queries, and a clean map UI\",\"breadcrumb\":{\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage\",\"url\":\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image.png\",\"contentUrl\":\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image.png\",\"width\":1600,\"height\":855},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/wpengine.com\/builders\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/wpengine.com\/builders\/#website\",\"url\":\"https:\/\/wpengine.com\/builders\/\",\"name\":\"Builders\",\"description\":\"Reimagining the way we build with WordPress.\",\"publisher\":{\"@id\":\"https:\/\/wpengine.com\/builders\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/wpengine.com\/builders\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/wpengine.com\/builders\/#organization\",\"name\":\"WP Engine\",\"url\":\"https:\/\/wpengine.com\/builders\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/wpengine.com\/builders\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2024\/05\/WP-Engine-Horizontal@2x.png\",\"contentUrl\":\"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2024\/05\/WP-Engine-Horizontal@2x.png\",\"width\":348,\"height\":68,\"caption\":\"WP Engine\"},\"image\":{\"@id\":\"https:\/\/wpengine.com\/builders\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/x.com\/wpebuilders\",\"https:\/\/www.youtube.com\/channel\/UCh1WuL54XFb9ZI6m6goFv1g\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/wpengine.com\/builders\/#\/schema\/person\/bcdcb4ac0b215c34b6b30e440a24dc54\",\"name\":\"Francis Agulto\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/wpengine.com\/builders\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c24a68b84c9ad2b53c633d14917d8298?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c24a68b84c9ad2b53c633d14917d8298?s=96&d=mm&r=g\",\"caption\":\"Francis Agulto\"},\"description\":\"Fran Agulto is a Developer Advocate at WP Engine. He is a lover of all things headless WordPress, Rock Climbing, and overall being stoked for people that love what they do and share that stoke with others! Follow me on Twitter for cool stoked headless WP!\",\"url\":\"https:\/\/wpengine.com\/builders\/author\/francis-agultowpengine-com-2-2-2-2-2-2-2-2-2-2-2-3\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js - Builders","description":"Use geolocation search in your headless WordPress site with Nuxt, ACF, and WP Engine Smart Search AI\u2014covering schema, queries, and a clean map UI","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/","og_locale":"en_US","og_type":"article","og_title":"Use Geo-Aware Search with Nuxt.js, ACF & Smart Search AI","og_description":"Use location-based results to headless WordPress using WP Engine Smart Search AI, Nuxt, and ACF\u2014schema, indexing, and an interactive map UI.","og_url":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/","og_site_name":"Builders","article_published_time":"2025-12-12T17:27:41+00:00","article_modified_time":"2026-01-14T23:53:51+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/ssai-geofilter-api.png","type":"image\/png"}],"author":"Francis Agulto","twitter_card":"summary_large_image","twitter_creator":"@wpebuilders","twitter_site":"@wpebuilders","twitter_misc":{"Written by":"Francis Agulto","Est. reading time":"36 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#article","isPartOf":{"@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/"},"author":{"name":"Francis Agulto","@id":"https:\/\/wpengine.com\/builders\/#\/schema\/person\/bcdcb4ac0b215c34b6b30e440a24dc54"},"headline":"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js","datePublished":"2025-12-12T17:27:41+00:00","dateModified":"2026-01-14T23:53:51+00:00","mainEntityOfPage":{"@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/"},"wordCount":2282,"commentCount":0,"publisher":{"@id":"https:\/\/wpengine.com\/builders\/#organization"},"image":{"@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage"},"thumbnailUrl":"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1024x547.png","articleSection":["Headless"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/","url":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/","name":"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js - Builders","isPartOf":{"@id":"https:\/\/wpengine.com\/builders\/#website"},"primaryImageOfPage":{"@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage"},"image":{"@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage"},"thumbnailUrl":"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image-1024x547.png","datePublished":"2025-12-12T17:27:41+00:00","dateModified":"2026-01-14T23:53:51+00:00","description":"Use geolocation search in your headless WordPress site with Nuxt, ACF, and WP Engine Smart Search AI\u2014covering schema, queries, and a clean map UI","breadcrumb":{"@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#primaryimage","url":"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image.png","contentUrl":"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2025\/12\/image.png","width":1600,"height":855},{"@type":"BreadcrumbList","@id":"https:\/\/wpengine.com\/builders\/nuxt-smart-search-ai-acf-geolocation\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wpengine.com\/builders\/"},{"@type":"ListItem","position":2,"name":"Using the Geolocation API in Smart Search AI with ACF, Google Maps, And Nuxt.js"}]},{"@type":"WebSite","@id":"https:\/\/wpengine.com\/builders\/#website","url":"https:\/\/wpengine.com\/builders\/","name":"Builders","description":"Reimagining the way we build with WordPress.","publisher":{"@id":"https:\/\/wpengine.com\/builders\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wpengine.com\/builders\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/wpengine.com\/builders\/#organization","name":"WP Engine","url":"https:\/\/wpengine.com\/builders\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/wpengine.com\/builders\/#\/schema\/logo\/image\/","url":"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2024\/05\/WP-Engine-Horizontal@2x.png","contentUrl":"https:\/\/wpengine.com\/builders\/wp-content\/uploads\/2024\/05\/WP-Engine-Horizontal@2x.png","width":348,"height":68,"caption":"WP Engine"},"image":{"@id":"https:\/\/wpengine.com\/builders\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/wpebuilders","https:\/\/www.youtube.com\/channel\/UCh1WuL54XFb9ZI6m6goFv1g"]},{"@type":"Person","@id":"https:\/\/wpengine.com\/builders\/#\/schema\/person\/bcdcb4ac0b215c34b6b30e440a24dc54","name":"Francis Agulto","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/wpengine.com\/builders\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/c24a68b84c9ad2b53c633d14917d8298?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c24a68b84c9ad2b53c633d14917d8298?s=96&d=mm&r=g","caption":"Francis Agulto"},"description":"Fran Agulto is a Developer Advocate at WP Engine. He is a lover of all things headless WordPress, Rock Climbing, and overall being stoked for people that love what they do and share that stoke with others! Follow me on Twitter for cool stoked headless WP!","url":"https:\/\/wpengine.com\/builders\/author\/francis-agultowpengine-com-2-2-2-2-2-2-2-2-2-2-2-3\/"}]}},"_links":{"self":[{"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/posts\/32038","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/comments?post=32038"}],"version-history":[{"count":0,"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/posts\/32038\/revisions"}],"wp:attachment":[{"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/media?parent=32038"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/categories?post=32038"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpengine.com\/builders\/wp-json\/wp\/v2\/tags?post=32038"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}