(defcomp
  ()
  (div
    (~tw :tokens "space-y-3")
    (div
      (~tw :tokens "flex gap-3 items-center")
      (button
        :id "ref-diselt-btn"
        :sx-get "/sx/(geography.(hypermedia.(reference.(api.slow-echo))))"
        :sx-target "#ref-diselt-result"
        :sx-swap "innerHTML"
        :sx-disabled-elt "#ref-diselt-btn"
        :sx-vals "{\"q\": \"hello\"}"
        (~tw :tokens "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm disabled:opacity-50")
        "Click (disables during request)")
      (span
        (~tw :tokens "text-xs text-stone-400")
        "Button is disabled while request is in-flight."))
    (div
      :id "ref-diselt-result"
      (~tw :tokens "p-3 rounded bg-stone-100 text-stone-400 text-sm")
      "Click the button to see it disable during the request.")))