Out of box Sitecore provides 4 expanders as listed below to accommodate the Form Components in Sitecore 9.

• Basic
• Lists
• Security
• Structure

To create our own Expander to accommodate custom/OOTB components we need to do the following

Create a Folder in Master Database

Create a folder in master database to contain the components which need to appear under the expander. Later we need to provide the id of the folder in the core database to loop through the items it contain.

Create a Expander

Create a custom Expander using the Expander Parameter  using Sitecore Rocks in the core database in the following path set the following properties in the appearance section of the item

IsOpen – Specifies whether the expander is open by default

IsExtraFieldsLinkShown – Gives More,Less toggle links when there are a large number of fields in a expander

Headertext – Title for the Expander in DesignPane

IsVisible – Specifies whether the control is visible

IsCollapsible – Shows the toggle button for the Expander

Visual Style – Set the visual style to contextpane

Create a Draggable

Create a Custom Draggable using the DraggableElementList  using Sitecore Rocks in the core database in the following path and set the following properties

Appearance Section

IsVisible – Specifies whether the control is visible

Data Section

Database – Provide the name of the database from which the folder containing form components must be retrieved

StaticData – Provide the folder id in the master database from where the form components should be retrieved

Add to Presentation Details of Design Item

Add the above created expander(requires no placeholder) and draggable(add it to placeholder {ExpanderName}.Body) in the presentation details of design item shown below using  Sitecore Rocks.

Finally we can see our custom expander in the FormDesigner design pane