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

@@ -93,21 +93,28 @@ animate:
- By contrast, `dialog/success-modal-` and the Invoice Pay card (`last-modal-step transition
duration-150`) keep transitions, so the intended pattern still exists to copy from.
**FIX — DONE (subtle fade) & verified:** added the codebase's existing `fade-in transition-opacity
duration-300` to all three wizard step cards (new-invoice basic-details + accounts, vendor
step-card, client step-card). `fade-in` is defined in `resources/input.css`
(`.htmx-added .fade-in { opacity:0 }` → transitions to 1 after htmx settle), so each card fades in
on open *and* on every step swap. Verified live: cards always settle to **opacity 1** (never stuck
invisible) on both open and step navigation — no functional risk.
Notes / intentionally deferred (needs design intent + visual sign-off, so not done autonomously):
- The transaction-edit "reference" card's `last-modal-step` class is **undefined** (a no-op); its
only real transition is `transition duration-150`. So there was no clean reference slide to copy.
- The richer **forward/backward slide** transitions (the old `mm/*` modal-stack system using
`group/transition` + `forward`/`backward` + `htmx-*:translate-x-2/3`) were deliberately deleted in
Phase 11 and purged from the CSS. Re-introducing directional slides is a larger design decision
(which element carries `htmx-swapping`/`htmx-added` — the form vs the card — plus settle timing)
and is left for a human-in-the-loop pass if the subtle fade isn't enough.
**FIX — DONE (forward/back slide restored) in the shared `wizard2` engine.** The user confirmed the
old wizard had a directional **slide forward/back** between steps; the engine migration dropped it.
Restored the original mechanism (read out of the deleted `mm/multi_modal.clj`) in one shared place:
- `wizard2/step-slide-classes` — the `group-[.forward]/transition:htmx-*` + `group-[.backward]/…`
variants, now applied to the swapped wizard `<form>`.
- `wizard2/transitioner` — the `#transitioner` wrapper with the `@htmx:after-request` hook that reads
the `x-transition-type` response header and toggles `group/transition` + `forward|backward` on
itself (so the variants fire on the next swap). All 5 wizard configs' `:open-response` now wrap the
form in `wizard2/transitioner` instead of a plain `#transitioner` div.
- `wizard2/handle-step-submit` now sets `x-transition-type` (forward on advance, backward on Back,
`none` on a same-step validation re-render) + `HX-reswap: outerHTML swap:0.16s` (the swap delay
that lets the slide-out play). Direction is computed from the step order (`transition-type`).
- The earlier per-card `fade-in` (interim) was removed in favor of this.
- CSS rebuilt so the `group-[.forward]/transition:htmx-*` variants (16 fwd + 16 back) are compiled.
- Applies to ALL wizards (new-invoice, vendor, client, pay, transaction-rule) since it lives in the
engine. REPL-verified: `open-wizard` emits the transitioner, the form carries the slide classes,
and submit responses carry `x-transition-type` + the `HX-reswap` swap delay.
- **Live-verify caveat:** the long-lived dev server froze its route table at startup
(`auto-ap.handler/match->handler-lookup` is a `def` that merged the per-ns `key->handler` maps), so
an nREPL reload of leaf namespaces does NOT reach the running router — a server refresh
(`stop jetty → tools.namespace refresh → user/start-http`) or a fresh `lein run` is needed to see
it live. (Documented hazard; see the QA memory.)
## 4. Bug list + fixes (prioritized task list)