;; ---------------------------------------------------------------------------
;; Per-spec test page (reusable for eval, parser, router, render)
;; ---------------------------------------------------------------------------
(defcomp (&key (spec-name :as string) (spec-title :as string) (spec-desc :as string) (spec-source :as string) (framework-source :as string) (server-results :as dict?))
  (~docs/page :title spec-title
    (div (~tw :tokens "space-y-8")

      ;; Description
      (div (~tw :tokens "space-y-4")
        (p (~tw :tokens "text-lg text-stone-600") spec-desc))

      ;; Server-side results
      (when server-results
        (div (~tw :tokens "space-y-3")
          (h2 (~tw :tokens "text-2xl font-semibold text-stone-800") "Server: Python evaluator")
          (p (~tw :tokens "text-stone-600")
            "Ran "
            (code (~tw :tokens "text-violet-700 text-sm") (str "test-" spec-name ".sx"))
            " when this page loaded — "
            (strong (str (get server-results "passed") "/" (get server-results "total") " passed"))
            " in " (str (get server-results "elapsed-ms")) "ms.")
          (pre (~tw :tokens "text-sm font-mono bg-stone-900 text-green-400 rounded-lg p-4 overflow-x-auto max-h-96 overflow-y-auto")
            (get server-results "output"))))

      ;; Browser test runner
      (div (~tw :tokens "space-y-3")
        (h2 (~tw :tokens "text-2xl font-semibold text-stone-800") "Browser: JavaScript evaluator")
        (p (~tw :tokens "text-stone-600")
          "Run this spec in the browser:")
        (div (~tw :tokens "flex items-center gap-4")
          (button :id (str "test-btn-" spec-name)
            (~tw :tokens "px-4 py-2 rounded-md bg-violet-600 text-white font-medium text-sm hover:bg-violet-700 cursor-pointer")
            :onclick (str "sxRunModularTests('" spec-name "','test-output-" spec-name "','test-btn-" spec-name "')")
            (str "Run " spec-title)))
        (pre :id (str "test-output-" spec-name)
          (~tw :tokens "text-sm font-mono bg-stone-900 text-green-400 rounded-lg p-4 overflow-x-auto max-h-96 overflow-y-auto")
          :style "display:none"
          "")
        ;; Hidden: spec source + framework source for the browser runner
        (textarea :id (str "test-spec-" spec-name) :style "display:none" spec-source)
        (textarea :id "test-framework-source" :style "display:none" framework-source)
        (script :src (asset-url "/scripts/sx-test-runner.js")))

      ;; Full source
      (div (~tw :tokens "space-y-3")
        (h2 (~tw :tokens "text-2xl font-semibold text-stone-800") "Specification source")
        (p (~tw :tokens "text-xs text-stone-400 italic")
          (str "test-" spec-name ".sx")
          " — the canonical test specification for this module.")
        (div (~tw :tokens "not-prose bg-stone-100 rounded-lg p-5 mx-auto max-w-3xl")
          (pre (~tw :tokens "text-sm leading-relaxed whitespace-pre-wrap break-words")
            (code (highlight spec-source "sx"))))))))
