> ## Documentation Index
> Fetch the complete documentation index at: https://docs.openbridge.shop/llms.txt
> Use this file to discover all available pages before exploring further.

# .subscribe()

> Listen for cart changes

```javascript theme={null}
openbridge.cart.subscribe(callback)
```

Subscribes to cart state changes. The callback is called whenever the cart is updated.

## Parameters

| Param      | Type                                               | Required | Description                     |
| ---------- | -------------------------------------------------- | -------- | ------------------------------- |
| `callback` | [`CartSubscriber`](/api/types/cart#cartsubscriber) | Yes      | Function called on cart changes |

The callback receives the current cart state (or `null` if not initialized).

## Returns

`() => void`

Returns an unsubscribe function to stop listening.

## Examples

### Basic subscription

```javascript theme={null}
openbridge.cart.subscribe((cart) => {
    console.log('Cart updated:', cart)
})
```

### Update UI on changes

```javascript theme={null}
openbridge.cart.subscribe((cart) => {
    // Update cart badge
    document.querySelector('.cart-count').textContent = cart?.totalQuantity ?? 0

    // Update cart total
    if (cart) {
        document.querySelector('.cart-total').textContent =
            `${cart.cost.totalAmount.currencyCode} ${cart.cost.totalAmount.amount}`
    }
})
```

### Unsubscribe when done

```javascript theme={null}
const unsubscribe = openbridge.cart.subscribe((cart) => {
    updateMiniCart(cart)
})

// Later, stop listening
unsubscribe()
```

### Subscribe before init

```javascript theme={null}
// Subscribe first to catch the initial state
openbridge.cart.subscribe((cart) => {
    renderCart(cart)
})

// Then initialize
await openbridge.cart.init()
```

### Multiple subscribers

```javascript theme={null}
// Badge update
openbridge.cart.subscribe((cart) => {
    updateBadge(cart?.totalQuantity ?? 0)
})

// Mini cart
openbridge.cart.subscribe((cart) => {
    updateMiniCart(cart)
})

// Analytics
openbridge.cart.subscribe((cart) => {
    trackCartState(cart)
})
```

### Conditional logic

```javascript theme={null}
openbridge.cart.subscribe((cart) => {
    const isEmpty = !cart || cart.totalQuantity === 0

    document.querySelector('.empty-cart-message').hidden = !isEmpty
    document.querySelector('.cart-contents').hidden = isEmpty
    document.querySelector('.checkout-button').disabled = isEmpty
})
```

## Behavior

* Callback is invoked immediately if cart is already initialized
* Callback is invoked after every cart mutation (add, update, remove, clear)
* Multiple subscribers can be active simultaneously
* Subscribers are stored in a Set (no duplicate callbacks)
