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>

cart/app.py

@@ -50,7 +50,7 @@ async def cart_context() -> dict:
     - cart / calendar_cart_entries / total / calendar_total: direct DB
       (cart app owns this data)
     - cart_count: derived from cart + calendar entries (for _mini.html)
-    - nav_tree_html: fetched from blog as fragment
+    - nav_tree: fetched from blog as fragment
 
     When g.page_post exists, cart and calendar_cart_entries are page-scoped.
     Global cart_count / cart_total stay global for cart-mini.
@@ -73,14 +73,14 @@ async def cart_context() -> dict:
     if ident["session_id"] is not None:
         cart_params["session_id"] = ident["session_id"]
 
-    cart_mini_html, auth_menu_html, nav_tree_html = await fetch_fragments([
+    cart_mini, auth_menu, nav_tree = await fetch_fragments([
         ("cart", "cart-mini", cart_params or None),
         ("account", "auth-menu", {"email": user.email} if user else None),
         ("blog", "nav-tree", {"app_name": "cart", "path": request.path}),
     ])
-    ctx["cart_mini_html"] = cart_mini_html
-    ctx["auth_menu_html"] = auth_menu_html
-    ctx["nav_tree_html"] = nav_tree_html
+    ctx["cart_mini"] = cart_mini
+    ctx["auth_menu"] = auth_menu
+    ctx["nav_tree"] = nav_tree
 
     # Cart app owns cart data — use g.cart from _load_cart
     all_cart = getattr(g, "cart", None) or []

cart/bp/cart/global_routes.py

@@ -54,7 +54,7 @@ def register(url_prefix: str) -> Blueprint:
         if not cart_item:
             return await make_response("Product not found", 404)
 
-        if request.headers.get("HX-Request") == "true":
+        if request.headers.get("SX-Request") == "true" or request.headers.get("HX-Request") == "true":
             # Redirect to overview for HTMX
             return redirect(url_for("cart_overview.overview"))
 

cart/bp/cart/overview_routes.py

@@ -5,6 +5,7 @@ from __future__ import annotations
 from quart import Blueprint, render_template, make_response
 
 from shared.browser.app.utils.htmx import is_htmx_request
+from shared.sexp.helpers import sexp_response
 from .services import get_cart_grouped_by_page
 
 
@@ -22,8 +23,9 @@ def register(url_prefix: str) -> Blueprint:
 
         if not is_htmx_request():
             html = await render_overview_page(ctx, page_groups)
+            return await make_response(html)
         else:
-            html = await render_overview_oob(ctx, page_groups)
-        return await make_response(html)
+            sexp_src = await render_overview_oob(ctx, page_groups)
+            return sexp_response(sexp_src)
 
     return bp

cart/bp/cart/page_routes.py

@@ -5,6 +5,7 @@ from __future__ import annotations
 from quart import Blueprint, g, redirect, make_response, url_for
 
 from shared.browser.app.utils.htmx import is_htmx_request
+from shared.sexp.helpers import sexp_response
 from shared.infrastructure.actions import call_action
 from .services import (
     total,
@@ -49,12 +50,13 @@ def register(url_prefix: str) -> Blueprint:
                 ctx, post, cart, cal_entries, page_tickets,
                 ticket_groups, total, calendar_total, ticket_total,
             )
+            return await make_response(html)
         else:
-            html = await render_page_cart_oob(
+            sexp_src = await render_page_cart_oob(
                 ctx, post, cart, cal_entries, page_tickets,
                 ticket_groups, total, calendar_total, ticket_total,
             )
-        return await make_response(html)
+            return sexp_response(sexp_src)
 
     @bp.post("/checkout/")
     async def page_checkout():

cart/bp/fragments/routes.py

@@ -1,6 +1,6 @@
 """Cart app fragment endpoints.
 
-Exposes HTML fragments at ``/internal/fragments/<type>`` for consumption
+Exposes sexp fragments at ``/internal/fragments/<type>`` for consumption
 by other coop apps via the fragment client.
 
 Fragments:
@@ -19,13 +19,13 @@ def register():
     bp = Blueprint("fragments", __name__, url_prefix="/internal/fragments")
 
     # ---------------------------------------------------------------
-    # Fragment handlers
+    # Fragment handlers — return sexp source text
     # ---------------------------------------------------------------
 
     async def _cart_mini():
         from shared.services.registry import services
         from shared.infrastructure.urls import blog_url, cart_url
-        from shared.sexp.jinja_bridge import sexp as render_sexp
+        from shared.sexp.helpers import sexp_call
 
         user_id = request.args.get("user_id", type=int)
         session_id = request.args.get("session_id")
@@ -35,19 +35,19 @@ def register():
         )
         count = summary.count + summary.calendar_count + summary.ticket_count
         oob = request.args.get("oob", "")
-        return render_sexp(
-            '(~cart-mini :cart-count cart-count :blog-url blog-url :cart-url cart-url :oob oob)',
-            **{"cart-count": count, "blog-url": blog_url(""), "cart-url": cart_url(""), "oob": oob or None},
-        )
+        return sexp_call("cart-mini",
+                         cart_count=count,
+                         blog_url=blog_url(""),
+                         cart_url=cart_url(""),
+                         oob=oob or None)
 
     async def _account_nav_item():
         from shared.infrastructure.urls import cart_url
-        from shared.sexp.jinja_bridge import sexp as render_sexp
+        from shared.sexp.helpers import sexp_call
 
-        return render_sexp(
-            '(~account-nav-item :href href :label "orders")',
-            href=cart_url("/orders/"),
-        )
+        return sexp_call("account-nav-item",
+                         href=cart_url("/orders/"),
+                         label="orders")
 
     _handlers = {
         "cart-mini": _cart_mini,
@@ -67,8 +67,8 @@ def register():
     async def get_fragment(fragment_type: str):
         handler = _handlers.get(fragment_type)
         if handler is None:
-            return Response("", status=200, content_type="text/html")
-        html = await handler()
-        return Response(html, status=200, content_type="text/html")
+            return Response("", status=200, content_type="text/sexp")
+        src = await handler()
+        return Response(src, status=200, content_type="text/sexp")
 
     return bp

cart/bp/order/routes.py

@@ -13,6 +13,7 @@ from shared.infrastructure.http_utils import vary as _vary, current_url_without_
 from shared.infrastructure.cart_identity import current_cart_identity
 from bp.cart.services import check_sumup_status
 from shared.browser.app.utils.htmx import is_htmx_request
+from shared.sexp.helpers import sexp_response
 
 from .filters.qs import makeqs_factory, decode
 
@@ -63,10 +64,10 @@ def register() -> Blueprint:
 
         if not is_htmx_request():
             html = await render_order_page(ctx, order, calendar_entries, url_for)
+            return await make_response(html)
         else:
-            html = await render_order_oob(ctx, order, calendar_entries, url_for)
-
-        return await make_response(html)
+            sexp_src = await render_order_oob(ctx, order, calendar_entries, url_for)
+            return sexp_response(sexp_src)
 
     @bp.get("/pay/")
     async def order_pay(order_id: int):

cart/bp/orders/routes.py

@@ -13,6 +13,7 @@ from shared.infrastructure.http_utils import vary as _vary, current_url_without_
 from shared.infrastructure.cart_identity import current_cart_identity
 from bp.cart.services import check_sumup_status
 from shared.browser.app.utils.htmx import is_htmx_request
+from shared.sexp.helpers import sexp_response
 from bp import register_order
 
 from .filters.qs import makeqs_factory, decode
@@ -151,17 +152,18 @@ def register(url_prefix: str) -> Blueprint:
                 ctx, orders, page, total_pages, search, total_count,
                 url_for, qs_fn,
             )
+            resp = await make_response(html)
         elif page > 1:
-            html = await render_orders_rows(
+            sexp_src = await render_orders_rows(
                 ctx, orders, page, total_pages, url_for, qs_fn,
             )
+            resp = sexp_response(sexp_src)
         else:
-            html = await render_orders_oob(
+            sexp_src = await render_orders_oob(
                 ctx, orders, page, total_pages, search, total_count,
                 url_for, qs_fn,
             )
-
-        resp = await make_response(html)
+            resp = sexp_response(sexp_src)
         resp.headers["Hx-Push-Url"] = _current_url_without_page()
         return _vary(resp)
 

cart/bp/page_admin/routes.py

@@ -8,6 +8,7 @@ from shared.infrastructure.actions import call_action
 from shared.infrastructure.data_client import fetch_data
 from shared.browser.app.authz import require_admin
 from shared.browser.app.utils.htmx import is_htmx_request
+from shared.sexp.helpers import sexp_response
 
 
 def register():
@@ -23,9 +24,10 @@ def register():
         page_post = getattr(g, "page_post", None)
         if not is_htmx_request():
             html = await render_cart_admin_page(ctx, page_post)
+            return await make_response(html)
         else:
-            html = await render_cart_admin_oob(ctx, page_post)
-        return await make_response(html)
+            sexp_src = await render_cart_admin_oob(ctx, page_post)
+            return sexp_response(sexp_src)
 
     @bp.get("/payments/")
     @require_admin
@@ -37,9 +39,10 @@ def register():
         page_post = getattr(g, "page_post", None)
         if not is_htmx_request():
             html = await render_cart_payments_page(ctx, page_post)
+            return await make_response(html)
         else:
-            html = await render_cart_payments_oob(ctx, page_post)
-        return await make_response(html)
+            sexp_src = await render_cart_payments_oob(ctx, page_post)
+            return sexp_response(sexp_src)
 
     @bp.put("/payments/")
     @require_admin
@@ -78,6 +81,6 @@ def register():
         from sexp.sexp_components import render_cart_payments_panel
         ctx = await get_template_context()
         html = render_cart_payments_panel(ctx)
-        return await make_response(html)
+        return sexp_response(html)
 
     return bp

cart/sexp/calendar.sexpr

@@ -2,11 +2,11 @@
 
 (defcomp ~cart-cal-entry (&key name date-str cost)
   (li :class "flex items-start justify-between text-sm"
-    (div (div :class "font-medium" (raw! name))
-      (div :class "text-xs text-stone-500" (raw! date-str)))
-    (div :class "ml-4 font-medium" (raw! cost))))
+    (div (div :class "font-medium" name)
+      (div :class "text-xs text-stone-500" date-str))
+    (div :class "ml-4 font-medium" cost)))
 
-(defcomp ~cart-cal-section (&key items-html)
+(defcomp ~cart-cal-section (&key items)
   (div :class "mt-6 border-t border-stone-200 pt-4"
     (h2 :class "text-base font-semibold mb-2" "Calendar bookings")
-    (ul :class "space-y-2" (raw! items-html))))
+    (ul :class "space-y-2" items)))

cart/sexp/checkout.sexpr

@@ -8,13 +8,13 @@
 
 (defcomp ~cart-checkout-error-order-id (&key order-id)
   (p :class "text-xs text-rose-800/80"
-    "Order ID: " (span :class "font-mono" (raw! order-id))))
+    "Order ID: " (span :class "font-mono" order-id)))
 
-(defcomp ~cart-checkout-error-content (&key error-msg order-html back-url)
+(defcomp ~cart-checkout-error-content (&key error-msg order back-url)
   (div :class "max-w-full px-3 py-3 space-y-4"
     (div :class "rounded-2xl border border-rose-200 bg-rose-50/80 p-4 sm:p-6 text-sm text-rose-900 space-y-2"
       (p :class "font-medium" "Something went wrong.")
-      (p (raw! error-msg))
-      (raw! order-html))
+      (p error-msg)
+      order)
     (div (a :href back-url :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"
       (i :class "fa fa-shopping-cart mr-2" :aria-hidden "true") "Back to cart"))))

cart/sexp/header.sexpr

@@ -7,38 +7,38 @@
   (a :href href :class "inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"
     (i :class "fa fa-arrow-left text-xs" :aria-hidden "true") "All carts"))
 
-(defcomp ~cart-header-child (&key inner-html)
+(defcomp ~cart-header-child (&key inner)
   (div :id "root-header-child" :class "flex flex-col w-full items-center"
-    (raw! inner-html)))
+    inner))
 
-(defcomp ~cart-header-child-nested (&key outer-html inner-html)
+(defcomp ~cart-header-child-nested (&key outer inner)
   (div :id "root-header-child" :class "flex flex-col w-full items-center"
-    (raw! outer-html)
+    outer
     (div :id "cart-header-child" :class "flex flex-col w-full items-center"
-      (raw! inner-html))))
+      inner)))
 
-(defcomp ~cart-header-child-oob (&key inner-html)
-  (div :id "cart-header-child" :hx-swap-oob "outerHTML" :class "flex flex-col w-full items-center"
-    (raw! inner-html)))
+(defcomp ~cart-header-child-oob (&key inner)
+  (div :id "cart-header-child" :sx-swap-oob "outerHTML" :class "flex flex-col w-full items-center"
+    inner))
 
-(defcomp ~cart-auth-header-child (&key auth-html orders-html)
+(defcomp ~cart-auth-header-child (&key auth orders)
   (div :id "root-header-child" :class "flex flex-col w-full items-center"
-    (raw! auth-html)
+    auth
     (div :id "auth-header-child" :class "flex flex-col w-full items-center"
-      (raw! orders-html))))
+      orders)))
 
-(defcomp ~cart-auth-header-child-oob (&key inner-html)
-  (div :id "auth-header-child" :hx-swap-oob "outerHTML" :class "flex flex-col w-full items-center"
-    (raw! inner-html)))
+(defcomp ~cart-auth-header-child-oob (&key inner)
+  (div :id "auth-header-child" :sx-swap-oob "outerHTML" :class "flex flex-col w-full items-center"
+    inner))
 
-(defcomp ~cart-order-header-child (&key auth-html orders-html order-html)
+(defcomp ~cart-order-header-child (&key auth orders order)
   (div :id "root-header-child" :class "flex flex-col w-full items-center"
-    (raw! auth-html)
+    auth
     (div :id "auth-header-child" :class "flex flex-col w-full items-center"
-      (raw! orders-html)
+      orders
       (div :id "orders-header-child" :class "flex flex-col w-full items-center"
-        (raw! order-html)))))
+        order))))
 
-(defcomp ~cart-orders-header-child-oob (&key inner-html)
-  (div :id "orders-header-child" :hx-swap-oob "outerHTML" :class "flex flex-col w-full items-center"
-    (raw! inner-html)))
+(defcomp ~cart-orders-header-child-oob (&key inner)
+  (div :id "orders-header-child" :sx-swap-oob "outerHTML" :class "flex flex-col w-full items-center"
+    inner))

cart/sexp/items.sexpr

@@ -8,10 +8,10 @@
     "No image"))
 
 (defcomp ~cart-item-price (&key text)
-  (p :class "text-sm sm:text-base font-semibold text-stone-900" (raw! text)))
+  (p :class "text-sm sm:text-base font-semibold text-stone-900" text))
 
 (defcomp ~cart-item-price-was (&key text)
-  (p :class "text-xs text-stone-400 line-through" (raw! text)))
+  (p :class "text-xs text-stone-400 line-through" text))
 
 (defcomp ~cart-item-no-price ()
   (p :class "text-xs text-stone-500" "No price"))
@@ -22,34 +22,34 @@
     " This item is no longer available or price has changed"))
 
 (defcomp ~cart-item-brand (&key brand)
-  (p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" (raw! brand)))
+  (p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" brand))
 
 (defcomp ~cart-item-line-total (&key text)
-  (p :class "text-sm sm:text-base font-semibold text-stone-900" (raw! text)))
+  (p :class "text-sm sm:text-base font-semibold text-stone-900" text))
 
-(defcomp ~cart-item (&key id img-html prod-url title brand-html deleted-html price-html qty-url csrf minus qty plus line-total-html)
+(defcomp ~cart-item (&key id img prod-url title brand deleted price qty-url csrf minus qty plus line-total)
   (article :id id :class "flex flex-col sm:flex-row gap-3 sm:gap-4 rounded-2xl bg-white shadow-sm border border-stone-200 p-3 sm:p-4 md:p-5"
-    (div :class "w-full sm:w-32 shrink-0 flex justify-center sm:block" (raw! img-html))
+    (div :class "w-full sm:w-32 shrink-0 flex justify-center sm:block" (when img img))
     (div :class "flex-1 min-w-0"
       (div :class "flex flex-col sm:flex-row sm:items-start justify-between gap-2 sm:gap-3"
         (div :class "min-w-0"
           (h2 :class "text-sm sm:text-base md:text-lg font-semibold text-stone-900"
-            (a :href prod-url :class "hover:text-emerald-700" (raw! title)))
-          (raw! brand-html) (raw! deleted-html))
-        (div :class "text-left sm:text-right" (raw! price-html)))
+            (a :href prod-url :class "hover:text-emerald-700" title))
+          (when brand brand) (when deleted deleted))
+        (div :class "text-left sm:text-right" (when price price)))
       (div :class "mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2 sm:gap-4"
         (div :class "flex items-center gap-2 text-xs sm:text-sm text-stone-700"
           (span :class "text-[0.65rem] sm:text-xs uppercase tracking-wide text-stone-500" "Quantity")
-          (form :action qty-url :method "post" :hx-post qty-url :hx-swap "none"
+          (form :action qty-url :method "post" :sx-post qty-url :sx-swap "none"
             (input :type "hidden" :name "csrf_token" :value csrf)
             (input :type "hidden" :name "count" :value minus)
             (button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "-"))
-          (span :class "inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium" (raw! qty))
-          (form :action qty-url :method "post" :hx-post qty-url :hx-swap "none"
+          (span :class "inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium" qty)
+          (form :action qty-url :method "post" :sx-post qty-url :sx-swap "none"
             (input :type "hidden" :name "csrf_token" :value csrf)
             (input :type "hidden" :name "count" :value plus)
             (button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "+")))
-        (div :class "flex items-center justify-between sm:justify-end gap-3" (raw! line-total-html))))))
+        (div :class "flex items-center justify-between sm:justify-end gap-3" (when line-total line-total))))))
 
 (defcomp ~cart-page-empty ()
   (div :class "max-w-full px-3 py-3 space-y-3"
@@ -59,8 +59,8 @@
           (i :class "fa fa-shopping-cart text-stone-500 text-sm sm:text-base" :aria-hidden "true"))
         (p :class "text-base sm:text-lg font-medium text-stone-800" "Your cart is empty")))))
 
-(defcomp ~cart-page-panel (&key items-html cal-html tickets-html summary-html)
+(defcomp ~cart-page-panel (&key items cal tickets summary)
   (div :class "max-w-full px-3 py-3 space-y-3"
     (div :id "cart"
-      (div (section :class "space-y-3 sm:space-y-4" (raw! items-html) (raw! cal-html) (raw! tickets-html))
-        (raw! summary-html)))))
+      (div (section :class "space-y-3 sm:space-y-4" items cal tickets)
+        summary))))

cart/sexp/order_detail.sexpr

@@ -6,43 +6,43 @@
 (defcomp ~cart-order-item-no-img ()
   (div :class "w-full h-full flex items-center justify-center text-[9px] text-stone-400" "No image"))
 
-(defcomp ~cart-order-item (&key prod-url img-html title product-id qty price)
+(defcomp ~cart-order-item (&key prod-url img title product-id qty price)
   (li (a :class "w-full py-2 flex gap-3" :href prod-url
-    (div :class "w-12 h-12 sm:w-14 sm:h-14 rounded-md bg-stone-100 flex-shrink-0 overflow-hidden" (raw! img-html))
+    (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" (raw! title))
-        (p :class "text-[11px] text-stone-500" (raw! product-id)))
+      (div (p :class "font-medium" title)
+        (p :class "text-[11px] text-stone-500" product-id))
       (div :class "text-right whitespace-nowrap"
-        (p (raw! qty)) (p (raw! price)))))))
+        (p qty) (p price))))))
 
-(defcomp ~cart-order-items-panel (&key items-html)
+(defcomp ~cart-order-items-panel (&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" (raw! items-html))))
+    (ul :class "divide-y divide-stone-100 text-xs sm:text-sm" items)))
 
 (defcomp ~cart-order-cal-entry (&key name pill status date-str cost)
   (li :class "px-4 py-3 flex items-start justify-between text-sm"
     (div (div :class "font-medium flex items-center gap-2"
-      (raw! name) (span :class pill (raw! status)))
-      (div :class "text-xs text-stone-500" (raw! date-str)))
-    (div :class "ml-4 font-medium" (raw! cost))))
+      name (span :class pill status))
+      (div :class "text-xs text-stone-500" date-str))
+    (div :class "ml-4 font-medium" cost)))
 
-(defcomp ~cart-order-cal-section (&key items-html)
+(defcomp ~cart-order-cal-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" (raw! items-html))))
+    (ul :class "divide-y divide-stone-200 rounded-2xl border border-stone-200 bg-white/80" items)))
 
-(defcomp ~cart-order-main (&key summary-html items-html cal-html)
-  (div :class "max-w-full px-3 py-3 space-y-4" (raw! summary-html) (raw! items-html) (raw! cal-html)))
+(defcomp ~cart-order-main (&key summary items cal)
+  (div :class "max-w-full px-3 py-3 space-y-4" summary items cal))
 
 (defcomp ~cart-order-pay-btn (&key url)
   (a :href url :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-emerald-600 bg-emerald-600 text-white hover:bg-emerald-700 transition"
     (i :class "fa fa-credit-card mr-2" :aria-hidden "true") "Open payment page"))
 
-(defcomp ~cart-order-filter (&key info list-url recheck-url csrf pay-html)
+(defcomp ~cart-order-filter (&key info list-url recheck-url csrf pay)
   (header :class "mb-6 sm:mb-8 flex flex-col sm:flex-row sm:items-center justify-between gap-3 sm:gap-4"
     (div :class "space-y-1"
-      (p :class "text-xs sm:text-sm text-stone-600" (raw! info)))
+      (p :class "text-xs sm:text-sm text-stone-600" info))
     (div :class "flex w-full sm:w-auto justify-start sm:justify-end gap-2"
       (a :href list-url :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"
         (i :class "fa-solid fa-list mr-2" :aria-hidden "true") "All orders")
@@ -50,4 +50,4 @@
         (input :type "hidden" :name "csrf_token" :value csrf)
         (button :type "submit" :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"
           (i :class "fa-solid fa-rotate mr-2" :aria-hidden "true") "Re-check status"))
-      (raw! pay-html))))
+      pay)))

cart/sexp/orders.sexpr

@@ -2,11 +2,11 @@
 
 (defcomp ~cart-order-row-desktop (&key order-id created desc total pill status detail-url)
   (tr :class "hidden sm:table-row border-t border-stone-100 hover:bg-stone-50/60"
-    (td :class "px-3 py-2 align-top" (span :class "font-mono text-[11px] sm:text-xs" (raw! order-id)))
-    (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" (raw! created))
-    (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" (raw! desc))
-    (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" (raw! total))
-    (td :class "px-3 py-2 align-top" (span :class pill (raw! status)))
+    (td :class "px-3 py-2 align-top" (span :class "font-mono text-[11px] sm:text-xs" order-id))
+    (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" created)
+    (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" desc)
+    (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" total)
+    (td :class "px-3 py-2 align-top" (span :class pill status))
     (td :class "px-3 py-0.5 align-top text-right"
       (a :href detail-url :class "inline-flex items-center px-3 py-1.5 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition" "View"))))
 
@@ -15,11 +15,11 @@
     (td :colspan "5" :class "px-3 py-3"
       (div :class "flex flex-col gap-2 text-xs"
         (div :class "flex items-center justify-between gap-2"
-          (span :class "font-mono text-[11px] text-stone-700" (raw! order-id))
-          (span :class pill (raw! status)))
-        (div :class "text-[11px] text-stone-500 break-words" (raw! created))
+          (span :class "font-mono text-[11px] text-stone-700" order-id)
+          (span :class pill status))
+        (div :class "text-[11px] text-stone-500 break-words" created)
         (div :class "flex items-center justify-between gap-2"
-          (div :class "font-medium text-stone-800" (raw! total))
+          (div :class "font-medium text-stone-800" total)
           (a :href detail-url :class "inline-flex items-center px-2 py-1 text-[11px] rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition shrink-0" "View"))))))
 
 (defcomp ~cart-orders-end ()
@@ -30,7 +30,7 @@
     (div :class "rounded-2xl border border-dashed border-stone-300 bg-white/80 p-4 sm:p-6 text-sm text-stone-700"
       "No orders yet.")))
 
-(defcomp ~cart-orders-table (&key rows-html)
+(defcomp ~cart-orders-table (&key rows)
   (div :class "max-w-full px-3 py-3 space-y-3"
     (div :class "overflow-x-auto rounded-2xl border border-stone-200 bg-white/80"
       (table :class "min-w-full text-xs sm:text-sm"
@@ -42,10 +42,10 @@
             (th :class "px-3 py-2 text-left font-medium" "Total")
             (th :class "px-3 py-2 text-left font-medium" "Status")
             (th :class "px-3 py-2 text-left font-medium")))
-        (tbody (raw! rows-html))))))
+        (tbody rows)))))
 
-(defcomp ~cart-orders-filter (&key search-mobile-html)
+(defcomp ~cart-orders-filter (&key search-mobile)
   (header :class "mb-6 sm:mb-8 flex flex-col sm:flex-row sm:items-center justify-between gap-3 sm:gap-4"
     (div :class "space-y-1"
       (p :class "text-xs sm:text-sm text-stone-600" "Recent orders placed via the checkout."))
-    (div :class "md:hidden" (raw! search-mobile-html))))
+    (div :class "md:hidden" search-mobile)))

cart/sexp/overview.sexpr

@@ -2,11 +2,11 @@
 
 (defcomp ~cart-badge (&key icon text)
   (span :class "inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-stone-100"
-    (i :class icon :aria-hidden "true") (raw! text)))
+    (i :class icon :aria-hidden "true") text))
 
-(defcomp ~cart-badges-wrap (&key badges-html)
+(defcomp ~cart-badges-wrap (&key badges)
   (div :class "mt-1 flex flex-wrap gap-2 text-xs text-stone-600"
-    (raw! badges-html)))
+    badges))
 
 (defcomp ~cart-group-card-img (&key src alt)
   (img :src src :alt alt :class "h-16 w-16 rounded-xl object-cover border border-stone-200 flex-shrink-0"))
@@ -16,29 +16,29 @@
     (i :class "fa fa-store text-stone-400 text-xl" :aria-hidden "true")))
 
 (defcomp ~cart-mp-subtitle (&key title)
-  (p :class "text-xs text-stone-500 truncate" (raw! title)))
+  (p :class "text-xs text-stone-500 truncate" title))
 
-(defcomp ~cart-group-card (&key href img-html display-title subtitle-html badges-html total)
+(defcomp ~cart-group-card (&key href img display-title subtitle badges total)
   (a :href href :class "block rounded-2xl border border-stone-200 bg-white shadow-sm hover:shadow-md hover:border-stone-300 transition p-4 sm:p-5"
     (div :class "flex items-start gap-4"
-      (raw! img-html)
+      img
       (div :class "flex-1 min-w-0"
-        (h3 :class "text-base sm:text-lg font-semibold text-stone-900 truncate" (raw! display-title))
-        (raw! subtitle-html) (raw! badges-html))
+        (h3 :class "text-base sm:text-lg font-semibold text-stone-900 truncate" display-title)
+        subtitle badges)
       (div :class "text-right flex-shrink-0"
-        (div :class "text-lg font-bold text-stone-900" (raw! total))
+        (div :class "text-lg font-bold text-stone-900" total)
         (div :class "mt-1 text-xs text-emerald-700 font-medium" "View cart \u2192")))))
 
-(defcomp ~cart-orphan-card (&key badges-html total)
+(defcomp ~cart-orphan-card (&key badges total)
   (div :class "rounded-2xl border border-dashed border-amber-300 bg-amber-50/60 p-4 sm:p-5"
     (div :class "flex items-start gap-4"
       (div :class "h-16 w-16 rounded-xl bg-amber-100 flex items-center justify-center flex-shrink-0"
         (i :class "fa fa-shopping-cart text-amber-500 text-xl" :aria-hidden "true"))
       (div :class "flex-1 min-w-0"
         (h3 :class "text-base sm:text-lg font-semibold text-stone-900" "Other items")
-        (raw! badges-html))
+        badges)
       (div :class "text-right flex-shrink-0"
-        (div :class "text-lg font-bold text-stone-900" (raw! total))))))
+        (div :class "text-lg font-bold text-stone-900" total)))))
 
 (defcomp ~cart-empty ()
   (div :class "max-w-full px-3 py-3 space-y-3"
@@ -47,6 +47,6 @@
         (i :class "fa fa-shopping-cart text-stone-500 text-sm sm:text-base" :aria-hidden "true"))
       (p :class "text-base sm:text-lg font-medium text-stone-800" "Your cart is empty"))))
 
-(defcomp ~cart-overview-panel (&key cards-html)
+(defcomp ~cart-overview-panel (&key cards)
   (div :class "max-w-full px-3 py-3 space-y-3"
-    (div :class "space-y-4" (raw! cards-html))))
+    (div :class "space-y-4" cards)))

cart/sexp/payments.sexpr

@@ -6,7 +6,7 @@
       (h3 :class "text-lg font-semibold text-stone-800"
         (i :class "fa fa-credit-card text-purple-600 mr-1") " SumUp Payment")
       (p :class "text-xs text-stone-400" "Configure per-page SumUp credentials. Leave blank to use the global merchant account.")
-      (form :hx-put update-url :hx-target "#payments-panel" :hx-swap "outerHTML" :hx-select "#payments-panel" :class "space-y-3"
+      (form :sx-put update-url :sx-target "#payments-panel" :sx-swap "outerHTML" :sx-select "#payments-panel" :class "space-y-3"
         (input :type "hidden" :name "csrf_token" :value csrf)
         (div (label :class "block text-xs font-medium text-stone-600 mb-1" "Merchant Code")
           (input :type "text" :name "merchant_code" :value merchant-code :placeholder "e.g. ME4J6100" :class input-cls))

cart/sexp/sexp_components.py

@@ -12,9 +12,11 @@ from markupsafe import escape
 
 from shared.sexp.jinja_bridge import render, load_service_components
 from shared.sexp.helpers import (
-    call_url, root_header_html, post_admin_header_html,
-    post_header_html as _shared_post_header_html,
-    search_desktop_html, search_mobile_html, full_page, oob_page,
+    call_url, root_header_sexp, post_admin_header_sexp,
+    post_header_sexp as _shared_post_header_sexp,
+    search_desktop_sexp, search_mobile_sexp,
+    full_page_sexp, oob_page_sexp, header_child_sexp,
+    sexp_call, SexpExpr,
 )
 from shared.infrastructure.urls import market_product_url, cart_url
 
@@ -27,7 +29,7 @@ load_service_components(os.path.dirname(os.path.dirname(__file__)))
 # ---------------------------------------------------------------------------
 
 def _ensure_post_ctx(ctx: dict, page_post: Any) -> dict:
-    """Ensure ctx has a 'post' dict from page_post DTO (for shared post_header_html)."""
+    """Ensure ctx has a 'post' dict from page_post DTO (for shared post_header_sexp)."""
     if ctx.get("post") or not page_post:
         return ctx
     ctx = {**ctx, "post": {
@@ -40,8 +42,8 @@ def _ensure_post_ctx(ctx: dict, page_post: Any) -> dict:
 
 
 async def _ensure_container_nav(ctx: dict) -> dict:
-    """Fetch container_nav_html if not already present (for post header row)."""
-    if ctx.get("container_nav_html"):
+    """Fetch container_nav if not already present (for post header row)."""
+    if ctx.get("container_nav"):
         return ctx
     post = ctx.get("post") or {}
     post_id = post.get("id")
@@ -58,20 +60,20 @@ async def _ensure_container_nav(ctx: dict) -> dict:
         ("events", "container-nav", nav_params),
         ("market", "container-nav", nav_params),
     ], required=False)
-    return {**ctx, "container_nav_html": events_nav + market_nav}
+    return {**ctx, "container_nav": events_nav + market_nav}
 
 
-async def _post_header_html(ctx: dict, page_post: Any, *, oob: bool = False) -> str:
+async def _post_header_sexp(ctx: dict, page_post: Any, *, oob: bool = False) -> str:
     """Build post-level header row from page_post DTO, using shared helper."""
     ctx = _ensure_post_ctx(ctx, page_post)
     ctx = await _ensure_container_nav(ctx)
-    return _shared_post_header_html(ctx, oob=oob)
+    return _shared_post_header_sexp(ctx, oob=oob)
 
 
-def _cart_header_html(ctx: dict, *, oob: bool = False) -> str:
+def _cart_header_sexp(ctx: dict, *, oob: bool = False) -> str:
     """Build the cart section header row."""
-    return render(
-        "menu-row",
+    return sexp_call(
+        "menu-row-sx",
         id="cart-row", level=1, colour="sky",
         link_href=call_url(ctx, "cart_url", "/"),
         link_label="cart", icon="fa fa-shopping-cart",
@@ -79,27 +81,29 @@ def _cart_header_html(ctx: dict, *, oob: bool = False) -> str:
     )
 
 
-def _page_cart_header_html(ctx: dict, page_post: Any, *, oob: bool = False) -> str:
+def _page_cart_header_sexp(ctx: dict, page_post: Any, *, oob: bool = False) -> str:
     """Build the per-page cart header row."""
     slug = page_post.slug if page_post else ""
     title = ((page_post.title if page_post else None) or "")[:160]
-    label_html = ""
+    label_parts = []
     if page_post and page_post.feature_image:
-        label_html += render("cart-page-label-img", src=page_post.feature_image)
-    label_html += f"<span>{title}</span>"
-    nav_html = render("cart-all-carts-link", href=call_url(ctx, "cart_url", "/"))
-    return render(
-        "menu-row",
+        label_parts.append(sexp_call("cart-page-label-img", src=page_post.feature_image))
+    label_parts.append(f'(span "{escape(title)}")')
+    label_sexp = "(<> " + " ".join(label_parts) + ")"
+    nav_sexp = sexp_call("cart-all-carts-link", href=call_url(ctx, "cart_url", "/"))
+    return sexp_call(
+        "menu-row-sx",
         id="page-cart-row", level=2, colour="sky",
         link_href=call_url(ctx, "cart_url", f"/{slug}/"),
-        link_label_html=label_html, nav_html=nav_html, oob=oob,
+        link_label_content=SexpExpr(label_sexp),
+        nav=SexpExpr(nav_sexp), oob=oob,
     )
 
 
-def _auth_header_html(ctx: dict, *, oob: bool = False) -> str:
+def _auth_header_sexp(ctx: dict, *, oob: bool = False) -> str:
     """Build the account section header row (for orders)."""
-    return render(
-        "menu-row",
+    return sexp_call(
+        "menu-row-sx",
         id="auth-row", level=1, colour="sky",
         link_href=call_url(ctx, "account_url", "/"),
         link_label="account", icon="fa-solid fa-user",
@@ -107,10 +111,10 @@ def _auth_header_html(ctx: dict, *, oob: bool = False) -> str:
     )
 
 
-def _orders_header_html(ctx: dict, list_url: str) -> str:
+def _orders_header_sexp(ctx: dict, list_url: str) -> str:
     """Build the orders section header row."""
-    return render(
-        "menu-row",
+    return sexp_call(
+        "menu-row-sx",
         id="orders-row", level=2, colour="sky",
         link_href=list_url, link_label="Orders", icon="fa fa-gbp",
         child_id="orders-header-child",
@@ -121,13 +125,13 @@ def _orders_header_html(ctx: dict, list_url: str) -> str:
 # Cart overview
 # ---------------------------------------------------------------------------
 
-def _badge_html(icon: str, count: int, label: str) -> str:
+def _badge_sexp(icon: str, count: int, label: str) -> str:
     """Render a count badge."""
     s = "s" if count != 1 else ""
-    return render("cart-badge", icon=icon, text=f"{count} {label}{s}")
+    return sexp_call("cart-badge", icon=icon, text=f"{count} {label}{s}")
 
 
-def _page_group_card_html(grp: Any, ctx: dict) -> str:
+def _page_group_card_sexp(grp: Any, ctx: dict) -> str:
     """Render a single page group card for cart overview."""
     post = grp.get("post") if isinstance(grp, dict) else getattr(grp, "post", None)
     cart_items = grp.get("cart_items", []) if isinstance(grp, dict) else getattr(grp, "cart_items", [])
@@ -143,14 +147,15 @@ def _page_group_card_html(grp: Any, ctx: dict) -> str:
         return ""
 
     # Count badges
-    badges = ""
+    badge_parts = []
     if product_count > 0:
-        badges += _badge_html("fa fa-box-open", product_count, "item")
+        badge_parts.append(_badge_sexp("fa fa-box-open", product_count, "item"))
     if calendar_count > 0:
-        badges += _badge_html("fa fa-calendar", calendar_count, "booking")
+        badge_parts.append(_badge_sexp("fa fa-calendar", calendar_count, "booking"))
     if ticket_count > 0:
-        badges += _badge_html("fa fa-ticket", ticket_count, "ticket")
-    badges_html = render("cart-badges-wrap", badges_html=badges)
+        badge_parts.append(_badge_sexp("fa fa-ticket", ticket_count, "ticket"))
+    badges_sexp = "(<> " + " ".join(badge_parts) + ")" if badge_parts else '""'
+    badges_wrap = sexp_call("cart-badges-wrap", badges=SexpExpr(badges_sexp))
 
     if post:
         slug = post.slug if hasattr(post, "slug") else post.get("slug", "")
@@ -159,58 +164,58 @@ def _page_group_card_html(grp: Any, ctx: dict) -> str:
         cart_href = call_url(ctx, "cart_url", f"/{slug}/")
 
         if feature_image:
-            img = render("cart-group-card-img", src=feature_image, alt=title)
+            img = sexp_call("cart-group-card-img", src=feature_image, alt=title)
         else:
-            img = render("cart-group-card-placeholder")
+            img = sexp_call("cart-group-card-placeholder")
 
         mp_sub = ""
         if market_place:
             mp_name = market_place.name if hasattr(market_place, "name") else market_place.get("name", "")
-            mp_sub = render("cart-mp-subtitle", title=title)
+            mp_sub = sexp_call("cart-mp-subtitle", title=title)
         else:
             mp_name = ""
         display_title = mp_name or title
 
-        return render(
+        return sexp_call(
             "cart-group-card",
-            href=cart_href, img_html=img, display_title=display_title,
-            subtitle_html=mp_sub, badges_html=badges_html,
+            href=cart_href, img=SexpExpr(img), display_title=display_title,
+            subtitle=SexpExpr(mp_sub) if mp_sub else None,
+            badges=SexpExpr(badges_wrap),
             total=f"\u00a3{total:.2f}",
         )
     else:
-        # Orphan items — use amber badges
-        badges_amber = badges.replace("bg-stone-100", "bg-amber-100")
-        badges_html_amber = render("cart-badges-wrap", badges_html=badges_amber)
-        return render(
+        # Orphan items
+        return sexp_call(
             "cart-orphan-card",
-            badges_html=badges_html_amber,
+            badges=SexpExpr(badges_wrap),
             total=f"\u00a3{total:.2f}",
         )
 
 
-def _empty_cart_html() -> str:
+def _empty_cart_sexp() -> str:
     """Empty cart state."""
-    return render("cart-empty")
+    return sexp_call("cart-empty")
 
 
-def _overview_main_panel_html(page_groups: list, ctx: dict) -> str:
+def _overview_main_panel_sexp(page_groups: list, ctx: dict) -> str:
     """Cart overview main panel."""
     if not page_groups:
-        return _empty_cart_html()
+        return _empty_cart_sexp()
 
-    cards = [_page_group_card_html(grp, ctx) for grp in page_groups]
+    cards = [_page_group_card_sexp(grp, ctx) for grp in page_groups]
     has_items = any(c for c in cards)
     if not has_items:
-        return _empty_cart_html()
+        return _empty_cart_sexp()
 
-    return render("cart-overview-panel", cards_html="".join(cards))
+    cards_sexp = "(<> " + " ".join(c for c in cards if c) + ")"
+    return sexp_call("cart-overview-panel", cards=SexpExpr(cards_sexp))
 
 
 # ---------------------------------------------------------------------------
 # Page cart
 # ---------------------------------------------------------------------------
 
-def _cart_item_html(item: Any, ctx: dict) -> str:
+def _cart_item_sexp(item: Any, ctx: dict) -> str:
     """Render a single product cart item."""
     from shared.browser.app.csrf import generate_csrf_token
     from quart import url_for
@@ -225,60 +230,60 @@ def _cart_item_html(item: Any, ctx: dict) -> str:
     prod_url = market_product_url(slug)
 
     if p.image:
-        img = render("cart-item-img", src=p.image, alt=p.title)
+        img = sexp_call("cart-item-img", src=p.image, alt=p.title)
     else:
-        img = render("cart-item-no-img")
+        img = sexp_call("cart-item-no-img")
 
-    price_html = ""
+    price_parts = []
     if unit_price:
-        price_html = render("cart-item-price", text=f"{symbol}{unit_price:.2f}")
+        price_parts.append(sexp_call("cart-item-price", text=f"{symbol}{unit_price:.2f}"))
         if p.special_price and p.special_price != p.regular_price:
-            price_html += render("cart-item-price-was", text=f"{symbol}{p.regular_price:.2f}")
+            price_parts.append(sexp_call("cart-item-price-was", text=f"{symbol}{p.regular_price:.2f}"))
     else:
-        price_html = render("cart-item-no-price")
+        price_parts.append(sexp_call("cart-item-no-price"))
+    price_sexp = "(<> " + " ".join(price_parts) + ")" if len(price_parts) > 1 else price_parts[0]
 
-    deleted_html = ""
-    if getattr(item, "is_deleted", False):
-        deleted_html = render("cart-item-deleted")
+    deleted_sexp = sexp_call("cart-item-deleted") if getattr(item, "is_deleted", False) else None
 
-    brand_html = ""
-    if getattr(p, "brand", None):
-        brand_html = render("cart-item-brand", brand=p.brand)
+    brand_sexp = sexp_call("cart-item-brand", brand=p.brand) if getattr(p, "brand", None) else None
 
-    line_total_html = ""
+    line_total_sexp = None
     if unit_price:
         lt = unit_price * item.quantity
-        line_total_html = render("cart-item-line-total", text=f"Line total: {symbol}{lt:.2f}")
+        line_total_sexp = sexp_call("cart-item-line-total", text=f"Line total: {symbol}{lt:.2f}")
 
-    return render(
+    return sexp_call(
         "cart-item",
-        id=f"cart-item-{slug}", img_html=img, prod_url=prod_url, title=p.title,
-        brand_html=brand_html, deleted_html=deleted_html, price_html=price_html,
+        id=f"cart-item-{slug}", img=SexpExpr(img), prod_url=prod_url, title=p.title,
+        brand=SexpExpr(brand_sexp) if brand_sexp else None,
+        deleted=SexpExpr(deleted_sexp) if deleted_sexp else None,
+        price=SexpExpr(price_sexp),
         qty_url=qty_url, csrf=csrf, minus=str(item.quantity - 1),
         qty=str(item.quantity), plus=str(item.quantity + 1),
-        line_total_html=line_total_html,
+        line_total=SexpExpr(line_total_sexp) if line_total_sexp else None,
     )
 
 
-def _calendar_entries_html(entries: list) -> str:
+def _calendar_entries_sexp(entries: list) -> str:
     """Render calendar booking entries in cart."""
     if not entries:
         return ""
-    items = ""
+    parts = []
     for e in entries:
         name = getattr(e, "name", None) or getattr(e, "calendar_name", "")
         start = e.start_at if hasattr(e, "start_at") else ""
         end = getattr(e, "end_at", None)
         cost = getattr(e, "cost", 0) or 0
         end_str = f" \u2013 {end}" if end else ""
-        items += render(
+        parts.append(sexp_call(
             "cart-cal-entry",
             name=name, date_str=f"{start}{end_str}", cost=f"\u00a3{cost:.2f}",
-        )
-    return render("cart-cal-section", items_html=items)
+        ))
+    items_sexp = "(<> " + " ".join(parts) + ")"
+    return sexp_call("cart-cal-section", items=SexpExpr(items_sexp))
 
 
-def _ticket_groups_html(ticket_groups: list, ctx: dict) -> str:
+def _ticket_groups_sexp(ticket_groups: list, ctx: dict) -> str:
     """Render ticket groups in cart."""
     if not ticket_groups:
         return ""
@@ -287,7 +292,7 @@ def _ticket_groups_html(ticket_groups: list, ctx: dict) -> str:
 
     csrf = generate_csrf_token()
     qty_url = url_for("cart_global.update_ticket_quantity")
-    items = ""
+    parts = []
 
     for tg in ticket_groups:
         name = tg.entry_name if hasattr(tg, "entry_name") else tg.get("entry_name", "")
@@ -304,22 +309,26 @@ def _ticket_groups_html(ticket_groups: list, ctx: dict) -> str:
         if end_at:
             date_str += f" \u2013 {end_at.strftime('%-d %b %Y, %H:%M')}"
 
-        tt_name_html = render("cart-ticket-type-name", name=tt_name) if tt_name else ""
-        tt_hidden = render("cart-ticket-type-hidden", value=str(tt_id)) if tt_id else ""
+        tt_name_sexp = sexp_call("cart-ticket-type-name", name=tt_name) if tt_name else None
+        tt_hidden_sexp = sexp_call("cart-ticket-type-hidden", value=str(tt_id)) if tt_id else None
 
-        items += render(
+        parts.append(sexp_call(
             "cart-ticket-article",
-            name=name, type_name_html=tt_name_html, date_str=date_str,
+            name=name,
+            type_name=SexpExpr(tt_name_sexp) if tt_name_sexp else None,
+            date_str=date_str,
             price=f"\u00a3{price or 0:.2f}", qty_url=qty_url, csrf=csrf,
-            entry_id=str(entry_id), type_hidden_html=tt_hidden,
+            entry_id=str(entry_id),
+            type_hidden=SexpExpr(tt_hidden_sexp) if tt_hidden_sexp else None,
             minus=str(max(quantity - 1, 0)), qty=str(quantity),
             plus=str(quantity + 1), line_total=f"Line total: \u00a3{line_total:.2f}",
-        )
+        ))
 
-    return render("cart-tickets-section", items_html=items)
+    items_sexp = "(<> " + " ".join(parts) + ")"
+    return sexp_call("cart-tickets-section", items=SexpExpr(items_sexp))
 
 
-def _cart_summary_html(ctx: dict, cart: list, cal_entries: list, tickets: list,
+def _cart_summary_sexp(ctx: dict, cart: list, cal_entries: list, tickets: list,
                        total_fn: Any, cal_total_fn: Any, ticket_total_fn: Any) -> str:
     """Render the order summary sidebar."""
     from shared.browser.app.csrf import generate_csrf_token
@@ -351,38 +360,41 @@ def _cart_summary_html(ctx: dict, cart: list, cal_entries: list, tickets: list,
             action = url_for("cart_global.checkout")
         from shared.utils import route_prefix
         action = route_prefix() + action
-        checkout_html = render(
+        checkout_sexp = sexp_call(
             "cart-checkout-form",
             action=action, csrf=csrf, label=f" Checkout as {user.email}",
         )
     else:
         href = login_url(request.url)
-        checkout_html = render("cart-checkout-signin", href=href)
+        checkout_sexp = sexp_call("cart-checkout-signin", href=href)
 
-    return render(
+    return sexp_call(
         "cart-summary-panel",
         item_count=str(item_count), subtotal=f"{symbol}{grand:.2f}",
-        checkout_html=checkout_html,
+        checkout=SexpExpr(checkout_sexp),
     )
 
 
-def _page_cart_main_panel_html(ctx: dict, cart: list, cal_entries: list,
+def _page_cart_main_panel_sexp(ctx: dict, cart: list, cal_entries: list,
                                 tickets: list, ticket_groups: list,
                                 total_fn: Any, cal_total_fn: Any,
                                 ticket_total_fn: Any) -> str:
     """Page cart main panel."""
     if not cart and not cal_entries and not tickets:
-        return render("cart-page-empty")
+        return sexp_call("cart-page-empty")
 
-    items_html = "".join(_cart_item_html(item, ctx) for item in cart)
-    cal_html = _calendar_entries_html(cal_entries)
-    tickets_html = _ticket_groups_html(ticket_groups, ctx)
-    summary_html = _cart_summary_html(ctx, cart, cal_entries, tickets, total_fn, cal_total_fn, ticket_total_fn)
+    item_parts = [_cart_item_sexp(item, ctx) for item in cart]
+    items_sexp = "(<> " + " ".join(item_parts) + ")" if item_parts else '""'
+    cal_sexp = _calendar_entries_sexp(cal_entries)
+    tickets_sexp = _ticket_groups_sexp(ticket_groups, ctx)
+    summary_sexp = _cart_summary_sexp(ctx, cart, cal_entries, tickets, total_fn, cal_total_fn, ticket_total_fn)
 
-    return render(
+    return sexp_call(
         "cart-page-panel",
-        items_html=items_html, cal_html=cal_html,
-        tickets_html=tickets_html, summary_html=summary_html,
+        items=SexpExpr(items_sexp),
+        cal=SexpExpr(cal_sexp) if cal_sexp else None,
+        tickets=SexpExpr(tickets_sexp) if tickets_sexp else None,
+        summary=SexpExpr(summary_sexp),
     )
 
 
@@ -390,7 +402,7 @@ def _page_cart_main_panel_html(ctx: dict, cart: list, cal_entries: list,
 # Orders list (same pattern as orders service)
 # ---------------------------------------------------------------------------
 
-def _order_row_html(order: Any, detail_url: str) -> str:
+def _order_row_sexp(order: Any, detail_url: str) -> str:
     """Render a single order as desktop table row + mobile card."""
     status = order.status or "pending"
     sl = status.lower()
@@ -403,90 +415,91 @@ def _order_row_html(order: Any, detail_url: str) -> str:
     created = order.created_at.strftime("%-d %b %Y, %H:%M") if order.created_at else "\u2014"
     total = f"{order.currency or 'GBP'} {order.total_amount or 0:.2f}"
 
-    desktop = render(
+    desktop = sexp_call(
         "cart-order-row-desktop",
         order_id=f"#{order.id}", created=created, desc=order.description or "",
         total=total, pill=pill_cls, status=status, detail_url=detail_url,
     )
 
     mobile_pill = f"inline-flex items-center rounded-full border px-2 py-0.5 text-[11px] {pill}"
-    mobile = render(
+    mobile = sexp_call(
         "cart-order-row-mobile",
         order_id=f"#{order.id}", pill=mobile_pill, status=status,
         created=created, total=total, detail_url=detail_url,
     )
 
-    return desktop + mobile
+    return "(<> " + desktop + " " + mobile + ")"
 
 
-def _orders_rows_html(orders: list, page: int, total_pages: int,
+def _orders_rows_sexp(orders: list, page: int, total_pages: int,
                       url_for_fn: Any, qs_fn: Any) -> str:
     """Render order rows + infinite scroll sentinel."""
     from shared.utils import route_prefix
     pfx = route_prefix()
 
     parts = [
-        _order_row_html(o, pfx + url_for_fn("orders.order.order_detail", order_id=o.id))
+        _order_row_sexp(o, pfx + url_for_fn("orders.order.order_detail", order_id=o.id))
         for o in orders
     ]
 
     if page < total_pages:
         next_url = pfx + url_for_fn("orders.list_orders") + qs_fn(page=page + 1)
-        parts.append(render(
+        parts.append(sexp_call(
             "infinite-scroll",
             url=next_url, page=page, total_pages=total_pages,
             id_prefix="orders", colspan=5,
         ))
     else:
-        parts.append(render("cart-orders-end"))
+        parts.append(sexp_call("cart-orders-end"))
 
-    return "".join(parts)
+    return "(<> " + " ".join(parts) + ")"
 
 
-def _orders_main_panel_html(orders: list, rows_html: str) -> str:
+def _orders_main_panel_sexp(orders: list, rows_sexp: str) -> str:
     """Main panel for orders list."""
     if not orders:
-        return render("cart-orders-empty")
-    return render("cart-orders-table", rows_html=rows_html)
+        return sexp_call("cart-orders-empty")
+    return sexp_call("cart-orders-table", rows=SexpExpr(rows_sexp))
 
 
-def _orders_summary_html(ctx: dict) -> str:
+def _orders_summary_sexp(ctx: dict) -> str:
     """Filter section for orders list."""
-    return render("cart-orders-filter", search_mobile_html=search_mobile_html(ctx))
+    return sexp_call("cart-orders-filter", search_mobile=SexpExpr(search_mobile_sexp(ctx)))
 
 
 # ---------------------------------------------------------------------------
 # Single order detail
 # ---------------------------------------------------------------------------
 
-def _order_items_html(order: Any) -> str:
+def _order_items_sexp(order: Any) -> str:
     """Render order items list."""
     if not order or not order.items:
         return ""
-    items = ""
+    parts = []
     for item in order.items:
         prod_url = market_product_url(item.product_slug)
         if item.product_image:
-            img = render(
+            img = sexp_call(
                 "cart-order-item-img",
                 src=item.product_image, alt=item.product_title or "Product image",
             )
         else:
-            img = render("cart-order-item-no-img")
-        items += render(
+            img = sexp_call("cart-order-item-no-img")
+        parts.append(sexp_call(
             "cart-order-item",
-            prod_url=prod_url, img_html=img,
+            prod_url=prod_url, img=SexpExpr(img),
             title=item.product_title or "Unknown product",
             product_id=f"Product ID: {item.product_id}",
             qty=f"Qty: {item.quantity}",
             price=f"{item.currency or order.currency or 'GBP'} {item.unit_price or 0:.2f}",
-        )
-    return render("cart-order-items-panel", items_html=items)
+        ))
+    items_sexp = "(<> " + " ".join(parts) + ")"
+    return sexp_call("cart-order-items-panel", items=SexpExpr(items_sexp))
 
 
-def _order_summary_html(order: Any) -> str:
+def _order_summary_sexp(order: Any) -> str:
     """Order summary card."""
-    return render(
+    return sexp_call(
         "order-summary-card",
         order_id=order.id,
         created_at=order.created_at.strftime("%-d %b %Y, %H:%M") if order.created_at else None,
@@ -495,11 +508,11 @@ def _order_summary_html(order: Any) -> str:
     )
 
 
-def _order_calendar_items_html(calendar_entries: list | None) -> str:
+def _order_calendar_items_sexp(calendar_entries: list | None) -> str:
     """Render calendar bookings for an order."""
     if not calendar_entries:
         return ""
-    items = ""
+    parts = []
     for e in calendar_entries:
         st = e.state or ""
         pill = (
@@ -512,38 +525,43 @@ def _order_calendar_items_html(calendar_entries: list | None) -> str:
         ds = e.start_at.strftime("%-d %b %Y, %H:%M") if e.start_at else ""
         if e.end_at:
             ds += f" \u2013 {e.end_at.strftime('%-d %b %Y, %H:%M')}"
-        items += render(
+        parts.append(sexp_call(
             "cart-order-cal-entry",
             name=e.name, pill=pill_cls, status=st.capitalize(),
             date_str=ds, cost=f"\u00a3{e.cost or 0:.2f}",
-        )
-    return render("cart-order-cal-section", items_html=items)
+        ))
+    items_sexp = "(<> " + " ".join(parts) + ")"
+    return sexp_call("cart-order-cal-section", items=SexpExpr(items_sexp))
 
 
-def _order_main_html(order: Any, calendar_entries: list | None) -> str:
+def _order_main_sexp(order: Any, calendar_entries: list | None) -> str:
     """Main panel for single order detail."""
-    summary = _order_summary_html(order)
-    return render(
+    summary = _order_summary_sexp(order)
+    items = _order_items_sexp(order)
+    cal = _order_calendar_items_sexp(calendar_entries)
+    return sexp_call(
         "cart-order-main",
-        summary_html=summary, items_html=_order_items_html(order),
-        cal_html=_order_calendar_items_html(calendar_entries),
+        summary=SexpExpr(summary),
+        items=SexpExpr(items) if items else None,
+        cal=SexpExpr(cal) if cal else None,
     )
 
 
-def _order_filter_html(order: Any, list_url: str, recheck_url: str,
+def _order_filter_sexp(order: Any, list_url: str, recheck_url: str,
                        pay_url: str, csrf_token: str) -> str:
     """Filter section for single order detail."""
     created = order.created_at.strftime("%-d %b %Y, %H:%M") if order.created_at else "\u2014"
     status = order.status or "pending"
 
-    pay = ""
+    pay_sexp = None
     if status != "paid":
-        pay = render("cart-order-pay-btn", url=pay_url)
+        pay_sexp = sexp_call("cart-order-pay-btn", url=pay_url)
 
-    return render(
+    return sexp_call(
         "cart-order-filter",
         info=f"Placed {created} \u00b7 Status: {status}",
-        list_url=list_url, recheck_url=recheck_url, csrf=csrf_token, pay_html=pay,
+        list_url=list_url, recheck_url=recheck_url, csrf=csrf_token,
+        pay=SexpExpr(pay_sexp) if pay_sexp else None,
     )
 
 
@@ -553,16 +571,16 @@ def _order_filter_html(order: Any, list_url: str, recheck_url: str,
 
 async def render_overview_page(ctx: dict, page_groups: list) -> str:
     """Full page: cart overview."""
-    main = _overview_main_panel_html(page_groups, ctx)
-    hdr = root_header_html(ctx)
-    return full_page(ctx, header_rows_html=hdr, content_html=main)
+    main = _overview_main_panel_sexp(page_groups, ctx)
+    hdr = root_header_sexp(ctx)
+    return full_page_sexp(ctx, header_rows=hdr, content=main)
 
 
 async def render_overview_oob(ctx: dict, page_groups: list) -> str:
     """OOB response for cart overview."""
-    main = _overview_main_panel_html(page_groups, ctx)
-    oobs = root_header_html(ctx, oob=True)
-    return oob_page(ctx, oobs_html=oobs, content_html=main)
+    main = _overview_main_panel_sexp(page_groups, ctx)
+    oobs = root_header_sexp(ctx, oob=True)
+    return oob_page_sexp(oobs=oobs, content=main)
 
 
 # ---------------------------------------------------------------------------
@@ -574,16 +592,17 @@ async def render_page_cart_page(ctx: dict, page_post: Any,
                                  ticket_groups: list, total_fn: Any,
                                  cal_total_fn: Any, ticket_total_fn: Any) -> str:
     """Full page: page-specific cart."""
-    main = _page_cart_main_panel_html(ctx, cart, cal_entries, tickets, ticket_groups,
+    main = _page_cart_main_panel_sexp(ctx, cart, cal_entries, tickets, ticket_groups,
                                        total_fn, cal_total_fn, ticket_total_fn)
-    hdr = root_header_html(ctx)
-    child = _cart_header_html(ctx)
-    page_hdr = _page_cart_header_html(ctx, page_post)
-    hdr += render(
+    hdr = root_header_sexp(ctx)
+    child = _cart_header_sexp(ctx)
+    page_hdr = _page_cart_header_sexp(ctx, page_post)
+    nested = sexp_call(
         "cart-header-child-nested",
-        outer_html=child, inner_html=page_hdr,
+        outer=SexpExpr(child), inner=SexpExpr(page_hdr),
     )
-    return full_page(ctx, header_rows_html=hdr, content_html=main)
+    header_rows = "(<> " + hdr + " " + nested + ")"
+    return full_page_sexp(ctx, header_rows=header_rows, content=main)
 
 
 async def render_page_cart_oob(ctx: dict, page_post: Any,
@@ -591,14 +610,14 @@ async def render_page_cart_oob(ctx: dict, page_post: Any,
                                 ticket_groups: list, total_fn: Any,
                                 cal_total_fn: Any, ticket_total_fn: Any) -> str:
     """OOB response for page cart."""
-    main = _page_cart_main_panel_html(ctx, cart, cal_entries, tickets, ticket_groups,
+    main = _page_cart_main_panel_sexp(ctx, cart, cal_entries, tickets, ticket_groups,
                                        total_fn, cal_total_fn, ticket_total_fn)
-    oobs = (
-        render("cart-header-child-oob", inner_html=_page_cart_header_html(ctx, page_post))
-        + _cart_header_html(ctx, oob=True)
-        + root_header_html(ctx, oob=True)
-    )
-    return oob_page(ctx, oobs_html=oobs, content_html=main)
+    child_oob = sexp_call("cart-header-child-oob",
+                           inner=SexpExpr(_page_cart_header_sexp(ctx, page_post)))
+    cart_hdr_oob = _cart_header_sexp(ctx, oob=True)
+    root_hdr_oob = root_header_sexp(ctx, oob=True)
+    oobs = "(<> " + child_oob + " " + cart_hdr_oob + " " + root_hdr_oob + ")"
+    return oob_page_sexp(oobs=oobs, content=main)
 
 
 # ---------------------------------------------------------------------------
@@ -616,27 +635,29 @@ async def render_orders_page(ctx: dict, orders: list, page: int,
     ctx["search_count"] = search_count
     list_url = route_prefix() + url_for_fn("orders.list_orders")
 
-    rows = _orders_rows_html(orders, page, total_pages, url_for_fn, qs_fn)
-    main = _orders_main_panel_html(orders, rows)
+    rows = _orders_rows_sexp(orders, page, total_pages, url_for_fn, qs_fn)
+    main = _orders_main_panel_sexp(orders, rows)
 
-    hdr = root_header_html(ctx)
-    hdr += render(
+    hdr = root_header_sexp(ctx)
+    auth = _auth_header_sexp(ctx)
+    orders_hdr = _orders_header_sexp(ctx, list_url)
+    auth_child = sexp_call(
         "cart-auth-header-child",
-        auth_html=_auth_header_html(ctx),
-        orders_html=_orders_header_html(ctx, list_url),
+        auth=SexpExpr(auth), orders=SexpExpr(orders_hdr),
     )
+    header_rows = "(<> " + hdr + " " + auth_child + ")"
 
-    return full_page(ctx, header_rows_html=hdr,
-                     filter_html=_orders_summary_html(ctx),
-                     aside_html=search_desktop_html(ctx),
-                     content_html=main)
+    return full_page_sexp(ctx, header_rows=header_rows,
+                          filter=_orders_summary_sexp(ctx),
+                          aside=search_desktop_sexp(ctx),
+                          content=main)
 
 
 async def render_orders_rows(ctx: dict, orders: list, page: int,
                               total_pages: int, url_for_fn: Any,
                               qs_fn: Any) -> str:
     """Pagination: just the table rows."""
-    return _orders_rows_html(orders, page, total_pages, url_for_fn, qs_fn)
+    return _orders_rows_sexp(orders, page, total_pages, url_for_fn, qs_fn)
 
 
 async def render_orders_oob(ctx: dict, orders: list, page: int,
@@ -650,22 +671,21 @@ async def render_orders_oob(ctx: dict, orders: list, page: int,
     ctx["search_count"] = search_count
     list_url = route_prefix() + url_for_fn("orders.list_orders")
 
-    rows = _orders_rows_html(orders, page, total_pages, url_for_fn, qs_fn)
-    main = _orders_main_panel_html(orders, rows)
+    rows = _orders_rows_sexp(orders, page, total_pages, url_for_fn, qs_fn)
+    main = _orders_main_panel_sexp(orders, rows)
 
-    oobs = (
-        _auth_header_html(ctx, oob=True)
-        + render(
-            "cart-auth-header-child-oob",
-            inner_html=_orders_header_html(ctx, list_url),
-        )
-        + root_header_html(ctx, oob=True)
+    auth_oob = _auth_header_sexp(ctx, oob=True)
+    auth_child_oob = sexp_call(
+        "cart-auth-header-child-oob",
+        inner=SexpExpr(_orders_header_sexp(ctx, list_url)),
     )
+    root_oob = root_header_sexp(ctx, oob=True)
+    oobs = "(<> " + auth_oob + " " + auth_child_oob + " " + root_oob + ")"
 
-    return oob_page(ctx, oobs_html=oobs,
-                    filter_html=_orders_summary_html(ctx),
-                    aside_html=search_desktop_html(ctx),
-                    content_html=main)
+    return oob_page_sexp(oobs=oobs,
+                         filter=_orders_summary_sexp(ctx),
+                         aside=search_desktop_sexp(ctx),
+                         content=main)
 
 
 # ---------------------------------------------------------------------------
@@ -685,23 +705,24 @@ async def render_order_page(ctx: dict, order: Any,
     recheck_url = pfx + url_for_fn("orders.order.order_recheck", order_id=order.id)
     pay_url = pfx + url_for_fn("orders.order.order_pay", order_id=order.id)
 
-    main = _order_main_html(order, calendar_entries)
-    filt = _order_filter_html(order, list_url, recheck_url, pay_url, generate_csrf_token())
+    main = _order_main_sexp(order, calendar_entries)
+    filt = _order_filter_sexp(order, list_url, recheck_url, pay_url, generate_csrf_token())
 
-    hdr = root_header_html(ctx)
-    order_row = render(
-        "menu-row",
+    hdr = root_header_sexp(ctx)
+    order_row = sexp_call(
+        "menu-row-sx",
         id="order-row", level=3, colour="sky",
         link_href=detail_url, link_label=f"Order {order.id}", icon="fa fa-gbp",
     )
-    hdr += render(
+    order_child = sexp_call(
         "cart-order-header-child",
-        auth_html=_auth_header_html(ctx),
-        orders_html=_orders_header_html(ctx, list_url),
-        order_html=order_row,
+        auth=SexpExpr(_auth_header_sexp(ctx)),
+        orders=SexpExpr(_orders_header_sexp(ctx, list_url)),
+        order=SexpExpr(order_row),
     )
+    header_rows = "(<> " + hdr + " " + order_child + ")"
 
-    return full_page(ctx, header_rows_html=hdr, filter_html=filt, content_html=main)
+    return full_page_sexp(ctx, header_rows=header_rows, filter=filt, content=main)
 
 
 async def render_order_oob(ctx: dict, order: Any,
@@ -717,78 +738,78 @@ async def render_order_oob(ctx: dict, order: Any,
     recheck_url = pfx + url_for_fn("orders.order.order_recheck", order_id=order.id)
     pay_url = pfx + url_for_fn("orders.order.order_pay", order_id=order.id)
 
-    main = _order_main_html(order, calendar_entries)
-    filt = _order_filter_html(order, list_url, recheck_url, pay_url, generate_csrf_token())
+    main = _order_main_sexp(order, calendar_entries)
+    filt = _order_filter_sexp(order, list_url, recheck_url, pay_url, generate_csrf_token())
 
-    order_row_oob = render(
-        "menu-row",
+    order_row_oob = sexp_call(
+        "menu-row-sx",
         id="order-row", level=3, colour="sky",
         link_href=detail_url, link_label=f"Order {order.id}", icon="fa fa-gbp",
         oob=True,
     )
-    oobs = (
-        render("cart-orders-header-child-oob", inner_html=order_row_oob)
-        + root_header_html(ctx, oob=True)
-    )
+    orders_child_oob = sexp_call("cart-orders-header-child-oob",
+                                  inner=SexpExpr(order_row_oob))
+    root_oob = root_header_sexp(ctx, oob=True)
+    oobs = "(<> " + orders_child_oob + " " + root_oob + ")"
 
-    return oob_page(ctx, oobs_html=oobs, filter_html=filt, content_html=main)
+    return oob_page_sexp(oobs=oobs, filter=filt, content=main)
 
 
 # ---------------------------------------------------------------------------
 # Public API: Checkout error
 # ---------------------------------------------------------------------------
 
-def _checkout_error_filter_html() -> str:
-    return render("cart-checkout-error-filter")
+def _checkout_error_filter_sexp() -> str:
+    return sexp_call("cart-checkout-error-filter")
 
 
-def _checkout_error_content_html(error: str | None, order: Any | None) -> str:
+def _checkout_error_content_sexp(error: str | None, order: Any | None) -> str:
     err_msg = error or "Unexpected error while creating the hosted checkout session."
-    order_html = ""
+    order_sexp = None
     if order:
-        order_html = render("cart-checkout-error-order-id", order_id=f"#{order.id}")
+        order_sexp = sexp_call("cart-checkout-error-order-id", order_id=f"#{order.id}")
     back_url = cart_url("/")
-    return render(
+    return sexp_call(
         "cart-checkout-error-content",
-        error_msg=err_msg, order_html=order_html, back_url=back_url,
+        error_msg=err_msg,
+        order=SexpExpr(order_sexp) if order_sexp else None,
+        back_url=back_url,
     )
 
 
 async def render_checkout_error_page(ctx: dict, error: str | None = None, order: Any | None = None) -> str:
     """Full page: checkout error."""
-    hdr = root_header_html(ctx)
-    filt = _checkout_error_filter_html()
-    content = _checkout_error_content_html(error, order)
-    return full_page(ctx, header_rows_html=hdr, filter_html=filt, content_html=content)
+    hdr = root_header_sexp(ctx)
+    filt = _checkout_error_filter_sexp()
+    content = _checkout_error_content_sexp(error, order)
+    return full_page_sexp(ctx, header_rows=hdr, filter=filt, content=content)
 
 
 # ---------------------------------------------------------------------------
 # Page admin (/<page_slug>/admin/)
 # ---------------------------------------------------------------------------
 
-def _cart_page_admin_header_html(ctx: dict, page_post: Any, *, oob: bool = False,
+def _cart_page_admin_header_sexp(ctx: dict, page_post: Any, *, oob: bool = False,
                                   selected: str = "") -> str:
-    """Build the page-level admin header row — delegates to shared helper."""
+    """Build the page-level admin header row -- delegates to shared helper."""
     slug = page_post.slug if page_post else ""
     ctx = _ensure_post_ctx(ctx, page_post)
-    return post_admin_header_html(ctx, slug, oob=oob, selected=selected)
+    return post_admin_header_sexp(ctx, slug, oob=oob, selected=selected)
 
 
-def _cart_admin_main_panel_html(ctx: dict) -> str:
-    """Admin overview panel — links to sub-admin pages."""
+def _cart_admin_main_panel_sexp(ctx: dict) -> str:
+    """Admin overview panel -- links to sub-admin pages."""
     from quart import url_for
     payments_href = url_for("page_admin.payments")
     return (
-        '<div id="main-panel">'
-        '<div class="flex items-center justify-between p-3 border-b">'
-        '<span class="font-medium"><i class="fa fa-credit-card text-purple-600 mr-1"></i> Payments</span>'
-        f'<a href="{payments_href}" class="text-sm underline">configure</a>'
-        '</div>'
-        '</div>'
+        '(div :id "main-panel"'
+        ' (div :class "flex items-center justify-between p-3 border-b"'
+        ' (span :class "font-medium" (i :class "fa fa-credit-card text-purple-600 mr-1") " Payments")'
+        f' (a :href "{payments_href}" :class "text-sm underline" "configure")))'
     )
 
 
-def _cart_payments_main_panel_html(ctx: dict) -> str:
+def _cart_payments_main_panel_sexp(ctx: dict) -> str:
     """Render SumUp payment config form."""
     from quart import url_for
     csrf_token = ctx.get("csrf_token")
@@ -802,11 +823,11 @@ def _cart_payments_main_panel_html(ctx: dict) -> str:
     placeholder = "--------" if sumup_configured else "sup_sk_..."
     input_cls = "w-full px-3 py-1.5 text-sm border border-stone-300 rounded focus:ring-purple-500 focus:border-purple-500"
 
-    return render("cart-payments-panel",
-                  update_url=update_url, csrf=csrf,
-                  merchant_code=merchant_code, placeholder=placeholder,
-                  input_cls=input_cls, sumup_configured=sumup_configured,
-                  checkout_prefix=checkout_prefix)
+    return sexp_call("cart-payments-panel",
+                     update_url=update_url, csrf=csrf,
+                     merchant_code=merchant_code, placeholder=placeholder,
+                     input_cls=input_cls, sumup_configured=sumup_configured,
+                     checkout_prefix=checkout_prefix)
 
 
 # ---------------------------------------------------------------------------
@@ -815,18 +836,19 @@ def _cart_payments_main_panel_html(ctx: dict) -> str:
 
 async def render_cart_admin_page(ctx: dict, page_post: Any) -> str:
     """Full page: cart page admin overview."""
-    content = _cart_admin_main_panel_html(ctx)
-    root_hdr = root_header_html(ctx)
-    post_hdr = await _post_header_html(ctx, page_post)
-    admin_hdr = _cart_page_admin_header_html(ctx, page_post)
-    return full_page(ctx, header_rows_html=root_hdr + post_hdr + admin_hdr, content_html=content)
+    content = _cart_admin_main_panel_sexp(ctx)
+    root_hdr = root_header_sexp(ctx)
+    post_hdr = await _post_header_sexp(ctx, page_post)
+    admin_hdr = _cart_page_admin_header_sexp(ctx, page_post)
+    header_rows = "(<> " + root_hdr + " " + post_hdr + " " + admin_hdr + ")"
+    return full_page_sexp(ctx, header_rows=header_rows, content=content)
 
 
 async def render_cart_admin_oob(ctx: dict, page_post: Any) -> str:
     """OOB response: cart page admin overview."""
-    content = _cart_admin_main_panel_html(ctx)
-    oobs = _cart_page_admin_header_html(ctx, page_post, oob=True)
-    return oob_page(ctx, oobs_html=oobs, content_html=content)
+    content = _cart_admin_main_panel_sexp(ctx)
+    oobs = _cart_page_admin_header_sexp(ctx, page_post, oob=True)
+    return oob_page_sexp(oobs=oobs, content=content)
 
 
 # ---------------------------------------------------------------------------
@@ -835,20 +857,21 @@ async def render_cart_admin_oob(ctx: dict, page_post: Any) -> str:
 
 async def render_cart_payments_page(ctx: dict, page_post: Any) -> str:
     """Full page: payments config."""
-    content = _cart_payments_main_panel_html(ctx)
-    root_hdr = root_header_html(ctx)
-    post_hdr = await _post_header_html(ctx, page_post)
-    admin_hdr = _cart_page_admin_header_html(ctx, page_post, selected="payments")
-    return full_page(ctx, header_rows_html=root_hdr + post_hdr + admin_hdr, content_html=content)
+    content = _cart_payments_main_panel_sexp(ctx)
+    root_hdr = root_header_sexp(ctx)
+    post_hdr = await _post_header_sexp(ctx, page_post)
+    admin_hdr = _cart_page_admin_header_sexp(ctx, page_post, selected="payments")
+    header_rows = "(<> " + root_hdr + " " + post_hdr + " " + admin_hdr + ")"
+    return full_page_sexp(ctx, header_rows=header_rows, content=content)
 
 
 async def render_cart_payments_oob(ctx: dict, page_post: Any) -> str:
     """OOB response: payments config."""
-    content = _cart_payments_main_panel_html(ctx)
-    oobs = _cart_page_admin_header_html(ctx, page_post, oob=True, selected="payments")
-    return oob_page(ctx, oobs_html=oobs, content_html=content)
+    content = _cart_payments_main_panel_sexp(ctx)
+    oobs = _cart_page_admin_header_sexp(ctx, page_post, oob=True, selected="payments")
+    return oob_page_sexp(oobs=oobs, content=content)
 
 
 def render_cart_payments_panel(ctx: dict) -> str:
     """Render the payments config panel for PUT response."""
-    return _cart_payments_main_panel_html(ctx)
+    return _cart_payments_main_panel_sexp(ctx)

cart/sexp/summary.sexpr

@@ -4,23 +4,23 @@
   (form :method "post" :action action :class "w-full"
     (input :type "hidden" :name "csrf_token" :value csrf)
     (button :type "submit" :class "w-full inline-flex items-center justify-center px-4 py-2 text-xs sm:text-sm rounded-full border border-emerald-600 bg-emerald-600 text-white hover:bg-emerald-700 transition"
-      (i :class "fa-solid fa-credit-card mr-2" :aria-hidden "true") (raw! label))))
+      (i :class "fa-solid fa-credit-card mr-2" :aria-hidden "true") label)))
 
 (defcomp ~cart-checkout-signin (&key href)
   (div :class "w-full flex"
     (a :href href :class "w-full cursor-pointer flex flex-row items-center justify-center p-3 gap-2 rounded bg-stone-200 text-black hover:bg-stone-300 transition"
       (i :class "fa-solid fa-key") (span "sign in or register to checkout"))))
 
-(defcomp ~cart-summary-panel (&key item-count subtotal checkout-html)
+(defcomp ~cart-summary-panel (&key item-count subtotal checkout)
   (aside :id "cart-summary" :class "lg:pl-2"
     (div :class "rounded-2xl bg-white shadow-sm border border-stone-200 p-4 sm:p-5"
       (h2 :class "text-sm sm:text-base font-semibold text-stone-900 mb-3 sm:mb-4" "Order summary")
       (dl :class "space-y-2 text-xs sm:text-sm"
         (div :class "flex items-center justify-between"
-          (dt :class "text-stone-600" "Items") (dd :class "text-stone-900" (raw! item-count)))
+          (dt :class "text-stone-600" "Items") (dd :class "text-stone-900" item-count))
         (div :class "flex items-center justify-between"
-          (dt :class "text-stone-600" "Subtotal") (dd :class "text-stone-900" (raw! subtotal))))
+          (dt :class "text-stone-600" "Subtotal") (dd :class "text-stone-900" subtotal)))
       (div :class "flex flex-col items-center w-full"
         (h1 :class "text-5xl mt-2" "This is a test - it will not take actual money")
         (div "use dummy card number: 5555 5555 5555 4444"))
-      (div :class "mt-4 sm:mt-5" (raw! checkout-html)))))
+      (div :class "mt-4 sm:mt-5" checkout))))

cart/sexp/tickets.sexpr

@@ -1,42 +1,42 @@
 ;; Cart ticket components
 
 (defcomp ~cart-ticket-type-name (&key name)
-  (p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" (raw! name)))
+  (p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" name))
 
 (defcomp ~cart-ticket-type-hidden (&key value)
   (input :type "hidden" :name "ticket_type_id" :value value))
 
-(defcomp ~cart-ticket-article (&key name type-name-html date-str price qty-url csrf entry-id type-hidden-html minus qty plus line-total)
+(defcomp ~cart-ticket-article (&key name type-name date-str price qty-url csrf entry-id type-hidden minus qty plus line-total)
   (article :class "flex flex-col sm:flex-row gap-3 sm:gap-4 rounded-2xl bg-white shadow-sm border border-stone-200 p-3 sm:p-4"
     (div :class "flex-1 min-w-0"
       (div :class "flex flex-col sm:flex-row sm:items-start justify-between gap-2 sm:gap-3"
         (div :class "min-w-0"
-          (h3 :class "text-sm sm:text-base font-semibold text-stone-900" (raw! name))
-          (raw! type-name-html)
-          (p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" (raw! date-str)))
+          (h3 :class "text-sm sm:text-base font-semibold text-stone-900" name)
+          type-name
+          (p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" date-str))
         (div :class "text-left sm:text-right"
-          (p :class "text-sm sm:text-base font-semibold text-stone-900" (raw! price))))
+          (p :class "text-sm sm:text-base font-semibold text-stone-900" price)))
       (div :class "mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2 sm:gap-4"
         (div :class "flex items-center gap-2 text-xs sm:text-sm text-stone-700"
           (span :class "text-[0.65rem] sm:text-xs uppercase tracking-wide text-stone-500" "Quantity")
-          (form :action qty-url :method "post" :hx-post qty-url :hx-swap "none"
+          (form :action qty-url :method "post" :sx-post qty-url :sx-swap "none"
             (input :type "hidden" :name "csrf_token" :value csrf)
             (input :type "hidden" :name "entry_id" :value entry-id)
-            (raw! type-hidden-html)
+            type-hidden
             (input :type "hidden" :name "count" :value minus)
             (button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "-"))
-          (span :class "inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium" (raw! qty))
-          (form :action qty-url :method "post" :hx-post qty-url :hx-swap "none"
+          (span :class "inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium" qty)
+          (form :action qty-url :method "post" :sx-post qty-url :sx-swap "none"
             (input :type "hidden" :name "csrf_token" :value csrf)
             (input :type "hidden" :name "entry_id" :value entry-id)
-            (raw! type-hidden-html)
+            type-hidden
             (input :type "hidden" :name "count" :value plus)
             (button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "+")))
         (div :class "flex items-center justify-between sm:justify-end gap-3"
-          (p :class "text-sm sm:text-base font-semibold text-stone-900" (raw! line-total)))))))
+          (p :class "text-sm sm:text-base font-semibold text-stone-900" line-total))))))
 
-(defcomp ~cart-tickets-section (&key items-html)
+(defcomp ~cart-tickets-section (&key items)
   (div :class "mt-6 border-t border-stone-200 pt-4"
     (h2 :class "text-base font-semibold mb-2"
       (i :class "fa fa-ticket mr-1" :aria-hidden "true") " Event tickets")
-    (div :class "space-y-3" (raw! items-html))))
+    (div :class "space-y-3" items)))

cart/templates/_types/cart/_cart.html

@@ -1,5 +1,5 @@
 {% macro show_cart(oob=False) %}
-<div id="cart" {% if oob %} hx-swap-oob="{{oob}}" {% endif%}>
+<div id="cart" {% if oob %} sx-swap-oob="{{oob}}" {% endif%}>
   {# Empty cart #}
   {% if not cart and not calendar_cart_entries and not ticket_cart_entries  %}
     <div class="rounded-2xl border border-dashed border-stone-300 bg-white/80 p-6 sm:p-8 text-center">
@@ -103,8 +103,8 @@
                         <form
                           action="{{ qty_url }}"
                           method="post"
-                          hx-post="{{ qty_url }}"
-                          hx-swap="none"
+                          sx-post="{{ qty_url }}"
+                          sx-swap="none"
                         >
                           <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                           <input type="hidden" name="entry_id" value="{{ tg.entry_id }}">
@@ -127,8 +127,8 @@
                         <form
                           action="{{ qty_url }}"
                           method="post"
-                          hx-post="{{ qty_url }}"
-                          hx-swap="none"
+                          sx-post="{{ qty_url }}"
+                          sx-swap="none"
                         >
                           <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                           <input type="hidden" name="entry_id" value="{{ tg.entry_id }}">
@@ -169,7 +169,7 @@
 
 
 {% macro summary(cart, total, calendar_total, calendar_cart_entries, ticket_total, ticket_cart_entries, oob=False) %}
-  <aside id="cart-summary" class="lg:pl-2" {% if oob %} hx-swap-oob="{{oob}}" {% endif %}>
+  <aside id="cart-summary" class="lg:pl-2" {% if oob %} sx-swap-oob="{{oob}}" {% endif %}>
     <div class="rounded-2xl bg-white shadow-sm border border-stone-200 p-4 sm:p-5">
       <h2 class="text-sm sm:text-base font-semibold text-stone-900 mb-3 sm:mb-4">
         Order summary

cart/templates/_types/cart/_mini.html

@@ -1,5 +1,5 @@
 {% macro mini(oob=False, count=None) %}
-<div id="cart-mini" {% if oob %}hx-swap-oob="{{oob}}"{% endif %} >
+<div id="cart-mini" {% if oob %}sx-swap-oob="{{oob}}"{% endif %} >
   {# cart_count is set by the context processor in all apps.
      Cart app computes it from g.cart + calendar_cart_entries;
      other apps get it from the cart internal API.

cart/templates/_types/orders/_rows.html

@@ -102,43 +102,10 @@
 {% if page < total_pages|int %}
   <tr
     id="orders-sentinel-{{ page }}"
-    hx-get="{{ (current_local_href ~ {'page': page + 1}|qs)|host }}"
-    hx-trigger="intersect once delay:250ms, sentinel:retry"
-    hx-swap="outerHTML"
-    _="
-      init
-        if not me.dataset.retryMs then set me.dataset.retryMs to 1000 end
-
-      on sentinel:retry
-        remove .hidden from .js-loading in me
-        add .hidden to .js-neterr in me
-        set me.style.pointerEvents to 'none'
-        set me.style.opacity to '0'
-        trigger htmx:consume on me
-        call htmx.trigger(me, 'intersect')
-      end
-
-      def backoff()
-        add .hidden to .js-loading in me
-        remove .hidden from .js-neterr in me
-        set myMs to Number(me.dataset.retryMs)
-        if myMs < 10000 then set me.dataset.retryMs to myMs * 2 end
-        js setTimeout(() => htmx.trigger(me, 'sentinel:retry'), myMs)
-      end
-
-      on htmx:beforeRequest
-        set me.style.pointerEvents to 'none'
-        set me.style.opacity to '0'
-      end
-
-      on htmx:afterSwap
-        set me.dataset.retryMs to 1000
-      end
-
-      on htmx:sendError     call backoff()
-      on htmx:responseError call backoff()
-      on htmx:timeout       call backoff()
-    "
+    sx-get="{{ (current_local_href ~ {'page': page + 1}|qs)|host }}"
+    sx-trigger="intersect once delay:250ms"
+    sx-swap="outerHTML"
+    sx-retry="exponential:1000:30000"
     role="status"
     aria-live="polite"
     aria-hidden="true"

cart/templates/_types/product/_cart.html

@@ -3,15 +3,15 @@
       | selectattr('product.slug', 'equalto', slug)
       | sum(attribute='quantity') %}
 
-<div id="cart-{{ slug }}" {% if oob=='true'  %} hx-swap-oob="{{oob}}" {% endif %}>
+<div id="cart-{{ slug }}" {% if oob=='true'  %} sx-swap-oob="{{oob}}" {% endif %}>
   
   {% if not quantity %}
     <form
       action="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
       method="post"
-      hx-post="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
-      hx-target="#cart-mini"
-      hx-swap="outerHTML"
+      sx-post="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
+      sx-target="#cart-mini"
+      sx-swap="outerHTML"
       class="rounded flex items-center"
     >
       <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
@@ -40,9 +40,9 @@
       <form
         action="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
         method="post"
-        hx-post="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
-        hx-target="#cart-mini"
-        hx-swap="outerHTML"
+        sx-post="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
+        sx-target="#cart-mini"
+        sx-swap="outerHTML"
       >
         <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
         <input
@@ -82,9 +82,9 @@
       <form
         action="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
         method="post"
-        hx-post="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
-        hx-target="#cart-mini"
-        hx-swap="outerHTML"
+        sx-post="{{ url_for('market.browse.product.cart', product_slug=slug) }}"
+        sx-target="#cart-mini"
+        sx-swap="outerHTML"
       >
         <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
         <input
@@ -113,7 +113,7 @@
 <article
     id="cart-item-{{p.slug}}"
     {% if oob %}
-    hx-swap-oob="{{oob}}"
+    sx-swap-oob="{{oob}}"
     {% endif %}
     class="flex flex-col sm:flex-row gap-3 sm:gap-4 rounded-2xl bg-white shadow-sm border border-stone-200 p-3 sm:p-4 md:p-5"
   >
@@ -143,10 +143,10 @@
             <a
               href="{{ href }}"
               hx_get="{{href}}"
-              hx-target="#main-panel"
-              hx-select ="{{hx_select_search}}"
-              hx-swap="outerHTML"
-              hx-push-url="true"
+              sx-target="#main-panel"
+              sx-select ="{{hx_select_search}}"
+              sx-swap="outerHTML"
+              sx-push-url="true"
               class="hover:text-emerald-700"
             >
               {{ p.title }}
@@ -192,8 +192,8 @@
           <form
             action="{{ qty_url }}"
             method="post"
-            hx-post="{{ qty_url }}"
-            hx-swap="none"
+            sx-post="{{ qty_url }}"
+            sx-swap="none"
           >
             <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
             <input
@@ -214,8 +214,8 @@
           <form
             action="{{ qty_url }}"
             method="post"
-            hx-post="{{ qty_url }}"
-            hx-swap="none"
+            sx-post="{{ qty_url }}"
+            sx-swap="none"
           >
             <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
             <input