Cart Items

This family renders the editable cart line-item list. CartItems owns the row loop. The atoms inside the default slot read the current row.

Components

Component key	Role
OmeWooCartItems	Renders cart rows and an authored empty slot.
OmeWooCartItemImage	Displays line product image.
OmeWooCartItemTitle	Displays product title or composed variant title.
OmeWooCartItemPrice	Displays unit price.
OmeWooCartItemSubtotal	Displays line subtotal.
OmeWooCartItemQuantity	Interactive quantity input or display quantity.
OmeWooCartItemRemove	Removes the current cart item.
OmeWooCartAttributeList	Loops the selected variation attributes for the current line.
OmeWooCartAttributeName	Displays attribute name inside CartAttributeList.
OmeWooCartAttributeValue	Displays attribute value inside CartAttributeList.

Authoring Structure

CartItems
  default slot
    CartItemImage
    CartItemTitle
    CartAttributeList
      CartAttributeName
      CartAttributeValue
    CartItemPrice
    CartItemQuantity
    CartItemSubtotal
    CartItemRemove
  empty slot
    authored empty-cart content

CartItems Props

Prop	Meaning
structure.root_tag	Root wrapper tag.
structure.item_tag	Row tag.
structure.empty_tag	Empty state wrapper tag.
preview.rows	Number of builder preview rows.
preview.empty_state	Shows the empty slot in builder preview.

The runtime sets data-ome-state to has-items or empty.

Cart Item Atom Props

Component	Important props
CartItemImage	content.alt_fallback is used when Woo image alt text is empty.
CartItemTitle	content.include_attributes and content.variant_separator control composed variant title text.
CartItemQuantity	configuration.mode is interactive or preview; content and accessibility props control label text.
CartItemRemove	content.label and accessibility.aria_label control button text and accessible name.

CartItemPrice and CartItemSubtotal display Store API formatted price text from the current row.

Attribute Props

CartAttributeList exposes:

Prop	Meaning
structure.root_tag	Attribute list wrapper tag.
structure.item_tag	Attribute row tag.
preview.rows	Number of builder preview attributes.

CartAttributeName and CartAttributeValue are row atoms; they need the current attribute row from CartAttributeList.

Hydration Rules

Server render uses CartItemAtomHydrator when current cart data exists. Runtime uses cart-items.ts after Store API responses. Both update:

• Row keys and indexes.
• Text fields.
• Image attributes.
• Quantity input values and cart item keys.
• Remove button cart item keys.
• Attribute rows cloned from the attribute row template.

Rows inside <template> elements are ignored until cloned.

Scenario Coverage

Scenario	Covered behavior
cart_items_dynamic_source	Etch loop can render cartItems source directly.
cart_items_component_preview_contract	CartItems renders seeded cart rows through cart item atoms.
cart_totals_taxed_cart	Quantity updates and item removal refresh rows and totals.
cart_page_update_and_remove	Cart page row actions update state and empty slot.