Skip to content

Fix custom input and form template documentation examples - #1654

Merged
rvsia merged 1 commit into
data-driven-forms:masterfrom
dajiaohuang:docs/custom-input-examples-20261016
Oct 16, 2026
Merged

rvsia merged 1 commit into
data-driven-forms:masterfrom
dajiaohuang:docs/custom-input-examples-20261016

Conversation

@dajiaohuang

Copy link
Copy Markdown
Contributor

Description

Correct the custom-input examples so they can be used with useFieldApi and FormRenderer:

  • Add the missing schema comma in both READMEs and use htmlFor to associate the label with its input.
  • Close the input/Card JSX in the useFieldApi examples and spread the hook's input object rather than an undeclared rest variable.
  • Use JSX spread syntax for the FormTemplate wrapper's props.

The README schema and hook examples fail to parse as written. The README label also does not focus its input when clicked. These are documentation-only corrections; no library behavior or APIs change.

Validation

  • Parsed the selected executable JSX examples: the original snippets fail; the corrected snippets pass. For the abbreviated FormTemplate invocation, omitted only the explicit ... placeholders when checking its JSX.
  • Real headless Chromium: clicking the README label does not focus the input before the change and does after it; typing and submitting a dummy value passes.
  • Real headless Chromium: all six documented useFieldApi snippets submit their expected dummy values after DOM input/click interactions. Supplied small local Card/Spinner/ErrorMessage components for the examples' custom imports.
  • Core renderer CJS/ESM TypeScript builds and a public TypeScript consumer fixture pass in an isolated dependency environment.
  • Additional local FormRenderer checks pass for required/cross-field/async validation, nested values and datatype conversion, conditional fields, exported FieldArray add/remove, reset/cancel, and a custom common Wizard.
  • git diff --check passes.

Limits: this was checked on Windows/Node 24 with an isolated core setup, not the documented Unix/Node 16 monorepo environment. The full monorepo build/lint/Jest suite and documentation-site build were not run. All browser data was synthetic and submissions were captured only by local callbacks; no external form endpoint was used.

@vercel

vercel Bot commented Oct 16, 2026

Copy link
Copy Markdown

@dajiaohuang is attempting to deploy a commit to the data-driven-forms Team on Vercel.

A member of the Team first needs to authorize it.

@rvsia rvsia left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for the fixes! 👍

@rvsia
rvsia merged commit a9ee57c into data-driven-forms:master Oct 16, 2026
1 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants