(defcomp
  ()
  (~docs/page
    :title "Reactive Islands — Examples"
    (~docs/section
      :title "Live interactive islands"
      :id "intro"
      (p
        (strong "Every example below is a live interactive island")
        " — not a static code snippet. Click the buttons, type in the inputs. The signal runtime is defined in "
        (code "signals.sx")
        ", bootstrapped to JavaScript. No hand-written signal logic.")
      (p
        "Each island uses "
        (code "defisland")
        " with signals ("
        (code "signal")
        ", "
        (code "deref")
        ", "
        (code "reset!")
        ", "
        (code "swap!")
        "), derived values ("
        (code "computed")
        "), side effects ("
        (code "effect")
        "), and batch updates ("
        (code "batch")
        ")."))
    (~docs/section
      :title "Examples"
      :id "examples"
      (ol
        (~tw :tokens "space-y-1")
        (map
          (fn
            (item)
            (li
              (a
                :href (get item "href")
                :sx-get (get item "href")
                :sx-target "#sx-content"
                :sx-select "#sx-content"
                :sx-swap "outerHTML"
                :sx-push-url "true"
                (~tw :tokens "text-violet-600 hover:underline")
                (get item "label"))))
          reactive-examples-nav-items)))))
