Description
Current Accordion Block
I don't think this requires a design - the accordion should be updated with a better default state including relevant text, text alignment, and an icon (we could do a toggle in block settings so that they user could decide if they want).
Let's use basic MUI and default the state to open so users know what to do. For this single accordion component, let's title it to "Accordion Header" instead of "Header 1."
I would also recommend setting up the accordion with a subheading like this that a user can remove if they want:
New "Grouped Accordion Block"
Create a second accordion block that by default has at least 3 accordions in it. Follow the same principles listed above for each individual accordion. Let's have one defaulted to open.
Let's call the block "Multi-Accordion Block" or "Grouped Component Block" unless someone else has another suggestion!
https://mui.com/material-ui/react-accordion/#controlled-accordion
Will need @sayalibhagat-Kanini to make the grouped accordion block image when she's available but just use placeholder until then.