Rename all 1,169 components to path-based names with namespace support

Component names now reflect filesystem location using / as path separator
and : as namespace separator for shared components:
  ~sx-header → ~layouts/header
  ~layout-app-body → ~shared:layout/app-body
  ~blog-admin-dashboard → ~admin/dashboard

209 files, 4,941 replacements across all services.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-12 22:00:12 +00:00
parent de80d921e9
commit b0920a1121
209 changed files with 4620 additions and 4620 deletions

View File

@@ -1,6 +1,6 @@
;; SX docs — example and demo components
(defcomp ~example-card (&key title description &rest children)
(defcomp ~examples/card (&key title description &rest children)
(div :class "border border-stone-200 rounded-lg overflow-hidden"
(div :class "bg-stone-100 px-4 py-3 border-b border-stone-200"
(h3 :class "font-semibold text-stone-800" title)
@@ -8,16 +8,16 @@
(p :class "text-sm text-stone-500 mt-1" description)))
(div :class "p-4" children)))
(defcomp ~example-demo (&key &rest children)
(defcomp ~examples/demo (&key &rest children)
(div :class "border border-dashed border-stone-300 rounded p-4 bg-stone-100" children))
(defcomp ~example-source (&key code)
(defcomp ~examples/source (&key code)
(div :class "not-prose bg-stone-100 rounded p-5 mt-3 mx-auto max-w-3xl"
(pre :class "text-sm leading-relaxed whitespace-pre-wrap break-words" (code code))))
;; --- Click to load demo ---
(defcomp ~click-to-load-demo ()
(defcomp ~examples/click-to-load-demo ()
(div :class "space-y-4"
(div :id "click-result" :class "p-4 rounded bg-stone-100 text-stone-500 text-center"
"Click the button to load content.")
@@ -28,7 +28,7 @@
:class "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors"
"Load content")))
(defcomp ~click-result (&key time)
(defcomp ~examples/click-result (&key time)
(div :class "space-y-2"
(p :class "text-stone-800 font-medium" "Content loaded!")
(p :class "text-stone-500 text-sm"
@@ -36,7 +36,7 @@
;; --- Form submission demo ---
(defcomp ~form-demo ()
(defcomp ~examples/form-demo ()
(div :class "space-y-4"
(form
:sx-post "/sx/(geography.(hypermedia.(example.(api.form))))"
@@ -53,14 +53,14 @@
(div :id "form-result" :class "p-3 rounded bg-stone-100 text-stone-500 text-sm text-center"
"Submit the form to see the result.")))
(defcomp ~form-result (&key name)
(defcomp ~examples/form-result (&key name)
(div :class "text-stone-800"
(p (str "Hello, " (if (empty? name) "stranger" name) "!"))
(p :class "text-sm text-stone-500 mt-1" "Submitted via sx-post. The form data was sent as a POST request.")))
;; --- Polling demo ---
(defcomp ~polling-demo ()
(defcomp ~examples/polling-demo ()
(div :class "space-y-4"
(div :id "poll-target"
:sx-get "/sx/(geography.(hypermedia.(example.(api.poll))))"
@@ -69,7 +69,7 @@
:class "p-4 rounded border border-stone-200 bg-stone-100 text-center font-mono"
"Loading...")))
(defcomp ~poll-result (&key time count)
(defcomp ~examples/poll-result (&key time count)
(div
(p :class "text-stone-800 font-medium" (str "Server time: " time))
(p :class "text-stone-500 text-sm mt-1" (str "Poll count: " count))
@@ -82,7 +82,7 @@
;; --- Delete row demo ---
(defcomp ~delete-demo (&key items)
(defcomp ~examples/delete-demo (&key items)
(div
(table :class "w-full text-left text-sm"
(thead
@@ -91,10 +91,10 @@
(th :class "px-3 py-2 font-medium text-stone-600 w-20" "")))
(tbody :id "delete-rows"
(map (fn (item)
(~delete-row :id (nth item 0) :name (nth item 1)))
(~examples/delete-row :id (nth item 0) :name (nth item 1)))
items)))))
(defcomp ~delete-row (&key id name)
(defcomp ~examples/delete-row (&key id name)
(tr :id (str "row-" id) :class "border-b border-stone-100 transition-all"
(td :class "px-3 py-2 text-stone-700" name)
(td :class "px-3 py-2"
@@ -108,11 +108,11 @@
;; --- Inline edit demo ---
(defcomp ~inline-edit-demo ()
(defcomp ~examples/inline-edit-demo ()
(div :id "edit-target" :class "space-y-3"
(~inline-view :value "Click edit to change this text")))
(~examples/inline-view :value "Click edit to change this text")))
(defcomp ~inline-view (&key value)
(defcomp ~examples/inline-view (&key value)
(div :class "flex items-center justify-between p-3 rounded border border-stone-200"
(span :class "text-stone-800" value)
(button
@@ -122,7 +122,7 @@
:class "text-sm text-violet-600 hover:text-violet-800"
"edit")))
(defcomp ~inline-edit-form (&key value)
(defcomp ~examples/inline-edit-form (&key value)
(form
:sx-post "/sx/(geography.(hypermedia.(example.(api.edit))))"
:sx-target "#edit-target"
@@ -142,7 +142,7 @@
;; --- OOB swap demo ---
(defcomp ~oob-demo ()
(defcomp ~examples/oob-demo ()
(div :class "space-y-4"
(div :class "grid grid-cols-2 gap-4"
(div :id "oob-box-a" :class "p-4 rounded border border-stone-200 bg-stone-100 text-center"
@@ -160,7 +160,7 @@
;; --- Lazy loading demo ---
(defcomp ~lazy-loading-demo ()
(defcomp ~examples/lazy-loading-demo ()
(div :class "space-y-4"
(p :class "text-sm text-stone-500" "The content below loads automatically when the page renders.")
(div :id "lazy-target"
@@ -172,14 +172,14 @@
(div :class "h-4 bg-stone-200 rounded w-3/4 mx-auto")
(div :class "h-4 bg-stone-200 rounded w-1/2 mx-auto")))))
(defcomp ~lazy-result (&key time)
(defcomp ~examples/lazy-result (&key time)
(div :class "space-y-2"
(p :class "text-stone-800 font-medium" "Content loaded on page render!")
(p :class "text-stone-500 text-sm" (str "Loaded via sx-trigger=\"load\" at " time))))
;; --- Infinite scroll demo ---
(defcomp ~infinite-scroll-demo ()
(defcomp ~examples/infinite-scroll-demo ()
(div :class "h-64 overflow-y-auto border border-stone-200 rounded" :id "scroll-container"
(div :id "scroll-items"
(map-indexed (fn (i item)
@@ -194,7 +194,7 @@
:class "p-3 text-center text-stone-400 text-sm"
"Loading more..."))))
(defcomp ~scroll-items (&key items page)
(defcomp ~examples/scroll-items (&key items page)
(<>
(map (fn (item)
(div :class "px-4 py-3 border-b border-stone-100 text-sm text-stone-700" item))
@@ -210,7 +210,7 @@
;; --- Progress bar demo ---
(defcomp ~progress-bar-demo ()
(defcomp ~examples/progress-bar-demo ()
(div :class "space-y-4"
(div :id "progress-target" :class "space-y-3"
(div :class "w-full bg-stone-200 rounded-full h-4"
@@ -223,7 +223,7 @@
:class "px-4 py-2 bg-violet-600 text-white rounded hover:bg-violet-700 transition-colors text-sm"
"Start job")))
(defcomp ~progress-status (&key percent job-id)
(defcomp ~examples/progress-status (&key percent job-id)
(div :class "space-y-3"
(div :class "w-full bg-stone-200 rounded-full h-4"
(div :class "bg-violet-600 h-4 rounded-full transition-all"
@@ -239,7 +239,7 @@
;; --- Active search demo ---
(defcomp ~active-search-demo ()
(defcomp ~examples/active-search-demo ()
(div :class "space-y-3"
(input :type "text" :name "q"
:sx-get "/sx/(geography.(hypermedia.(example.(api.search))))"
@@ -251,7 +251,7 @@
(div :id "search-results" :class "border border-stone-200 rounded divide-y divide-stone-100"
(p :class "p-3 text-sm text-stone-400" "Type to search..."))))
(defcomp ~search-results (&key items query)
(defcomp ~examples/search-results (&key items query)
(<>
(if (empty? items)
(p :class "p-3 text-sm text-stone-400" (str "No results for \"" query "\""))
@@ -261,7 +261,7 @@
;; --- Inline validation demo ---
(defcomp ~inline-validation-demo ()
(defcomp ~examples/inline-validation-demo ()
(form :class "space-y-4" :sx-post "/sx/(geography.(hypermedia.(example.(api.validate-submit))))" :sx-target "#validation-result" :sx-swap "innerHTML"
(div
(label :class "block text-sm font-medium text-stone-700 mb-1" "Email")
@@ -277,15 +277,15 @@
"Submit")
(div :id "validation-result")))
(defcomp ~validation-ok (&key email)
(defcomp ~examples/validation-ok (&key email)
(p :class "text-sm text-emerald-600" (str email " is available")))
(defcomp ~validation-error (&key message)
(defcomp ~examples/validation-error (&key message)
(p :class "text-sm text-rose-600" message))
;; --- Value select demo ---
(defcomp ~value-select-demo ()
(defcomp ~examples/value-select-demo ()
(div :class "space-y-3"
(div
(label :class "block text-sm font-medium text-stone-700 mb-1" "Category")
@@ -305,13 +305,13 @@
:class "w-full px-3 py-2 border border-stone-300 rounded text-sm focus:outline-none focus:ring-2 focus:ring-violet-500"
(option :value "" "Select a category first...")))))
(defcomp ~value-options (&key items)
(defcomp ~examples/value-options (&key items)
(<>
(map (fn (item) (option :value item item)) items)))
;; --- Reset on submit demo ---
(defcomp ~reset-on-submit-demo ()
(defcomp ~examples/reset-on-submit-demo ()
(div :class "space-y-3"
(form :id "reset-form"
:sx-post "/sx/(geography.(hypermedia.(example.(api.reset-submit))))"
@@ -327,13 +327,13 @@
(div :id "reset-result" :class "space-y-2"
(p :class "text-sm text-stone-400" "Messages will appear here."))))
(defcomp ~reset-message (&key message time)
(defcomp ~examples/reset-message (&key message time)
(div :class "px-3 py-2 bg-stone-100 rounded text-sm text-stone-700"
(str "[" time "] " message)))
;; --- Edit row demo ---
(defcomp ~edit-row-demo (&key rows)
(defcomp ~examples/edit-row-demo (&key rows)
(div
(table :class "w-full text-left text-sm"
(thead
@@ -344,10 +344,10 @@
(th :class "px-3 py-2 font-medium text-stone-600 w-24" "")))
(tbody :id "edit-rows"
(map (fn (row)
(~edit-row-view :id (nth row 0) :name (nth row 1) :price (nth row 2) :stock (nth row 3)))
(~examples/edit-row-view :id (nth row 0) :name (nth row 1) :price (nth row 2) :stock (nth row 3)))
rows)))))
(defcomp ~edit-row-view (&key id name price stock)
(defcomp ~examples/edit-row-view (&key id name price stock)
(tr :id (str "erow-" id) :class "border-b border-stone-100"
(td :class "px-3 py-2 text-stone-700" name)
(td :class "px-3 py-2 text-stone-700" (str "$" price))
@@ -360,7 +360,7 @@
:class "text-sm text-violet-600 hover:text-violet-800"
"edit"))))
(defcomp ~edit-row-form (&key id name price stock)
(defcomp ~examples/edit-row-form (&key id name price stock)
(tr :id (str "erow-" id) :class "border-b border-stone-100 bg-violet-50"
(td :class "px-3 py-2"
(input :type "text" :name "name" :value name
@@ -388,7 +388,7 @@
;; --- Bulk update demo ---
(defcomp ~bulk-update-demo (&key users)
(defcomp ~examples/bulk-update-demo (&key users)
(div :class "space-y-3"
(form :id "bulk-form"
(div :class "flex gap-2 mb-3"
@@ -415,10 +415,10 @@
(th :class "px-3 py-2 font-medium text-stone-600" "Status")))
(tbody :id "bulk-table"
(map (fn (u)
(~bulk-row :id (nth u 0) :name (nth u 1) :email (nth u 2) :status (nth u 3)))
(~examples/bulk-row :id (nth u 0) :name (nth u 1) :email (nth u 2) :status (nth u 3)))
users))))))
(defcomp ~bulk-row (&key id name email status)
(defcomp ~examples/bulk-row (&key id name email status)
(tr :class "border-b border-stone-100"
(td :class "px-3 py-2"
(input :type "checkbox" :name "ids" :value id))
@@ -433,7 +433,7 @@
;; --- Swap positions demo ---
(defcomp ~swap-positions-demo ()
(defcomp ~examples/swap-positions-demo ()
(div :class "space-y-3"
(div :class "flex gap-2"
(button
@@ -459,13 +459,13 @@
:class "border border-stone-200 rounded h-48 overflow-y-auto divide-y divide-stone-100"
(p :class "p-3 text-sm text-stone-400" "Log entries will appear here."))))
(defcomp ~swap-entry (&key time mode)
(defcomp ~examples/swap-entry (&key time mode)
(div :class "px-3 py-2 text-sm text-stone-700"
(str "[" time "] " mode)))
;; --- Select filter demo ---
(defcomp ~select-filter-demo ()
(defcomp ~examples/select-filter-demo ()
(div :class "space-y-3"
(div :class "flex gap-2"
(button
@@ -493,17 +493,17 @@
;; --- Tabs demo ---
(defcomp ~tabs-demo ()
(defcomp ~examples/tabs-demo ()
(div :class "space-y-0"
(div :class "flex border-b border-stone-200" :id "tab-buttons"
(~tab-btn :tab "tab1" :label "Overview" :active "true")
(~tab-btn :tab "tab2" :label "Details" :active "false")
(~tab-btn :tab "tab3" :label "History" :active "false"))
(~examples/tab-btn :tab "tab1" :label "Overview" :active "true")
(~examples/tab-btn :tab "tab2" :label "Details" :active "false")
(~examples/tab-btn :tab "tab3" :label "History" :active "false"))
(div :id "tab-content" :class "p-4 border border-t-0 border-stone-200 rounded-b"
(p :class "text-stone-700" "Welcome to the Overview tab. This content is loaded by default.")
(p :class "text-stone-500 text-sm mt-2" "Click the tabs above to navigate. Watch the browser URL update."))))
(defcomp ~tab-btn (&key tab label active)
(defcomp ~examples/tab-btn (&key tab label active)
(button
:sx-get (str "/sx/(geography.(hypermedia.(example.(api.(tabs." tab ")))))")
:sx-target "#tab-content"
@@ -517,7 +517,7 @@
;; --- Animations demo ---
(defcomp ~animations-demo ()
(defcomp ~examples/animations-demo ()
(div :class "space-y-4"
(button
:sx-get "/sx/(geography.(hypermedia.(example.(api.animate))))"
@@ -528,7 +528,7 @@
(div :id "anim-target" :class "p-4 rounded border border-stone-200 bg-stone-100 text-center"
(p :class "text-stone-400" "Content will fade in here."))))
(defcomp ~anim-result (&key color time)
(defcomp ~examples/anim-result (&key color time)
(div :class "sx-fade-in space-y-2"
(div :class (str "p-4 rounded transition-colors duration-700 " color)
(p :class "font-medium" "Faded in!")
@@ -536,7 +536,7 @@
;; --- Dialogs demo ---
(defcomp ~dialogs-demo ()
(defcomp ~examples/dialogs-demo ()
(div
(button
:sx-get "/sx/(geography.(hypermedia.(example.(api.dialog))))"
@@ -546,7 +546,7 @@
"Open Dialog")
(div :id "dialog-container")))
(defcomp ~dialog-modal (&key title message)
(defcomp ~examples/dialog-modal (&key title message)
(div :class "fixed inset-0 z-50 flex items-center justify-center"
(div :class "absolute inset-0 bg-black/50"
:sx-get "/sx/(geography.(hypermedia.(example.(api.dialog-close))))"
@@ -571,7 +571,7 @@
;; --- Keyboard shortcuts demo ---
(defcomp ~keyboard-shortcuts-demo ()
(defcomp ~examples/keyboard-shortcuts-demo ()
(div :class "space-y-4"
(div :class "p-4 rounded border border-stone-200 bg-stone-100"
(p :class "text-sm text-stone-600 font-medium mb-2" "Keyboard shortcuts:")
@@ -600,18 +600,18 @@
:sx-target "#kbd-target"
:sx-swap "innerHTML")))
(defcomp ~kbd-result (&key key action)
(defcomp ~examples/kbd-result (&key key action)
(div :class "space-y-1"
(p :class "text-stone-800 font-medium" action)
(p :class "text-sm text-stone-500" (str "Triggered by pressing '" key "'"))))
;; --- PUT / PATCH demo ---
(defcomp ~put-patch-demo (&key name email role)
(defcomp ~examples/put-patch-demo (&key name email role)
(div :id "pp-target" :class "space-y-4"
(~pp-view :name name :email email :role role)))
(~examples/pp-view :name name :email email :role role)))
(defcomp ~pp-view (&key name email role)
(defcomp ~examples/pp-view (&key name email role)
(div :class "space-y-3"
(div :class "flex justify-between items-start"
(div
@@ -625,7 +625,7 @@
:class "text-sm text-violet-600 hover:text-violet-800"
"Edit All (PUT)"))))
(defcomp ~pp-form-full (&key name email role)
(defcomp ~examples/pp-form-full (&key name email role)
(form
:sx-put "/sx/(geography.(hypermedia.(example.(api.putpatch))))"
:sx-target "#pp-target"
@@ -656,7 +656,7 @@
;; --- JSON encoding demo ---
(defcomp ~json-encoding-demo ()
(defcomp ~examples/json-encoding-demo ()
(div :class "space-y-4"
(form
:sx-post "/sx/(geography.(hypermedia.(example.(api.json-echo))))"
@@ -678,7 +678,7 @@
(div :id "json-result" :class "p-3 rounded bg-stone-100 text-stone-500 text-sm"
"Submit the form to see the server echo the parsed JSON.")))
(defcomp ~json-result (&key body content-type)
(defcomp ~examples/json-result (&key body content-type)
(div :class "space-y-2"
(p :class "text-stone-800 font-medium" "Server received:")
(pre :class "text-sm bg-stone-100 p-3 rounded overflow-x-auto" (code body))
@@ -686,7 +686,7 @@
;; --- Vals & Headers demo ---
(defcomp ~vals-headers-demo ()
(defcomp ~examples/vals-headers-demo ()
(div :class "space-y-6"
(div :class "space-y-2"
(h4 :class "text-sm font-semibold text-stone-700" "sx-vals — send extra values")
@@ -711,7 +711,7 @@
(div :id "headers-result" :class "p-3 rounded bg-stone-100 text-sm text-stone-400"
"Click to see server-received headers."))))
(defcomp ~echo-result (&key label items)
(defcomp ~examples/echo-result (&key label items)
(div :class "space-y-1"
(p :class "text-stone-800 font-medium" (str "Server received " label ":"))
(map (fn (item)
@@ -720,7 +720,7 @@
;; --- Loading states demo ---
(defcomp ~loading-states-demo ()
(defcomp ~examples/loading-states-demo ()
(div :class "space-y-4"
(button
:sx-get "/sx/(geography.(hypermedia.(example.(api.slow))))"
@@ -732,14 +732,14 @@
(div :id "loading-result" :class "p-4 rounded border border-stone-200 bg-stone-100 text-center"
(p :class "text-stone-400 text-sm" "Click the button — it takes 2 seconds."))))
(defcomp ~loading-result (&key time)
(defcomp ~examples/loading-result (&key time)
(div
(p :class "text-stone-800 font-medium" "Loaded!")
(p :class "text-sm text-stone-500" (str "Response arrived at " time))))
;; --- Sync replace demo (request abort) ---
(defcomp ~sync-replace-demo ()
(defcomp ~examples/sync-replace-demo ()
(div :class "space-y-3"
(input :type "text" :name "q"
:sx-get "/sx/(geography.(hypermedia.(example.(api.slow-search))))"
@@ -752,14 +752,14 @@
(div :id "sync-result" :class "p-4 rounded border border-stone-200 bg-stone-100"
(p :class "text-sm text-stone-400" "Type to trigger requests — stale ones get aborted."))))
(defcomp ~sync-result (&key query delay)
(defcomp ~examples/sync-result (&key query delay)
(div
(p :class "text-stone-800 font-medium" (str "Result for: \"" query "\""))
(p :class "text-sm text-stone-500" (str "Server took " delay "ms to respond"))))
;; --- Retry demo ---
(defcomp ~retry-demo ()
(defcomp ~examples/retry-demo ()
(div :class "space-y-4"
(button
:sx-get "/sx/(geography.(hypermedia.(example.(api.flaky))))"
@@ -771,7 +771,7 @@
(div :id "retry-result" :class "p-4 rounded border border-stone-200 bg-stone-100 text-center"
(p :class "text-stone-400 text-sm" "Endpoint fails twice, succeeds on 3rd attempt."))))
(defcomp ~retry-result (&key attempt message)
(defcomp ~examples/retry-result (&key attempt message)
(div :class "space-y-1"
(p :class "text-stone-800 font-medium" message)
(p :class "text-sm text-stone-500" (str "Succeeded on attempt #" attempt))))