Prefix all SX URLs with /sx/ for WhatsApp-safe sharing
All routes moved under /sx/ prefix: - / redirects to /sx/ - /sx/ serves home page - /sx/<path:expr> is the catch-all for SX expression URLs - Bare /(...) and /~... redirect to /sx/(...) and /sx/~... - All ~600 hrefs, sx-get attrs, defhandler paths, redirect targets, and blueprint routes updated across 44 files Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -10,7 +10,7 @@
|
||||
(defcomp ~ref-get-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-get-result"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm"
|
||||
@@ -26,7 +26,7 @@
|
||||
(defcomp ~ref-post-demo ()
|
||||
(div :class "space-y-3"
|
||||
(form
|
||||
:sx-post "/(geography.(hypermedia.(reference.(api.greet))))"
|
||||
:sx-post "/sx/(geography.(hypermedia.(reference.(api.greet))))"
|
||||
:sx-target "#ref-post-result"
|
||||
:sx-swap "innerHTML"
|
||||
:class "flex gap-2"
|
||||
@@ -48,7 +48,7 @@
|
||||
(div :class "flex items-center justify-between p-3 bg-stone-100 rounded"
|
||||
(span :class "text-stone-700 text-sm" "Status: " (strong "draft"))
|
||||
(button
|
||||
:sx-put "/(geography.(hypermedia.(reference.(api.status))))"
|
||||
:sx-put "/sx/(geography.(hypermedia.(reference.(api.status))))"
|
||||
:sx-target "#ref-put-view"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-vals "{\"status\": \"published\"}"
|
||||
@@ -63,17 +63,17 @@
|
||||
(div :class "space-y-2"
|
||||
(div :id "ref-del-1" :class "flex items-center justify-between p-2 border border-stone-200 rounded"
|
||||
(span :class "text-sm text-stone-700" "Item A")
|
||||
(button :sx-delete "/(geography.(hypermedia.(reference.(api.(item.1)))))"
|
||||
(button :sx-delete "/sx/(geography.(hypermedia.(reference.(api.(item.1)))))"
|
||||
:sx-target "#ref-del-1" :sx-swap "delete"
|
||||
:class "text-red-500 text-sm hover:text-red-700" "Remove"))
|
||||
(div :id "ref-del-2" :class "flex items-center justify-between p-2 border border-stone-200 rounded"
|
||||
(span :class "text-sm text-stone-700" "Item B")
|
||||
(button :sx-delete "/(geography.(hypermedia.(reference.(api.(item.2)))))"
|
||||
(button :sx-delete "/sx/(geography.(hypermedia.(reference.(api.(item.2)))))"
|
||||
:sx-target "#ref-del-2" :sx-swap "delete"
|
||||
:class "text-red-500 text-sm hover:text-red-700" "Remove"))
|
||||
(div :id "ref-del-3" :class "flex items-center justify-between p-2 border border-stone-200 rounded"
|
||||
(span :class "text-sm text-stone-700" "Item C")
|
||||
(button :sx-delete "/(geography.(hypermedia.(reference.(api.(item.3)))))"
|
||||
(button :sx-delete "/sx/(geography.(hypermedia.(reference.(api.(item.3)))))"
|
||||
:sx-target "#ref-del-3" :sx-swap "delete"
|
||||
:class "text-red-500 text-sm hover:text-red-700" "Remove"))))
|
||||
|
||||
@@ -86,11 +86,11 @@
|
||||
(div :class "p-3 bg-stone-100 rounded"
|
||||
(span :class "text-stone-700 text-sm" "Theme: " (strong :id "ref-patch-val" "light")))
|
||||
(div :class "flex gap-2"
|
||||
(button :sx-patch "/(geography.(hypermedia.(reference.(api.theme))))"
|
||||
(button :sx-patch "/sx/(geography.(hypermedia.(reference.(api.theme))))"
|
||||
:sx-vals "{\"theme\": \"dark\"}"
|
||||
:sx-target "#ref-patch-val" :sx-swap "innerHTML"
|
||||
:class "px-3 py-1 bg-stone-800 text-white rounded text-sm" "Dark")
|
||||
(button :sx-patch "/(geography.(hypermedia.(reference.(api.theme))))"
|
||||
(button :sx-patch "/sx/(geography.(hypermedia.(reference.(api.theme))))"
|
||||
:sx-vals "{\"theme\": \"light\"}"
|
||||
:sx-target "#ref-patch-val" :sx-swap "innerHTML"
|
||||
:class "px-3 py-1 bg-stone-100 border border-stone-300 text-stone-700 rounded text-sm" "Light"))))
|
||||
@@ -102,7 +102,7 @@
|
||||
(defcomp ~ref-trigger-demo ()
|
||||
(div :class "space-y-3"
|
||||
(input :type "text" :name "q" :placeholder "Type to search..."
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.trigger-search))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.trigger-search))))"
|
||||
:sx-trigger "input changed delay:300ms"
|
||||
:sx-target "#ref-trigger-result"
|
||||
:sx-swap "innerHTML"
|
||||
@@ -118,12 +118,12 @@
|
||||
(defcomp ~ref-target-demo ()
|
||||
(div :class "space-y-3"
|
||||
(div :class "flex gap-2"
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-target-a"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-3 py-1 bg-violet-600 text-white rounded text-sm hover:bg-violet-700"
|
||||
"Update Box A")
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-target-b"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-3 py-1 bg-emerald-600 text-white rounded text-sm hover:bg-emerald-700"
|
||||
@@ -141,13 +141,13 @@
|
||||
(defcomp ~ref-swap-demo ()
|
||||
(div :class "space-y-3"
|
||||
(div :class "flex gap-2 flex-wrap"
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
:sx-target "#ref-swap-list" :sx-swap "beforeend"
|
||||
:class "px-3 py-1 bg-violet-600 text-white rounded text-sm" "beforeend")
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
:sx-target "#ref-swap-list" :sx-swap "afterbegin"
|
||||
:class "px-3 py-1 bg-emerald-600 text-white rounded text-sm" "afterbegin")
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
:sx-target "#ref-swap-list" :sx-swap "innerHTML"
|
||||
:class "px-3 py-1 bg-blue-600 text-white rounded text-sm" "innerHTML"))
|
||||
(div :id "ref-swap-list"
|
||||
@@ -160,7 +160,7 @@
|
||||
|
||||
(defcomp ~ref-oob-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.oob))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.oob))))"
|
||||
:sx-target "#ref-oob-main"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-4 py-2 bg-violet-600 text-white rounded text-sm hover:bg-violet-700"
|
||||
@@ -179,7 +179,7 @@
|
||||
|
||||
(defcomp ~ref-select-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.select-page))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.select-page))))"
|
||||
:sx-target "#ref-select-result"
|
||||
:sx-select "#the-content"
|
||||
:sx-swap "innerHTML"
|
||||
@@ -198,7 +198,7 @@
|
||||
(div :id "ref-confirm-item"
|
||||
:class "flex items-center justify-between p-3 border border-stone-200 rounded"
|
||||
(span :class "text-sm text-stone-700" "Important file.txt")
|
||||
(button :sx-delete "/(geography.(hypermedia.(reference.(api.(item.confirm)))))"
|
||||
(button :sx-delete "/sx/(geography.(hypermedia.(reference.(api.(item.confirm)))))"
|
||||
:sx-target "#ref-confirm-item" :sx-swap "delete"
|
||||
:sx-confirm "Are you sure you want to delete this file?"
|
||||
:class "px-3 py-1 text-red-500 text-sm border border-red-200 rounded hover:bg-red-50"
|
||||
@@ -211,14 +211,14 @@
|
||||
(defcomp ~ref-pushurl-demo ()
|
||||
(div :class "space-y-3"
|
||||
(div :class "flex gap-2"
|
||||
(a :href "/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
:sx-get "/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
(a :href "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
:sx-target "#main-panel" :sx-select "#main-panel"
|
||||
:sx-swap "outerHTML" :sx-push-url "true"
|
||||
:class "px-3 py-1 bg-violet-100 text-violet-700 rounded text-sm no-underline hover:bg-violet-200"
|
||||
"sx-get page")
|
||||
(a :href "/(geography.(hypermedia.(reference-detail.attributes.sx-post)))"
|
||||
:sx-get "/(geography.(hypermedia.(reference-detail.attributes.sx-post)))"
|
||||
(a :href "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-post)))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-post)))"
|
||||
:sx-target "#main-panel" :sx-select "#main-panel"
|
||||
:sx-swap "outerHTML" :sx-push-url "true"
|
||||
:class "px-3 py-1 bg-violet-100 text-violet-700 rounded text-sm no-underline hover:bg-violet-200"
|
||||
@@ -233,7 +233,7 @@
|
||||
(defcomp ~ref-sync-demo ()
|
||||
(div :class "space-y-3"
|
||||
(input :type "text" :name "q" :placeholder "Type quickly..."
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.slow-echo))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.slow-echo))))"
|
||||
:sx-trigger "input changed delay:100ms"
|
||||
:sx-sync "replace"
|
||||
:sx-target "#ref-sync-result"
|
||||
@@ -251,7 +251,7 @@
|
||||
|
||||
(defcomp ~ref-encoding-demo ()
|
||||
(div :class "space-y-3"
|
||||
(form :sx-post "/(geography.(hypermedia.(reference.(api.upload-name))))"
|
||||
(form :sx-post "/sx/(geography.(hypermedia.(reference.(api.upload-name))))"
|
||||
:sx-encoding "multipart/form-data"
|
||||
:sx-target "#ref-encoding-result"
|
||||
:sx-swap "innerHTML"
|
||||
@@ -271,7 +271,7 @@
|
||||
|
||||
(defcomp ~ref-headers-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.echo-headers))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.echo-headers))))"
|
||||
:sx-headers {:X-Custom-Token "abc123" :X-Request-Source "demo"}
|
||||
:sx-target "#ref-headers-result"
|
||||
:sx-swap "innerHTML"
|
||||
@@ -295,7 +295,7 @@
|
||||
(option :value "all" "All")
|
||||
(option :value "books" "Books")
|
||||
(option :value "tools" "Tools")))
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.echo-vals))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.echo-vals))))"
|
||||
:sx-include "#ref-inc-cat"
|
||||
:sx-target "#ref-include-result"
|
||||
:sx-swap "innerHTML"
|
||||
@@ -311,7 +311,7 @@
|
||||
|
||||
(defcomp ~ref-vals-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button :sx-post "/(geography.(hypermedia.(reference.(api.echo-vals))))"
|
||||
(button :sx-post "/sx/(geography.(hypermedia.(reference.(api.echo-vals))))"
|
||||
:sx-vals "{\"source\": \"demo\", \"page\": \"3\"}"
|
||||
:sx-target "#ref-vals-result"
|
||||
:sx-swap "innerHTML"
|
||||
@@ -327,8 +327,8 @@
|
||||
|
||||
(defcomp ~ref-media-demo ()
|
||||
(div :class "space-y-3"
|
||||
(a :href "/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
:sx-get "/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
(a :href "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
:sx-target "#main-panel" :sx-select "#main-panel"
|
||||
:sx-swap "outerHTML" :sx-push-url "true"
|
||||
:sx-media "(min-width: 768px)"
|
||||
@@ -346,13 +346,13 @@
|
||||
(div :class "grid grid-cols-2 gap-3"
|
||||
(div :class "p-3 border border-stone-200 rounded"
|
||||
(p :class "text-xs text-stone-400 mb-2" "sx enabled")
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-dis-a" :sx-swap "innerHTML"
|
||||
:class "px-3 py-1 bg-violet-600 text-white rounded text-sm" "Load")
|
||||
(div :id "ref-dis-a" :class "mt-2 text-sm text-stone-500" "—"))
|
||||
(div :sx-disable "true" :class "p-3 border border-stone-200 rounded"
|
||||
(p :class "text-xs text-stone-400 mb-2" "sx disabled")
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-dis-b" :sx-swap "innerHTML"
|
||||
:class "px-3 py-1 bg-stone-400 text-white rounded text-sm" "Load")
|
||||
(div :id "ref-dis-b" :class "mt-2 text-sm text-stone-500"
|
||||
@@ -378,7 +378,7 @@
|
||||
|
||||
(defcomp ~ref-retry-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button :sx-get "/(geography.(hypermedia.(reference.(api.flaky))))"
|
||||
(button :sx-get "/sx/(geography.(hypermedia.(reference.(api.flaky))))"
|
||||
:sx-target "#ref-retry-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-retry "true"
|
||||
@@ -414,13 +414,13 @@
|
||||
(defcomp ~ref-boost-demo ()
|
||||
(div :class "space-y-3"
|
||||
(nav :sx-boost "true" :class "flex gap-3"
|
||||
(a :href "/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
(a :href "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-get)))"
|
||||
:class "text-violet-600 hover:text-violet-800 underline text-sm"
|
||||
"sx-get")
|
||||
(a :href "/(geography.(hypermedia.(reference-detail.attributes.sx-post)))"
|
||||
(a :href "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-post)))"
|
||||
:class "text-violet-600 hover:text-violet-800 underline text-sm"
|
||||
"sx-post")
|
||||
(a :href "/(geography.(hypermedia.(reference-detail.attributes.sx-target)))"
|
||||
(a :href "/sx/(geography.(hypermedia.(reference-detail.attributes.sx-target)))"
|
||||
:class "text-violet-600 hover:text-violet-800 underline text-sm"
|
||||
"sx-target"))
|
||||
(p :class "text-xs text-stone-400"
|
||||
@@ -434,7 +434,7 @@
|
||||
(defcomp ~ref-preload-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-preload-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-preload "mouseover"
|
||||
@@ -452,7 +452,7 @@
|
||||
(div :class "space-y-3"
|
||||
(div :class "flex gap-2 items-center"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-preserve-container"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm"
|
||||
@@ -473,7 +473,7 @@
|
||||
(div :class "space-y-3"
|
||||
(div :class "flex gap-3 items-center"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.slow-echo))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.slow-echo))))"
|
||||
:sx-target "#ref-indicator-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-indicator "#ref-spinner"
|
||||
@@ -495,7 +495,7 @@
|
||||
(defcomp ~ref-validate-demo ()
|
||||
(div :class "space-y-3"
|
||||
(form
|
||||
:sx-post "/(geography.(hypermedia.(reference.(api.greet))))"
|
||||
:sx-post "/sx/(geography.(hypermedia.(reference.(api.greet))))"
|
||||
:sx-target "#ref-validate-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-validate "true"
|
||||
@@ -517,7 +517,7 @@
|
||||
(defcomp ~ref-ignore-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-ignore-container"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm"
|
||||
@@ -539,14 +539,14 @@
|
||||
(div :id "ref-opt-item-1"
|
||||
:class "flex items-center justify-between p-2 border border-stone-200 rounded"
|
||||
(span :class "text-sm text-stone-700" "Optimistic item A")
|
||||
(button :sx-delete "/(geography.(hypermedia.(reference.(api.(item.opt1)))))"
|
||||
(button :sx-delete "/sx/(geography.(hypermedia.(reference.(api.(item.opt1)))))"
|
||||
:sx-target "#ref-opt-item-1" :sx-swap "delete"
|
||||
:sx-optimistic "remove"
|
||||
:class "text-red-500 text-sm hover:text-red-700" "Remove"))
|
||||
(div :id "ref-opt-item-2"
|
||||
:class "flex items-center justify-between p-2 border border-stone-200 rounded"
|
||||
(span :class "text-sm text-stone-700" "Optimistic item B")
|
||||
(button :sx-delete "/(geography.(hypermedia.(reference.(api.(item.opt2)))))"
|
||||
(button :sx-delete "/sx/(geography.(hypermedia.(reference.(api.(item.opt2)))))"
|
||||
:sx-target "#ref-opt-item-2" :sx-swap "delete"
|
||||
:sx-optimistic "remove"
|
||||
:class "text-red-500 text-sm hover:text-red-700" "Remove"))
|
||||
@@ -560,7 +560,7 @@
|
||||
(defcomp ~ref-replace-url-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-replurl-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-replace-url "true"
|
||||
@@ -578,7 +578,7 @@
|
||||
(div :class "space-y-3"
|
||||
(div :class "flex gap-3 items-center"
|
||||
(button :id "ref-diselt-btn"
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.slow-echo))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.slow-echo))))"
|
||||
:sx-target "#ref-diselt-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-disabled-elt "#ref-diselt-btn"
|
||||
@@ -597,7 +597,7 @@
|
||||
(defcomp ~ref-prompt-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.prompt-echo))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.prompt-echo))))"
|
||||
:sx-target "#ref-prompt-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-prompt "Enter your name:"
|
||||
@@ -614,7 +614,7 @@
|
||||
(defcomp ~ref-params-demo ()
|
||||
(div :class "space-y-3"
|
||||
(form
|
||||
:sx-post "/(geography.(hypermedia.(reference.(api.echo-vals))))"
|
||||
:sx-post "/sx/(geography.(hypermedia.(reference.(api.echo-vals))))"
|
||||
:sx-target "#ref-params-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-params "name"
|
||||
@@ -636,7 +636,7 @@
|
||||
|
||||
(defcomp ~ref-sse-demo ()
|
||||
(div :class "space-y-3"
|
||||
(div :sx-sse "/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
(div :sx-sse "/sx/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
:sx-sse-swap "time"
|
||||
:sx-swap "innerHTML"
|
||||
(div :id "ref-sse-result"
|
||||
@@ -656,7 +656,7 @@
|
||||
(defcomp ~ref-header-prompt-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.prompt-echo))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.prompt-echo))))"
|
||||
:sx-target "#ref-hdr-prompt-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-prompt "Enter your name:"
|
||||
@@ -673,7 +673,7 @@
|
||||
(defcomp ~ref-header-trigger-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.trigger-event))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.trigger-event))))"
|
||||
:sx-target "#ref-hdr-trigger-result"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm"
|
||||
@@ -690,7 +690,7 @@
|
||||
(defcomp ~ref-header-retarget-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.retarget))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.retarget))))"
|
||||
:sx-target "#ref-hdr-retarget-main"
|
||||
:sx-swap "innerHTML"
|
||||
:class "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm"
|
||||
@@ -717,7 +717,7 @@
|
||||
(input :id "ref-evt-br-input" :type "text" :placeholder "Type something first..."
|
||||
:class "flex-1 px-3 py-2 border border-stone-300 rounded text-sm focus:outline-none focus:ring-2 focus:ring-violet-500")
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-evt-br-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-on:sx:beforeRequest "if (!document.getElementById('ref-evt-br-input').value) { event.preventDefault(); document.getElementById('ref-evt-br-result').textContent = 'Cancelled — input is empty!'; }"
|
||||
@@ -734,7 +734,7 @@
|
||||
(defcomp ~ref-event-after-request-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.time))))"
|
||||
:sx-target "#ref-evt-ar-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-on:sx:afterRequest "document.getElementById('ref-evt-ar-log').textContent = 'Response status: ' + (event.detail ? event.detail.status : '?')"
|
||||
@@ -754,7 +754,7 @@
|
||||
(defcomp ~ref-event-after-swap-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.swap-item))))"
|
||||
:sx-target "#ref-evt-as-list"
|
||||
:sx-swap "beforeend"
|
||||
:sx-on:sx:afterSwap "var items = document.querySelectorAll('#ref-evt-as-list > div'); if (items.length) items[items.length-1].scrollIntoView({behavior:'smooth'}); document.getElementById('ref-evt-as-count').textContent = items.length + ' items'"
|
||||
@@ -774,7 +774,7 @@
|
||||
(defcomp ~ref-event-response-error-demo ()
|
||||
(div :class "space-y-3"
|
||||
(button
|
||||
:sx-get "/(geography.(hypermedia.(reference.(api.error-500))))"
|
||||
:sx-get "/sx/(geography.(hypermedia.(reference.(api.error-500))))"
|
||||
:sx-target "#ref-evt-err-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-on:sx:responseError "var s=document.getElementById('ref-evt-err-status'); s.style.display='block'; s.textContent='Error ' + (event.detail ? event.detail.status || '?' : '?') + ' received'"
|
||||
@@ -796,7 +796,7 @@
|
||||
(defcomp ~ref-event-validation-failed-demo ()
|
||||
(div :class "space-y-3"
|
||||
(form
|
||||
:sx-post "/(geography.(hypermedia.(reference.(api.greet))))"
|
||||
:sx-post "/sx/(geography.(hypermedia.(reference.(api.greet))))"
|
||||
:sx-target "#ref-evt-vf-result"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-validate "true"
|
||||
@@ -847,13 +847,13 @@
|
||||
"Open DevTools console, then navigate to a pure page (no :data expression). "
|
||||
"You'll see \"sx:route client /path\" in the console — no network request is made.")
|
||||
(div :class "flex gap-2 flex-wrap"
|
||||
(a :href "/(etc.(essay))"
|
||||
(a :href "/sx/(etc.(essay))"
|
||||
:class "px-3 py-1 bg-violet-100 text-violet-700 rounded text-sm no-underline hover:bg-violet-200"
|
||||
"Essays")
|
||||
(a :href "/(etc.(plan))"
|
||||
(a :href "/sx/(etc.(plan))"
|
||||
:class "px-3 py-1 bg-violet-100 text-violet-700 rounded text-sm no-underline hover:bg-violet-200"
|
||||
"Plans")
|
||||
(a :href "/(applications.(protocol))"
|
||||
(a :href "/sx/(applications.(protocol))"
|
||||
:class "px-3 py-1 bg-violet-100 text-violet-700 rounded text-sm no-underline hover:bg-violet-200"
|
||||
"Protocols"))
|
||||
(p :class "text-xs text-stone-400"
|
||||
@@ -866,7 +866,7 @@
|
||||
|
||||
(defcomp ~ref-event-sse-open-demo ()
|
||||
(div :class "space-y-3"
|
||||
(div :sx-sse "/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
(div :sx-sse "/sx/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
:sx-sse-swap "time"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-on:sx:sseOpen "document.getElementById('ref-evt-sseopen-status').textContent = 'Connected'; document.getElementById('ref-evt-sseopen-status').className = 'inline-block px-2 py-0.5 rounded text-xs bg-emerald-100 text-emerald-700'"
|
||||
@@ -884,7 +884,7 @@
|
||||
|
||||
(defcomp ~ref-event-sse-message-demo ()
|
||||
(div :class "space-y-3"
|
||||
(div :sx-sse "/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
(div :sx-sse "/sx/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
:sx-sse-swap "time"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-on:sx:sseMessage "var c = parseInt(document.getElementById('ref-evt-ssemsg-count').dataset.count || '0') + 1; document.getElementById('ref-evt-ssemsg-count').dataset.count = c; document.getElementById('ref-evt-ssemsg-count').textContent = c + ' messages received'"
|
||||
@@ -902,7 +902,7 @@
|
||||
|
||||
(defcomp ~ref-event-sse-error-demo ()
|
||||
(div :class "space-y-3"
|
||||
(div :sx-sse "/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
(div :sx-sse "/sx/(geography.(hypermedia.(reference.(api.sse-time))))"
|
||||
:sx-sse-swap "time"
|
||||
:sx-swap "innerHTML"
|
||||
:sx-on:sx:sseError "document.getElementById('ref-evt-sseerr-status').textContent = 'Disconnected'; document.getElementById('ref-evt-sseerr-status').className = 'inline-block px-2 py-0.5 rounded text-xs bg-red-100 text-red-700'"
|
||||
|
||||
Reference in New Issue
Block a user