The constraint
The only chrome allowed on the page is hover-revealed overlays anchored to items that already exist: the remove control and the drag handle. Everything else lives in the notch, a tab the admin draws over the canvas, flush to the right edge and centred on its section. What the user sees is in Guides: Adding, reordering and removing.Entries
A component with no explicit
notch gets one entry per addable list. notch: [] opts out; form questions do this because their add is a ghost row in the flow of the question list.
Item notches
Items can carry their own notch, revealed on hover, for nested lists and per-item settings. The rule:Every list’s add lives in the notch of its owning container.A section owns its top-level lists. An item that owns a nested list shows that list’s add in its own notch. It scales to any depth and answers “which parent?” by which item is hovered, the same targeting model as drag and remove.
The component contract
1
Render identically in edit mode
No expanded editable state, no rack. The design is intact.
2
Stamp data-e-current on the active item
Stateful components only. It tells the cog and inline edits which item is showing.
3
Handle the custom events you declare
A
{ event: "next" } notch entry dispatches an event into the frame. The component’s script advances so every item becomes reachable in its real frame.4
Declare insert: 'reload' if the DOM derives from the list
Pagination dots, counters, a select’s options. Otherwise a new item grafts in place: an optimistic clone of the last sibling appears, then the server render with correct anchors swaps in.
5
Choose reorderable: 'strip' for one-at-a-time components
Nothing on the page can be dragged past anything, so the grip opens a vertical filmstrip of thumbnails beside the notch. Thumbnails come from the page’s own images via the array’s
thumb. Delivery is a staged reload plus a goto event that pages back to the held item.Next steps
Page schemas
Where notch entries are declared.
Components
The renderer side.