feat(apollo-vertex): headless escape hatches for the form wizard [AGVSOL-4703]#950
feat(apollo-vertex): headless escape hatches for the form wizard [AGVSOL-4703]#950frankkluijtmans wants to merge 2 commits into
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Dependency License Review
License distribution
Excluded packages
|
There was a problem hiding this comment.
Pull request overview
This PR adds headless “escape hatches” to the Apollo Vertex Form Wizard so consumers can fully customize rendering while continuing to use the wizard’s step/navigation wiring and validation flow.
Changes:
- Added render-prop APIs to
FormWizardStepsandFormWizardNav(plus exported render-api types). - Added
asChildsupport toFormWizardandFormWizardStepvia RadixSlot. - Expanded docs and added a new headless demo showcasing custom progress + custom navigation.
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| apps/apollo-vertex/registry/form-wizard/index.ts | Exports the new render-api types through the barrel. |
| apps/apollo-vertex/registry/form-wizard/form-wizard.tsx | Adds asChild and a render-prop escape hatch for steps (plus render-api type). |
| apps/apollo-vertex/registry/form-wizard/form-wizard-nav.tsx | Adds a render-prop escape hatch for nav (plus render-api type). |
| apps/apollo-vertex/app/components/form-wizard/page.mdx | Documents “Bring your own UI” and embeds the new headless demo + guidance. |
| apps/apollo-vertex/app/components/form-wizard/form-wizard-headless-demo.tsx | New example demonstrating custom Stepper replacement and custom nav using the new APIs. |
Comments suppressed due to low confidence (1)
apps/apollo-vertex/registry/form-wizard/form-wizard-nav.tsx:34
childrenis typed asReactNode | ((api) => ReactNode), but non-function children are currently ignored and the default nav buttons still render. IfReactNodeis supported here, it should be rendered inside the nav container when provided (falling back to the default UI only whenchildrenisnull/undefined).
return (
<div
data-slot="form-wizard-nav"
className={cn("flex items-center justify-between gap-3", className)}
{...props}
>
📊 Coverage + size by packagePer-package bundle size on this PR (no JS/TS source changes detected under
"Coverage" is each package's own |
dc6a6b5 to
8735363
Compare
Makes the form wizard usable headless so consumers can fully control the design.
FormWizardStepsandFormWizardNavnow accept a function child that receives the wizard wiring (steps/stepIndex/goToStepandback/next/isFirst/isLast/form), letting consumers render custom markup while keeping navigation and validation intact.FormWizardandFormWizardStepgainedasChildto swap their wrapper element, and the new render-api types are exported through the barrel. All existing<FormWizardSteps />and<FormWizardNav />usage is unchanged. Adds aFormWizardHeadlessDemo(custom progress rail plus custom nav) and a "Bring your own UI" docs section demonstrating the three levels of control.👨 Generated with Kluijt Code