# Facet Target

> Result container whose loop and fallback slots are refreshed by connected facets.

<!-- Sources: src/Components/Facets/FacetTarget/FacetTarget.php; src/Facets/FacetBlockInterceptor.php; src/Facets/FacetLoopParamResolver.php; client/src/domains/facets/service/facet-target-registry.ts; tests/e2e/components/facets/nested-loop-context.spec.ts -->

# Facet Target

`Facet Target` is the result container. Facet controls do not replace content directly; they send state for a target ID, and the target receives refreshed loop markup from the facet endpoint.

## Structure

```text
Facet Target
├── loop slot
└── fallback slot
```

The loop slot renders the normal results. The fallback slot renders when the refreshed loop has no items.

## Props

| Group | Prop | Default | Meaning |
| --- | --- | --- | --- |
| Structure | `tag` | `div` | HTML tag for the live result wrapper. |
| Structure | `fallback_tag` | `div` | HTML tag for the fallback wrapper. |
| Settings | `target` | empty | Shared target ID used by connected facets. |
| Settings | `rerun_scripts` | `true` | Reruns inline scripts returned with refreshed markup. |
| Settings | `preview_fallback` | `false` | Shows fallback in Etch preview instead of loop content. |
| Settings | `scroll_to_top` | `false` | Scrolls to this target after connected facet updates. |
| Settings | `used_with_map` | `false` | Marks the target as paired with a Map Facet. |
| Settings | `load_more_on_scroll` | `false` | Enables infinite scroll controls inside the target. |
| Settings | `load_more_batch_size` | `10` | Batch size for infinite scroll. |
| Styling | `class` | `ome-facet-target-default` | Root target class. |

## Runtime Contract

The rendered target uses `data-ome-facet-target`, `data-ome-facet-loop`, `aria-live="polite"`, and target-specific data attributes for scripts, scrolling, map pairing, and infinite scroll.

If `load_more_on_scroll` is enabled, the component renders hidden controls for `offset` and `posts_per_page`. Those controls are part of the same facet request flow as the visible Load More Facet.

## Nested Loop Rule

If a target lives inside another Etch loop, the outer loop params are resolved during the original render before the template is stored. The nested loop E2E scenario verifies that a Search Facet refresh keeps the correct outer-loop context after AJAX refresh.

## Example

```text
Target ID: article-results
Facet Target:
- target = article-results
- loop slot = WP Query loop
- fallback slot = "No posts found."

Search Facet:
- target = article-results
- default query argument = search
```