---
title: purchase.thank-you.header.render-after
description: >-
A static extension target that is rendered below the header on the **Thank
you** page.
> Tip:
> To prevent layout shifting, avoid dynamic data fetching & rendering in this target. If you need to render dynamic content, consider reserving space for your content while it is loading.
> See: [Spinner](/docs/api/checkout-ui-extensions/components/feedback/spinner), [SkeletonText](/docs/api/checkout-ui-extensions/components/feedback/skeletontext), or [BlockSpacer](/docs/api/checkout-ui-extensions/components/structure/blockspacer).
api_version: 2026-04
api_name: checkout-ui-extensions
source_url:
html: >-
https://shopify.dev/docs/api/checkout-ui-extensions/latest/targets/header/purchase-thank-you-header-render-after
md: >-
https://shopify.dev/docs/api/checkout-ui-extensions/latest/targets/header/purchase-thank-you-header-render-after.md
---
# purchase.thank-you.header.render-after
**Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data) for some properties.:**
A static extension target that is rendered below the header on the **Thank you** page.
**Tip:** To prevent layout shifting, avoid dynamic data fetching \& rendering in this target. If you need to render dynamic content, consider reserving space for your content while it is loading. See: \Spinner\, \SkeletonText\, or \BlockSpacer\.
### Support Components (55) APIs (24)
### Supported components
* [Abbreviation](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/abbreviation)
* [Badge](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/feedback-and-status-indicators/badge)
* [Banner](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/feedback-and-status-indicators/banner)
* [Box](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/layout-and-structure/box)
* [Button](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/actions/button)
* [Checkbox](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/checkbox)
* [Chip](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/chip)
* [Choice list](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/choice-list)
* [Clickable](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/actions/clickable)
* [Clickable chip](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/actions/clickable-chip)
* [Clipboard item](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/actions/clipboard-item)
* [Consent checkbox](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/consent-checkbox)
* [Consent phone field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/consent-phone-field)
* [Date field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/date-field)
* [Date picker](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/date-picker)
* [Details](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/details)
* [Divider](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/layout-and-structure/divider)
* [Drop zone](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/drop-zone)
* [Email field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/email-field)
* [Form](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/form)
* [Grid](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/layout-and-structure/grid)
* [Heading](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/heading)
* [Icon](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/media-and-visuals/icon)
* [Image](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/media-and-visuals/image)
* [Link](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/actions/link)
* [Map](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/media-and-visuals/map)
* [Modal](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/overlays/modal)
* [Money field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/money-field)
* [Number field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/number-field)
* [Ordered list](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/ordered-list)
* [Paragraph](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/paragraph)
* [Password field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/password-field)
* [Payment icon](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/media-and-visuals/payment-icon)
* [Phone field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/phone-field)
* [Popover](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/overlays/popover)
* [Press button](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/actions/press-button)
* [Product thumbnail](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/media-and-visuals/product-thumbnail)
* [Progress](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/feedback-and-status-indicators/progress)
* [Qr code](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/media-and-visuals/qr-code)
* [Query container](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/layout-and-structure/query-container)
* [Scroll box](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/layout-and-structure/scroll-box)
* [Section](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/layout-and-structure/section)
* [Select](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/select)
* [Sheet](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/overlays/sheet)
* [Skeleton paragraph](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/skeleton-paragraph)
* [Spinner](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/feedback-and-status-indicators/spinner)
* [Stack](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/layout-and-structure/stack)
* [Switch](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/switch)
* [Text](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/text)
* [Text area](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/text-area)
* [Text field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/text-field)
* [Time](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/time)
* [Tooltip](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/overlays/tooltip)
* [Unordered list](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/typography-and-content/unordered-list)
* [Url field](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/web-components/forms/url-field)
### Available APIs
* [Addresses API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/addresses-api)
* [Analytics API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/analytics-api)
* [Attributes API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/attributes-api)
* [Buyer Identity API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/buyer-identity-api)
* [Buyer Journey API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/buyer-journey-api)
* [Cart Instructions API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/cart-instructions-api)
* [Cart Lines API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/cart-lines-api)
* [Checkout Token API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/checkout-token-api)
* [Cost API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/cost-api)
* [Customer Privacy API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/customer-privacy-api)
* [Delivery API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/delivery-api)
* [Discounts API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/discounts-api)
* [Extension API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/extension-api)
* [Gift Cards API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/gift-cards-api)
* [Localization API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/localization-api)
* [Localized Fields API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/localized-fields-api)
* [Metafields API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/metafields-api)
* [Note API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/note-api)
* [Payments API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/checkout-apis/payments-api)
* [Session Token API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/session-token-api)
* [Settings API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/settings-api)
* [Shop API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/shop-api)
* [Storage API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/storage-api)
* [Storefront API](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/target-apis/platform-apis/storefront-api)
## OrderConfirmationApi
The API object provided to this and other `purchase.thank-you` extension targets.
* **orderConfirmation**
**SubscribableSignalLike\**
**required**
The order details available after the buyer completes checkout, including the order ID, order number, and whether it's the buyer's first purchase.
### SubscribableSignalLike
Represents a reactive signal interface that provides both immediate value access and subscription-based updates. Enables real-time synchronization with changing data through the observer pattern. This interface extends \`ReadonlySignalLike\` with deprecated fields that are still supported for backwards compatibility.
* current
The current value of the signal. Equivalent to \`.value\`, accessing this property subscribes to changes when used in a reactive context.
```ts
T
```
* destroy
Cleans up the subscription and releases any resources held by this signal. After calling \`destroy()\`, the signal stops receiving updates from the main thread.
```ts
() => Promise
```
* subscribe
Subscribes to value changes and calls the provided function whenever the value updates. Returns an unsubscribe function to clean up the subscription. Use to automatically react to changes in the signal's value.
```ts
(fn: (value: T) => void) => () => void
```
* value
The current value of the signal. This property provides immediate access to the current value without requiring subscription setup. Use for one-time value checks or initial setup.
```ts
T
```
### OrderConfirmation
* isFirstOrder
Whether this is the customer's first completed order with this shop. \`true\` means the buyer hasn't placed an order here before. Use this to show first-purchase messaging or trigger welcome offers.
```ts
boolean
```
* number
A randomly generated alpha-numeric identifier for the order, distinct from \`order.id\`. The value is \`undefined\` for orders that were created before this field was introduced. All recent orders have a number.
```ts
string
```
* order
```ts
{ id: string; }
```
## StandardApi
The base API object provided to this and other `purchase.checkout` and `purchase.thank-you` extension targets.
* **analytics**
**Analytics**
**required**
Tracks custom events and sends visitor information to [Web Pixels](https://shopify.dev/docs/apps/marketing). Use `publish()` to emit events and `visitor()` to submit buyer contact details.
* **appliedGiftCards**
**SubscribableSignalLike\**
**required**
The gift cards that have been applied to the checkout. Each entry includes the last four characters of the gift card code, the amount used at checkout, and the card's remaining balance.
* **applyTrackingConsentChange**
**ApplyTrackingConsentChangeType**
**required**
Enables setting and updating customer privacy consent settings and tracking consent metafields.
**Note:** Requires the \\\customer\\_privacy\\ capability\ to be set to \true\.
[](https://shopify.dev/apps/store/data-protection/protected-customer-data)Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
* **appMetafields**
**SubscribableSignalLike\**
**required**
The metafields requested in the [`shopify.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/configuration) file. These metafields are updated when there's a change in the merchandise items being purchased by the customer.
App owned metafields are supported and are returned using the `$app` format. The fully qualified reserved namespace format such as `app--{your-app-id}[--{optional-namespace}]` isn't supported. See [app owned metafields](https://shopify.dev/docs/apps/build/custom-data/ownership#reserved-prefixes) for more information.
[](https://shopify.dev/apps/store/data-protection/protected-customer-data)Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
* **attributes**
**SubscribableSignalLike\**
**required**
The custom key-value attributes attached to the cart or checkout. These are set by the buyer or by an extension using `applyAttributeChange()`. The list is empty if no attributes have been added.
* **availablePaymentOptions**
**SubscribableSignalLike\**
**required**
All payment options available to the buyer for this checkout, such as credit cards, wallets, and local payment methods. The list depends on the shop's payment configuration and the buyer's region.
* **buyerJourney**
**BuyerJourney**
**required**
Provides details on the buyer's progression through the checkout and lets you intercept navigation to validate data before the buyer continues.
Refer to [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/apis/buyer-journey#examples) examples for more information.
* **checkoutSettings**
**SubscribableSignalLike\**
**required**
Settings applied to the buyer's checkout.
* **checkoutToken**
**SubscribableSignalLike\**
**required**
A stable ID that represents the current checkout.
The value is `undefined` when the checkout hasn't been created on the server yet.
Use this to correlate checkout sessions across your extension, web pixels, and backend systems.
This matches the `data.checkout.token` field in a [checkout-related WebPixel event](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_started#properties-propertydetail-data) and the `checkout_token` field in the [REST Admin API `Order` resource](https://shopify.dev/docs/api/admin-rest/unstable/resources/order#resource-object).
* **cost**
**CartCost**
**required**
The cost breakdown for the current checkout, including subtotal, shipping, tax, and total amounts. These values update as the buyer progresses through checkout and costs like shipping and tax are calculated.
* **customerPrivacy**
**SubscribableSignalLike\**
**required**
Customer privacy consent settings and a flag denoting if consent has previously been collected.
* **deliveryGroups**
**SubscribableSignalLike\**
**required**
The delivery groups for this checkout. Each group contains one or more cart lines and the available delivery options (shipping, pickup point, or pickup location) for those items.
* **discountAllocations**
**SubscribableSignalLike\**
**required**
The discount allocations applied to the entire cart, including automatic discounts, code-based discounts, and custom discounts from [Shopify Functions](https://shopify.dev/docs/apps/build/functions). Each allocation indicates how much was discounted and how the discount was triggered.
* **discountCodes**
**SubscribableSignalLike\**
**required**
The discount codes currently applied to the checkout. The list is empty if no discount codes have been applied. Use `applyDiscountCodeChange()` to add or remove codes.
* **extension**
**Extension\**
**required**
Metadata about the running extension, including the current target, API version, capabilities, and editor context. Use this to conditionally render content based on where the extension is running.
* **i18n**
**I18n**
**required**
Utilities for translating strings, formatting currencies, numbers, and dates according to the buyer's locale. Use alongside [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/apis/localization) to build fully localized extensions.
* **instructions**
**SubscribableSignalLike\**
**required**
The cart instructions used to create the checkout and possibly limit extension capabilities.
These instructions should be checked before performing any actions that might be affected by them.
For example, if you intend to add a discount code via the `applyDiscountCodeChange` method, check `discounts.canUpdateDiscountCodes` to ensure it's supported in this checkout.
**Caution:** As of version \2024-07\, UI extension code must check for instructions before calling select APIs in case those APIs aren\'t available. See the \update guide\ for more information.
* **lines**
**SubscribableSignalLike\**
**required**
The list of line items the buyer intends to purchase. Each entry includes the merchandise, quantity, cost, and any custom attributes. Use `applyCartLinesChange()` to add, remove, or update line items.
* **localization**
**Localization**
**required**
The buyer's language, country, currency, and timezone context. For formatting and translation helpers, use the [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/apis/localization#standardapi-propertydetail-i18n) object instead.
* **note**
**SubscribableSignalLike\**
**required**
A note left by the customer to the merchant, either in their cart or during checkout.
The value is `undefined` if the buyer hasn't entered a note. Use this to display or react to order-level instructions such as delivery preferences or gift messages.
* **query**
**\>(query: string, options?: { variables?: Variables; version?: StorefrontApiVersion; }) => Promise<{ data?: Data; errors?: GraphQLError\[]; }>**
**required**
The method used to query the Storefront GraphQL API with a prefetched token.
Refer to [Storefront API access examples](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/apis/storefront-api) for more information.
* **selectedPaymentOptions**
**SubscribableSignalLike\**
**required**
The payment options the buyer has currently selected. This updates as the buyer changes their payment method. The array can contain multiple entries when the buyer splits payment across methods (for example, a gift card and a credit card).
* **sessionToken**
**SessionToken**
**required**
The session token providing a set of claims as a signed JSON Web Token (JWT).
The token has a TTL of five minutes.
If the previous token expires, this value reflects a new session token with a new signature and expiry.
Refer to [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/apis/session-token) for more information.
* **settings**
**SubscribableSignalLike\**
**required**
The settings matching the settings definition written in the [`shopify.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/configuration) file.
Refer to [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/apis/settings#examples) for more information.
**Note:** When an extension is being installed in the editor, the settings are empty until a merchant sets a value. In that case, this object updates in real time as a merchant fills in the settings.
* **shop**
**Shop**
**required**
The store where the checkout is taking place, including the shop name, storefront URL, `.myshopify.com` subdomain, and a globally-unique ID.
* **storage**
**Storage**
**required**
Key-value storage that persists across page loads within the current checkout session. Data is shared across all activated extension targets of this extension.
**Caution:** Data persistence isn\'t guaranteed and storage is cleared when the buyer starts a new checkout.
* **version**
**Version**
**required**
The renderer version being used for the extension.
* **billingAddress**
**SubscribableSignalLike\**
The proposed customer billing address. The address updates when the field is committed (on change) rather than every keystroke. The property is available only if the extension has access to protected customer data. The subscribable value is `undefined` if the billing address hasn't been provided yet.
[](https://shopify.dev/apps/store/data-protection/protected-customer-data)Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
* **buyerIdentity**
**BuyerIdentity**
Information about the buyer that's interacting with the checkout. The property is available only if the extension has access to protected customer data.
[](https://shopify.dev/apps/store/data-protection/protected-customer-data)Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
* **localizedFields**
**SubscribableSignalLike\**
Additional region-specific fields required during checkout, such as tax identification numbers (Brazil's CPF/CNPJ) or customs credentials. The property is available only if the extension has access to protected customer data. The array is empty if the current checkout doesn't require any localized fields.
* **shippingAddress**
**SubscribableSignalLike\**
The proposed customer shipping address. During the information step, the address updates when the field is committed (on change) rather than every keystroke. The property is available only if the extension has access to protected customer data. When available, the subscribable value is `undefined` if delivery isn't required.
[](https://shopify.dev/apps/store/data-protection/protected-customer-data)Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
* **extensionPoint**
**Target**
**required**
**deprecated**
The identifier that specifies where in Shopify's UI your code is being injected. This is one of the targets you've included in your extension's configuration file.
**Deprecated:**
Deprecated as of version `2023-07`, use `extension.target` instead.
### Analytics
Tracks custom events and sends visitor information to \[Web Pixels]\(/docs/apps/marketing). Use \`publish()\` to emit events and \`visitor()\` to submit buyer contact details.
* publish
Publishes a custom event to \[Web Pixels]\(/docs/apps/marketing). Returns \`true\` when the event is successfully dispatched.
```ts
(name: string, data: Record) => Promise
```
* visitor
Submits buyer contact details for attribution and analytics purposes.
```ts
(data: { email?: string; phone?: string; }) => Promise
```
### VisitorResult
Represents a visitor result.
```ts
VisitorSuccess | VisitorError
```
### VisitorSuccess
Represents a successful visitor result.
* type
Indicates that the visitor information was validated and submitted.
```ts
'success'
```
### VisitorError
Represents an unsuccessful visitor result.
* message
A message that explains the error. This message is useful for debugging. It isn't localized and shouldn't be displayed to the buyer.
```ts
string
```
* type
Indicates that the visitor information is invalid and wasn't submitted. Common causes include using the wrong data type or omitting a required property.
```ts
'error'
```
### AppliedGiftCard
* amountUsed
The amount of the applied gift card that's used when the checkout is completed. This might be less than \`balance\` if the order total is lower than the card's remaining balance.
```ts
Money
```
* balance
The current balance of the applied gift card before checkout completion. This reflects the full remaining value on the card, not just the amount being applied to this order.
```ts
Money
```
* lastCharacters
The last four characters of the applied gift card's code. The full code isn't exposed for security reasons. Use this value to display which card is applied.
```ts
string
```
### Money
* amount
The decimal amount of the price. For example, \`29.99\` represents twenty-nine dollars and ninety-nine cents.
```ts
number
```
* currencyCode
The three-letter currency code in \[ISO 4217]\(https://en.wikipedia.org/wiki/ISO\_4217) format.
```ts
CurrencyCode
```
### CurrencyCode
```ts
'AED' | 'AFN' | 'ALL' | 'AMD' | 'ANG' | 'AOA' | 'ARS' | 'AUD' | 'AWG' | 'AZN' | 'BAM' | 'BBD' | 'BDT' | 'BGN' | 'BHD' | 'BIF' | 'BMD' | 'BND' | 'BOB' | 'BOV' | 'BRL' | 'BSD' | 'BTN' | 'BWP' | 'BYN' | 'BZD' | 'CAD' | 'CDF' | 'CHE' | 'CHF' | 'CHW' | 'CLF' | 'CLP' | 'CNY' | 'COP' | 'COU' | 'CRC' | 'CUC' | 'CUP' | 'CVE' | 'CZK' | 'DJF' | 'DKK' | 'DOP' | 'DZD' | 'EGP' | 'ERN' | 'ETB' | 'EUR' | 'FJD' | 'FKP' | 'GBP' | 'GEL' | 'GHS' | 'GIP' | 'GMD' | 'GNF' | 'GTQ' | 'GYD' | 'HKD' | 'HNL' | 'HRK' | 'HTG' | 'HUF' | 'IDR' | 'ILS' | 'INR' | 'IQD' | 'IRR' | 'ISK' | 'JMD' | 'JOD' | 'JPY' | 'KES' | 'KGS' | 'KHR' | 'KMF' | 'KPW' | 'KRW' | 'KWD' | 'KYD' | 'KZT' | 'LAK' | 'LBP' | 'LKR' | 'LRD' | 'LSL' | 'LYD' | 'MAD' | 'MDL' | 'MGA' | 'MKD' | 'MMK' | 'MNT' | 'MOP' | 'MRU' | 'MUR' | 'MVR' | 'MWK' | 'MXN' | 'MXV' | 'MYR' | 'MZN' | 'NAD' | 'NGN' | 'NIO' | 'NOK' | 'NPR' | 'NZD' | 'OMR' | 'PAB' | 'PEN' | 'PGK' | 'PHP' | 'PKR' | 'PLN' | 'PYG' | 'QAR' | 'RON' | 'RSD' | 'RUB' | 'RWF' | 'SAR' | 'SBD' | 'SCR' | 'SDG' | 'SEK' | 'SGD' | 'SHP' | 'SLL' | 'SOS' | 'SRD' | 'SSP' | 'STN' | 'SVC' | 'SYP' | 'SZL' | 'THB' | 'TJS' | 'TMT' | 'TND' | 'TOP' | 'TRY' | 'TTD' | 'TWD' | 'TZS' | 'UAH' | 'UGX' | 'USD' | 'USN' | 'UYI' | 'UYU' | 'UYW' | 'UZS' | 'VES' | 'VND' | 'VUV' | 'WST' | 'XAF' | 'XAG' | 'XAU' | 'XBA' | 'XBB' | 'XBC' | 'XBD' | 'XCD' | 'XDR' | 'XOF' | 'XPD' | 'XPF' | 'XPT' | 'XSU' | 'XTS' | 'XUA' | 'XXX' | 'YER' | 'ZAR' | 'ZMW' | 'ZWL'
```
### ApplyTrackingConsentChangeType
* visitorConsent
```ts
VisitorConsentChange
```
Promise\
```ts
Promise
```
### VisitorConsentChange
* analytics
The visitor's consent for analytics tracking. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
* marketing
The visitor's consent for marketing and targeted advertising. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
* metafields
Tracking consent metafield data to be saved. If the value is \`null\`, the metafield is deleted.
```ts
TrackingConsentMetafieldChange[]
```
* preferences
The visitor's consent for storing preferences such as language and currency. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
* saleOfData
The visitor's consent for the sale or sharing of their personal data with third parties. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
* type
Identifies this as a visitor consent change. This is the only supported change type for \`applyTrackingConsentChange()\`.
```ts
'changeVisitorConsent'
```
### TrackingConsentMetafieldChange
* key
The identifier for the tracking consent metafield to update.
```ts
string
```
* value
The new value to store in the metafield. Set to \`null\` to delete the metafield.
```ts
string | null
```
### TrackingConsentChangeResult
```ts
TrackingConsentChangeResultSuccess | TrackingConsentChangeResultError
```
### TrackingConsentChangeResultSuccess
The returned result of a successful tracking consent preference update.
* type
Indicates that the tracking consent update was applied successfully.
```ts
'success'
```
### TrackingConsentChangeResultError
The returned result of an unsuccessful tracking consent preference update with a message detailing the type of error that occurred.
* message
A message that explains the error. This message is useful for debugging. It isn't localized and shouldn't be displayed to the buyer.
```ts
string
```
* type
Indicates that the tracking consent update couldn't be applied. Check the \`message\` property for details.
```ts
'error'
```
### AppMetafieldEntry
An entry that pairs a Shopify resource with one of its \[metafields]\(/docs/apps/build/custom-data/metafields). Each entry contains a \`target\` identifying which resource the metafield belongs to and a \`metafield\` object with the actual data.
* metafield
The metafield data, including the namespace, key, value, and content type. Use the \`namespace\` and \`key\` together to uniquely identify the metafield within its resource.
```ts
AppMetafield
```
* target
The Shopify resource that this metafield is attached to, including the resource type (such as \`'product'\` or \`'customer'\`) and its globally-unique ID. {% include /apps/checkout/privacy-icon.md %} Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data) when the type is \`customer\`, \`company\` or \`companyLocation\`.
```ts
AppMetafieldEntryTarget
```
### AppMetafield
Represents a custom \[metafield]\(/docs/apps/build/custom-data/metafields) attached to a resource such as a product, variant, customer, or shop.
* key
The identifier for the metafield within its namespace, such as \`'ingredients'\` or \`'shipping\_weight'\`.
```ts
string
```
* namespace
The namespace that the metafield belongs to. Namespaces group related metafields and prevent naming collisions between different apps. App owned metafield namespaces are returned using the \`$app\` format. See \[app owned metafields]\(/docs/apps/build/custom-data/ownership#reserved-prefixes) for more information.
```ts
string
```
* type
The metafield's \[type name]\(/docs/apps/build/custom-data/metafields/list-of-data-types), such as \`'single\_line\_text\_field'\` or \`'json'\`. This is the full type identifier, whereas \`valueType\` is a simplified category.
```ts
string
```
* value
The value of a metafield, stored as a string regardless of the underlying type. For JSON metafields, parse the string to access structured data.
```ts
string
```
* valueType
The metafield's information type. - \`'boolean'\`: A true or false value. - \`'float'\`: A decimal number value. - \`'integer'\`: A whole number value. - \`'json\_string'\`: A JSON-encoded string value. - \`'string'\`: A plain text value.
```ts
'boolean' | 'float' | 'integer' | 'json_string' | 'string'
```
### AppMetafieldEntryTarget
The Shopify resource that a metafield is attached to. Each entry identifies a specific resource by its type and globally-unique ID, so you can trace where the data comes from.
* id
The globally-unique identifier of the Shopify resource, in \[GID]\(/docs/api/usage/gids) format. Use this value to match the metafield to a specific resource in your extension or when querying the \[Storefront API]\(/docs/api/storefront).
```ts
string
```
* type
The kind of Shopify resource this metafield belongs to: - \`'customer'\`: The customer who placed the order. - \`'product'\`: A product in the merchant's catalog. - \`'shop'\`: The merchant's shop. - \`'shopUser'\`: A staff member or collaborator account on the shop. - \`'variant'\`: A specific variant of a product. - \`'company'\`: A \[B2B]\(/docs/apps/build/b2b) company associated with the order. - \`'companyLocation'\`: A location belonging to a \[B2B]\(/docs/apps/build/b2b) company. - \`'cart'\`: The cart associated with the checkout. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data) when the type is \`customer\`, \`company\` or \`companyLocation\`.
```ts
| 'customer'
| 'product'
| 'shop'
| 'shopUser'
| 'variant'
| 'company'
| 'companyLocation'
| 'cart'
```
### Attribute
* key
The identifier for the attribute. Each key must be unique within the set of attributes on the cart or checkout. If you call \`applyAttributeChange()\` with a key that already exists, then the existing value is replaced.
```ts
string
```
* value
The value associated with the attribute key. This is a freeform string that can store any information the buyer or app provides.
```ts
string
```
### PaymentOption
A payment option presented to the buyer.
* handle
A session-scoped identifier for this payment option. This handle isn't globally unique; it's specific to the current checkout session or the shop.
```ts
string
```
* type
The type of the payment option. Shops can be configured to support many different payment options. Some options are available only to buyers in specific regions. | Type | Description | |---|---| | \`creditCard\` | A vaulted or manually entered credit card. | | \`deferred\` | A \[deferred payment]\(https://help.shopify.com/en/manual/orders/deferred-payments), such as invoicing the buyer and collecting payment at a later time. | | \`local\` | A \[local payment option]\(https://help.shopify.com/en/manual/payments/shopify-payments/local-payment-methods) specific to the current region or market | | \`manualPayment\` | A manual payment option such as an in-person retail transaction. | | \`offsite\` | A payment processed outside of Shopify's checkout, excluding integrated wallets. | | \`other\` | Another type of payment not defined here. | | \`paymentOnDelivery\` | A payment collected on delivery. | | \`redeemable\` | A redeemable payment option such as a gift card or store credit. | | \`wallet\` | An integrated wallet such as PayPal, Google Pay, or Apple Pay. | | \`customOnsite\` | A custom payment option that's processed through a checkout extension with a payments app. |
```ts
| 'creditCard'
| 'deferred'
| 'local'
| 'manualPayment'
| 'offsite'
| 'other'
| 'paymentOnDelivery'
| 'redeemable'
| 'wallet'
| 'customOnsite'
```
### MailingAddress
* address1
The first line of the street address, including the street number and name. The value is \`undefined\` if the buyer hasn't entered an address yet. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* address2
The second line of the buyer's address, such as apartment number, suite, or unit. The value is \`undefined\` if the buyer didn't provide a second address line. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* city
The city, town, or village of the address. The value is \`undefined\` if the buyer hasn't entered a city yet. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* company
The buyer's company name. The value is \`undefined\` if the buyer didn't enter a company or the store doesn't collect company names. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* countryCode
The two-letter country code in \[ISO 3166 Alpha-2]\(https://en.wikipedia.org/wiki/ISO\_3166-1\_alpha-2) format. The value is \`undefined\` if the buyer hasn't selected a country yet. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
CountryCode
```
* firstName
The buyer's first name. Use this alongside \`lastName\` when you need to display or process name parts separately. The value is \`undefined\` if the buyer didn't provide a first name or the store doesn't collect split names. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* lastName
The buyer's last name. Use this alongside \`firstName\` when you need to display or process name parts separately. The value is \`undefined\` if the buyer didn't provide a last name or the store doesn't collect split names. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* name
The buyer's full name, typically a combination of first and last name. The value is \`undefined\` if the buyer didn't provide a name. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* phone
The phone number associated with the address, typically in international format. The value is \`undefined\` if the buyer didn't provide a phone number or the store doesn't collect phone numbers. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* provinceCode
The province, state, prefecture, or region code of the address. The format varies by country. The value is \`undefined\` if the buyer hasn't selected one yet or the country doesn't have provinces. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* zip
The postal code or ZIP code of the address, used for mail sorting and delivery routing. The value is \`undefined\` if the buyer hasn't entered one yet or the country doesn't use postal codes. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
### CountryCode
```ts
'AC' | 'AD' | 'AE' | 'AF' | 'AG' | 'AI' | 'AL' | 'AM' | 'AN' | 'AO' | 'AR' | 'AT' | 'AU' | 'AW' | 'AX' | 'AZ' | 'BA' | 'BB' | 'BD' | 'BE' | 'BF' | 'BG' | 'BH' | 'BI' | 'BJ' | 'BL' | 'BM' | 'BN' | 'BO' | 'BQ' | 'BR' | 'BS' | 'BT' | 'BV' | 'BW' | 'BY' | 'BZ' | 'CA' | 'CC' | 'CD' | 'CF' | 'CG' | 'CH' | 'CI' | 'CK' | 'CL' | 'CM' | 'CN' | 'CO' | 'CR' | 'CU' | 'CV' | 'CW' | 'CX' | 'CY' | 'CZ' | 'DE' | 'DJ' | 'DK' | 'DM' | 'DO' | 'DZ' | 'EC' | 'EE' | 'EG' | 'EH' | 'ER' | 'ES' | 'ET' | 'FI' | 'FJ' | 'FK' | 'FO' | 'FR' | 'GA' | 'GB' | 'GD' | 'GE' | 'GF' | 'GG' | 'GH' | 'GI' | 'GL' | 'GM' | 'GN' | 'GP' | 'GQ' | 'GR' | 'GS' | 'GT' | 'GW' | 'GY' | 'HK' | 'HM' | 'HN' | 'HR' | 'HT' | 'HU' | 'ID' | 'IE' | 'IL' | 'IM' | 'IN' | 'IO' | 'IQ' | 'IR' | 'IS' | 'IT' | 'JE' | 'JM' | 'JO' | 'JP' | 'KE' | 'KG' | 'KH' | 'KI' | 'KM' | 'KN' | 'KP' | 'KR' | 'KW' | 'KY' | 'KZ' | 'LA' | 'LB' | 'LC' | 'LI' | 'LK' | 'LR' | 'LS' | 'LT' | 'LU' | 'LV' | 'LY' | 'MA' | 'MC' | 'MD' | 'ME' | 'MF' | 'MG' | 'MK' | 'ML' | 'MM' | 'MN' | 'MO' | 'MQ' | 'MR' | 'MS' | 'MT' | 'MU' | 'MV' | 'MW' | 'MX' | 'MY' | 'MZ' | 'NA' | 'NC' | 'NE' | 'NF' | 'NG' | 'NI' | 'NL' | 'NO' | 'NP' | 'NR' | 'NU' | 'NZ' | 'OM' | 'PA' | 'PE' | 'PF' | 'PG' | 'PH' | 'PK' | 'PL' | 'PM' | 'PN' | 'PS' | 'PT' | 'PY' | 'QA' | 'RE' | 'RO' | 'RS' | 'RU' | 'RW' | 'SA' | 'SB' | 'SC' | 'SD' | 'SE' | 'SG' | 'SH' | 'SI' | 'SJ' | 'SK' | 'SL' | 'SM' | 'SN' | 'SO' | 'SR' | 'SS' | 'ST' | 'SV' | 'SX' | 'SY' | 'SZ' | 'TA' | 'TC' | 'TD' | 'TF' | 'TG' | 'TH' | 'TJ' | 'TK' | 'TL' | 'TM' | 'TN' | 'TO' | 'TR' | 'TT' | 'TV' | 'TW' | 'TZ' | 'UA' | 'UG' | 'UM' | 'US' | 'UY' | 'UZ' | 'VA' | 'VC' | 'VE' | 'VG' | 'VN' | 'VU' | 'WF' | 'WS' | 'XK' | 'YE' | 'YT' | 'ZA' | 'ZM' | 'ZW' | 'ZZ'
```
### BuyerIdentity
Information about the buyer who is completing the checkout. {% include /apps/checkout/privacy-icon.md %} Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data). The \`customer\` and \`purchasingCompany\` properties require level 1 access. The \`email\` and \`phone\` properties require level 2 access.
* customer
The buyer's customer account, including their ID and whether they've accepted marketing. The value is \`undefined\` if the buyer isn't a known customer for this shop or if they haven't logged in yet. {% include /apps/checkout/privacy-icon.md %} Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
SubscribableSignalLike
```
* email
The email address the buyer provided during checkout. The value is \`undefined\` if the app doesn't have access to customer data. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
SubscribableSignalLike
```
* phone
The phone number the buyer provided during checkout. The value is \`undefined\` if no phone number was provided or the app doesn't have access to customer data. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
SubscribableSignalLike
```
* purchasingCompany
The company and company location that a B2B (business-to-business) customer is purchasing on behalf of. Use this to identify the business context of the order. The value is \`undefined\` if the buyer isn't a B2B customer. {% include /apps/checkout/privacy-icon.md %} Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
SubscribableSignalLike
```
### Customer
Information about a customer who has previously purchased from this shop. {% include /apps/checkout/privacy-icon.md %} Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
* acceptsEmailMarketing
Whether the customer has opted in to email marketing. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
boolean
```
* acceptsMarketing
Whether the customer has opted in to receiving marketing communications from the merchant, such as email campaigns and promotional offers. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data). > Caution: This field is deprecated and will be removed in a future version. Use \`acceptsEmailMarketing\` or \`acceptsSmsMarketing\` instead.
```ts
boolean
```
* acceptsSmsMarketing
Whether the customer has opted in to SMS marketing. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
boolean
```
* email
The email address associated with the customer's account. The value is \`undefined\` if the app doesn't have the required access level. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* firstName
The customer's first name. The value is \`undefined\` if the app doesn't have the required access level. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* fullName
The customer's full name, typically a combination of first and last name. The value is \`undefined\` if the app doesn't have the required access level. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* id
A globally-unique identifier for the customer in the format \`gid://shopify/Customer/\\`. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* image
The customer's profile image, such as a Gravatar avatar. Use this to personalize the extension UI for the logged-in buyer. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
ImageDetails
```
* lastName
The customer's last name. The value is \`undefined\` if the app doesn't have the required access level. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* ordersCount
The number of orders the customer has previously placed with this shop. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
number
```
* phone
The phone number associated with the customer's account. The value is \`undefined\` if no phone number is on file or the app doesn't have the required access level. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* storeCreditAccounts
The store credit accounts owned by this customer that can be used as payment during checkout. Each account has a balance representing available store credit. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
StoreCreditAccount[]
```
### ImageDetails
* altText
The alternative text for the image, used for accessibility. The value is \`undefined\` if the merchant hasn't provided alt text.
```ts
string
```
* url
The fully-qualified URL of the image. Use this to render the product or variant image in your extension.
```ts
string
```
### PurchasingCompany
The company and location that the \[B2B]\(/docs/apps/build/b2b) customer is purchasing on behalf of. This is present only when the buyer is logged in as a business customer.
* company
The company the B2B customer belongs to. {% include /apps/checkout/privacy-icon.md %} Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
Company
```
* location
The specific company location associated with this B2B purchase. {% include /apps/checkout/privacy-icon.md %} Requires access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
CompanyLocation
```
### Company
* externalId
A merchant-defined external identifier for the company. The value is \`undefined\` if the merchant hasn't set one. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* id
A globally-unique identifier for the company in the format \`gid://shopify/Company/\\`. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* name
The company's display name. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
### CompanyLocation
* externalId
A merchant-defined external identifier for the company location. The value is \`undefined\` if the merchant hasn't set one. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* id
A globally-unique identifier for the company location in the format \`gid://shopify/CompanyLocation/\\`. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* name
The display name of the company location. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
### BuyerJourney
Provides details on the buyer's progression through the checkout.
* activeStep
The step of checkout the buyer is currently on. The value is \`undefined\` if the current step can't be determined.
```ts
SubscribableSignalLike
```
* completed
Whether the buyer has completed submitting their order. When \`true\`, the buyer is on the order status page after submitting payment. When \`false\`, the buyer is still in the checkout flow.
```ts
SubscribableSignalLike
```
* intercept
Installs a function for intercepting and preventing progress on checkout. This returns a promise that resolves to a teardown function. Calling the teardown function removes the interceptor. To block checkout progress, you must set the \[block\_progress]\(/docs/api/checkout-ui-extensions/2026-04/configuration#block-progress) capability in your extension's configuration. If you do, then you're expected to inform the buyer why navigation was blocked, either by passing validation errors to the checkout UI or rendering the errors in your extension. If the merchant hasn't allowed your extension to block checkout progress, show a warning in the \[checkout editor]\(/docs/apps/build/checkout/test-checkout-ui-extensions#test-the-extension-in-the-checkout-editor).
```ts
(interceptor: Interceptor) => Promise<() => void>
```
* steps
All possible steps the buyer can take to complete checkout. These steps vary depending on whether the checkout is one-page or three-page, and on the shop's configuration.
```ts
SubscribableSignalLike
```
### BuyerJourneyStepReference
What step of checkout the buyer is currently on.
* handle
The handle identifying which step the buyer is on, such as \`'information'\`, \`'shipping'\`, or \`'payment'\`. See \`BuyerJourneyStepHandle\` for all values.
```ts
BuyerJourneyStepHandle
```
### BuyerJourneyStepHandle
\| handle | Description | |---|---| | \`cart\` | The cart page. | | \`checkout\` | A one-page checkout, including Shop Pay. | | \`information\` | The contact information step of a three-page checkout. | | \`shipping\` | The shipping step of a three-page checkout. | | \`payment\` | The payment step of a three-page checkout. | | \`review\` | The step after payment where the buyer confirms the purchase. Not all shops are configured to have a review step. | | \`thank-you\` | The page displayed after the purchase, thanking the buyer. | | \`unknown\` | An unknown step in the buyer journey. |
```ts
'cart' | 'checkout' | 'information' | 'shipping' | 'payment' | 'review' | 'thank-you' | 'unknown'
```
### Interceptor
A function for intercepting and preventing navigation on checkout. You can block navigation by returning an object with \`{behavior: 'block', reason: 'your reason here', errors?: ValidationError\[]}\`. If you do, then you're expected to also update some part of your UI to reflect the reason why navigation was blocked, either by targeting checkout UI fields, passing errors to the page level, or rendering the errors in your extension.
* interceptorProps
```ts
InterceptorProps
```
InterceptorRequest | Promise\
```ts
InterceptorRequest | Promise
```
### InterceptorProps
* canBlockProgress
Whether the interceptor can block the buyer's progress through checkout. When \`true\`, the merchant has granted your extension the \`block\_progress\` capability. When \`false\`, you can still validate but can't prevent the buyer from continuing.
```ts
boolean
```
### InterceptorRequest
```ts
InterceptorRequestAllow | InterceptorRequestBlock
```
### InterceptorRequestAllow
* behavior
Indicates that the interceptor allows the buyer's journey to continue.
```ts
'allow'
```
* perform
This callback is called when all interceptors finish. We recommend setting errors or reasons for blocking at this stage, so that all the errors in the UI show up at once.
```ts
(result: InterceptorResult) => void | Promise
```
### InterceptorResult
```ts
InterceptorResultAllow | InterceptorResultBlock
```
### InterceptorResultAllow
* behavior
Indicates that the buyer was allowed to progress through checkout.
```ts
'allow'
```
### InterceptorResultBlock
* behavior
Indicates that some part of the checkout UI intercepted and prevented the buyer's progress. The buyer typically needs to take some action to resolve this issue and to move on to the next step.
```ts
'block'
```
### InterceptorRequestBlock
* behavior
Indicates that the interceptor blocks the buyer's journey from continuing.
```ts
'block'
```
* errors
Used to pass errors to the checkout UI, outside your extension's UI boundaries.
```ts
ValidationError[]
```
* perform
This callback is called when all interceptors finish. We recommend setting errors or reasons for blocking at this stage, so that all the errors in the UI show up at once.
```ts
(result: InterceptorResult) => void | Promise
```
* reason
The reason for blocking the interceptor request. This value isn't presented to the buyer, so it doesn't need to be localized. The value is used only for Shopify's own internal debugging and metrics.
```ts
string
```
### ValidationError
* message
The error message to display to the buyer. Use this to explain what went wrong and how to fix it.
```ts
string
```
* target
The checkout UI field that the error is associated with. When provided, checkout highlights the matching field so the buyer knows where to fix the issue. The value is \`undefined\` if the error isn't tied to a specific field.
```ts
string
```
### BuyerJourneyStep
* disabled
Whether this step is disabled. When \`true\`, the buyer hasn't reached this step yet and can't navigate to it. When \`false\`, the step is accessible. For example, if the buyer hasn't reached the \`shipping\` step yet, then \`shipping\` is disabled.
```ts
boolean
```
* handle
The handle that uniquely identifies the buyer journey step, such as \`'information'\`, \`'shipping'\`, or \`'payment'\`.
```ts
BuyerJourneyStepHandle
```
* label
The localized label of the buyer journey step, suitable for rendering in navigation UI.
```ts
string
```
* to
The URL of the buyer journey step, using the \`shopify:\` protocol.
```ts
string
```
### CheckoutSettings
Settings describing the behavior of the buyer's checkout.
* orderSubmission
The type of order created when the buyer completes checkout. - \`'DRAFT\_ORDER'\`: The checkout creates a draft order that the merchant must manually confirm before fulfillment. Common for B2B checkouts with deferred payment terms. - \`'ORDER'\`: The checkout creates a confirmed order immediately upon completion.
```ts
'DRAFT_ORDER' | 'ORDER'
```
* paymentTermsTemplate
The payment terms configured by the merchant for B2B orders, such as net-30 or net-60. The value is \`undefined\` if no payment terms are configured.
```ts
PaymentTermsTemplate
```
* shippingAddress
Settings that control how the shipping address behaves during checkout, such as whether the buyer can edit the address.
```ts
ShippingAddressSettings
```
### PaymentTermsTemplate
A payment terms template configured by the merchant, defining when payment is due for B2B orders. Common examples include "Net 30" (due in 30 days) or "Due on receipt".
* dueDate
The due date for payment in \[ISO 8601]\(https://en.wikipedia.org/wiki/ISO\_8601) format (\`YYYY-MM-DDTHH:mm:ss.sssZ\`). The value is \`undefined\` if the payment terms don't have a fixed due date.
```ts
string
```
* dueInDays
The number of days the buyer has to pay after the order is placed, such as \`30\` for "Net 30" terms. The value is \`undefined\` if the payment terms aren't net-based.
```ts
number
```
* id
A globally-unique identifier for the payment terms template in the format \`gid://shopify/PaymentTermsTemplate/\\`.
```ts
string
```
* name
The name of the payment terms translated to the buyer's current language, such as "Net 30" or "Due on receipt".
```ts
string
```
### ShippingAddressSettings
Settings describing the behavior of the shipping address.
* isEditable
Whether the buyer is allowed to edit the shipping address during checkout. When \`false\`, the shipping address is locked and can't be changed, which is common for B2B orders with a predefined ship-to address.
```ts
boolean
```
### CheckoutToken
```ts
string
```
### CartCost
* subtotalAmount
The sum of all line item prices at the current step of checkout, before shipping and taxes are applied. Use this value to display the base cost of the items the buyer purchased.
```ts
SubscribableSignalLike
```
* totalAmount
The minimum total at the current step of checkout. Costs not yet calculated, such as shipping on the information step, aren't included. Gift cards and store credits are excluded from this total.
```ts
SubscribableSignalLike
```
* totalShippingAmount
The total shipping cost after shipping discounts have been applied. The value is \`undefined\` if shipping hasn't been calculated yet, such as when the buyer is still on the information step.
```ts
SubscribableSignalLike
```
* totalTaxAmount
The total tax the buyer can expect to pay, or the total tax already included in product and shipping prices (for tax-inclusive regions). The value is \`undefined\` if taxes haven't been calculated yet.
```ts
SubscribableSignalLike
```
### CustomerPrivacy
* allowedProcessing
Flags indicating whether each type of data processing is permitted, based on the visitor's consent, the merchant's privacy configuration, and the visitor's geographic location.
```ts
AllowedProcessing
```
* metafields
The tracking consent metafields that have been stored for this visitor. These contain app-specific consent data beyond the standard categories.
```ts
TrackingConsentMetafield[]
```
* region
The visitor's geographic location, used to determine whether more granular consent controls should be displayed based on regional privacy regulations.
```ts
CustomerPrivacyRegion
```
* saleOfDataRegion
Whether the visitor is located in a region that requires an explicit opt-out option for the sale or sharing of personal data, such as California (CCPA) or other jurisdictions with similar regulations.
```ts
boolean
```
* shouldShowBanner
Whether a consent banner should be displayed by default when the page loads. Use this as the initial open/expanded state of the consent banner. This is determined by the visitor's current privacy consent, the shop's \[region visibility configuration]\(https://help.shopify.com/en/manual/privacy-and-security/privacy/customer-privacy-settings/privacy-settings#add-a-cookie-banner) settings, and the region in which the visitor is located.
```ts
boolean
```
* visitorConsent
The visitor's current privacy consent settings. Each property represents a consent category and is \`true\` (actively granted), \`false\` (actively denied), or \`undefined\` (no decision made yet).
```ts
VisitorConsent
```
### AllowedProcessing
* analytics
Whether analytics data can be collected based on the visitor's consent, the merchant's privacy configuration, and the visitor's region. Analytics data includes how the shop was used and what interactions occurred.
```ts
boolean
```
* marketing
Whether marketing data can be collected based on the visitor's consent, the merchant's privacy configuration, and the visitor's region. Marketing data includes attribution and targeted advertising preferences.
```ts
boolean
```
* preferences
Whether preference data can be collected based on the visitor's consent, the merchant's privacy configuration, and the visitor's region. Preference data includes language, currency, and sizing choices.
```ts
boolean
```
* saleOfData
Whether data can be shared with third parties based on the visitor's consent, the merchant's privacy configuration, and the visitor's region. This typically applies to behavioral advertising data.
```ts
boolean
```
### TrackingConsentMetafield
* key
The identifier for the tracking consent metafield, such as \`'analyticsType'\` or \`'marketingType'\`.
```ts
string
```
* value
The value stored in the tracking consent metafield, such as \`'granular'\` or a stringified JSON object.
```ts
string
```
### CustomerPrivacyRegion
* countryCode
The buyer's country code in \[ISO 3166-1 alpha-2]\(https://en.wikipedia.org/wiki/ISO\_3166-1\_alpha-2) format. The value is \`undefined\` if geolocation failed. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
CountryCode
```
* provinceCode
The buyer's province, state, or region code in \[ISO 3166-2]\(https://en.wikipedia.org/wiki/ISO\_3166-2) format. The value is \`undefined\` if geolocation failed or only the country was detected. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
### VisitorConsent
* analytics
The visitor's consent for analytics tracking. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
* marketing
The visitor's consent for marketing and targeted advertising. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
* preferences
The visitor's consent for storing preferences such as language and currency. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
* saleOfData
The visitor's consent for the sale or sharing of their personal data with third parties. \`true\` means the visitor actively granted consent, \`false\` means actively denied, and \`undefined\` means no decision has been made yet.
```ts
boolean
```
### DeliveryGroup
A group of cart lines that share the same set of delivery options. For example, physical items might form one delivery group while digital items form another.
* deliveryOptions
The delivery options available for this group, including shipping, pickup point, and pickup location options. The buyer selects one of these to determine how their items are delivered.
```ts
DeliveryOption[]
```
* groupType
Whether this group contains items for a one-time purchase or a subscription. Subscription delivery groups might have different shipping options. See \`DeliveryGroupType\` for possible values.
```ts
DeliveryGroupType
```
* id
A unique identifier for the delivery group. The value is \`undefined\` if the underlying delivery line doesn't have an ID assigned.
```ts
string
```
* isDeliveryRequired
Whether physical delivery is required for the items in this group. Digital-only groups don't require delivery.
```ts
boolean
```
* selectedDeliveryOption
The delivery option the buyer has selected for this group. The value is \`undefined\` if the buyer hasn't selected a delivery option yet. Contains a \`handle\` you can match against \`deliveryOptions\` entries.
```ts
DeliveryOptionReference
```
* targetedCartLines
The cart lines that belong to this delivery group. Each reference contains the cart line's \`id\`, which you can match against \`lines\` to get the full cart line details.
```ts
CartLineReference[]
```
### DeliveryOption
A delivery option available to the buyer. Use the \`type\` property to determine which kind of option it is: - \`ShippingOption\` (\`type: 'shipping' | 'local'\`): Items shipped by a carrier or delivered locally by the merchant. - \`PickupPointOption\` (\`type: 'pickupPoint'\`): Items shipped to a third-party collection point for the buyer to pick up. - \`PickupLocationOption\` (\`type: 'pickup'\`): Items picked up directly from a merchant's store or warehouse.
```ts
ShippingOption | PickupPointOption | PickupLocationOption
```
### ShippingOption
Represents a delivery option that's a shipping option.
* carrier
Information about the carrier providing this shipping option, including the carrier's display name.
```ts
ShippingOptionCarrier
```
* code
The carrier service code or rate identifier for this delivery option.
```ts
string
```
* cost
The cost of this delivery option before any shipping discounts are applied. Compare with \`costAfterDiscounts\` to show savings.
```ts
Money
```
* costAfterDiscounts
The cost of this delivery option after shipping discounts have been applied. This is the price the buyer actually pays for shipping.
```ts
Money
```
* deliveryEstimate
The estimated delivery time for this shipping option. Use the \`timeInTransit\` range to display an estimated arrival window to the buyer.
```ts
DeliveryEstimate
```
* description
Additional details about the delivery option provided by the carrier or merchant, such as estimated delivery windows or service level notes.
```ts
string
```
* handle
The unique identifier of the delivery option. Use this to match against \`DeliveryOptionReference.handle\` or \`DeliverySelectionGroup\` entries.
```ts
string
```
* metafields
Custom \[metafields]\(/docs/apps/build/custom-data/metafields) attached to this delivery option by the carrier or a \[Shopify Function]\(/docs/apps/build/functions). Use these to display additional information about the option.
```ts
Metafield[]
```
* title
The merchant-facing or carrier-provided display name for the delivery option, such as "Standard Shipping" or "Express".
```ts
string
```
* type
Identifies the delivery method. \`'shipping'\` means items are shipped by a carrier. \`'local'\` means the merchant handles delivery themselves, for example same-day local delivery.
```ts
'shipping' | 'local'
```
### ShippingOptionCarrier
* name
The display name of the shipping carrier, such as "Canada Post" or "UPS". The value is \`undefined\` if the carrier name isn't available.
```ts
string
```
### DeliveryEstimate
* timeInTransit
The estimated time in transit for the delivery, expressed as a range in seconds. Undefined when the carrier doesn't provide an estimate. When present, either the lower or upper bound of the range might still be omitted.
```ts
NumberRange
```
### NumberRange
* lower
The lower bound of the range. Undefined if only an upper bound is provided.
```ts
number
```
* upper
The upper bound of the range. Undefined if only a lower bound is provided.
```ts
number
```
### Metafield
Metadata associated with the checkout. See the \[metafields documentation]\(/docs/apps/build/custom-data/metafields) for more information on how metafields work.
* key
The name of the metafield.
```ts
string
```
* namespace
A container for a set of metafields. You need to define a custom namespace for your metafields to distinguish them from the metafields used by other apps.
```ts
string
```
* value
The information to be stored as metadata.
```ts
string | number
```
* valueType
The metafield's information type. - \`'integer'\`: A whole number value. - \`'string'\`: A plain text value. - \`'json\_string'\`: A JSON-encoded string value.
```ts
'integer' | 'string' | 'json_string'
```
### PickupPointOption
* carrier
Information about the carrier that ships items to this pickup point, including the carrier's name and code.
```ts
PickupPointCarrier
```
* code
The carrier service code or rate identifier for this delivery option.
```ts
string
```
* cost
The cost of this delivery option before any shipping discounts are applied. Compare with \`costAfterDiscounts\` to show savings.
```ts
Money
```
* costAfterDiscounts
The cost of this delivery option after shipping discounts have been applied. This is the price the buyer actually pays for shipping.
```ts
Money
```
* description
Additional details about the delivery option provided by the carrier or merchant, such as estimated delivery windows or service level notes.
```ts
string
```
* handle
The unique identifier of the delivery option. Use this to match against \`DeliveryOptionReference.handle\` or \`DeliverySelectionGroup\` entries.
```ts
string
```
* location
The physical location where the buyer picks up their order, including the address and display name of the collection point.
```ts
PickupPointLocation
```
* metafields
Custom \[metafields]\(/docs/apps/build/custom-data/metafields) attached to this delivery option by the carrier or a \[Shopify Function]\(/docs/apps/build/functions). Use these to display additional information about the option.
```ts
Metafield[]
```
* title
The merchant-facing or carrier-provided display name for the delivery option, such as "Standard Shipping" or "Express".
```ts
string
```
* type
Identifies this as a pickup point option, where items are shipped to a third-party collection point for the buyer to pick up.
```ts
'pickupPoint'
```
### PickupPointCarrier
* code
The carrier's unique identifier code, used to distinguish between different carriers that deliver to pickup points.
```ts
string
```
* name
The display name of the carrier that delivers to this pickup point.
```ts
string
```
### PickupPointLocation
* address
The physical address of the pickup point.
```ts
MailingAddress
```
* handle
The unique identifier of the pickup point.
```ts
string
```
* name
The display name of the pickup point, such as the name of the locker or collection point.
```ts
string
```
### PickupLocationOption
* code
The carrier service code or rate identifier for this delivery option.
```ts
string
```
* description
Additional details about the delivery option provided by the carrier or merchant, such as estimated delivery windows or service level notes.
```ts
string
```
* handle
The unique identifier of the delivery option. Use this to match against \`DeliveryOptionReference.handle\` or \`DeliverySelectionGroup\` entries.
```ts
string
```
* location
The merchant's store or warehouse where the buyer picks up their order, including the address and display name.
```ts
PickupLocation
```
* metafields
Custom \[metafields]\(/docs/apps/build/custom-data/metafields) attached to this delivery option by the carrier or a \[Shopify Function]\(/docs/apps/build/functions). Use these to display additional information about the option.
```ts
Metafield[]
```
* title
The merchant-facing or carrier-provided display name for the delivery option, such as "Standard Shipping" or "Express".
```ts
string
```
* type
Identifies this as a pickup location option, where the buyer picks up items directly from a merchant's store or warehouse.
```ts
'pickup'
```
### PickupLocation
* address
The physical address of the pickup location.
```ts
MailingAddress
```
* name
The merchant-defined display name of the pickup location, such as a store name or warehouse label.
```ts
string
```
### DeliveryGroupType
The possible types of a delivery group. - \`'oneTimePurchase'\`: Items bought as a single, non-recurring purchase. - \`'subscription'\`: Items bought through a \[selling plan]\(/docs/apps/build/purchase-options/subscriptions) that results in recurring deliveries.
```ts
'oneTimePurchase' | 'subscription'
```
### DeliveryOptionReference
A reference to the delivery option selected by the buyer for a delivery group.
* handle
The unique identifier of the referenced delivery option. Match this against \`DeliveryOption.handle\` from the \`deliveryOptions\` array to get the full option details.
```ts
string
```
### CartLineReference
A reference to a cart line within a delivery group, identified by the cart line's ID.
* id
The unique identifier of the referenced cart line. Match this against \`CartLine.id\` from the \`lines\` property to get the full line item details.
```ts
string
```
### CartDiscountAllocation
A discount allocation applied to the cart. Use the \`type\` property to determine how the discount was triggered: - \`CartCodeDiscountAllocation\` (\`type: 'code'\`): Triggered by a discount code the buyer entered. - \`CartAutomaticDiscountAllocation\` (\`type: 'automatic'\`): Applied automatically based on merchant-configured rules. - \`CartCustomDiscountAllocation\` (\`type: 'custom'\`): Applied by a \[Shopify Function]\(/docs/api/functions/latest/discount).
```ts
CartCodeDiscountAllocation | CartAutomaticDiscountAllocation | CartCustomDiscountAllocation
```
### CartCodeDiscountAllocation
* code
The discount code string that the buyer entered during checkout, such as \`"SAVE10"\` or \`"FREESHIP"\`.
```ts
string
```
* discountedAmount
The monetary value that was deducted from the line item or order total by this discount allocation.
```ts
Money
```
* type
Identifies this as a code-based discount, triggered by a discount code the buyer entered at checkout.
```ts
'code'
```
### CartAutomaticDiscountAllocation
* discountedAmount
The monetary value that was deducted from the line item or order total by this discount allocation.
```ts
Money
```
* title
The merchant-defined title of the automatic discount as displayed to the buyer, such as "Summer Sale 10% Off".
```ts
string
```
* type
Identifies this as an automatic discount, applied based on merchant-configured rules without a code.
```ts
'automatic'
```
### CartCustomDiscountAllocation
* discountedAmount
The monetary value that was deducted from the line item or order total by this discount allocation.
```ts
Money
```
* title
The title of the custom discount, typically applied by a \[Shopify Function]\(/docs/api/functions/latest/discount).
```ts
string
```
* type
Identifies this as a custom discount applied by a \[Shopify Function]\(/docs/api/functions/latest/discount).
```ts
'custom'
```
### CartDiscountCode
* code
The discount code string entered by the buyer during checkout or applied programmatically, such as \`"SAVE10"\` or \`"FREESHIP"\`. Use this to display which discount codes were applied.
```ts
string
```
### Extension
Metadata about the running extension, including its API version, target, capabilities, and editor context. Use this to read configuration details or conditionally render content based on where the extension is running.
* apiVersion
The API version that was set in the extension config file.
```ts
ApiVersion
```
* capabilities
The allowed capabilities of the extension, defined in your \[shopify.extension.toml]\(/docs/api/checkout-ui-extensions/2026-04/configuration) file. \* \[\`api\_access\`]\(/docs/api/checkout-ui-extensions/2026-04/configuration#api-access): the extension can access the Storefront API. \* \[\`network\_access\`]\(/docs/api/checkout-ui-extensions/2026-04/configuration#network-access): the extension can make external network calls. \* \[\`block\_progress\`]\(/docs/api/checkout-ui-extensions/2026-04/configuration#block-progress): the extension can block a customer's progress and the merchant has allowed this blocking behavior. \* \[\`collect\_buyer\_consent.sms\_marketing\`]\(/docs/api/checkout-ui-extensions/2026-04/configuration#collect-buyer-consent): the extension can collect customer consent for SMS marketing. \* \[\`collect\_buyer\_consent.customer\_privacy\`]\(/docs/api/checkout-ui-extensions/2026-04/configuration#collect-buyer-consent): the extension can register customer consent decisions that are honored on Shopify-managed services. \* \[\`iframe.sources\`]\(/docs/api/checkout-ui-extensions/2026-04/configuration#iframe): the extension can embed an external URL in an iframe.
```ts
SubscribableSignalLike
```
* editor
Information about the editor where the extension is being rendered. If the value is undefined, then the extension isn't running in an editor.
```ts
Editor
```
* rendered
A Boolean to show whether your extension is currently rendered to the screen. Shopify might render your extension before it's visible in the UI, typically to pre-render extensions that appear on a later step of the checkout. Your extension might also continue to run after the customer has navigated away from where it was rendered. The extension continues running so that your extension is immediately available to render if the customer navigates back.
```ts
SubscribableSignalLike
```
* scriptUrl
The URL to the script that started the extension target.
```ts
string
```
* target
The identifier that specifies where in Shopify's UI your code is being injected. This is one of the targets you've included in your extension's configuration file.
```ts
Target
```
* version
The published version of the running extension target. For unpublished extensions, the value is \`undefined\`.
```ts
string
```
### ApiVersion
The supported GraphQL Admin API versions. Use this to specify which API version your GraphQL queries should execute against. Each version includes specific features, bug fixes, and breaking changes. The \`unstable\` version provides access to the latest features but may change without notice.
```ts
'2023-04' | '2023-07' | '2023-10' | '2024-01' | '2024-04' | '2024-07' | '2024-10' | '2025-01' | '2025-04' | 'unstable' | '2025-07' | '2025-10' | '2026-01' | '2026-04'
```
### Capability
The capabilities an extension has access to. \* \`api\_access\`: The extension can access the Storefront API. \* \`network\_access\`: The extension can make external network calls. \* \`block\_progress\`: The extension can block a buyer's progress and the merchant has allowed this blocking behavior. \* \`collect\_buyer\_consent.sms\_marketing\`: The extension can collect buyer consent for SMS marketing. \* \`collect\_buyer\_consent.customer\_privacy\`: The extension can register buyer consent decisions that will be honored on Shopify-managed services. \* \`iframe.sources\`: The extension can embed an external URL in an iframe.
```ts
'api_access' | 'network_access' | 'block_progress' | 'collect_buyer_consent.sms_marketing' | 'collect_buyer_consent.customer_privacy' | 'iframe.sources'
```
### Editor
Information about the editor environment when an extension is rendered inside the checkout editor. The value is \`undefined\` when the extension is not rendering in an editor.
* type
Indicates whether the extension is rendering in the \[checkout editor]\(/docs/apps/checkout). Always \`'checkout'\`.
```ts
'checkout'
```
### I18n
Utilities for translating strings, formatting currencies, numbers, and dates according to the buyer's locale. Use the I18n API alongside the Localization API to build fully localized extensions.
* formatCurrency
Returns a localized currency value. This function behaves like the standard \`Intl.NumberFormat()\` with a style of \`currency\` applied. It uses the buyer's locale by default.
```ts
(number: number | bigint, options?: { inExtensionLocale?: boolean; } & NumberFormatOptions) => string
```
* formatDate
Returns a localized date value. This function behaves like the standard \[\`Intl.DateTimeFormat()\`]\(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global\_Objects/Intl/DateTimeFormat) and uses the buyer's locale by default. Formatting \[options]\(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global\_Objects/Intl/DateTimeFormat#using\_options) can be passed in as options.
```ts
(date: Date, options?: { inExtensionLocale?: boolean; } & DateTimeFormatOptions) => string
```
* formatNumber
Returns a localized number. This function behaves like the standard \`Intl.NumberFormat()\` with a style of \`decimal\` applied. It uses the buyer's locale by default.
```ts
(number: number | bigint, options?: { inExtensionLocale?: boolean; } & NumberFormatOptions) => string
```
* translate
Returns translated content in the buyer's locale, as supported by the extension. - \`options.count\` is a special numeric value used in pluralization. - The other option keys and values are treated as replacements for interpolation. - If the replacements are all primitives, then \`translate()\` returns a single string. - If replacements contain UI components, then \`translate()\` returns an array of elements.
```ts
I18nTranslate
```
### I18nTranslate
Translates a key from your extension's locale files into a localized string. Supports interpolation with placeholder replacements and pluralization via the special \`count\` option.
### CartInstructions
* attributes
Whether the extension can update custom attributes using \`applyAttributeChange()\`.
```ts
AttributesCartInstructions
```
* delivery
Whether the extension can modify the shipping address using \`applyShippingAddressChange()\`.
```ts
DeliveryCartInstructions
```
* discounts
Whether the extension can add or remove discount codes using \`applyDiscountCodeChange()\`.
```ts
DiscountsCartInstructions
```
* lines
Whether the extension can add, remove, or update cart lines using \`applyCartLinesChange()\`.
```ts
CartLinesCartInstructions
```
* metafields
Whether the extension can add, update, or delete cart metafields using \`applyMetafieldChange()\`.
```ts
MetafieldsCartInstructions
```
* notes
Whether the extension can update the order note using \`applyNoteChange()\`.
```ts
NotesCartInstructions
```
### AttributesCartInstructions
* canUpdateAttributes
Whether attributes can be updated using \`applyAttributeChange()\`. When \`false\`, the checkout configuration doesn't allow attribute changes. Even when \`true\`, calls to \`applyAttributeChange()\` can still fail during accelerated checkout (Apple Pay, Google Pay).
```ts
boolean
```
### DeliveryCartInstructions
* canSelectCustomAddress
Whether the shipping address can be modified using \`applyShippingAddressChange()\`. When \`false\`, the buyer is using an accelerated checkout flow (Apple Pay, Google Pay) where the address can't be changed.
```ts
boolean
```
### DiscountsCartInstructions
* canUpdateDiscountCodes
Whether discount codes can be updated using \`applyDiscountCodeChange()\`. When \`false\`, the checkout configuration doesn't allow discount code changes. Even when \`true\`, calls to \`applyDiscountCodeChange()\` can still fail during accelerated checkout (Apple Pay, Google Pay).
```ts
boolean
```
### CartLinesCartInstructions
* canAddCartLine
Whether new cart lines can be added using \`applyCartLinesChange()\`. When \`false\`, the checkout configuration doesn't allow adding lines (for example, draft orders). Even when \`true\`, calls can still fail during accelerated checkout (Apple Pay, Google Pay).
```ts
boolean
```
* canRemoveCartLine
Whether cart lines can be removed using \`applyCartLinesChange()\`. When \`false\`, the checkout configuration doesn't allow removing lines. Even when \`true\`, calls can still fail during accelerated checkout.
```ts
boolean
```
* canUpdateCartLine
Whether cart lines can be updated using \`applyCartLinesChange()\`. When \`false\`, the checkout configuration doesn't allow updating lines. Even when \`true\`, calls can still fail during accelerated checkout.
```ts
boolean
```
### MetafieldsCartInstructions
* canDeleteCartMetafield
Whether the extension can delete cart metafields using \`applyMetafieldChange()\`.
```ts
boolean
```
* canSetCartMetafields
Whether the extension can add or update cart metafields using \`applyMetafieldChange()\`.
```ts
boolean
```
### NotesCartInstructions
* canUpdateNote
Whether the order note can be updated using \`applyNoteChange()\`. When \`false\`, the checkout configuration doesn't allow note changes. Even when \`true\`, calls to \`applyNoteChange()\` can still fail during accelerated checkout (Apple Pay, Google Pay).
```ts
boolean
```
### CartLine
* attributes
Custom key-value attributes attached to this cart line, such as gift messages or engraving text. Use \`applyCartLinesChange()\` to update these values.
```ts
Attribute[]
```
* cost
The cost breakdown for this line item, including the total price after any line-level discounts have been applied.
```ts
CartLineCost
```
* discountAllocations
Discounts applied to this cart line, including code-based, automatic, and custom discounts. Each allocation shows the discounted amount and how the discount was triggered.
```ts
CartDiscountAllocation[]
```
* id
A unique identifier for the cart line in the format \`gid://shopify/CartLine/\\`. This ID isn't stable and can change after any cart operation, so avoid persisting it. Always look up the current ID before calling \`applyCartLinesChange()\`, because you'll need it to create a \`CartLineChange\` object.
```ts
string
```
* lineComponents
The individual components of a \[bundle]\(/docs/apps/build/product-merchandising/bundles) line item. Each component represents a separate product within the bundle. Returns an empty array if the line item isn't a bundle.
```ts
CartBundleLineComponent[]
```
* merchandise
The product variant or other merchandise associated with this line item. Use this to access product details such as the title, image, SKU, and selected options.
```ts
Merchandise
```
* parentRelationship
The parent line item that this line belongs to, or \`null\` if this is a top-level line item. Used to identify lines added as children of a bundle or other grouped product.
```ts
CartLineParentRelationship | null
```
* quantity
The number of units of this merchandise that the buyer purchased.
```ts
number
```
### CartLineCost
* totalAmount
The total price the buyer pays for this line item after all line-level discounts have been applied, but before order-level discounts, taxes, and shipping.
```ts
Money
```
### CartBundleLineComponent
An individual component within a bundled cart line. Each \`CartLine\` that represents a bundle has a \`lineComponents\` array containing these components.
* attributes
Custom key-value pairs attached to this bundle component, such as personalization options specific to this item within the bundle.
```ts
Attribute[]
```
* cost
The cost breakdown for this bundle component, including the total amount after any per-item discounts.
```ts
CartLineCost
```
* id
A unique identifier for this component within the bundle, in the format \`gid://shopify/CartLineComponent/\\`. This ID isn't stable and might change after any operation that updates the line items.
```ts
string
```
* merchandise
The product variant included in this bundle component. Use this to display product details for individual items within a bundle.
```ts
Merchandise
```
* quantity
The number of units of this component included in the bundle.
```ts
number
```
* type
Identifies this as a bundle line component. This is currently the only component type.
```ts
'bundle'
```
### Merchandise
* id
A globally-unique identifier for the product variant in the format \`gid://shopify/ProductVariant/\\`.
```ts
string
```
* image
The image associated with the product variant. Falls back to the product image if the variant doesn't have its own. The value is \`undefined\` if neither the variant nor the product has an image.
```ts
ImageDetails
```
* product
The parent product that this variant belongs to. Use this to access the product's ID, vendor, and type.
```ts
Product
```
* requiresShipping
Whether this product variant requires physical shipping. When \`true\`, the buyer must provide a shipping address. Returns \`false\` for digital products, gift cards, and services.
```ts
boolean
```
* selectedOptions
The product options applied to this variant, such as size, color, or material. Each entry contains the option name and the selected value.
```ts
SelectedOption[]
```
* sellingPlan
The \[selling plan]\(/docs/apps/build/purchase-options/subscriptions) associated with this variant, such as a subscription or pre-order plan. The value is \`undefined\` if the item isn't being purchased through a selling plan.
```ts
SellingPlan
```
* sku
The stock keeping unit (SKU) assigned to this variant by the merchant, used for inventory tracking. The value is \`undefined\` if no SKU has been set.
```ts
string
```
* subtitle
A secondary description for the variant that provides additional context, such as a color or size combination. The value is \`undefined\` if no subtitle is available.
```ts
string
```
* title
The display title of the product variant, such as "Small" or "Red / Large". This is the variant-specific label, not the parent product title.
```ts
string
```
* type
Identifies the merchandise as a product variant. This is currently the only merchandise type in checkout.
```ts
'variant'
```
### Product
* id
A globally-unique identifier for the product in the format \`gid://shopify/Product/\\`.
```ts
string
```
* productType
A merchant-defined categorization for the product, such as "Accessories" or "Clothing". Commonly used for filtering and organizing products in a storefront.
```ts
string
```
* vendor
The name of the product's vendor or manufacturer, as set by the merchant in Shopify admin.
```ts
string
```
### SelectedOption
* name
The name of the product option, such as "Color" or "Size".
```ts
string
```
* value
The selected value for the product option, such as "Red" or "Large".
```ts
string
```
### SellingPlan
A \[selling plan]\(/docs/apps/build/purchase-options/subscriptions) represents a recurring or deferred purchasing option for a product, such as a subscription, pre-order, or try-before-you-buy plan. The merchant configures selling plans to define how and when the buyer is charged.
* id
A globally-unique identifier for the selling plan in the format \`gid://shopify/SellingPlan/\\`. Use this to reference the specific selling plan associated with a line item.
```ts
string
```
* recurringDeliveries
Whether purchasing through this selling plan results in multiple deliveries. \`true\` for subscription plans with recurring fulfillment, \`false\` for one-time pre-orders or try-before-you-buy plans.
```ts
boolean
```
### CartLineParentRelationship
* parent
The parent cart line that a cart line is associated with.
```ts
{ id: string; }
```
### Localization
The buyer's language, country, currency, and timezone context. Use this to adapt your extension to the buyer's region and display localized content.
* country
The country context of the checkout, carried over from the cart. It updates when the buyer changes their shipping address country. Use this value to display region-specific content such as local support information or regional policies. The value is \`undefined\` if the buyer's country is unknown.
```ts
SubscribableSignalLike
```
* currency
The currency that the buyer sees for money amounts in the checkout. Use this value to format prices and totals in the buyer's expected currency.
```ts
SubscribableSignalLike
```
* extensionLanguage
The best available language match for your extension based on the buyer's language. If the buyer's language is \`'fr-CA'\` but your extension supports only \`'fr'\`, this returns \`'fr'\`. If your extension doesn't support any variant of the buyer's language, this falls back to your extension's default locale (the \`.default.json\` translation file). Use this value to load the correct translation file for your extension.
```ts
SubscribableSignalLike
```
* language
The language the buyer sees in the checkout. This reflects the language selected by the buyer or determined by their browser settings, and might differ from the languages your extension supports.
```ts
SubscribableSignalLike
```
* market
The \[market]\(/docs/apps/build/markets) context of the checkout, carried over from the cart context. Markets group countries and regions with shared pricing, languages, and domains. It updates when the buyer changes the country of their shipping address. The value is \`undefined\` if the market is unknown. > Caution: Deprecated as of version \`2025-04\`. Merchants now manage which extensions load for each market, so extensions no longer need to check this value.
```ts
SubscribableSignalLike
```
* timezone
The buyer's time zone, based on their browser or account settings. Use this value to format dates and times relative to the buyer's local time.
```ts
SubscribableSignalLike
```
### Country
A buyer's country, identified by its ISO country code.
* isoCode
The two-letter country code in \[ISO 3166-1 alpha-2]\(https://en.wikipedia.org/wiki/ISO\_3166-1\_alpha-2) format.
```ts
CountryCode
```
### Currency
* isoCode
The three-letter currency code in \[ISO 4217]\(https://en.wikipedia.org/wiki/ISO\_4217) format, such as \`'USD'\`, \`'EUR'\`, or \`'CAD'\`.
```ts
CurrencyCode
```
### Language
* isoCode
The \[BCP-47]\(https://en.wikipedia.org/wiki/IETF\_language\_tag) language tag that identifies the language. This is a standardized code that might include a base language and an optional region subtag separated by a dash. For example, \`'en'\` represents English and \`'en-US'\` represents English as used in the United States. The region subtag follows the \[ISO 3166-1 alpha-2]\(https://en.wikipedia.org/wiki/ISO\_3166-1\_alpha-2) standard.
```ts
string
```
### Market
A \[Shopify Market]\(/docs/apps/build/markets) that represents a group of one or more regions for international selling.
* handle
The human-readable, shop-scoped identifier for the market, such as \`'us'\` or \`'eu'\`. Merchants define these handles when configuring \[Shopify Markets]\(/docs/apps/build/markets).
```ts
string
```
* id
A globally-unique identifier for the market in the format \`gid://shopify/Market/\\`.
```ts
string
```
### Timezone
```ts
'Africa/Abidjan' | 'Africa/Algiers' | 'Africa/Bissau' | 'Africa/Cairo' | 'Africa/Casablanca' | 'Africa/Ceuta' | 'Africa/El_Aaiun' | 'Africa/Johannesburg' | 'Africa/Juba' | 'Africa/Khartoum' | 'Africa/Lagos' | 'Africa/Maputo' | 'Africa/Monrovia' | 'Africa/Nairobi' | 'Africa/Ndjamena' | 'Africa/Sao_Tome' | 'Africa/Tripoli' | 'Africa/Tunis' | 'Africa/Windhoek' | 'America/Adak' | 'America/Anchorage' | 'America/Araguaina' | 'America/Argentina/Buenos_Aires' | 'America/Argentina/Catamarca' | 'America/Argentina/Cordoba' | 'America/Argentina/Jujuy' | 'America/Argentina/La_Rioja' | 'America/Argentina/Mendoza' | 'America/Argentina/Rio_Gallegos' | 'America/Argentina/Salta' | 'America/Argentina/San_Juan' | 'America/Argentina/San_Luis' | 'America/Argentina/Tucuman' | 'America/Argentina/Ushuaia' | 'America/Asuncion' | 'America/Bahia' | 'America/Bahia_Banderas' | 'America/Barbados' | 'America/Belem' | 'America/Belize' | 'America/Boa_Vista' | 'America/Bogota' | 'America/Boise' | 'America/Cambridge_Bay' | 'America/Campo_Grande' | 'America/Cancun' | 'America/Caracas' | 'America/Cayenne' | 'America/Chicago' | 'America/Chihuahua' | 'America/Costa_Rica' | 'America/Cuiaba' | 'America/Danmarkshavn' | 'America/Dawson' | 'America/Dawson_Creek' | 'America/Denver' | 'America/Detroit' | 'America/Edmonton' | 'America/Eirunepe' | 'America/El_Salvador' | 'America/Fort_Nelson' | 'America/Fortaleza' | 'America/Glace_Bay' | 'America/Goose_Bay' | 'America/Grand_Turk' | 'America/Guatemala' | 'America/Guayaquil' | 'America/Guyana' | 'America/Halifax' | 'America/Havana' | 'America/Hermosillo' | 'America/Indiana/Indianapolis' | 'America/Indiana/Knox' | 'America/Indiana/Marengo' | 'America/Indiana/Petersburg' | 'America/Indiana/Tell_City' | 'America/Indiana/Vevay' | 'America/Indiana/Vincennes' | 'America/Indiana/Winamac' | 'America/Inuvik' | 'America/Iqaluit' | 'America/Jamaica' | 'America/Juneau' | 'America/Kentucky/Louisville' | 'America/Kentucky/Monticello' | 'America/La_Paz' | 'America/Lima' | 'America/Los_Angeles' | 'America/Maceio' | 'America/Managua' | 'America/Manaus' | 'America/Martinique' | 'America/Matamoros' | 'America/Mazatlan' | 'America/Menominee' | 'America/Merida' | 'America/Metlakatla' | 'America/Mexico_City' | 'America/Miquelon' | 'America/Moncton' | 'America/Monterrey' | 'America/Montevideo' | 'America/New_York' | 'America/Nipigon' | 'America/Nome' | 'America/Noronha' | 'America/North_Dakota/Beulah' | 'America/North_Dakota/Center' | 'America/North_Dakota/New_Salem' | 'America/Nuuk' | 'America/Ojinaga' | 'America/Panama' | 'America/Pangnirtung' | 'America/Paramaribo' | 'America/Phoenix' | 'America/Port-au-Prince' | 'America/Porto_Velho' | 'America/Puerto_Rico' | 'America/Punta_Arenas' | 'America/Rainy_River' | 'America/Rankin_Inlet' | 'America/Recife' | 'America/Regina' | 'America/Resolute' | 'America/Rio_Branco' | 'America/Santarem' | 'America/Santiago' | 'America/Santo_Domingo' | 'America/Sao_Paulo' | 'America/Scoresbysund' | 'America/Sitka' | 'America/St_Johns' | 'America/Swift_Current' | 'America/Tegucigalpa' | 'America/Thule' | 'America/Thunder_Bay' | 'America/Tijuana' | 'America/Toronto' | 'America/Vancouver' | 'America/Whitehorse' | 'America/Winnipeg' | 'America/Yakutat' | 'America/Yellowknife' | 'Antarctica/Casey' | 'Antarctica/Davis' | 'Antarctica/Macquarie' | 'Antarctica/Mawson' | 'Antarctica/Palmer' | 'Antarctica/Rothera' | 'Antarctica/Troll' | 'Antarctica/Vostok' | 'Asia/Almaty' | 'Asia/Amman' | 'Asia/Anadyr' | 'Asia/Aqtau' | 'Asia/Aqtobe' | 'Asia/Ashgabat' | 'Asia/Atyrau' | 'Asia/Baghdad' | 'Asia/Baku' | 'Asia/Bangkok' | 'Asia/Barnaul' | 'Asia/Beirut' | 'Asia/Bishkek' | 'Asia/Brunei' | 'Asia/Chita' | 'Asia/Choibalsan' | 'Asia/Colombo' | 'Asia/Damascus' | 'Asia/Dhaka' | 'Asia/Dili' | 'Asia/Dubai' | 'Asia/Dushanbe' | 'Asia/Famagusta' | 'Asia/Gaza' | 'Asia/Hebron' | 'Asia/Ho_Chi_Minh' | 'Asia/Hong_Kong' | 'Asia/Hovd' | 'Asia/Irkutsk' | 'Asia/Jakarta' | 'Asia/Jayapura' | 'Asia/Jerusalem' | 'Asia/Kabul' | 'Asia/Kamchatka' | 'Asia/Karachi' | 'Asia/Kathmandu' | 'Asia/Khandyga' | 'Asia/Kolkata' | 'Asia/Krasnoyarsk' | 'Asia/Kuala_Lumpur' | 'Asia/Kuching' | 'Asia/Macau' | 'Asia/Magadan' | 'Asia/Makassar' | 'Asia/Manila' | 'Asia/Nicosia' | 'Asia/Novokuznetsk' | 'Asia/Novosibirsk' | 'Asia/Omsk' | 'Asia/Oral' | 'Asia/Pontianak' | 'Asia/Pyongyang' | 'Asia/Qatar' | 'Asia/Qostanay' | 'Asia/Qyzylorda' | 'Asia/Riyadh' | 'Asia/Sakhalin' | 'Asia/Samarkand' | 'Asia/Seoul' | 'Asia/Shanghai' | 'Asia/Singapore' | 'Asia/Srednekolymsk' | 'Asia/Taipei' | 'Asia/Tashkent' | 'Asia/Tbilisi' | 'Asia/Tehran' | 'Asia/Thimphu' | 'Asia/Tokyo' | 'Asia/Tomsk' | 'Asia/Ulaanbaatar' | 'Asia/Urumqi' | 'Asia/Ust-Nera' | 'Asia/Vladivostok' | 'Asia/Yakutsk' | 'Asia/Yangon' | 'Asia/Yekaterinburg' | 'Asia/Yerevan' | 'Atlantic/Azores' | 'Atlantic/Bermuda' | 'Atlantic/Canary' | 'Atlantic/Cape_Verde' | 'Atlantic/Faroe' | 'Atlantic/Madeira' | 'Atlantic/Reykjavik' | 'Atlantic/South_Georgia' | 'Atlantic/Stanley' | 'Australia/Adelaide' | 'Australia/Brisbane' | 'Australia/Broken_Hill' | 'Australia/Darwin' | 'Australia/Eucla' | 'Australia/Hobart' | 'Australia/Lindeman' | 'Australia/Lord_Howe' | 'Australia/Melbourne' | 'Australia/Perth' | 'Australia/Sydney' | 'CET' | 'CST6CDT' | 'EET' | 'EST' | 'EST5EDT' | 'Etc/GMT' | 'Etc/GMT-1' | 'Etc/GMT-10' | 'Etc/GMT-11' | 'Etc/GMT-12' | 'Etc/GMT-13' | 'Etc/GMT-14' | 'Etc/GMT-2' | 'Etc/GMT-3' | 'Etc/GMT-4' | 'Etc/GMT-5' | 'Etc/GMT-6' | 'Etc/GMT-7' | 'Etc/GMT-8' | 'Etc/GMT-9' | 'Etc/GMT+1' | 'Etc/GMT+10' | 'Etc/GMT+11' | 'Etc/GMT+12' | 'Etc/GMT+2' | 'Etc/GMT+3' | 'Etc/GMT+4' | 'Etc/GMT+5' | 'Etc/GMT+6' | 'Etc/GMT+7' | 'Etc/GMT+8' | 'Etc/GMT+9' | 'Etc/UTC' | 'Europe/Amsterdam' | 'Europe/Andorra' | 'Europe/Astrakhan' | 'Europe/Athens' | 'Europe/Belgrade' | 'Europe/Berlin' | 'Europe/Brussels' | 'Europe/Bucharest' | 'Europe/Budapest' | 'Europe/Chisinau' | 'Europe/Copenhagen' | 'Europe/Dublin' | 'Europe/Gibraltar' | 'Europe/Helsinki' | 'Europe/Istanbul' | 'Europe/Kaliningrad' | 'Europe/Kiev' | 'Europe/Kirov' | 'Europe/Lisbon' | 'Europe/London' | 'Europe/Luxembourg' | 'Europe/Madrid' | 'Europe/Malta' | 'Europe/Minsk' | 'Europe/Monaco' | 'Europe/Moscow' | 'Europe/Oslo' | 'Europe/Paris' | 'Europe/Prague' | 'Europe/Riga' | 'Europe/Rome' | 'Europe/Samara' | 'Europe/Saratov' | 'Europe/Simferopol' | 'Europe/Sofia' | 'Europe/Stockholm' | 'Europe/Tallinn' | 'Europe/Tirane' | 'Europe/Ulyanovsk' | 'Europe/Uzhgorod' | 'Europe/Vienna' | 'Europe/Vilnius' | 'Europe/Volgograd' | 'Europe/Warsaw' | 'Europe/Zaporozhye' | 'Europe/Zurich' | 'HST' | 'Indian/Chagos' | 'Indian/Christmas' | 'Indian/Cocos' | 'Indian/Kerguelen' | 'Indian/Mahe' | 'Indian/Maldives' | 'Indian/Mauritius' | 'Indian/Reunion' | 'MET' | 'MST' | 'MST7MDT' | 'Pacific/Apia' | 'Pacific/Auckland' | 'Pacific/Bougainville' | 'Pacific/Chatham' | 'Pacific/Chuuk' | 'Pacific/Easter' | 'Pacific/Efate' | 'Pacific/Fakaofo' | 'Pacific/Fiji' | 'Pacific/Funafuti' | 'Pacific/Galapagos' | 'Pacific/Gambier' | 'Pacific/Guadalcanal' | 'Pacific/Guam' | 'Pacific/Honolulu' | 'Pacific/Kanton' | 'Pacific/Kiritimati' | 'Pacific/Kosrae' | 'Pacific/Kwajalein' | 'Pacific/Majuro' | 'Pacific/Marquesas' | 'Pacific/Nauru' | 'Pacific/Niue' | 'Pacific/Norfolk' | 'Pacific/Noumea' | 'Pacific/Pago_Pago' | 'Pacific/Palau' | 'Pacific/Pitcairn' | 'Pacific/Pohnpei' | 'Pacific/Port_Moresby' | 'Pacific/Rarotonga' | 'Pacific/Tahiti' | 'Pacific/Tarawa' | 'Pacific/Tongatapu' | 'Pacific/Wake' | 'Pacific/Wallis' | 'PST8PDT' | 'WET'
```
### LocalizedField
* key
The identifier for the localized field, indicating the type of information collected (for example, a tax credential or shipping credential for a specific country).
```ts
LocalizedFieldKey
```
* title
The localized display label for the field, suitable for rendering in the UI.
```ts
string
```
* value
The current value entered by the buyer for this field.
```ts
string
```
### LocalizedFieldKey
A union of keys for the localized fields that are required by certain countries.
```ts
'SHIPPING_CREDENTIAL_BR' | 'SHIPPING_CREDENTIAL_CL' | 'SHIPPING_CREDENTIAL_CN' | 'SHIPPING_CREDENTIAL_CO' | 'SHIPPING_CREDENTIAL_CR' | 'SHIPPING_CREDENTIAL_EC' | 'SHIPPING_CREDENTIAL_ES' | 'SHIPPING_CREDENTIAL_GT' | 'SHIPPING_CREDENTIAL_ID' | 'SHIPPING_CREDENTIAL_KR' | 'SHIPPING_CREDENTIAL_MY' | 'SHIPPING_CREDENTIAL_MX' | 'SHIPPING_CREDENTIAL_PE' | 'SHIPPING_CREDENTIAL_PT' | 'SHIPPING_CREDENTIAL_PY' | 'SHIPPING_CREDENTIAL_TR' | 'SHIPPING_CREDENTIAL_TW' | 'SHIPPING_CREDENTIAL_TYPE_CO' | 'TAX_CREDENTIAL_BR' | 'TAX_CREDENTIAL_CL' | 'TAX_CREDENTIAL_CO' | 'TAX_CREDENTIAL_CR' | 'TAX_CREDENTIAL_EC' | 'TAX_CREDENTIAL_ES' | 'TAX_CREDENTIAL_GT' | 'TAX_CREDENTIAL_ID' | 'TAX_CREDENTIAL_IT' | 'TAX_CREDENTIAL_MX' | 'TAX_CREDENTIAL_MY' | 'TAX_CREDENTIAL_PE' | 'TAX_CREDENTIAL_PT' | 'TAX_CREDENTIAL_PY' | 'TAX_CREDENTIAL_TR' | 'TAX_CREDENTIAL_TYPE_CO' | 'TAX_CREDENTIAL_TYPE_MX' | 'TAX_CREDENTIAL_USE_MX' | 'TAX_EMAIL_IT'
```
### StorefrontApiVersion
The supported Storefront API versions. Pass one of these values to \`query()\` to target a specific API version when querying the Storefront GraphQL API.
```ts
'2022-04' | '2022-07' | '2022-10' | '2023-01' | '2023-04' | '2023-07' | '2024-01' | '2024-04' | '2024-07' | '2024-10' | '2025-01' | '2025-04' | 'unstable' | '2025-07' | '2025-10'
```
### GraphQLError
An error returned by the Storefront GraphQL API. Contains a human-readable \`message\` and an \`extensions\` object with the request ID and error code for debugging.
* extensions
Additional error metadata including the request ID and error code.
```ts
{ requestId: string; code: string; }
```
* message
A human-readable description of the error.
```ts
string
```
### SelectedPaymentOption
A payment option that the buyer has actively selected. This is the same shape as \`PaymentOption\` and appears in \`selectedPaymentOptions\`.
* handle
A session-scoped identifier for this payment option. This handle isn't globally unique; it's specific to the current checkout session or the shop.
```ts
string
```
* type
The type of the payment option. Shops can be configured to support many different payment options. Some options are available only to buyers in specific regions. | Type | Description | |---|---| | \`creditCard\` | A vaulted or manually entered credit card. | | \`deferred\` | A \[deferred payment]\(https://help.shopify.com/en/manual/orders/deferred-payments), such as invoicing the buyer and collecting payment at a later time. | | \`local\` | A \[local payment option]\(https://help.shopify.com/en/manual/payments/shopify-payments/local-payment-methods) specific to the current region or market | | \`manualPayment\` | A manual payment option such as an in-person retail transaction. | | \`offsite\` | A payment processed outside of Shopify's checkout, excluding integrated wallets. | | \`other\` | Another type of payment not defined here. | | \`paymentOnDelivery\` | A payment collected on delivery. | | \`redeemable\` | A redeemable payment option such as a gift card or store credit. | | \`wallet\` | An integrated wallet such as PayPal, Google Pay, or Apple Pay. | | \`customOnsite\` | A custom payment option that's processed through a checkout extension with a payments app. |
```ts
| 'creditCard'
| 'deferred'
| 'local'
| 'manualPayment'
| 'offsite'
| 'other'
| 'paymentOnDelivery'
| 'redeemable'
| 'wallet'
| 'customOnsite'
```
### SessionToken
Authenticates requests between your extension and your app backend. Use session tokens to verify the identity of the buyer and the shop context when making server-side API calls. The token is a signed JWT that contains claims such as the customer ID, shop domain, and expiration.
* get
Requests a session token that hasn't expired. You should call this method every time you need to make a request to your backend in order to get a valid token. This method returns cached tokens when possible, so you don't need to worry about storing these tokens yourself.
```ts
() => Promise
```
### ExtensionSettings
The merchant-defined setting values for the extension.
### ShippingAddress
* address1
The first line of the street address, including the street number and name. The value is \`undefined\` if the buyer hasn't entered an address yet. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* address2
The second line of the buyer's address, such as apartment number, suite, or unit. The value is \`undefined\` if the buyer didn't provide a second address line. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* city
The city, town, or village of the address. The value is \`undefined\` if the buyer hasn't entered a city yet. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* company
The buyer's company name. The value is \`undefined\` if the buyer didn't enter a company or the store doesn't collect company names. {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* countryCode
The two-letter country code in \[ISO 3166 Alpha-2]\(https://en.wikipedia.org/wiki/ISO\_3166-1\_alpha-2) format. The value is \`undefined\` if the buyer hasn't selected a country yet. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
CountryCode
```
* firstName
The buyer's first name. Use this alongside \`lastName\` when you need to display or process name parts separately. The value is \`undefined\` if the buyer didn't provide a first name or the store doesn't collect split names. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* lastName
The buyer's last name. Use this alongside \`firstName\` when you need to display or process name parts separately. The value is \`undefined\` if the buyer didn't provide a last name or the store doesn't collect split names. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* name
The buyer's full name, typically a combination of first and last name. The value is \`undefined\` if the buyer didn't provide a name. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* oneTimeUse
Controls whether the address is saved to the buyer's account. When \`true\`, the address won't be saved and is only used for this checkout. When \`false\` or \`undefined\`, the address might be saved to the buyer's account for future use.
```ts
boolean
```
* phone
The phone number associated with the address, typically in international format. The value is \`undefined\` if the buyer didn't provide a phone number or the store doesn't collect phone numbers. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* provinceCode
The province, state, prefecture, or region code of the address. The format varies by country. The value is \`undefined\` if the buyer hasn't selected one yet or the country doesn't have provinces. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
* zip
The postal code or ZIP code of the address, used for mail sorting and delivery routing. The value is \`undefined\` if the buyer hasn't entered one yet or the country doesn't use postal codes. {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to \[protected customer data]\(/docs/apps/store/data-protection/protected-customer-data).
```ts
string
```
### Shop
Metadata about the merchant's store, including its name, storefront URL, \`.myshopify.com\` subdomain, and a globally-unique ID.
* id
A globally-unique identifier for the shop in the format \`gid://shopify/Shop/\\`.
```ts
string
```
* myshopifyDomain
The shop's unique \`.myshopify.com\` subdomain, such as \`'example.myshopify.com'\`. This domain is permanent and doesn't change even if the merchant adds a custom domain.
```ts
string
```
* name
The display name of the shop as configured by the merchant in Shopify admin.
```ts
string
```
* storefrontUrl
The primary storefront URL for the shop, such as \`'https://example.myshopify.com'\`. Use this to build links back to the merchant's online store.
```ts
string
```
### Storage
Key-value storage for a specific extension. Use storage to save preferences or cached data that should survive page reloads without requiring a backend call. Stored data is only available to this specific extension. The storage backend is implemented with \`localStorage\` and data persistence isn't guaranteed.
* delete
Deletes a previously stored value by key.
```ts
(key: string) => Promise
```
* read
Read and return a stored value by key. The stored data is deserialized from JSON and returned as its original type. Returns \`null\` if no stored data exists.
```ts
(key: string) => Promise
```
* write
Write stored data for this key. The data must be serializable to JSON.
```ts
(key: string, data: any) => Promise
```
### Version
```ts
string
```
Examples
### Examples
* ####
##### Preact
```jsx
import '@shopify/ui-extensions/preact';
import {render} from 'preact';
export default function extension() {
render(, document.body);
}
function Extension() {
return (
Shop name: {shopify.shop.name}
cost:{' '}
{shopify.cost.totalAmount.value.amount}
);
}
```
## Related
[Reference - APIs](https://shopify.dev/docs/api/checkout-ui-extensions/targets)
[Reference - Components](https://shopify.dev/docs/api/checkout-ui-extensions/components)
[Reference - Configuration](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
[Learn - Tutorials](https://shopify.dev/apps/checkout)