We’re excited to launch a new version of the Retool Inspector! By reducing clutter and improving consistency across components, we’ve made it easy to find important properties when you need them most.
With this re-design, we're adding:
- A new add-ons section
- Progressive disclosure for list editors
- Advanced panels
- More consistent property grouping
New add-ons section
We’ve added a new section under “Content” called “Add-ons”. These add-ons include properties that were formerly known as “Adornments”, such as prefix icons, suffix text, and tooltips.
We’ve also split some components up into their constituent parts and are adding them to “Add-ons” as well. Each of these add-ons has its own properties and corresponding Inspector view (e.g. the Label add-on below). These add-ons are also visible on the editor canvas and can be directly clicked to open up the right panel.
Progressive disclosure for list editors
Currently, we use the list editor pattern for adding event handlers. We're now applying this same pattern to Add-ons, Validation rules, and Styles. This hides away properties that have not yet been set, but can be added on an as-needed basis. You can add any of these properties by clicking the plus button next to each list editor’s header.
Advanced panels
Instead of showing every property in each section, we now hide less frequently used settings inside of an advanced panel. You can access these properties by clicking on the advanced button in the header of each section.
Consistent property grouping
Each component now has the same three sections, which makes it easier to find similar properties across different components:
- Content: Data that gets piped into the component, as well as any add-ons.
- Interaction: Event handlers, validation rules, and any properties that impact the behavior of the component.
- Appearance: Properties that change the look of a component, such as layout, style, and show/hide toggles.
We're excited to see what you think! Feel free to send any feedback to jessicasun@retool.com.
