rjsf-team/react-jsonschema-form

Feature Request: Implement collapse button for array form items

Open

#2193 opened on Jan 14, 2021

View on GitHub
 (4 comments) (15 reactions) (0 assignees)TypeScript (13,175 stars) (2,136 forks)batch import
featurehelp wanted

Description

Prerequisites

Description

Hi there,

In case of long form it's useful to hide non-needed parts of the form. Here is example:

It would be super useful to add collapse/expand button for array item for such long forms. It may be controlled via several options: "ui: autoCollapse": true/false "ui: showCollapseButton": true/false

Thanks!

Contributor guide

Tech stack
reacttypescriptjavascript
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Basic React knowledgeUnderstanding of JSON Schema
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
70
Research direction
The feature requests adding a collapse/expand button for array form items to hide non needed parts. The implementation likely involves modifying the ArrayField component in `packages/core/src/components/fields/ArrayField.tsx` to wrap each array item in a collapsible container. Check the existing `ui:options` for custom class names or buttons. The issue suggests options like `ui:autoCollapse` and `ui:showCollapseButton`, which would need to be passed through schema and processed in the component. Review the discussion in the comments for any additional requirements or constraints.