---
alias: "fc.repeater"
aliases:
  - fc.repeater
category: layout
module: Core
---
# fc.repeater

Iterate over array data, rendering descendants once per item with per-item data context.

## When to Use
- Fulfilment choices in a MULTI order (each with its own card)
- Order items with complex per-item detail views
- Any array where each item needs a rich component tree (not just a table row)

## Key Props
| Prop | Type | Required | What it controls |
|------|------|----------|------------------|
| `dataSource` | string (JSONPath) | **Yes** | Path to array or connection, e.g., `"order.fulfilmentChoices.edges"` |

## Data Binding
Each iteration's data context is set to the current array item. **Auto-detects Relay connection format**: if the resolved data is an object with an `edges` array (`{ edges: [{ node: {...} }] }`), it automatically unwraps and iterates over `edges`. This means you can point `dataSource` at either a plain array OR a Relay connection object and it works the same way.

## Descendants
Yes (required) — rendered once per item.

## Composition Patterns
- `fc.repeater` > `fc.card.attribute` per item
- `fc.repeater` > `fc.conditional` > type-specific content per item

## Gotchas
- Must have at least one descendant -- empty repeater is an error
- For simple tabular data, use `fc.list` instead (better performance, pagination)
- **Supports both plain arrays and Relay connection objects** -- if data has `{ edges: [...] }`, it iterates over `edges` automatically. You do NOT need to append `.edges` to the dataSource path if the data is a connection
- When iterating a connection, each iteration's context is the edge object (typically `{ node: {...}, cursor: "..." }`) -- use `{{node.field}}` in descendant templates

## Validation Rules
P07 (CRITICAL — dataSource required), P08 (CRITICAL — needs descendants)

## Manifest Example
```json
{
  "component": "fc.repeater",
  "props": { "dataSource": "orderById.fulfilmentChoices.edges" },
  "descendants": [
    { "component": "fc.card.attribute", "props": { "title": "FC: {{node.ref}}", "attributes": [{ "label": "Type", "value": "{{node.type}}" }] } }
  ]
}
```

## AI Parse Notes
- **Primary intent:** Declarative Mystique component definition for manifests.
- **Selection signals:** Match by `alias`, category, and required `Key Props`.
- **Assembly hints:** Combine with compatible parent/child components listed in `Composition Patterns`.
- **Safety checks:** Validate required props and data bindings before manifest generation.
