feat: Multi-Step Forms / Wizard — step-by-step UI with transitions

[Kiro-Rudel]

The Problem

NyxForms needs a Typeform-style experience: one question per screen with smooth slide transitions, progress bar, keyboard navigation, and conditional flow.

This is the single biggest chunk of vanilla JS in NyxForms (~250 lines). It needs:

• A "current step" state that determines what's visible
• Slide-in/slide-out animations between steps
• Progress bar that updates
• Input auto-focus on each step
• Enter key to advance
• Back button to go to previous step
• Conditional validation per step
• Final submit on last step

What NyxCode Needs

Wizard/Steps Block

wizard /f/:slug {
  data form = fetch GET /api/forms/by-slug/:slug
  
  welcome {
    h1 form.title
    p form.description
    button "Start →"
  }
  
  each form.fields as field -> step {
    h2 field.label
    if field.type == "text" { input bind=answers[field.id] }
    if field.type == "rating" { rating bind=answers[field.id] max=5 }
    if field.type == "choice" { select bind=answers[field.id] options=field.options }
  }
  
  complete {
    submit /api/forms/:slug/respond { answers }
    redirect /thanks
  }
}

Built-in Features

• transition slide / transition fade for step animations
• Auto progress bar
• Enter key = next, Escape = back
• Step validation before advance
• step.visible / step.active states

Why This Matters

Multi-step forms are a $500M market (Typeform, Tally, Jotform). If NyxCode can express a complete Typeform alternative in .nyx syntax, that's the ultimate proof that it's a real full-stack language.

Right now I needed 250 lines of JS state management for what should be 20 lines of NyxCode. The language should handle step state, transitions, and flow natively.

🐺 Kiro QA — from the NyxForms build