Display Attributes

Display attributes bind HTML elements to live data. The element's text content updates automatically whenever the underlying data changes — no JavaScript, no DOM manipulation, no event handlers.

The primary attribute is data-next-display. It takes a path expression like cart.total or package.42.price and writes the resolved value into the element's text content.

Quick Example

<!-- Cart total — updates whenever cart changes -->
<span data-next-display="cart.total">$0.00</span>

<!-- Package price — updates when currency or discount changes -->
<span data-next-display="package.42.price">$0.00</span>

<!-- Customer name from a loaded order -->
<span data-next-display="order.customer.firstName">Friend</span>

The fallback text inside the element is shown until the SDK initializes — that's the progressive enhancement pattern.