cern-sis / cern-sis/react-formule

improve display of objects and arrays in schema settings

Open
#120 0 comments 0 reactions 0 assignees View on GitHub
enhancement
Dominant language
JavaScript
Stars
16
Forks
5
PR merge metrics
No merged PRs in 30d

Description

When using object or array fields in the schema settings (e.g. for options in select or slider fields) the styling is a bit janky, with unnecessary margins and background colors. This is due to the fact the object and array fields are styled this way for the final form, but this is not necessary for the form rendering the settings, which so far is affected by the same styles. We should think of a way to prevent this and provide a cleaner UI in the settings, maybe by using a custom field template that overrides these from fieldTypes to **remove** the unwanted styling, or the other way around, providing the custom template from FormuleForm to **add** the styling for the final form/form preview only.

A temporary (insufficient) fix has been to pass `marginBottom: uiSchema["ui:label"] === false ? 0 : undefined` in `FieldTemplate` style

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by tracing the FieldTemplate and FormuleForm entry points, then inspect the relevant fieldTypes and uiSchema handling. Compare object and array rendering in schema settings with the final form or preview; done means settings have no unwanted margins or background colors while final-form styling remains intact.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.