(defcomp
  ()
  (~docs/page
    :title "sx-on-settle"
    (p
      "After a swap settles, the trigger element's "
      (code "sx-on-settle")
      " attribute is parsed and evaluated as SX. This runs "
      (em "after")
      " the content is in the DOM — so you can update reactive state based on what the server returned.")
    (p
      "Click \"Fetch Item\" to load server content. The response is pure hypermedia. But "
      (code "sx-on-settle")
      " on the button increments a fetch counter signal "
      (em "after")
      " the swap. The counter updates reactively.")
    (~reactive-islands/marshes/demo-marsh-settle)
    (~docs/code
      :src (highlight
        ";; sx-on-settle runs SX after the swap settles\n(defisland ~reactive-islands/marshes/demo-marsh-settle ()\n  (let ((count (def-store \"settle-count\" (fn () (signal 0)))))\n    (div\n      ;; Reactive counter — updates from sx-on-settle\n      (span \"Fetched: \" (deref count) \" times\")\n\n      ;; Button with sx-on-settle hook\n      (button :sx-get \"/sx/(geography.(reactive.(api.settle-data)))\"\n              :sx-target \"#settle-result\"\n              :sx-swap \"innerHTML\"\n              :sx-on-settle \"(swap! (use-store \\\"settle-count\\\") inc)\"\n        \"Fetch Item\")\n\n      ;; Server content lands here (pure hypermedia)\n      (div :id \"settle-result\"))))"
        "lisp"))
    (p
      "The server knows nothing about signals or counters. It returns plain content. The "
      (code "sx-on-settle")
      " hook is a client-side concern — it runs in the global SX environment with access to all primitives.")))
