Allow component properties to be categorized

Created on 9 December 2024, 12 days ago

Overview

Right now, if you have a number of component properties, they all show up in the UI with no organization other than the order they show up in the yml file.

There are reasons why it could improve the UX to allow for the categorization of the properties.

For example, if there are properties for filling in the content of the component vs properties for styling the component, they could be separated to make this more clear, e.g. a button might have:

Content

- icon
- text
- url

Styling

- type (primary, secondary, tertiary)
- theme (light, dark)
- size (small, regular, large)

but there might even be other "advanced"/"additional"/ "extra" props/settings like:

Advanced

- is_new_window (opens in a new window)
- is_external (shows arrow to indicate it's linking to external site)
- is_disabled (disabled button)
- css_class (extra class that can be added)

Proposed resolution

Introduce a new "category"/"group" or similar classification for properties.

Ideally, these groupings can open/close and we can also define which of these groupings are open by default. For example, we may want to close the "Styling" and "Advanced" props by default so as to not overwhelm the user.

User interface changes

Shows each category/group with all the properties under it and some mechanism to open/close.

✨ Feature request
Status

Active

Version

0.0

Component

Page builder

Created by

πŸ‡ΊπŸ‡ΈUnited States Kristen Pol Santa Cruz, CA, USA

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024