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

# Ecommerce events

> Track the journey from product discovery to completed order with typed ecommerce payloads.

Use Bily's title-case event names for product and order activity. The SDK recognizes them and maps typed products and orders to the Bily event contract.

## Record a product view

```typescript theme={null}
import { track } from "@bilyai/js";

track("Product Viewed", {
  products: [
    {
      id: "product_123",
      name: "Everyday Tee",
      price: 39,
      currency: "USD",
      quantity: 1,
      sku: "TEE-NAVY-M",
      category: "Tops",
      brand: "Everyday",
      image: "https://cdn.example.com/products/everyday-tee.jpg",
    },
  ],
});
```

`quantity` defaults to `1` when omitted.

## Record an add to cart

```typescript theme={null}
track("Product Added", {
  products: [
    {
      id: "product_123",
      name: "Everyday Tee",
      price: 39,
      currency: "USD",
      quantity: 2,
      sku: "TEE-NAVY-M",
    },
  ],
});
```

## Record the start of checkout

```typescript theme={null}
track("Checkout Started", {
  products: [
    {
      id: "product_123",
      name: "Everyday Tee",
      price: 39,
      currency: "USD",
      quantity: 2,
    },
  ],
  checkout_id: "checkout_456",
});
```

## Record a completed order

Use `order` when an event represents one order. If you provide `order.total`, the SDK uses it. Otherwise, it calculates the total from product price and quantity.

```typescript theme={null}
track("Order Completed", {
  order: {
    id: "order_789",
    currency: "USD",
    total: 73,
    tax: 4,
    discount: 10,
    discountCode: "WELCOME10",
    shippingFees: 1,
    products: [
      {
        id: "product_123",
        name: "Everyday Tee",
        price: 39,
        currency: "USD",
        quantity: 2,
      },
    ],
  },
});
```

Totals, tax, discounts, and shipping fees can all be zero.

## Use an exact event name

* `Product List Viewed`
* `Products Searched`
* `Product Clicked`
* `Product Added`
* `Product Added to Wishlist`
* `Product Removed`
* `Product Removed From Cart`
* `Product Removed From Wishlist`
* `Product Viewed`
* `Cart Viewed`
* `Checkout Started`
* `Checkout Step Viewed`
* `Checkout Step Completed`
* `Payment Info Entered`
* `Shipping Info Entered`
* `AddShippingInfo`
* `AddContactInfo`
* `Checkout Address Info Submitted`
* `Order Completed`
* `Order Updated`
* `Order Refunded`
* `Order Cancelled`
* `Clicked Promotion`
* `Viewed Promotion`
* `ViewCategory`

Match the spelling and capitalization exactly. See [event names](/api-reference/events) for accepted legacy aliases.

## Include every required product field

Every product needs `id`, `name`, `price`, and `currency`. Include `quantity`, `sku`, `category`, `brand`, and `image` when you have them.

<Card title="Payload reference" icon="brackets-curly" href="/api-reference/payload">
  See every field in `BilyProduct` and `BilyOrder`.
</Card>
