Skip to content

Add Forms page to dev app and JsonForms vertical layout spacing - #347

Merged
zoharma merged 2 commits into
mainfrom
zma/devapp-forms
Oct 15, 2026
Merged

zoharma merged 2 commits into
mainfrom
zma/devapp-forms

Conversation

@zoharma

@zoharma zoharma commented Oct 6, 2026

Copy link
Copy Markdown
Contributor
  • Dev app Forms page: default MUI form controls and JsonForms, to check DiamondDSTheme in a downstream-like setup.

    • MUI text fields in outlined, filled and standard variants, with helper text, required, adornment, error, read-only, disabled and multiline states.
    • Select, Autocomplete, Slider, Checkbox, Radio, Switch and Button, including read-only and disabled Select.
    • A JsonForms example set up as in the Helpers/JsonForms guide, with a switch for a read-only form.
    • Read-only vs disabled compared side by side. JsonForms' material renderers draw both as disabled, so the comparison shows the sci-react-ui text controls next to a disabled field.
  • JsonFormsControls.layoutRenderers: a JsonForms vertical layout with spacing between fields. Material's vertical layout uses spacing: 0, so stacked fields touch. This one uses spacing={2}, the same gap as material's horizontal layout. Hidden fields add no extra gap. It's opt-in:

    renderers={[...materialRenderers, ...JsonFormsControls.layoutRenderers]}

@zoharma zoharma added this to the 0.9.0 milestone Oct 15, 2026
- Add a Forms page showing default MUI text fields (outlined, filled, standard) and selection controls, including read-only and disabled states
- Add a JsonForms example with material renderers plus `JsonFormsControls`, with a switch for a read-only form
- Compare the sci-react-ui read-only text controls with disabled JsonForms fields
- Add `JsonFormsControls.layoutRenderers`, a vertical layout that spaces fields like material's horizontal layout; hidden fields add no gap
- Use it in the dev app's JsonForms examples
- Document it in Helpers/JsonForms and the changelog
@zoharma
zoharma marked this pull request as ready for review October 15, 2026 10:50
@zoharma
zoharma requested a review from a team October 15, 2026 10:50

@VictoriaBeilsten-Edmands VictoriaBeilsten-Edmands left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

LGTM

@zoharma
zoharma merged commit 8f66dda into main Oct 15, 2026
2 checks passed
@zoharma
zoharma deleted the zma/devapp-forms branch October 15, 2026 14:20
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