Files
rose-ash/orders/sexp/detail.sexpr
giles 22802bd36b
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 5m35s
Send all responses as sexp wire format with client-side rendering
- 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>
2026-03-01 09:45:07 +00:00

55 lines
2.2 KiB
Plaintext

;; Order detail components
(defcomp ~orders-item-image (&key src alt)
(img :src src :alt alt :class "w-full h-full object-contain object-center" :loading "lazy" :decoding "async"))
(defcomp ~orders-item-no-image ()
(div :class "w-full h-full flex items-center justify-center text-[9px] text-stone-400" "No image"))
(defcomp ~orders-item-row (&key href img title pid qty price)
(li (a :class "w-full py-2 flex gap-3" :href href
(div :class "w-12 h-12 sm:w-14 sm:h-14 rounded-md bg-stone-100 flex-shrink-0 overflow-hidden" img)
(div :class "flex-1 flex justify-between gap-3"
(div
(p :class "font-medium" title)
(p :class "text-[11px] text-stone-500" "Product ID: " pid))
(div :class "text-right whitespace-nowrap"
(p "Qty: " qty)
(p price))))))
(defcomp ~orders-items-section (&key items)
(div :class "rounded-2xl border border-stone-200 bg-white/80 p-4 sm:p-6"
(h2 :class "text-sm sm:text-base font-semibold mb-3" "Items")
(ul :class "divide-y divide-stone-100 text-xs sm:text-sm" items)))
(defcomp ~orders-calendar-item (&key name pill state ds cost)
(li :class "px-4 py-3 flex items-start justify-between text-sm"
(div
(div :class "font-medium flex items-center gap-2"
name
(span :class pill state))
(div :class "text-xs text-stone-500" ds))
(div :class "ml-4 font-medium" cost)))
(defcomp ~orders-calendar-section (&key items)
(section :class "mt-6 space-y-3"
(h2 :class "text-base sm:text-lg font-semibold" "Calendar bookings in this order")
(ul :class "divide-y divide-stone-200 rounded-2xl border border-stone-200 bg-white/80" items)))
(defcomp ~orders-detail-panel (&key summary items calendar)
(div :class "max-w-full px-3 py-3 space-y-4"
summary items calendar))
(defcomp ~orders-detail-header-stack (&key auth orders order)
(div :id "root-header-child" :class "flex flex-col w-full items-center"
auth
(div :id "auth-header-child" :class "flex flex-col w-full items-center"
orders
(div :id "orders-header-child" :class "flex flex-col w-full items-center"
order))))
(defcomp ~orders-header-child-oob (&key inner)
(div :id "orders-header-child" :sx-swap-oob "outerHTML"
:class "flex flex-col w-full items-center"
inner))