feat(ssr): restore forward/back step slide in the wizard engine

The engine migration replaced the old mm/* modal-stack wizards (which slid
forward/back between steps) with wizard2, but never carried the slide over — step
transitions went flat. Restore the original mechanism in the shared engine so all
wizards (new-invoice, vendor, client, pay, transaction-rule) get it:

- wizard2/step-slide-classes: the group-[.forward]/transition:htmx-* and
  group-[.backward]/* slide variants, applied to the swapped <form>.
- wizard2/transitioner: the #transitioner wrapper whose @htmx:after-request hook
  reads the x-transition-type response header and toggles group/transition +
  forward|backward on itself. All 5 configs' :open-response now use it.
- wizard2/handle-step-submit sets x-transition-type (forward on advance, backward
  on Back, none on a same-step validation re-render) + HX-reswap "outerHTML
  swap:0.16s" so the slide-out plays before the swap. Direction computed from
  step order (transition-type).
- Removed the interim per-card fade-in in favor of this.
- Rebuilt output.css so the 16 fwd + 16 back slide variants are compiled.

REPL-verified: open-wizard emits the transitioner, the form carries the slide
classes, and submit responses carry the transition headers. Live verification
needs a server refresh (the dev server froze its route table at startup).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-06-27 21:17:51 -07:00
parent 6c791efb06
commit b44213bffd
8 changed files with 267 additions and 37 deletions

View File

@@ -333,7 +333,7 @@
client-val (or (:invoice/client data) client-from-req)]
(com/modal-card-advanced
{"@keydown.enter.prevent.stop" "if ($refs.next) {$refs.next.click()}"
:class " md:w-[750px] md:h-[600px] w-full h-full fade-in transition-opacity duration-300"
:class " md:w-[750px] md:h-[600px] w-full h-full"
"x-data" ""}
(com/modal-header {} [:div.p-2 (if extant? "Edit invoice" "New invoice")])
(com/modal-body
@@ -526,7 +526,7 @@
total (expense-accounts-total* rows)]
(com/modal-card-advanced
{"@keydown.enter.prevent.stop" "if ($refs.next) {$refs.next.click()}"
:class " md:w-[750px] md:h-[600px] w-full h-full fade-in transition-opacity duration-300"
:class " md:w-[750px] md:h-[600px] w-full h-full"
"x-data" ""}
(com/modal-header {} [:div.p-2 "Invoice accounts "])
(com/modal-body
@@ -778,7 +778,7 @@
:submit-route (bidi/path-for ssr-routes/only-routes ::route/new-invoice-submit)
:form-attrs {:hx-ext "response-targets"
:hx-target-400 "#form-errors"}
:open-response (fn [form] (modal-response [:div#transitioner.flex-1 form]))
:open-response (fn [form] (modal-response (wizard2/transitioner form)))
:init-fn new-init-fn
:steps [{:key :basic-details
:decode decode-basic-details