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

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

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