(defcomp
  ()
  (div
    (~tw :tokens "space-y-3")
    (input
      :type "text"
      :name "q"
      :placeholder "Type quickly..."
      :sx-get "/sx/(geography.(hypermedia.(reference.(api.slow-echo))))"
      :sx-trigger "input changed delay:100ms"
      :sx-sync "replace"
      :sx-target "#ref-sync-result"
      :sx-swap "innerHTML"
      (~tw :tokens "w-full px-3 py-2 border border-stone-300 rounded text-sm focus:outline-none focus:ring-2 focus:ring-violet-500"))
    (p
      (~tw :tokens "text-xs text-stone-400")
      "With sync:replace, each new keystroke aborts the in-flight request.")
    (div
      :id "ref-sync-result"
      (~tw :tokens "p-3 rounded bg-stone-100 text-stone-400 text-sm")
      "Type to see only the latest result.")))