---
title: checkout_completed
description: >-
  The `checkout_completed` event logs when a visitor completes a purchase. It's
  triggered once for each checkout, typically on the **Thank you** page.
  However, for upsells and post purchases, the `checkout_completed` event is
  triggered on the first upsell offer page instead. The event isn't triggered
  again on the **Thank you** page. If the page where the event is supposed to be
  triggered fails to load, then the `checkout_completed` event isn't triggered
  at all.
api_name: web-pixels
source_url:
  html: >-
    https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed
  md: >-
    https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed.md
---

# checkout\_​completedinterface

The `checkout_completed` event logs when a visitor completes a purchase. It's triggered once for each checkout, typically on the **Thank you** page. However, for upsells and post purchases, the `checkout_completed` event is triggered on the first upsell offer page instead. The event isn't triggered again on the **Thank you** page. If the page where the event is supposed to be triggered fails to load, then the `checkout_completed` event isn't triggered at all.

## Properties

* clientId

  string

  The client-side ID of the customer, provided by Shopify

* context

  Context

* data

  PixelEventsCheckoutCompletedData

* id

  string

  The ID of the customer event

* name

  string

  The name of the customer event

* seq

  number

  The sequence index number of the event.

* timestamp

  string

  The timestamp of when the customer event occurred, in [ISO 8601](https://en.wikipedia.org/wiki/ISO_8601) format

* type

  EventType.Standard

### Context

A snapshot of various read-only properties of the browser at the time of event

* document

  Snapshot of a subset of properties of the \`document\` object in the top frame of the browser

  ```ts
  WebPixelsDocument
  ```

* navigator

  Snapshot of a subset of properties of the \`navigator\` object in the top frame of the browser

  ```ts
  WebPixelsNavigator
  ```

* window

  Snapshot of a subset of properties of the \`window\` object in the top frame of the browser

  ```ts
  WebPixelsWindow
  ```

```ts
export interface Context {
  /**
   * Snapshot of a subset of properties of the `document` object in the top
   * frame of the browser
   */
  document?: WebPixelsDocument;

  /**
   * Snapshot of a subset of properties of the `navigator` object in the top
   * frame of the browser
   */
  navigator?: WebPixelsNavigator;

  /**
   * Snapshot of a subset of properties of the `window` object in the top frame
   * of the browser
   */
  window?: WebPixelsWindow;
}
```

### WebPixelsDocument

A snapshot of a subset of properties of the \`document\` object in the top frame of the browser

* characterSet

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Document), returns the character set being used by the document

  ```ts
  string
  ```

* location

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Document), returns the URI of the current document

  ```ts
  Location
  ```

* referrer

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Document), returns the URI of the page that linked to this page

  ```ts
  string
  ```

* title

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Document), returns the title of the current document

  ```ts
  string
  ```

```ts
export interface WebPixelsDocument {
  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Document),
   * returns the character set being used by the document
   */
  characterSet?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Document),
   * returns the URI of the current document
   */
  location?: Location;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Document),
   * returns the URI of the page that linked to this page
   */
  referrer?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Document),
   * returns the title of the current document
   */
  title?: string;
}
```

### Location

A snapshot of a subset of properties of the \`location\` object in the top frame of the browser

* hash

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing a \`'#'\` followed by the fragment identifier of the URL

  ```ts
  string
  ```

* host

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing the host, that is the hostname, a \`':'\`, and the port of the URL

  ```ts
  string
  ```

* hostname

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing the domain of the URL

  ```ts
  string
  ```

* href

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing the entire URL

  ```ts
  string
  ```

* origin

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing the canonical form of the origin of the specific location

  ```ts
  string
  ```

* pathname

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing an initial \`'/'\` followed by the path of the URL, not including the query string or fragment

  ```ts
  string
  ```

* port

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing the port number of the URL

  ```ts
  string
  ```

* protocol

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing the protocol scheme of the URL, including the final \`':'\`

  ```ts
  string
  ```

* search

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Location), a string containing a \`'?'\` followed by the parameters or "querystring" of the URL

  ```ts
  string
  ```

```ts
export interface Location {
  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing a `'#'` followed by the fragment identifier of the URL
   */
  hash?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing the host, that is the hostname, a `':'`, and the port of
   * the URL
   */
  host?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing the domain of the URL
   */
  hostname?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing the entire URL
   */
  href?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing the canonical form of the origin of the specific location
   */
  origin?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing an initial `'/'` followed by the path of the URL, not
   * including the query string or fragment
   */
  pathname?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing the port number of the URL
   */
  port?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing the protocol scheme of the URL, including the final `':'`
   */
  protocol?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Location), a
   * string containing a `'?'` followed by the parameters or "querystring" of
   * the URL
   */
  search?: string;
}
```

### WebPixelsNavigator

A snapshot of a subset of properties of the \`navigator\` object in the top frame of the browser

* cookieEnabled

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Navigator), returns \`false\` if setting a cookie will be ignored and true otherwise

  ```ts
  boolean
  ```

* language

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Navigator), returns a string representing the preferred language of the user, usually the language of the browser UI. The \`null\` value is returned when this is unknown

  ```ts
  string
  ```

* languages

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Navigator), returns an array of strings representing the languages known to the user, by order of preference

  ```ts
  ReadonlyArray<string>
  ```

* userAgent

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Navigator), returns the user agent string for the current browser

  ```ts
  string
  ```

```ts
export interface WebPixelsNavigator {
  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Navigator),
   * returns `false` if setting a cookie will be ignored and true otherwise
   */
  cookieEnabled?: boolean;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Navigator),
   * returns a string representing the preferred language of the user, usually
   * the language of the browser UI. The `null` value is returned when this
   * is unknown
   */
  language?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Navigator),
   * returns an array of strings representing the languages known to the user,
   * by order of preference
   */
  languages?: ReadonlyArray<string>;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Navigator),
   * returns the user agent string for the current browser
   */
  userAgent?: string;
}
```

### WebPixelsWindow

A snapshot of a subset of properties of the \`window\` object in the top frame of the browser

* innerHeight

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), gets the height of the content area of the browser window including, if rendered, the horizontal scrollbar

  ```ts
  number
  ```

* innerWidth

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), gets the width of the content area of the browser window including, if rendered, the vertical scrollbar

  ```ts
  number
  ```

* location

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), the location, or current URL, of the window object

  ```ts
  Location
  ```

* origin

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), the global object's origin, serialized as a string

  ```ts
  string
  ```

* outerHeight

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), gets the height of the outside of the browser window

  ```ts
  number
  ```

* outerWidth

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), gets the width of the outside of the browser window

  ```ts
  number
  ```

* pageXOffset

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), an alias for window\.scrollX

  ```ts
  number
  ```

* pageYOffset

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), an alias for window\.scrollY

  ```ts
  number
  ```

* screen

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Screen), the interface representing a screen, usually the one on which the current window is being rendered

  ```ts
  Screen
  ```

* screenX

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), the horizontal distance from the left border of the user's browser viewport to the left side of the screen

  ```ts
  number
  ```

* screenY

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), the vertical distance from the top border of the user's browser viewport to the top side of the screen

  ```ts
  number
  ```

* scrollX

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), the number of pixels that the document has already been scrolled horizontally

  ```ts
  number
  ```

* scrollY

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Window), the number of pixels that the document has already been scrolled vertically

  ```ts
  number
  ```

```ts
export interface WebPixelsWindow {
  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window),
   * gets the height of the content area of the browser window including, if
   * rendered, the horizontal scrollbar
   */
  innerHeight?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), gets
   * the width of the content area of the browser window including, if rendered,
   * the vertical scrollbar
   */
  innerWidth?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), the
   * location, or current URL, of the window object
   */
  location?: Location;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), the
   * global object's origin, serialized as a string
   */
  origin?: string;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), gets
   * the height of the outside of the browser window
   */
  outerHeight?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), gets
   * the width of the outside of the browser window
   */
  outerWidth?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), an
   * alias for window.scrollX
   */
  pageXOffset?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), an
   * alias for window.scrollY
   */
  pageYOffset?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Screen), the
   * interface representing a screen, usually the one on which the current
   * window is being rendered
   */
  screen?: Screen;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), the
   * horizontal distance from the left border of the user's browser viewport to
   * the left side of the screen
   */
  screenX?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), the
   * vertical distance from the top border of the user's browser viewport to the
   * top side of the screen
   */
  screenY?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), the
   * number of pixels that the document has already been scrolled horizontally
   */
  scrollX?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window), the
   * number of pixels that the document has already been scrolled vertically
   */
  scrollY?: number;
}
```

### Screen

The interface representing a screen, usually the one on which the current window is being rendered

* height

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Screen/height), the height of the screen

  ```ts
  number
  ```

* width

  Per \[MDN]\(https\://developer.mozilla.org/en-US/docs/Web/API/Screen/width), the width of the screen

  ```ts
  number
  ```

```ts
export interface Screen {
  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Screen/height),
   * the height of the screen
   */
  height?: number;

  /**
   * Per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Screen/width),
   * the width of the screen
   */
  width?: number;
}
```

### PixelEventsCheckoutCompletedData

* checkout

  ```ts
  Checkout
  ```

```ts
export interface PixelEventsCheckoutCompletedData {
  checkout?: Checkout;
}
```

### Checkout

A container for all the information required to add items to checkout and pay.

* attributes

  A list of attributes accumulated throughout the checkout process.

  ```ts
  Attribute[]
  ```

* billingAddress

  The billing address to where the order will be charged.

  ```ts
  MailingAddress | null
  ```

* buyerAcceptsEmailMarketing

  Indicates whether the customer has consented to be sent marketing material via email. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  boolean
  ```

* buyerAcceptsSmsMarketing

  Indicates whether the customer has consented to be sent marketing material via SMS. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  boolean
  ```

* currencyCode

  The three-letter code that represents the currency, for example, USD. Supported codes include standard ISO 4217 codes, legacy codes, and non- standard codes.

  ```ts
  string | null
  ```

* delivery

  Represents the selected delivery options for a checkout. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  Delivery | null
  ```

* discountApplications

  A list of discount applications.

  ```ts
  DiscountApplication[]
  ```

* discountsAmount

  The total amount of the discounts applied to the price of the checkout. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  MoneyV2 | null
  ```

* email

  The email attached to this checkout.

  ```ts
  string | null
  ```

* lineItems

  A list of line item objects, each one containing information about an item in the checkout.

  ```ts
  CheckoutLineItem[]
  ```

* localization

  Information about the active localized experience. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  Localization
  ```

* order

  The resulting order from a paid checkout.

  ```ts
  Order | null
  ```

* phone

  A unique phone number for the customer. Formatted using E.164 standard. For example, \*+16135551111\*.

  ```ts
  string | null
  ```

* shippingAddress

  The shipping address to where the line items will be shipped.

  ```ts
  MailingAddress | null
  ```

* shippingLine

  Once a shipping rate is selected by the customer it is transitioned to a \`shipping\_line\` object.

  ```ts
  ShippingRate | null
  ```

* smsMarketingPhone

  The phone number provided by the buyer after opting in to SMS marketing. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  string | null
  ```

* subtotalPrice

  The price at checkout before duties, shipping, and taxes.

  ```ts
  MoneyV2 | null
  ```

* token

  A unique identifier for a particular checkout.

  ```ts
  string | null
  ```

* totalPrice

  The sum of all the prices of all the items in the checkout, including duties, taxes, and discounts.

  ```ts
  MoneyV2 | null
  ```

* totalTax

  The sum of all the taxes applied to the line items and shipping lines in the checkout.

  ```ts
  MoneyV2
  ```

* transactions

  A list of transactions associated with a checkout or order. Certain transactions, such as credit card transactions, may only be present in the checkout\_completed event.

  ```ts
  Transaction[]
  ```

```ts
export interface Checkout {
  /**
   * A list of attributes accumulated throughout the checkout process.
   */
  attributes?: Attribute[];

  /**
   * The billing address to where the order will be charged.
   */
  billingAddress?: MailingAddress | null;

  /**
   * Indicates whether the customer has consented to be sent marketing material
   * via email. This property is only available if the shop has [upgraded
   * to Checkout Extensibility](https://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  buyerAcceptsEmailMarketing?: boolean;

  /**
   * Indicates whether the customer has consented to be sent marketing material
   * via SMS. This property is only available if the shop has [upgraded to
   * Checkout Extensibility](https://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  buyerAcceptsSmsMarketing?: boolean;

  /**
   * The three-letter code that represents the currency, for example, USD.
   * Supported codes include standard ISO 4217 codes, legacy codes, and non-
   * standard codes.
   */
  currencyCode?: string | null;

  /**
   * Represents the selected delivery options for a checkout. This
   * property is only available if the shop has [upgraded to Checkout
   * Extensibility](https://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  delivery?: Delivery | null;

  /**
   * A list of discount applications.
   */
  discountApplications?: DiscountApplication[];

  /**
   * The total amount of the discounts applied to the price of the checkout.
   * This property is only available if the shop has [upgraded to Checkout
   * Extensibility](https://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  discountsAmount?: MoneyV2 | null;

  /**
   * The email attached to this checkout.
   */
  email?: string | null;

  /**
   * A list of line item objects, each one containing information about an item
   * in the checkout.
   */
  lineItems?: CheckoutLineItem[];

  /**
   * Information about the active localized experience. This
   * property is only available if the shop has [upgraded to Checkout
   * Extensibility](https://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  localization?: Localization;

  /**
   * The resulting order from a paid checkout.
   */
  order?: Order | null;

  /**
   * A unique phone number for the customer. Formatted using E.164 standard. For
   * example, *+16135551111*.
   */
  phone?: string | null;

  /**
   * The shipping address to where the line items will be shipped.
   */
  shippingAddress?: MailingAddress | null;

  /**
   * Once a shipping rate is selected by the customer it is transitioned to a
   * `shipping_line` object.
   */
  shippingLine?: ShippingRate | null;

  /**
   * The phone number provided by the buyer after opting in to SMS
   * marketing. This property is only available if the shop has [upgraded
   * to Checkout Extensibility](https://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  smsMarketingPhone?: string | null;

  /**
   * The price at checkout before duties, shipping, and taxes.
   */
  subtotalPrice?: MoneyV2 | null;

  /**
   * A unique identifier for a particular checkout.
   */
  token?: string | null;

  /**
   * The sum of all the prices of all the items in the checkout, including
   * duties, taxes, and discounts.
   */
  totalPrice?: MoneyV2 | null;

  /**
   * The sum of all the taxes applied to the line items and shipping lines in
   * the checkout.
   */
  totalTax?: MoneyV2;

  /**
   * A list of transactions associated with a checkout or order. Certain
   * transactions, such as credit card transactions, may only be present in the
   * checkout_completed event.
   */
  transactions?: Transaction[];
}
```

### Attribute

Custom attributes associated with the cart or checkout.

* key

  The key for the attribute.

  ```ts
  string
  ```

* value

  The value for the attribute.

  ```ts
  string
  ```

```ts
export interface Attribute {
  /**
   * The key for the attribute.
   */
  key?: string;

  /**
   * The value for the attribute.
   */
  value?: string;
}
```

### MailingAddress

A mailing address for customers and shipping.

* address1

  The first line of the address. This is usually the street address or a P.O. Box number.

  ```ts
  string | null
  ```

* address2

  The second line of the address. This is usually an apartment, suite, or unit number.

  ```ts
  string | null
  ```

* city

  The name of the city, district, village, or town.

  ```ts
  string | null
  ```

* country

  The name of the country.

  ```ts
  string | null
  ```

* countryCode

  The two-letter code that represents the country, for example, US. The country codes generally follows ISO 3166-1 alpha-2 guidelines.

  ```ts
  string | null
  ```

* firstName

  The customer’s first name.

  ```ts
  string | null
  ```

* lastName

  The customer’s last name.

  ```ts
  string | null
  ```

* phone

  The phone number for this mailing address as entered by the customer.

  ```ts
  string | null
  ```

* province

  The region of the address, such as the province, state, or district.

  ```ts
  string | null
  ```

* provinceCode

  The two-letter code for the region. For example, ON.

  ```ts
  string | null
  ```

* zip

  The ZIP or postal code of the address.

  ```ts
  string | null
  ```

```ts
export interface MailingAddress {
  /**
   * The first line of the address. This is usually the street address or a P.O.
   * Box number.
   */
  address1?: string | null;

  /**
   * The second line of the address. This is usually an apartment, suite, or
   * unit number.
   */
  address2?: string | null;

  /**
   * The name of the city, district, village, or town.
   */
  city?: string | null;

  /**
   * The name of the country.
   */
  country?: string | null;

  /**
   * The two-letter code that represents the country, for example, US.
   * The country codes generally follows ISO 3166-1 alpha-2 guidelines.
   */
  countryCode?: string | null;

  /**
   * The customer’s first name.
   */
  firstName?: string | null;

  /**
   * The customer’s last name.
   */
  lastName?: string | null;

  /**
   * The phone number for this mailing address as entered by the customer.
   */
  phone?: string | null;

  /**
   * The region of the address, such as the province, state, or district.
   */
  province?: string | null;

  /**
   * The two-letter code for the region.
   * For example, ON.
   */
  provinceCode?: string | null;

  /**
   * The ZIP or postal code of the address.
   */
  zip?: string | null;
}
```

### Delivery

The delivery information for the event.

* selectedDeliveryOptions

  The selected delivery options for the event.

  ```ts
  DeliveryOption[]
  ```

```ts
export interface Delivery {
  /**
   * The selected delivery options for the event.
   */
  selectedDeliveryOptions?: DeliveryOption[];
}
```

### DeliveryOption

Represents a delivery option that the customer can choose from.

* cost

  The cost of the delivery option.

  ```ts
  MoneyV2 | null
  ```

* costAfterDiscounts

  The cost of the delivery option after discounts have been applied.

  ```ts
  MoneyV2 | null
  ```

* description

  The description of the delivery option.

  ```ts
  string | null
  ```

* handle

  The unique identifier of the delivery option.

  ```ts
  string
  ```

* title

  The title of the delivery option.

  ```ts
  string | null
  ```

* type

  The type of delivery option. - \`pickup\` - \`pickupPoint\` - \`shipping\` - \`local\`

  ```ts
  string
  ```

```ts
export interface DeliveryOption {
  /**
   * The cost of the delivery option.
   */
  cost?: MoneyV2 | null;

  /**
   * The cost of the delivery option after discounts have been applied.
   */
  costAfterDiscounts?: MoneyV2 | null;

  /**
   * The description of the delivery option.
   */
  description?: string | null;

  /**
   * The unique identifier of the delivery option.
   */
  handle?: string;

  /**
   * The title of the delivery option.
   */
  title?: string | null;

  /**
   * The type of delivery option.
   *
   * - `pickup`
   * - `pickupPoint`
   * - `shipping`
   * - `local`
   */
  type?: string;
}
```

### MoneyV2

A monetary value with currency.

* amount

  The decimal money amount.

  ```ts
  number
  ```

* currencyCode

  The three-letter code that represents the currency, for example, USD. Supported codes include standard ISO 4217 codes, legacy codes, and non- standard codes.

  ```ts
  string
  ```

```ts
export interface MoneyV2 {
  /**
   * The decimal money amount.
   */
  amount?: number;

  /**
   * The three-letter code that represents the currency, for example, USD.
   * Supported codes include standard ISO 4217 codes, legacy codes, and non-
   * standard codes.
   */
  currencyCode?: string;
}
```

### DiscountApplication

The information about the intent of the discount.

* allocationMethod

  The method by which the discount's value is applied to its entitled items. - \`ACROSS\`: The value is spread across all entitled lines. - \`EACH\`: The value is applied onto every entitled line.

  ```ts
  string
  ```

* targetSelection

  How the discount amount is distributed on the discounted lines. - \`ALL\`: The discount is allocated onto all the lines. - \`ENTITLED\`: The discount is allocated onto only the lines that it's entitled for. - \`EXPLICIT\`: The discount is allocated onto explicitly chosen lines.

  ```ts
  string
  ```

* targetType

  The type of line (i.e. line item or shipping line) on an order that the discount is applicable towards. - \`LINE\_ITEM\`: The discount applies onto line items. - \`SHIPPING\_LINE\`: The discount applies onto shipping lines.

  ```ts
  string
  ```

* title

  The customer-facing name of the discount. If the type of discount is a \`DISCOUNT\_CODE\`, this \`title\` attribute represents the code of the discount.

  ```ts
  string
  ```

* type

  The type of the discount. - \`AUTOMATIC\`: A discount automatically at checkout or in the cart without the need for a code. - \`DISCOUNT\_CODE\`: A discount applied onto checkouts through the use of a code. - \`MANUAL\`: A discount that is applied to an order by a merchant or store owner manually, rather than being automatically applied by the system or through a script. - \`SCRIPT\`: A discount applied to a customer's order using a script

  ```ts
  string
  ```

* value

  The value of the discount. Fixed discounts return a \`Money\` Object, while Percentage discounts return a \`PricingPercentageValue\` object.

  ```ts
  MoneyV2 | PricingPercentageValue
  ```

```ts
export interface DiscountApplication {
  /**
   * The method by which the discount's value is applied to its entitled items.
   *
   * - `ACROSS`: The value is spread across all entitled lines.
   * - `EACH`: The value is applied onto every entitled line.
   */
  allocationMethod?: string;

  /**
   * How the discount amount is distributed on the discounted lines.
   *
   * - `ALL`: The discount is allocated onto all the lines.
   * - `ENTITLED`: The discount is allocated onto only the lines that it's
   * entitled for.
   * - `EXPLICIT`: The discount is allocated onto explicitly chosen lines.
   */
  targetSelection?: string;

  /**
   * The type of line (i.e. line item or shipping line) on an order that the
   * discount is applicable towards.
   *
   * - `LINE_ITEM`: The discount applies onto line items.
   * - `SHIPPING_LINE`: The discount applies onto shipping lines.
   */
  targetType?: string;

  /**
   * The customer-facing name of the discount. If the type of discount is
   * a `DISCOUNT_CODE`, this `title` attribute represents the code of the
   * discount.
   */
  title?: string;

  /**
   * The type of the discount.
   *
   * - `AUTOMATIC`: A discount automatically at checkout or in the cart without
   * the need for a code.
   * - `DISCOUNT_CODE`: A discount applied onto checkouts through the use of
   * a code.
   * - `MANUAL`: A discount that is applied to an order by a merchant or store
   * owner manually, rather than being automatically applied by the system or
   * through a script.
   * - `SCRIPT`: A discount applied to a customer's order using a script
   */
  type?: string;

  /**
   * The value of the discount. Fixed discounts return a `Money` Object, while
   * Percentage discounts return a `PricingPercentageValue` object.
   */
  value?: MoneyV2 | PricingPercentageValue;
}
```

### PricingPercentageValue

A value given to a customer when a discount is applied to an order. The application of a discount with this value gives the customer the specified percentage off a specified item.

* percentage

  The percentage value of the object.

  ```ts
  number
  ```

```ts
export interface PricingPercentageValue {
  /**
   * The percentage value of the object.
   */
  percentage?: number;
}
```

### CheckoutLineItem

A single line item in the checkout, grouped by variant and attributes.

* discountAllocations

  The discounts that have been applied to the checkout line item by a discount application.

  ```ts
  DiscountAllocation[]
  ```

* finalLinePrice

  The combined price of all of the items in the line item after line-level discounts have been applied. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  MoneyV2
  ```

* id

  A globally unique identifier.

  ```ts
  string | null
  ```

* properties

  The properties of the line item. A shop may add, or enable customers to add custom information to a line item. Line item properties consist of a key and value pair. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  Property[]
  ```

* quantity

  The quantity of the line item.

  ```ts
  number
  ```

* sellingPlanAllocation

  The selling plan associated with the line item and the effect that each selling plan has on variants when they're purchased. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  SellingPlanAllocation | null
  ```

* title

  The title of the line item. Defaults to the product's title.

  ```ts
  string | null
  ```

* variant

  Product variant of the line item.

  ```ts
  ProductVariant | null
  ```

```ts
export interface CheckoutLineItem {
  /**
   * The discounts that have been applied to the checkout line item by a
   * discount application.
   */
  discountAllocations?: DiscountAllocation[];

  /**
   * The combined price of all of the items in the line item
   * after line-level discounts have been applied. This property
   * is only available if the shop has [upgraded to Checkout
   * Extensibility](https://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  finalLinePrice?: MoneyV2;

  /**
   * A globally unique identifier.
   */
  id?: string | null;

  /**
   * The properties of the line item. A shop may add, or enable customers to add
   * custom information to a line item. Line item properties consist of a key
   * and value pair. This property is only available if the shop has [upgraded
   * to Checkout Extensibility](https://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  properties?: Property[];

  /**
   * The quantity of the line item.
   */
  quantity?: number;

  /**
   * The selling plan associated with the line item and the effect that
   * each selling plan has on variants when they're purchased. This
   * property is only available if the shop has [upgraded to Checkout
   * Extensibility](https://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  sellingPlanAllocation?: SellingPlanAllocation | null;

  /**
   * The title of the line item. Defaults to the product's title.
   */
  title?: string | null;

  /**
   * Product variant of the line item.
   */
  variant?: ProductVariant | null;
}
```

### DiscountAllocation

The discount that has been applied to the checkout line item.

* amount

  The monetary value with currency allocated to the discount.

  ```ts
  MoneyV2
  ```

* discountApplication

  The information about the intent of the discount.

  ```ts
  DiscountApplication
  ```

```ts
export interface DiscountAllocation {
  /**
   * The monetary value with currency allocated to the discount.
   */
  amount?: MoneyV2;

  /**
   * The information about the intent of the discount.
   */
  discountApplication?: DiscountApplication;
}
```

### Property

The line item additional custom properties.

* key

  The key for the property.

  ```ts
  string
  ```

* value

  The value for the property.

  ```ts
  string
  ```

```ts
export interface Property {
  /**
   * The key for the property.
   */
  key?: string;

  /**
   * The value for the property.
   */
  value?: string;
}
```

### SellingPlanAllocation

Represents an association between a variant and a selling plan.

* sellingPlan

  A representation of how products and variants can be sold and purchased. For example, an individual selling plan could be '6 weeks of prepaid granola, delivered weekly'.

  ```ts
  SellingPlan
  ```

```ts
export interface SellingPlanAllocation {
  /**
   * A representation of how products and variants can be sold and purchased.
   * For example, an individual selling plan could be '6 weeks of prepaid
   * granola, delivered weekly'.
   */
  sellingPlan?: SellingPlan;
}
```

### SellingPlan

Represents how products and variants can be sold and purchased.

* id

  A globally unique identifier.

  ```ts
  string
  ```

* name

  The name of the selling plan. For example, '6 weeks of prepaid granola, delivered weekly'.

  ```ts
  string
  ```

```ts
export interface SellingPlan {
  /**
   * A globally unique identifier.
   */
  id?: string;

  /**
   * The name of the selling plan. For example, '6 weeks of prepaid granola,
   * delivered weekly'.
   */
  name?: string;
}
```

### ProductVariant

A product variant represents a different version of a product, such as differing sizes or differing colors.

* id

  A globally unique identifier.

  ```ts
  string | null
  ```

* image

  Image associated with the product variant. This field falls back to the product image if no image is available.

  ```ts
  Image | null
  ```

* price

  The product variant’s price.

  ```ts
  MoneyV2
  ```

* product

  The product object that the product variant belongs to.

  ```ts
  Product
  ```

* sku

  The SKU (stock keeping unit) associated with the variant.

  ```ts
  string | null
  ```

* title

  The product variant’s title.

  ```ts
  string | null
  ```

* untranslatedTitle

  The product variant’s untranslated title.

  ```ts
  string | null
  ```

```ts
export interface ProductVariant {
  /**
   * A globally unique identifier.
   */
  id?: string | null;

  /**
   * Image associated with the product variant. This field falls back to the
   * product image if no image is available.
   */
  image?: Image | null;

  /**
   * The product variant’s price.
   */
  price?: MoneyV2;

  /**
   * The product object that the product variant belongs to.
   */
  product?: Product;

  /**
   * The SKU (stock keeping unit) associated with the variant.
   */
  sku?: string | null;

  /**
   * The product variant’s title.
   */
  title?: string | null;

  /**
   * The product variant’s untranslated title.
   */
  untranslatedTitle?: string | null;
}
```

### Image

An image resource.

* src

  The location of the image as a URL.

  ```ts
  string | null
  ```

```ts
export interface Image {
  /**
   * The location of the image as a URL.
   */
  src?: string | null;
}
```

### Product

A product is an individual item for sale in a Shopify store.

* id

  The ID of the product.

  ```ts
  string | null
  ```

* title

  The product’s title.

  ```ts
  string
  ```

* type

  The \[product type]\(https\://help.shopify.com/en/manual/products/details/product-type) specified by the merchant.

  ```ts
  string | null
  ```

* untranslatedTitle

  The product’s untranslated title.

  ```ts
  string | null
  ```

* url

  The relative URL of the product.

  ```ts
  string | null
  ```

* vendor

  The product’s vendor name.

  ```ts
  string
  ```

```ts
export interface Product {
  /**
   * The ID of the product.
   */
  id?: string | null;

  /**
   * The product’s title.
   */
  title?: string;

  /**
   * The [product
   * type](https://help.shopify.com/en/manual/products/details/product-type)
   * specified by the merchant.
   */
  type?: string | null;

  /**
   * The product’s untranslated title.
   */
  untranslatedTitle?: string | null;

  /**
   * The relative URL of the product.
   */
  url?: string | null;

  /**
   * The product’s vendor name.
   */
  vendor?: string;
}
```

### Localization

Information about the active localized experience.

* country

  The country of the active localized experience.

  ```ts
  Country
  ```

* language

  The language of the active localized experience.

  ```ts
  Language
  ```

* market

  The market including the country of the active localized experience.

  ```ts
  Market
  ```

```ts
export interface Localization {
  /**
   * The country of the active localized experience.
   */
  country?: Country;

  /**
   * The language of the active localized experience.
   */
  language?: Language;

  /**
   * The market including the country of the active localized experience.
   */
  market?: Market;
}
```

### Country

A country.

* isoCode

  The ISO-3166-1 code for this country, for example, "US".

  ```ts
  string | null
  ```

```ts
export interface Country {
  /**
   * The ISO-3166-1 code for this country, for example, "US".
   */
  isoCode?: string | null;
}
```

### Language

A language.

* isoCode

  The BCP-47 language tag. It may contain a dash followed by an ISO 3166-1 alpha-2 region code, for example, "en-US".

  ```ts
  string
  ```

```ts
export interface Language {
  /**
   * The BCP-47 language tag. It may contain a dash followed by an ISO 3166-1
   * alpha-2 region code, for example, "en-US".
   */
  isoCode?: string;
}
```

### Market

A group of one or more regions of the world that a merchant is targeting for sales. To learn more about markets, refer to \[this]\(https\://shopify.dev/docs/apps/markets) conceptual overview.

* handle

  A human-readable, shop-scoped identifier.

  ```ts
  string | null
  ```

* id

  A globally unique identifier.

  ```ts
  string | null
  ```

```ts
export interface Market {
  /**
   * A human-readable, shop-scoped identifier.
   */
  handle?: string | null;

  /**
   * A globally unique identifier.
   */
  id?: string | null;
}
```

### Order

An order is a customer’s completed request to purchase one or more products from a shop. An order is created when a customer completes the checkout process.

* customer

  The customer that placed the order.

  ```ts
  OrderCustomer | null
  ```

* id

  The ID of the order. ID will be null for all events except checkout\_completed.

  ```ts
  string | null
  ```

```ts
export interface Order {
  /**
   * The customer that placed the order.
   */
  customer?: OrderCustomer | null;

  /**
   * The ID of the order. ID will be null for all events except
   * checkout_completed.
   */
  id?: string | null;
}
```

### OrderCustomer

The customer that placed the order.

* id

  The ID of the customer.

  ```ts
  string | null
  ```

* isFirstOrder

  Indicates if the order is the customer’s first order. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  boolean | null
  ```

```ts
export interface OrderCustomer {
  /**
   * The ID of the customer.
   */
  id?: string | null;

  /**
   * Indicates if the order is the customer’s first order. This
   * property is only available if the shop has [upgraded to Checkout
   * Extensibility](https://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  isFirstOrder?: boolean | null;
}
```

### ShippingRate

A shipping rate to be applied to a checkout.

* price

  Price of this shipping rate.

  ```ts
  MoneyV2
  ```

```ts
export interface ShippingRate {
  /**
   * Price of this shipping rate.
   */
  price?: MoneyV2;
}
```

### Transaction

A transaction associated with a checkout or order.

* amount

  The monetary value with currency allocated to the transaction method.

  ```ts
  MoneyV2
  ```

* gateway

  The name of the payment provider used for the transaction.

  ```ts
  string
  ```

* paymentMethod

  The payment method used for the transaction. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

  ```ts
  TransactionPaymentMethod
  ```

```ts
export interface Transaction {
  /**
   * The monetary value with currency allocated to the transaction method.
   */
  amount?: MoneyV2;

  /**
   * The name of the payment provider used for the transaction.
   */
  gateway?: string;

  /**
   * The payment method used for the transaction. This property
   * is only available if the shop has [upgraded to Checkout
   * Extensibility](https://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).
   */
  paymentMethod?: TransactionPaymentMethod;
}
```

### TransactionPaymentMethod

The payment method used for the transaction. This property is only available if the shop has \[upgraded to Checkout Extensibility]\(https\://help.shopify.com/en/manual/checkout-settings/checkout-extensibility/checkout-upgrade).

* name

  The name of the payment method used for the transaction. This may further specify the payment method used.

  ```ts
  string
  ```

* type

  The type of payment method used for the transaction. - \`creditCard\`: A vaulted or manually entered credit card. - \`redeemable\`: A redeemable payment method, such as a gift card or store credit. - \`deferred\`: A \[deferred payment]\(https\://help.shopify.com/en/manual/orders/deferred-payments), such as invoicing the buyer and collecting payment later. - \`local\`: A \[local payment method]\(https\://help.shopify.com/en/manual/payments/shopify-payments/local-payment-methods) specific to the current region or market. - \`manualPayment\`: A manual payment method, such as an in-person retail transaction. - \`paymentOnDelivery\`: A payment that will be collected on delivery. - \`wallet\`: An integrated wallet, such as PayPal, Google Pay, Apple Pay, etc. - \`offsite\`: A payment processed outside of Shopify's checkout, excluding integrated wallets. - \`customOnSite\`: A custom payment method that is processed through a checkout extension with a payments app. - \`other\`: Another type of payment not defined here.

  ```ts
  string
  ```

```ts
export interface TransactionPaymentMethod {
  /**
   * The name of the payment method used for the transaction. This may further
   * specify the payment method used.
   */
  name?: string;

  /**
   * The type of payment method used for the transaction.
   *
   * - `creditCard`: A vaulted or manually entered credit card.
   * - `redeemable`: A redeemable payment method, such as a gift card or store
   * credit.
   * - `deferred`: A [deferred
   * payment](https://help.shopify.com/en/manual/orders/deferred-payments), such
   * as invoicing the buyer and collecting payment later.
   * - `local`: A [local payment
   * method](https://help.shopify.com/en/manual/payments/shopify-payments/local-payment-methods) specific to the current region or market.
   * - `manualPayment`: A manual payment method, such as an in-person retail
   * transaction.
   * - `paymentOnDelivery`: A payment that will be collected on delivery.
   * - `wallet`: An integrated wallet, such as PayPal, Google Pay, Apple Pay,
   * etc.
   * - `offsite`: A payment processed outside of Shopify's checkout, excluding
   * integrated wallets.
   * - `customOnSite`: A custom payment method that is processed through a
   * checkout extension with a payments app.
   * - `other`: Another type of payment not defined here.
   */
  type?: string;
}
```

### EventType

* AdvancedDom

  ```ts
  advanced-dom
  ```

* Custom

  ```ts
  custom
  ```

* Dom

  ```ts
  dom
  ```

* Meta

  ```ts
  meta
  ```

* Standard

  ```ts
  standard
  ```

```ts
export enum EventType {
  AdvancedDom = 'advanced-dom',
  Custom = 'custom',
  Dom = 'dom',
  Meta = 'meta',
  Standard = 'standard',
}
```

### Examples

* #### Accessing Standard Events

  ##### App Pixel

  ```javascript
  import {register} from '@shopify/web-pixels-extension';

  register(({analytics}) => {
    analytics.subscribe('checkout_completed', (event) => {
      // Example for accessing event data
      const checkout = event.data.checkout;

      const checkoutTotalPrice = checkout.totalPrice?.amount;

      const allDiscountCodes = checkout.discountApplications.map((discount) => {
        if (discount.type === 'DISCOUNT_CODE') {
          return discount.title;
        }
      });

      const firstItem = checkout.lineItems[0];

      const firstItemDiscountedValue = firstItem.discountAllocations[0]?.amount;

      const customItemPayload = {
        quantity: firstItem.quantity,
        title: firstItem.title,
        discount: firstItemDiscountedValue,
      };

      const paymentTransactions = event.data.checkout.transactions.map((transaction) => {
        return {
            paymentGateway: transaction.gateway,
            amount: transaction.amount,
          };
      });

      const payload = {
        event_name: event.name,
        event_data: {
          totalPrice: checkoutTotalPrice,
          discountCodesUsed: allDiscountCodes,
          firstItem: customItemPayload,
          paymentTransactions: paymentTransactions,
        },
      };

      // Example for sending event data to third party servers
      fetch('https://example.com/pixel', {
        method: 'POST',
        body: JSON.stringify(payload),
        keepalive: true,
      });
    });
  });
  ```

  ##### Custom Pixel

  ```javascript
  analytics.subscribe('checkout_completed', (event) => {
    // Example for accessing event data
    const checkout = event.data.checkout;

    const checkoutTotalPrice = checkout.totalPrice?.amount;

    const allDiscountCodes = checkout.discountApplications.map((discount) => {
      if (discount.type === 'DISCOUNT_CODE') {
        return discount.title;
      }
    });

    const firstItem = checkout.lineItems[0];

    const firstItemDiscountedValue = firstItem.discountAllocations[0]?.amount;

    const customItemPayload = {
      quantity: firstItem.quantity,
      title: firstItem.title,
      discount: firstItemDiscountedValue,
    };

    const paymentTransactions = event.data.checkout.transactions.map((transaction) => {
      return {
          paymentGateway: transaction.gateway,
          amount: transaction.amount,
        };
    });

    const payload = {
      event_name: event.name,
      event_data: {
        totalPrice: checkoutTotalPrice,
        discountCodesUsed: allDiscountCodes,
        firstItem: customItemPayload,
        paymentTransactions: paymentTransactions,
      },
    };

    // Example for sending event data to third party servers
    fetch('https://example.com/pixel', {
      method: 'POST',
      body: JSON.stringify(payload),
      keepalive: true,
    });
  });
  ```