Developers

Groups & repeaters

Ordered collections of child content — the primitive behind feature lists, FAQs, and items slots inside components.

What a group stores
A group node holds an order[] of child item identities. Each child field is a real primitive node (text, image, richtext, …) with its own key. Editors add, remove, and reorder in the overlay repeater UI.

Mark a group

features.html
<section data-macro-key="home.features" data-macro-type="group">
  <!-- Macro manages item order; children hydrate as field nodes -->
</section>
NameTypeRequiredDescription
data-macro-keystringrequiredStable key for the group region.
data-macro-type"group"requiredMarks this element as a repeater region.

Key model

  • Group / region: home.features (or {parent}.slots.{name} for slots)
  • Item field: home.features.{index}.{field} — e.g. home.features.0.title

Locale is never part of the key. The same structure resolves per locale in Macro’s i18n layer.

Editor experience

  1. Select the group

    Click a repeater region in the overlay. The sidebar shows items and add / remove controls.

  2. Edit item fields

    Inline-edit primitives inside each item, or use the field form when fields are declared by a component slot.

  3. Reorder

    Drag handles reorder order[]; Macro persists the new sequence to the active draft.

Plain HTML vs component slots

You can mark a data-macro-type="group" region in page HTML. Structure still needs a clear child pattern so editors know what each item contains — often easier via a component that builds item markup.

Limits

Do

  • Keep item field lists fixed for a given component slot — buyers edit values, not schema.
  • Use richtext inside items when copy needs freer formatting.
  • Observe the DOM with MutationObserver if your UI (dots, nav) depends on item count.

Don’t

  • Don’t encode locale or draft id in group keys.
  • Don’t expect buyers to invent new fields inside a fixed items-slot schema.

Reference

Demo content-slider (@macro/content-slider) builds slides as an items slot and syncs nav from [data-macro-repeater-item].