giles
22802bd36b
- Server sends sexp source text, client (sexp.js) renders everything - SexpExpr marker class for nested sexp composition in serialize() - sexp_page() HTML shell with data-mount="body" for full page loads - sexp_response() returns text/sexp for OOB/partial responses - ~app-body layout component replaces ~app-layout (no raw!) - ~rich-text is the only component using raw! (for CMS HTML content) - Fragment endpoints return text/sexp, auto-wrapped in SexpExpr - All _*_html() helpers converted to _*_sexp() returning sexp source - Head auto-hoist: sexp.js moves meta/title/link/script[ld+json] from rendered body to document.head automatically - Unknown components render warning box instead of crashing page - Component kwargs preserve AST for lazy rendering (fixes <> in kwargs) - Fix unterminated paren in events/sexp/tickets.sexpr Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
66 lines
3.4 KiB
Plaintext
66 lines
3.4 KiB
Plaintext
;; Blog filter components
|
|
|
|
(defcomp ~blog-action-button (&key href hx-select btn-class title icon-class label)
|
|
(a :href href :sx-get href :sx-target "#main-panel"
|
|
:sx-select hx-select :sx-swap "outerHTML" :sx-push-url "true"
|
|
:class btn-class :title title (i :class icon-class) label))
|
|
|
|
(defcomp ~blog-drafts-button (&key href hx-select btn-class title label draft-count)
|
|
(a :href href :sx-get href :sx-target "#main-panel"
|
|
:sx-select hx-select :sx-swap "outerHTML" :sx-push-url "true"
|
|
:class btn-class :title title (i :class "fa fa-file-text-o mr-1") " Drafts "
|
|
(span :class "inline-block bg-stone-500 text-white px-1.5 py-0.5 text-xs font-medium rounded ml-1" draft-count)))
|
|
|
|
(defcomp ~blog-drafts-button-amber (&key href hx-select btn-class title label draft-count)
|
|
(a :href href :sx-get href :sx-target "#main-panel"
|
|
:sx-select hx-select :sx-swap "outerHTML" :sx-push-url "true"
|
|
:class btn-class :title title (i :class "fa fa-file-text-o mr-1") " Drafts "
|
|
(span :class "inline-block bg-amber-500 text-white px-1.5 py-0.5 text-xs font-medium rounded ml-1" draft-count)))
|
|
|
|
(defcomp ~blog-action-buttons-wrapper (&key inner)
|
|
(div :class "flex flex-wrap gap-2 px-4 py-3" inner))
|
|
|
|
(defcomp ~blog-filter-any-topic (&key cls hx-select)
|
|
(li (a :class (str "px-3 py-1 rounded border " cls)
|
|
:sx-get "?page=1" :sx-target "#main-panel" :sx-select hx-select
|
|
:sx-swap "outerHTML" :sx-push-url "true" "Any Topic")))
|
|
|
|
(defcomp ~blog-filter-group-icon-image (&key src name)
|
|
(img :src src :alt name :class "h-6 w-6 rounded-full object-cover border border-stone-300 flex-shrink-0"))
|
|
|
|
(defcomp ~blog-filter-group-icon-color (&key style initial)
|
|
(div :class "h-6 w-6 rounded-full text-[10px] font-semibold flex items-center justify-center border border-stone-300 flex-shrink-0" :style style initial))
|
|
|
|
(defcomp ~blog-filter-group-li (&key cls hx-get hx-select icon name count)
|
|
(li (a :class (str "flex items-center gap-2 px-3 py-1 rounded border " cls)
|
|
:sx-get hx-get :sx-target "#main-panel" :sx-select hx-select
|
|
:sx-swap "outerHTML" :sx-push-url "true"
|
|
icon
|
|
(span :class "inline-block rounded-full bg-stone-100 text-stone-600 px-2 py-1 text-sm font-medium border border-stone-200" name)
|
|
(span :class "flex-1")
|
|
(span :class "inline-block bg-stone-100 text-stone-600 px-2 py-1 text-xs font-medium border border-stone-200" count))))
|
|
|
|
(defcomp ~blog-filter-nav (&key items)
|
|
(nav :class "max-w-3xl mx-auto px-4 pb-4 flex flex-wrap gap-2 text-sm"
|
|
(ul :class "divide-y flex flex-col gap-3" items)))
|
|
|
|
(defcomp ~blog-filter-any-author (&key cls hx-select)
|
|
(li (a :class (str "px-3 py-1 rounded " cls)
|
|
:sx-get "?page=1" :sx-target "#main-panel" :sx-select hx-select
|
|
:sx-swap "outerHTML" :sx-push-url "true" "Any author")))
|
|
|
|
(defcomp ~blog-filter-author-icon (&key src name)
|
|
(img :src src :alt name :class "h-5 w-5 rounded-full object-cover"))
|
|
|
|
(defcomp ~blog-filter-author-li (&key cls hx-get hx-select icon name count)
|
|
(li (a :class (str "flex items-center gap-2 px-3 py-1 rounded " cls)
|
|
:sx-get hx-get :sx-target "#main-panel" :sx-select hx-select
|
|
:sx-swap "outerHTML" :sx-push-url "true"
|
|
icon
|
|
(span :class "text-stone-700" name)
|
|
(span :class "flex-1")
|
|
(span :class "inline-block bg-stone-100 text-stone-600 px-2 py-1 text-xs font-medium border border-stone-200" count))))
|
|
|
|
(defcomp ~blog-filter-summary (&key text)
|
|
(span :class "text-sm text-stone-600" text))
|