@@ -21,7 +21,7 @@ export default class extends Controller {
2121 this . isSearching = false
2222 this . searchTimeout = null
2323 this . clearResultsTimeout = null
24- this . lastSearchResults = [ ]
24+ this . selectableResults = [ ]
2525
2626 // Добавляем слушатели один раз
2727 if ( this . hasInputTarget ) {
@@ -164,27 +164,35 @@ export default class extends Controller {
164164 if ( ! items ?. length ) {
165165 this . resultsTarget . innerHTML = ""
166166 this . resultsTarget . classList . add ( "hidden" )
167+ this . selectableResults = [ ]
167168 return
168169 }
169170
171+ // Служебные строки («Ищу…», «Ничего не найдено») рисуем, но выбирать их нельзя:
172+ // data-idx считаем по выбираемым элементам, их же и запоминаем.
173+ const selectable = [ ]
174+
170175 this . resultsTarget . innerHTML = items
171- . map ( ( item , idx ) =>
172- item . class === "muted"
173- ? `<div class="p-3 text-sm text-gray-500 text-center">${ escapeHtml ( item . label ) } </div>`
174- : `<button type="button" data-action="click->geolocation#selectResult" data-idx="${ idx } " class="w-full text-left p-3 hover:bg-gray-100 text-sm border-b last:border-b-0 transition">
176+ . map ( ( item ) => {
177+ if ( ! isSelectableResult ( item ) ) {
178+ return `<div class="p-3 text-sm text-gray-500 text-center">${ escapeHtml ( item . label ) } </div>`
179+ }
180+
181+ const idx = selectable . push ( item ) - 1
182+ return `<button type="button" data-action="click->geolocation#selectResult" data-idx="${ idx } " class="w-full text-left p-3 hover:bg-gray-100 text-sm border-b last:border-b-0 transition">
175183 <div class="font-medium text-gray-800">${ escapeHtml ( item . label ) } </div>
176184 </button>`
177- )
185+ } )
178186 . join ( "" )
179187
180188 this . resultsTarget . classList . remove ( "hidden" )
181- this . lastSearchResults = items
189+ this . selectableResults = selectable
182190 }
183191
184192 selectResult ( e ) {
185193 e . preventDefault ( )
186194 const idx = parseInt ( e . currentTarget . dataset . idx , 10 )
187- const item = this . lastSearchResults ?. [ idx ]
195+ const item = this . selectableResults ?. [ idx ]
188196
189197 if ( ! item || ! this . hasInputTarget ) return
190198
@@ -194,7 +202,7 @@ export default class extends Controller {
194202 }
195203
196204 selectResultByIndex ( idx ) {
197- const item = this . lastSearchResults [ idx ]
205+ const item = this . selectableResults [ idx ]
198206 if ( item ) {
199207 this . setCoordinates ( item . lat , item . lon )
200208 this . clearResults ( )
@@ -207,33 +215,27 @@ export default class extends Controller {
207215 if ( ! val || this . isCoordinates ( val ) ) return
208216
209217 e . preventDefault ( )
210- if ( this . lastSearchResults . length > 0 ) {
218+ if ( this . selectableResults . length > 0 ) {
211219 this . selectResultByIndex ( 0 )
212220 } else {
213221 this . searchCity ( val )
214222 }
215223 }
216224
217- onFormSubmit ( e ) {
218- if ( ! this . hasInputTarget ) return
219- const input = this . inputTarget . value . trim ( )
220-
221- if ( ! input || this . isCoordinates ( input ) ) return
222-
223- e . preventDefault ( )
224- this . lastSearchResults . length > 0 ? null : this . searchCity ( input )
225- }
226-
227225 clearResults ( ) {
228226 this . cancelResultsClear ( )
229227 if ( this . hasResultsTarget ) {
230228 this . resultsTarget . innerHTML = ""
231229 this . resultsTarget . classList . add ( "hidden" )
232230 }
233- this . lastSearchResults = [ ]
231+ this . selectableResults = [ ]
234232 }
235233}
236234
235+ function isSelectableResult ( item ) {
236+ return item ?. class !== "muted" && Number . isFinite ( item ?. lat ) && Number . isFinite ( item ?. lon )
237+ }
238+
237239function escapeHtml ( unsafe ) {
238240 return String ( unsafe )
239241 . replace ( / & / g, "&" )
0 commit comments