(defcomp
  ()
  (div
    (~tw :tokens "space-y-4")
    (form
      :sx-post "/sx/(geography.(hypermedia.(example.(api.json-echo))))"
      :sx-target "#json-result"
      :sx-swap "innerHTML"
      :sx-encoding "json"
      (~tw :tokens "space-y-3")
      (div
        (label (~tw :tokens "block text-sm font-medium text-stone-700 mb-1") "Name")
        (input
          :type "text"
          :name "name"
          :value "Ada Lovelace"
          (~tw :tokens "w-full px-3 py-2 border border-stone-300 rounded text-sm")))
      (div
        (label (~tw :tokens "block text-sm font-medium text-stone-700 mb-1") "Age")
        (input
          :type "number"
          :name "age"
          :value "36"
          (~tw :tokens "w-full px-3 py-2 border border-stone-300 rounded text-sm")))
      (button
        :type "submit"
        (~tw :tokens "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm")
        "Submit as JSON"))
    (div
      :id "json-result"
      (~tw :tokens "p-3 rounded bg-stone-100 text-stone-500 text-sm")
      "Submit the form to see the server echo the parsed JSON.")))