# StandardApi

This base API object is provided to all extension points.

```jsx
import React from 'react';
import {
  BlockStack,
  render,
  Text,
  useExtensionApi,
} from '@shopify/checkout-ui-extensions-react';

// 1. Choose an extension point
render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  // 2. Use the extension API to gather context from the checkout and shop
  const {cost, shop} = useExtensionApi();

  // 3. Render a UI
  return (
    <BlockStack>
      <Text>Shop name: {shop.name}</Text>
      <Text>cost: {cost.totalAmount}</Text>
    </BlockStack>
  );
}

```

```js
import {
  BlockStack,
  Text,
  extend,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {shop, cost}) => {
    root.appendChild(
      root.createComponent(
        BlockStack,
        undefined,
        [
          root.createComponent(
            Text,
            undefined,
            `Shop name: ${shop.name}`,
          ),
          root.createComponent(
            Text,
            undefined,
            `Cost: ${cost.totalAmount}`,
          ),
        ],
      ),
    );
  },
);

```

## Properties

See [examples](#examples) for more information on how to use the API.

### StandardApi

### analytics

value: `Analytics`

  - Analytics: export interface Analytics {
  /**
   * Publish method to emit analytics events to [Web Pixels](https://shopify.dev/docs/apps/marketing).
   */
  publish(name: string, data: {[key: string]: unknown}): Promise<boolean>;
}
Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.

### appliedGiftCards

value: `StatefulRemoteSubscribable<AppliedGiftCard[]>`

  - AppliedGiftCard: export interface AppliedGiftCard {
  /**
   * The last four characters of the applied gift card's code.
   */
  lastCharacters: string;

  /**
   * The amount of the applied gift card that will be used when the checkout is completed.
   */
  amountUsed: Money;

  /**
   * The current balance of the applied gift card prior to checkout completion.
   */
  balance: Money;
}
Gift Cards that have been applied to the checkout.

### appMetafields

value: `StatefulRemoteSubscribable<AppMetafieldEntry[]>`

  - AppMetafieldEntry: export interface AppMetafieldEntry {
  /**
   * The target that is associated to the metadata.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data) when the type is `customer`.
   */
  target: AppMetafieldEntryTarget;

  /** The metadata information. */
  metafield: AppMetafield;
}
  - AppMetafield: export interface AppMetafield {
  /** The key name of a metafield. */
  key: string;

  /** The namespace for a metafield. */
  namespace: string;

  /** The value of a metafield. */
  value: string | number | boolean;

  /** The metafield’s information type. */
  valueType: 'boolean' | 'float' | 'integer' | 'json_string' | 'string';

  /** The metafield's type name. */
  type: string;
}
  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The metafields requested in the
[`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
file. These metafields are updated when there's a change in the merchandise items
being purchased by the customer.

{% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

> Tip:
> Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.

### attributes

value: `StatefulRemoteSubscribable<Attribute[] | undefined>`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
Custom attributes left by the customer to the merchant, either in their cart or during checkout.

### availablePaymentOptions

value: `StatefulRemoteSubscribable<PaymentOption[]>`

  - PaymentOption: export interface PaymentOption {
  /**
   * The type of the payment option.
   *
   * Shops can be configured to support many different payment options. Some options are only available 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 that will be 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, Apple Pay, etc.  |
   * | `customOnsite` | A custom payment option that is processed through a checkout extension with a payments app. |
   */
  type:
    | 'creditCard'
    | 'deferred'
    | 'local'
    | 'manualPayment'
    | 'offsite'
    | 'other'
    | 'paymentOnDelivery'
    | 'redeemable'
    | 'wallet'
    | 'customOnsite';

  /**
   * The unique handle for the payment option.
   *
   * This is not a globally unique identifier. It may be an identifier specific to the given checkout session or the current shop.
   */
  handle: string;
}
All available payment options.

### buyerIdentity

value: `BuyerIdentity`

  - BuyerIdentity: export interface BuyerIdentity {
  /**
   * The buyer's customer account. 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](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  customer: StatefulRemoteSubscribable<Customer | undefined>;

  /**
   * The email address of the buyer that is interacting with the cart.
   * The value is `undefined` if the app does not have access to customer data.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  email: StatefulRemoteSubscribable<string | undefined>;

  /**
   * The phone number of the buyer that is interacting with the cart.
   * The value is `undefined` if the app does not have access to customer data.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  phone: StatefulRemoteSubscribable<string | undefined>;
}
Information about the buyer that is interacting with the checkout.

{% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### buyerJourney

value: `BuyerJourney`

  - BuyerJourney: export interface BuyerJourney {
  /**
   * Installs a function for intercepting and preventing progress on checkout.
   *
   * This returns a promise that resolves to a teardown function. Calling the
   * teardown function will remove the interceptor.
   *
   * To block checkout progress, you must set the [block_progress](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress)
   * capability in your extension's configuration.
   */
  intercept(interceptor: Interceptor): Promise<() => void>;

  /**
   * This subscribable value will be true if the buyer completed submitting their order.
   *
   * For example, when viewing the order status page after submitting payment, the buyer will have completed their order.
   */
  completed: StatefulRemoteSubscribable<boolean>;
}
Provides details on the buyer's progression through the checkout.

See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
examples for more information.

### cost

value: `CartCost`

  - CartCost: export interface CartCost {
  /**
   * A `Money` value representing the minimum a buyer can expect to pay at the current
   * step of checkout. This value excludes amounts yet to be negotiated. For example,
   * the information step might not have delivery costs calculated.
   */
  totalAmount: StatefulRemoteSubscribable<Money>;
}
Details on the costs the buyer will pay for this checkout.

### deliveryGroups

value: `StatefulRemoteSubscribable<DeliveryGroup[]>`

  - DeliveryGroup: export interface DeliveryGroup {
  /**
   * The cart line references associated to the delivery group.
   */
  targetedCartLines: CartLineReference[];

  /**
   * The delivery options available for the delivery group.
   */
  deliveryOptions: DeliveryOption[];

  /**
   * The selected delivery option for the delivery group.
   */
  selectedDeliveryOption?: DeliveryOptionReference;

  /**
   * The type of the delivery group.
   */
  groupType: DeliveryGroupType;

  /**
   * Whether delivery is required for the delivery group.
   */
  isDeliveryRequired: boolean;
}
A list of delivery groups containing information about the delivery of the items the customer intends to purchase.

### discountCodes

value: `StatefulRemoteSubscribable<CartDiscountCode[]>`

  - CartDiscountCode: export interface CartDiscountCode {
  /**
   * The code for the discount
   */
  code: string;
}
A list of discount codes currently applied to the checkout.

### discountAllocations

value: `StatefulRemoteSubscribable<CartDiscountAllocation[]>`

  - CartDiscountAllocation: CartCodeDiscountAllocation | CartAutomaticDiscountAllocation | CartCustomDiscountAllocation
Discounts that have been applied to the entire cart.

### extension

value: `Extension<Target>`

  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
Meta information about the extension.

### extensionPoint

value: `ExtensionPoint`

  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - ExtensionPoint: keyof ExtensionPoints
The identifier that specifies where in Shopify’s UI your code is being
injected. This will be one of the targets you have included in your
extension’s configuration file.

### i18n

value: `I18n`

  - I18n: export interface I18n {
  /**
   * 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.
   *
   * @param options.inExtensionLocale - if true, use the extension's locale
   */
  formatNumber: (
    number: number | bigint,
    options?: {inExtensionLocale?: boolean} & Intl.NumberFormatOptions,
  ) => string;

  /**
   * 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.
   *
   * @param options.inExtensionLocale - if true, use the extension's locale
   */
  formatCurrency: (
    number: number | bigint,
    options?: {inExtensionLocale?: boolean} & Intl.NumberFormatOptions,
  ) => string;

  /**
   * Returns a localized date value.
   *
   * This function behaves like the standard `Intl.DateTimeFormatOptions()` and uses
   * the buyer's locale by default. Formatting options can be passed in as
   * options.
   *
   * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat0
   * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat#using_options
   *
   * @param options.inExtensionLocale - if true, use the extension's locale
   */
  formatDate: (
    date: Date,
    options?: {inExtensionLocale?: boolean} & Intl.DateTimeFormatOptions,
  ) => string;

  /**
   * 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.
   */
  translate: I18nTranslate;
}
Utilities for translating content and formatting values according to the current
[`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
of the checkout.

See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
for more information.

### lines

value: `StatefulRemoteSubscribable<CartLine[]>`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
A list of lines containing information about the items the customer intends to purchase.

### localization

value: `Localization`

  - Localization: export interface Localization {
  /**
   * The currency that the buyer sees for money amounts in the checkout.
   */
  currency: StatefulRemoteSubscribable<Currency>;

  /**
   * The buyer’s time zone.
   */
  timezone: StatefulRemoteSubscribable<Timezone>;

  /**
   * The language the buyer sees in the checkout.
   */
  language: StatefulRemoteSubscribable<Language>;

  /**
   * This is the buyer's language, as supported by the extension.
   * If the buyer's actual language is not supported by the extension,
   * this is the fallback locale used for translations.
   *
   * For example, if the buyer's language is 'fr-CA' but your extension
   * only supports translations for 'fr', then the `isoCode` for this
   * language is 'fr'. If your extension does not provide french
   * translations at all, this value is the default locale for your
   * extension (that is, the one matching your .default.json file).
   */
  extensionLanguage: StatefulRemoteSubscribable<Language>;

  /**
   * The country context of the checkout. This value carries over from the
   * context of the cart, where it was used to contextualize the storefront
   * experience. It will update if the buyer changes the country of their
   * shipping address. The value is undefined if unknown.
   */
  country: StatefulRemoteSubscribable<Country | undefined>;

  /**
   * The [market](https://shopify.dev/docs/apps/markets) context of the
   * checkout. This value carries over from the context of the cart, where it
   * was used to contextualize the storefront experience. It will update if the
   * buyer changes the country of their shipping address. The value is undefined
   * if unknown.
   */
  market: StatefulRemoteSubscribable<Market | undefined>;
}
Details about the location, language, and currency of the buyer. For utilities to easily
format and translate content based on these details, you can use the
[`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
object instead.

### metafields

value: `StatefulRemoteSubscribable<Metafield[]>`

  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The metafields that apply to the current checkout.

Metafields are stored locally on the client and are applied to the order object after the checkout completes.

These metafields are shared by all extensions running on checkout, and
persist for as long as the customer is working on this checkout.

Once the order is created, you can query these metafields using the
[GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)

### note

value: `StatefulRemoteSubscribable<string | undefined>`

A note left by the customer to the merchant, either in their cart or during checkout.

### presentmentLines

value: `StatefulRemoteSubscribable<PresentmentCartLine[]>`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - PresentmentCartLine: export interface PresentmentCartLine {
  /**
   * The ID of the present cart line. This ID isn't stable and might change after
   * any operations on the line items.
   * @example 'gid://shopify/PresentmentCartLine/123'
   */
  id: string;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the presentment cart line.
   */
  cost: PresentmentCartLineCost;

  /**
   * The title of the line item.
   */
  title: string;

  /**
   * The subtitle of the line item.
   */
  subtitle?: string;

  /**
   * The image associated with the line item.
   */
  image?: ImageDetails;

  /**
   * The merchandise lines being purchased.
   */
  lines: CartLine[];
}
A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.

### query

value: `<Data = unknown, Variables = { [key: string]: unknown; }>(query: string, options?: { variables?: Variables; version?: StorefrontApiVersion; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>`

  - ApiVersion: '2023-04' | 'unstable'
  - StorefrontApiVersion: '2022-04' | '2022-07' | '2022-10' | '2023-01' | 'unstable'
  - Version: string
Used to query the Storefront GraphQL API with a prefetched token.

See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.

### selectedPaymentOptions

value: `StatefulRemoteSubscribable<SelectedPaymentOption[]>`

  - PaymentOption: export interface PaymentOption {
  /**
   * The type of the payment option.
   *
   * Shops can be configured to support many different payment options. Some options are only available 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 that will be 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, Apple Pay, etc.  |
   * | `customOnsite` | A custom payment option that is processed through a checkout extension with a payments app. |
   */
  type:
    | 'creditCard'
    | 'deferred'
    | 'local'
    | 'manualPayment'
    | 'offsite'
    | 'other'
    | 'paymentOnDelivery'
    | 'redeemable'
    | 'wallet'
    | 'customOnsite';

  /**
   * The unique handle for the payment option.
   *
   * This is not a globally unique identifier. It may be an identifier specific to the given checkout session or the current shop.
   */
  handle: string;
}
  - SelectedPaymentOption: export interface SelectedPaymentOption {
  /**
   * The unique handle referencing `PaymentOption.handle`.
   *
   * See [availablePaymentOptions](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-availablepaymentoptions).
   */
  handle: string;
}
Payment options selected by the buyer.

### sessionToken

value: `SessionToken`

  - SessionToken: export interface SessionToken {
  /**
   * 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 will return cached tokens when possible, so you don’t need to worry
   * about storing these tokens yourself.
   */
  get(): Promise<string>;
}
Provides access to session tokens, which can be used to verify token claims on your app's server.

See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.

### settings

value: `StatefulRemoteSubscribable<ExtensionSettings>`

  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - ExtensionSettings: export interface ExtensionSettings {
  [key: string]: string | number | boolean | undefined;
}
The settings matching the settings definition written in the
[`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.

 See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.

> Note: When an extension is being installed in the editor, the settings will be empty until
a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.

### shippingAddress

value: `StatefulRemoteSubscribable<MailingAddress | undefined>`

  - MailingAddress: export interface MailingAddress {
  /**
   * The buyer's full name.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'John Doe'
   */
  name?: string;

  /**
   * The buyer's first name.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'John'
   */
  firstName?: string;

  /**
   * The buyer's last name.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'Doe'
   */
  lastName?: string;

  /**
   * The buyer's company name.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'Shopify'
   */
  company?: string;

  /**
   * The first line of the buyer's address, including street name and number.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example '151 O'Connor Street'
   */
  address1?: string;

  /**
   * The second line of the buyer's address, like apartment number, suite, etc.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'Ground floor'
   */
  address2?: string;

  /**
   * The buyer's city.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'Ottawa'
   */
  city?: string;

  /**
   * The buyer's postal or ZIP code.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'K2P 2L8'
   */
  zip?: string;

  /**
   * The ISO 3166 Alpha-2 format for the buyer's country. Refer to https://www.iso.org/iso-3166-country-codes.html.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'CA' for Canada.
   */
  countryCode?: CountryCode;

  /**
   * The buyer's zone code, such as state, province, prefecture, or region.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'ON' for Ontario.
   */
  provinceCode?: string;

  /**
   * The buyer's phone number.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example '+1 613 111 2222'.
   */
  phone?: string;
}
The proposed buyer shipping address. During the information step, the address
updates when the field is committed (on change) rather than every keystroke.
An address value is only present if delivery is required. Otherwise, the
subscribable value is undefined.

{% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### shop

value: `Shop`

  - Shop: export interface Shop {
  /**
   * The shop ID.
   * @example 'gid://shopify/Shop/123'
   */
  id: string;
  /**
   * The name of the shop.
   */
  name: string;
  /**
   * The primary storefront URL.
   */
  storefrontUrl?: string;
  /**
   * The shop's myshopify.com domain.
   */
  myshopifyDomain: string;
}
Shop where the checkout is taking place.

### storage

value: `Storage`

  - Storage: export interface Storage {
  /**
   * Read and return a stored value by key.
   *
   * The stored data is deserialized from JSON and returned as
   * its original primitive.
   *
   * Returns `null` if no stored data exists.
   */
  read<T = unknown>(key: string): Promise<T | null>;

  /**
   * Write stored data for this key.
   *
   * The data must be serializable to JSON.
   */
  write(key: string, data: any): Promise<void>;

  /**
   * Delete stored data by key.
   */
  delete(key: string): Promise<void>;
}
Key-value storage for the extension point.

### ui

value: `Ui`

  - Ui: export interface Ui {
  overlay: {
    close(overlayId: string): void;
  };
}
Methods to interact with the extension's UI.

### version

value: `Version`

  - Version: string
The renderer version being used for the extension.

### Analytics

### publish

value: `(name: string, data: { [key: string]: unknown; }) => Promise<boolean>`

Publish method to emit analytics events to [Web Pixels](https://shopify.dev/docs/apps/marketing).

### AppliedGiftCard

### lastCharacters

value: `string`

The last four characters of the applied gift card's code.

### amountUsed

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The amount of the applied gift card that will be used when the checkout is completed.

### balance

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The current balance of the applied gift card prior to checkout completion.

### Money

### amount

value: `number`

The price amount.

### currencyCode

value: `CurrencyCode`

  - CurrencyCode: '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'
  - Currency: export interface Currency {
  /**
   * The ISO-4217 code for this currency.
   * @see https://www.iso.org/iso-4217-currency-codes.html
   */
  isoCode: CurrencyCode;
}
The ISO 4217 format for the currency.

### AppMetafieldEntry

A metafield associated with the shop or a resource on the checkout.

### target

value: `AppMetafieldEntryTarget`

  - AppMetafieldEntry: export interface AppMetafieldEntry {
  /**
   * The target that is associated to the metadata.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data) when the type is `customer`.
   */
  target: AppMetafieldEntryTarget;

  /** The metadata information. */
  metafield: AppMetafield;
}
  - AppMetafieldEntryTarget: export interface AppMetafieldEntryTarget {
  /**
   * The type of the metafield owner.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data) when the type is `customer`.
   */
  type:
    | 'customer'
    | 'product'
    | 'shop'
    | 'variant'
    | 'company'
    | 'companyLocation'
    | 'cart';

  /** The numeric owner ID that is associated with the metafield. */
  id: string;
}
  - AppMetafield: export interface AppMetafield {
  /** The key name of a metafield. */
  key: string;

  /** The namespace for a metafield. */
  namespace: string;

  /** The value of a metafield. */
  value: string | number | boolean;

  /** The metafield’s information type. */
  valueType: 'boolean' | 'float' | 'integer' | 'json_string' | 'string';

  /** The metafield's type name. */
  type: string;
}
  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The target that is associated to the metadata.

{% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data) when the type is `customer`.

### metafield

value: `AppMetafield`

  - AppMetafield: export interface AppMetafield {
  /** The key name of a metafield. */
  key: string;

  /** The namespace for a metafield. */
  namespace: string;

  /** The value of a metafield. */
  value: string | number | boolean;

  /** The metafield’s information type. */
  valueType: 'boolean' | 'float' | 'integer' | 'json_string' | 'string';

  /** The metafield's type name. */
  type: string;
}
  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The metadata information.

### AppMetafieldEntryTarget

The metafield owner.

### type

value: `"cart" | "customer" | "product" | "shop" | "variant" | "company" | "companyLocation"`

The type of the metafield owner.

{% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data) when the type is `customer`.

### id

value: `string`

The numeric owner ID that is associated with the metafield.

### AppMetafield

Represents a custom metadata attached to a resource.

### key

value: `string`

The key name of a metafield.

### namespace

value: `string`

The namespace for a metafield.

### value

value: `string | number | boolean`

The value of a metafield.

### valueType

value: `"string" | "boolean" | "integer" | "json_string" | "float"`

The metafield’s information type.

### type

value: `string`

The metafield's type name.

### Attribute

### key

value: `string`

The key for the attribute.

### value

value: `string`

The value for the attribute.

### PaymentOption

A payment option presented to the buyer.

### type

value: `"creditCard" | "deferred" | "local" | "manualPayment" | "offsite" | "other" | "paymentOnDelivery" | "redeemable" | "wallet" | "customOnsite"`

The type of the payment option.

Shops can be configured to support many different payment options. Some options are only available 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 that will be 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, Apple Pay, etc.  |
| `customOnsite` | A custom payment option that is processed through a checkout extension with a payments app. |

### handle

value: `string`

The unique handle for the payment option.

This is not a globally unique identifier. It may be an identifier specific to the given checkout session or the current shop.

### BuyerIdentity

### customer

value: `StatefulRemoteSubscribable<Customer | undefined>`

  - Customer: export interface Customer {
  /**
   * Customer ID.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'gid://shopify/Customer/123'
   */
  id: string;
  /**
   * The email of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  email?: string;
  /**
   * The phone number of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  phone?: string;
  /**
   * The full name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  fullName?: string;
  /**
   * The first name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  firstName?: string;
  /**
   * The last name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  lastName?: string;
  /**
   * The image associated with the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  image: ImageDetails;
  /**
   * Defines if the customer accepts marketing activities.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  acceptsMarketing: boolean;
  /**
   * The Store Credit Accounts owned by the customer and usable during the checkout process.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @private
   */
  storeCreditAccounts: StoreCreditAccount[];
}
The buyer's customer account. 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](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### email

value: `StatefulRemoteSubscribable<string | undefined>`

The email address of the buyer that is interacting with the cart.
The value is `undefined` if the app does not have access to customer data.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### phone

value: `StatefulRemoteSubscribable<string | undefined>`

The phone number of the buyer that is interacting with the cart.
The value is `undefined` if the app does not have access to customer data.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### Customer

Information about a customer who has previously purchased from this shop.

{% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### id

value: `string`

Customer ID.

{% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### email

value: `string`

The email of the customer.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### phone

value: `string`

The phone number of the customer.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### fullName

value: `string`

The full name of the customer.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### firstName

value: `string`

The first name of the customer.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### lastName

value: `string`

The last name of the customer.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### image

value: `ImageDetails`

  - ImageDetails: export interface ImageDetails {
  /**
   * The image URL.
   */
  url: string;

  /**
   * The alternative text for the image.
   */
  altText?: string;
}
The image associated with the customer.

{% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### acceptsMarketing

value: `boolean`

Defines if the customer accepts marketing activities.

{% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### storeCreditAccounts

value: `StoreCreditAccount[]`

  - StoreCreditAccount: export interface StoreCreditAccount {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/StoreCreditAccount/1'
   */
  id: string;
  /**
   * The current balance of the Store Credit Account.
   */
  balance: Money;
}
The Store Credit Accounts owned by the customer and usable during the checkout process.

{% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### ImageDetails

### url

value: `string`

The image URL.

### altText

value: `string`

The alternative text for the image.

### StoreCreditAccount

Information about a Store Credit Account.

### id

value: `string`

A globally-unique identifier.

### balance

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The current balance of the Store Credit Account.

### BuyerJourney

Provides details on the buyer's progression through the checkout.

### intercept

value: `(interceptor: Interceptor) => Promise<() => void>`

  - Interceptor: (
  interceptorProps: InterceptorProps,
) => InterceptorRequest | Promise<InterceptorRequest>
Installs a function for intercepting and preventing progress on checkout.

This returns a promise that resolves to a teardown function. Calling the
teardown function will remove the interceptor.

To block checkout progress, you must set the [block_progress](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress)
capability in your extension's configuration.

### completed

value: `StatefulRemoteSubscribable<boolean>`

This subscribable value will be true if the buyer completed submitting their order.

For example, when viewing the order status page after submitting payment, the buyer will have completed their order.

### InterceptorProps

### canBlockProgress

value: `boolean`

Whether the interceptor has the capability to block a buyer's progress through
checkout. This ability might be granted by a merchant in differing checkout contexts.

### InterceptorRequestAllow

### behavior

value: `"allow"`

Indicates that the interceptor will allow the buyer's journey to continue.

### perform

value: `(result: InterceptorResult) => void | Promise<void>`

  - Interceptor: (
  interceptorProps: InterceptorProps,
) => InterceptorRequest | Promise<InterceptorRequest>
  - InterceptorResult: InterceptorResultAllow | InterceptorResultBlock
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.

### InterceptorResultAllow

### behavior

value: `"allow"`

Indicates that the buyer was allowed to progress through checkout.

### InterceptorResultBlock

### behavior

value: `"block"`

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.

### InterceptorRequestBlock

### behavior

value: `"block"`

Indicates that the interceptor will block the buyer's journey from continuing.

### reason

value: `string`

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.

### errors

value: `ValidationError[]`

  - ValidationError: export interface ValidationError {
  /**
   * Error message to be displayed to the buyer.
   */
  message: string;
  /**
   * The checkout UI field that the error is associated with.
   *
   * Example: `$.cart.deliveryGroups[0].deliveryAddress.countryCode`
   *
   * See the [supported targets](https://shopify.dev/docs/api/functions/reference/cart-checkout-validation/graphql#supported-targets)
   * for more information.
   */
  target?: string;
}
Used to pass errors to the checkout UI, outside your extension's UI boundaries.

### perform

value: `(result: InterceptorResult) => void | Promise<void>`

  - Interceptor: (
  interceptorProps: InterceptorProps,
) => InterceptorRequest | Promise<InterceptorRequest>
  - InterceptorResult: InterceptorResultAllow | InterceptorResultBlock
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.

### ValidationError

### message

value: `string`

Error message to be displayed to the buyer.

### target

value: `string`

The checkout UI field that the error is associated with.

Example: `$.cart.deliveryGroups[0].deliveryAddress.countryCode`

See the [supported targets](https://shopify.dev/docs/api/functions/reference/cart-checkout-validation/graphql#supported-targets)
for more information.

### CartCost

### totalAmount

value: `StatefulRemoteSubscribable<Money>`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
A `Money` value representing the minimum a buyer can expect to pay at the current
step of checkout. This value excludes amounts yet to be negotiated. For example,
the information step might not have delivery costs calculated.

### DeliveryGroup

Represents the delivery information and options available for one or
more cart lines.

### targetedCartLines

value: `CartLineReference[]`

  - CartLineReference: export interface CartLineReference {
  /**
   * The unique identifier of the referenced cart line.
   */
  id: string;
}
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
The cart line references associated to the delivery group.

### deliveryOptions

value: `DeliveryOption[]`

  - DeliveryOption: export interface DeliveryOption {
  /**
   * The unique identifier of the delivery option.
   */
  handle: string;

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

  /**
   * The description of the delivery option.
   */
  description?: string;
}
The delivery options available for the delivery group.

### selectedDeliveryOption

value: `DeliveryOptionReference`

  - DeliveryOption: export interface DeliveryOption {
  /**
   * The unique identifier of the delivery option.
   */
  handle: string;

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

  /**
   * The description of the delivery option.
   */
  description?: string;
}
  - DeliveryOptionReference: export interface DeliveryOptionReference {
  /**
   * The unique identifier of the referenced delivery option.
   */
  handle: string;
}
The selected delivery option for the delivery group.

### groupType

value: `DeliveryGroupType`

  - DeliveryGroup: export interface DeliveryGroup {
  /**
   * The cart line references associated to the delivery group.
   */
  targetedCartLines: CartLineReference[];

  /**
   * The delivery options available for the delivery group.
   */
  deliveryOptions: DeliveryOption[];

  /**
   * The selected delivery option for the delivery group.
   */
  selectedDeliveryOption?: DeliveryOptionReference;

  /**
   * The type of the delivery group.
   */
  groupType: DeliveryGroupType;

  /**
   * Whether delivery is required for the delivery group.
   */
  isDeliveryRequired: boolean;
}
  - DeliveryGroupType: 'oneTimePurchase' | 'subscription'
The type of the delivery group.

### isDeliveryRequired

value: `boolean`

Whether delivery is required for the delivery group.

### CartLineReference

Represents a reference to a cart line.

### id

value: `string`

The unique identifier of the referenced cart line.

### DeliveryOption

Represents a base interface for a single delivery option.

### handle

value: `string`

The unique identifier of the delivery option.

### title

value: `string`

The title of the delivery option.

### description

value: `string`

The description of the delivery option.

### DeliveryOptionReference

Represents a reference to a delivery option.

### handle

value: `string`

The unique identifier of the referenced delivery option.

### CartDiscountCode

### code

value: `string`

The code for the discount

### CartCodeDiscountAllocation

### code

value: `string`

The code for the discount

### type

value: `"code"`

The type of the code discount

### discountedAmount

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The money amount that has been discounted from the order

### CartAutomaticDiscountAllocation

### title

value: `string`

The title of the automatic discount

### type

value: `"automatic"`

The type of the automatic discount

### discountedAmount

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The money amount that has been discounted from the order

### CartCustomDiscountAllocation

### title

value: `string`

The title of the custom discount

### type

value: `"custom"`

The type of the custom discount

### discountedAmount

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The money amount that has been discounted from the order

### Extension

Meta information about an extension point.

### target

value: `Target`

The identifier that specifies where in Shopify’s UI your code is being
injected. This will be one of the targets you have included in your
extension’s configuration file.

### version

value: `string`

The published version of the running extension point.

For unpublished extensions, the value is `undefined`.

### apiVersion

value: `ApiVersion`

  - ApiVersion: '2023-04' | 'unstable'
  - Version: string
The API version that was set in the extension config file.

### scriptUrl

value: `string`

The URL to the script that started the extension point.

### rendered

value: `StatefulRemoteSubscribable<boolean>`

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 will appear on a later step of the
checkout.

Your extension might also continue to run after the buyer has navigated away
from where it was rendered. The extension continues running so that
your extension is immediately available to render if the buyer navigates back.

### capabilities

value: `StatefulRemoteSubscribable<Capability[]>`

  - Capability: 'api_access' | 'network_access' | 'block_progress'
The allowed capabilities of the extension, defined
in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.

* [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.

* [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.

* [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.

### editor

value: `Editor`

  - Editor: export interface Editor {
  /**
   * Indicates whether the extension is rendering in the checkout editor.
   */
  type: 'checkout';
}
Information about the editor where the extension is being rendered.

The value is undefined if the extension is not rendering in an editor.

### Editor

### type

value: `"checkout"`

Indicates whether the extension is rendering in the checkout editor.

### ExtensionPoints

A UI extension will register for one or more extension points using `shopify.extend()`.
An extension point in a UI extension is a plain JavaScript function.
This function receives some API for interacting with the application,
and is expected to return a value in a specific shape.
The input arguments and the output type are different
for each extension point.

### Checkout::Actions::RenderBefore

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::Actions::RenderBefore'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered immediately before any actions within each step.

### Checkout::CartLines::RenderAfter

value: `RenderExtension<
    CheckoutApi &
      StandardApi<'Checkout::CartLines::RenderAfter'> &
      OrderStatusApi,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
A static extension point that is rendered after all line items.

### Checkout::CartLineDetails::RenderAfter

value: `RenderExtension<
    CheckoutApi &
      CartLineDetailsApi &
      StandardApi<'Checkout::CartLineDetails::RenderAfter'> &
      OrderStatusApi,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
  - CartLineDetailsApi: export interface CartLineDetailsApi {
  /**
   * The cart line the extension is attached to.
   */
  target: StatefulRemoteSubscribable<PresentmentCartLine>;
}
A static extension point that renders on every line item, inside the details
under the line item properties element.

### Checkout::Contact::RenderAfter

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::Contact::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered immediately after the contact form element.

### Checkout::CustomerInformation::RenderAfter

value: `RenderExtension<
    OrderStatusApi &
      CheckoutApi &
      StandardApi<'Checkout::CustomerInformation::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Customer: export interface Customer {
  /**
   * Customer ID.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'gid://shopify/Customer/123'
   */
  id: string;
  /**
   * The email of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  email?: string;
  /**
   * The phone number of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  phone?: string;
  /**
   * The full name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  fullName?: string;
  /**
   * The first name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  firstName?: string;
  /**
   * The last name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  lastName?: string;
  /**
   * The image associated with the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  image: ImageDetails;
  /**
   * Defines if the customer accepts marketing activities.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  acceptsMarketing: boolean;
  /**
   * The Store Credit Accounts owned by the customer and usable during the checkout process.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @private
   */
  storeCreditAccounts: StoreCreditAccount[];
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
A static extension point that is rendered after a purchase below the customer information.

### Checkout::DeliveryAddress::RenderBefore

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::DeliveryAddress::RenderBefore'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered between the shipping address header
and shipping address form elements.

### Checkout::Dynamic::Render

value: `RenderExtension<
    CheckoutApi & OrderStatusApi & StandardApi<'Checkout::Dynamic::Render'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
A [dynamic extension point](https://shopify.dev/docs/api/checkout-ui-extensions/extension-points-overview#dynamic-extension-points) that isn't tied to a specific checkout section or feature.
Unlike static extension points, dynamic extension points render where the merchant
sets them using the [checkout editor](/apps/checkout/test-ui-extensions#test-the-extension-in-the-checkout-editor).

The [supported locations](https://shopify.dev/docs/api/checkout-ui-extensions/extension-points-overview#supported-locations) for dynamic extension points can be previewed during development
by [using a URL parameter](https://shopify.dev/docs/apps/checkout/best-practices/testing-ui-extensions#dynamic-extension-points).

### Checkout::ThankYou::Dynamic::Render

value: `RenderExtension<
    StandardApi<'Checkout::ThankYou::Dynamic::Render'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A [dynamic extension point](https://shopify.dev/docs/api/checkout-ui-extensions/extension-points-overview#dynamic-extension-points) that renders exclusively on the Thank You Page.
Unlike static extension points, dynamic extension points render where the merchant
sets them using the [checkout editor](/apps/checkout/test-ui-extensions#test-the-extension-in-the-checkout-editor).

The [supported locations](https://shopify.dev/docs/api/checkout-ui-extensions/extension-points-overview#supported-locations) for dynamic extension points can be previewed during development
by [using a URL parameter](https://shopify.dev/docs/apps/checkout/best-practices/testing-ui-extensions#dynamic-extension-points).

### Checkout::ThankYou::CartLineDetails::RenderAfter

value: `RenderExtension<
    CartLineDetailsApi &
      StandardApi<'Checkout::ThankYou::CartLineDetails::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - CartLineDetailsApi: export interface CartLineDetailsApi {
  /**
   * The cart line the extension is attached to.
   */
  target: StatefulRemoteSubscribable<PresentmentCartLine>;
}
A static extension point that renders on every line item, inside the details
under the line item properties element on the Thank You Page.

### Checkout::ThankYou::CartLines::RenderAfter

value: `RenderExtension<
    StandardApi<'Checkout::ThankYou::CartLines::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered after all line items on the Thank You page.

### Checkout::ThankYou::CustomerInformation::RenderAfter

value: `RenderExtension<
    StandardApi<'Checkout::ThankYou::CustomerInformation::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Customer: export interface Customer {
  /**
   * Customer ID.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'gid://shopify/Customer/123'
   */
  id: string;
  /**
   * The email of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  email?: string;
  /**
   * The phone number of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  phone?: string;
  /**
   * The full name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  fullName?: string;
  /**
   * The first name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  firstName?: string;
  /**
   * The last name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  lastName?: string;
  /**
   * The image associated with the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  image: ImageDetails;
  /**
   * Defines if the customer accepts marketing activities.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  acceptsMarketing: boolean;
  /**
   * The Store Credit Accounts owned by the customer and usable during the checkout process.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @private
   */
  storeCreditAccounts: StoreCreditAccount[];
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered after a purchase below the customer information on the Thank You page.

### Checkout::OrderStatus::Dynamic::Render

value: `RenderExtension<
    OrderStatusApi & StandardApi<'Checkout::OrderStatus::Dynamic::Render'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
A [dynamic extension point](https://shopify.dev/docs/api/checkout-ui-extensions/extension-points-overview#dynamic-extension-points) that renders exclusively on the Order Status Page.
Unlike static extension points, dynamic extension points render where the merchant
sets them using the [checkout editor](/apps/checkout/test-ui-extensions#test-the-extension-in-the-checkout-editor).

The [supported locations](https://shopify.dev/docs/api/checkout-ui-extensions/extension-points-overview#supported-locations) for dynamic extension points can be previewed during development
by [using a URL parameter](https://shopify.dev/docs/apps/checkout/best-practices/testing-ui-extensions#dynamic-extension-points).

### Checkout::OrderStatus::CartLineDetails::RenderAfter

value: `RenderExtension<
    CartLineDetailsApi &
      OrderStatusApi &
      StandardApi<'Checkout::OrderStatus::CartLineDetails::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
  - CartLineDetailsApi: export interface CartLineDetailsApi {
  /**
   * The cart line the extension is attached to.
   */
  target: StatefulRemoteSubscribable<PresentmentCartLine>;
}
A static extension point that renders on every line item, inside the details
under the line item properties element on the Order Status Page.

### Checkout::OrderStatus::CartLines::RenderAfter

value: `RenderExtension<
    OrderStatusApi &
      StandardApi<'Checkout::OrderStatus::CartLines::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
A static extension point that is rendered after all line items on the Order Status page.

### Checkout::OrderStatus::CustomerInformation::RenderAfter

value: `RenderExtension<
    OrderStatusApi &
      StandardApi<'Checkout::OrderStatus::CustomerInformation::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Customer: export interface Customer {
  /**
   * Customer ID.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @example 'gid://shopify/Customer/123'
   */
  id: string;
  /**
   * The email of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  email?: string;
  /**
   * The phone number of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  phone?: string;
  /**
   * The full name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  fullName?: string;
  /**
   * The first name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  firstName?: string;
  /**
   * The last name of the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  lastName?: string;
  /**
   * The image associated with the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  image: ImageDetails;
  /**
   * Defines if the customer accepts marketing activities.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  acceptsMarketing: boolean;
  /**
   * The Store Credit Accounts owned by the customer and usable during the checkout process.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * @private
   */
  storeCreditAccounts: StoreCreditAccount[];
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - OrderStatusApi: export interface OrderStatusApi {
  /**
   * Order information that's available post-checkout.
   */
  order: StatefulRemoteSubscribable<Order | undefined>;
}
  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
A static extension point that is rendered after a purchase below the customer information on the Order Status page.

### Checkout::GiftCard::Render

value: `RenderExtension<
    RedeemableRenderApi &
      CheckoutApi &
      StandardApi<'Checkout::GiftCard::Render'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - RedeemableRenderApi: export interface RedeemableRenderApi {
  /**
   * Applies a redeemable change to add a redeemable payment method.
   */
  applyRedeemableChange(
    change: RedeemableChange,
  ): Promise<RedeemableChangeResult>;
}
A static extension point that renders the gift card entry form fields after
the buyer ticks a box to use a gift card. This does not replace the
native gift card entry form which is rendered in a separate part of checkout.

### Checkout::PaymentMethod::Render

value: `RenderExtension<
    PaymentMethodRenderApi &
      CheckoutApi &
      StandardApi<'Checkout::PaymentMethod::Render'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - PaymentMethodRenderApi: export interface PaymentMethodRenderApi {
  /**
   * Sets the attributes of the related payment method.
   */
  applyPaymentMethodAttributesChange(
    change: PaymentMethodAttributesChange,
  ): Promise<PaymentMethodAttributesResult>;
}
A static extension point that renders the form fields for a payment method when selected by the buyer.

### Checkout::PaymentMethod::RenderRequiredAction

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::PaymentMethod::RenderRequiredAction'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that renders a form modal when a buyer selects the custom onsite payment method.

### Checkout::Reductions::RenderBefore

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::Reductions::RenderBefore'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered in the order summary, before the discount form element.

### Checkout::Reductions::RenderAfter

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::Reductions::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered in the order summary, after the discount form
and discount tag elements.

### Checkout::ShippingMethods::RenderBefore

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::ShippingMethods::RenderBefore'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered between the shipping method
header and shipping method options.

### Checkout::ShippingMethods::RenderAfter

value: `RenderExtension<
    CheckoutApi & StandardApi<'Checkout::ShippingMethods::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
A static extension point that is rendered after the shipping method
options.

### Checkout::PickupLocations::RenderBefore

value: `RenderExtension<
    PickupLocationsApi &
      CheckoutApi &
      StandardApi<'Checkout::PickupLocations::RenderBefore'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - PickupLocationsApi: export interface PickupLocationsApi {
  /**
   * Whether the customer location input form is shown to the buyer.
   */
  isLocationFormVisible: StatefulRemoteSubscribable<boolean>;
}
A static extension point that is rendered before pickup location options.

### Checkout::PickupLocations::RenderAfter

value: `RenderExtension<
    PickupLocationsApi &
      CheckoutApi &
      StandardApi<'Checkout::PickupLocations::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - PickupLocationsApi: export interface PickupLocationsApi {
  /**
   * Whether the customer location input form is shown to the buyer.
   */
  isLocationFormVisible: StatefulRemoteSubscribable<boolean>;
}
A static extension point that is rendered after pickup location options.

### Checkout::ShippingMethodDetails::RenderAfter

value: `RenderExtension<
    ShippingMethodDetailsApi &
      CheckoutApi &
      StandardApi<'Checkout::ShippingMethodDetails::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - ShippingMethodDetailsApi: export interface ShippingMethodDetailsApi {
  /**
   * The shipping option the extension is attached to.
   */
  target: StatefulRemoteSubscribable<ShippingOption>;

  /**
   * Whether the shipping option the extension is attached to is currently selected in the UI.
   */
  targetSelected: StatefulRemoteSubscribable<boolean>;
}
A static extension point that is rendered after the shipping method
details within the shipping method option list, for each option.

### Checkout::ShippingMethodDetails::RenderExpanded

value: `RenderExtension<
    ShippingMethodDetailsApi &
      CheckoutApi &
      StandardApi<'Checkout::ShippingMethodDetails::RenderExpanded'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - ShippingMethodDetailsApi: export interface ShippingMethodDetailsApi {
  /**
   * The shipping option the extension is attached to.
   */
  target: StatefulRemoteSubscribable<ShippingOption>;

  /**
   * Whether the shipping option the extension is attached to is currently selected in the UI.
   */
  targetSelected: StatefulRemoteSubscribable<boolean>;
}
A static extension point that is rendered under the shipping method
within the shipping method option list, for each option.

### Checkout::PickupPoints::RenderBefore

value: `RenderExtension<
    PickupPointsApi &
      CheckoutApi &
      StandardApi<'Checkout::PickupPoints::RenderBefore'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - PickupPointsApi: export interface PickupPointsApi {
  /**
   * Whether the customer location input form is shown to the buyer.
   */
  isLocationFormVisible: StatefulRemoteSubscribable<boolean>;
}
A static extension point that is rendered immediately before the pickup points.

### Checkout::PickupPoints::RenderAfter

value: `RenderExtension<
    PickupPointsApi &
      CheckoutApi &
      StandardApi<'Checkout::PickupPoints::RenderAfter'>,
    AllComponents
  >`

  - StandardApi: export interface StandardApi<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * Methods for interacting with [Web Pixels](https://shopify.dev/docs/apps/marketing), such as emitting an event.
   */
  analytics: Analytics;

  /**
   * Gift Cards that have been applied to the checkout.
   */
  appliedGiftCards: StatefulRemoteSubscribable<AppliedGiftCard[]>;

  /**
   * The metafields requested in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration)
   * file. These metafields are updated when there's a change in the merchandise items
   * being purchased by the customer.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  appMetafields: StatefulRemoteSubscribable<AppMetafieldEntry[]>;

  /**
   * Custom attributes left by the customer to the merchant, either in their cart or during checkout.
   */
  attributes: StatefulRemoteSubscribable<Attribute[] | undefined>;

  /**
   * All available payment options.
   */
  availablePaymentOptions: StatefulRemoteSubscribable<PaymentOption[]>;

  /**
   * Information about the buyer that is interacting with the checkout.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  buyerIdentity?: BuyerIdentity;

  /**
   * Provides details on the buyer's progression through the checkout.
   *
   * See [buyer journey](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-buyer-journey)
   * examples for more information.
   */
  buyerJourney: BuyerJourney;

  /**
   * Details on the costs the buyer will pay for this checkout.
   */
  cost: CartCost;

  /**
   * A list of delivery groups containing information about the delivery of the items the customer intends to purchase.
   */
  deliveryGroups: StatefulRemoteSubscribable<DeliveryGroup[]>;

  /**
   * A list of discount codes currently applied to the checkout.
   */
  discountCodes: StatefulRemoteSubscribable<CartDiscountCode[]>;

  /**
   * Discounts that have been applied to the entire cart.
   */
  discountAllocations: StatefulRemoteSubscribable<CartDiscountAllocation[]>;

  /**
   * Meta information about the extension.
   */
  extension: Extension<Target>;

  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  extensionPoint: ExtensionPoint;

  /**
   * Utilities for translating content and formatting values according to the current
   * [`localization`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-localization)
   * of the checkout.
   *
   * See [localization examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-localization)
   * for more information.
   */
  i18n: I18n;

  /**
   * A list of lines containing information about the items the customer intends to purchase.
   */
  lines: StatefulRemoteSubscribable<CartLine[]>;

  /**
   * Details about the location, language, and currency of the buyer. For utilities to easily
   * format and translate content based on these details, you can use the
   * [`i18n`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-i18n)
   * object instead.
   */
  localization: Localization;

  /**
   * The metafields that apply to the current checkout.
   *
   * Metafields are stored locally on the client and are applied to the order object after the checkout completes.
   *
   * These metafields are shared by all extensions running on checkout, and
   * persist for as long as the customer is working on this checkout.
   *
   * Once the order is created, you can query these metafields using the
   * [GraphQL Admin API](https://shopify.dev/docs/admin-api/graphql/reference/orders/order#metafield-2021-01)
   */
  metafields: StatefulRemoteSubscribable<Metafield[]>;

  /**
   * A note left by the customer to the merchant, either in their cart or during checkout.
   */
  note: StatefulRemoteSubscribable<string | undefined>;

  /**
   * A list of the line items displayed in the checkout. These may be the same as lines, or may be a subset.
   */
  presentmentLines: StatefulRemoteSubscribable<PresentmentCartLine[]>;

  /**
   * Used to query the Storefront GraphQL API with a prefetched token.
   *
   * See [storefront api access examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-storefront-api-access) for more information.
   */
  query: <Data = unknown, Variables = {[key: string]: unknown}>(
    query: string,
    options?: {variables?: Variables; version?: StorefrontApiVersion},
  ) => Promise<{data?: Data; errors?: GraphQLError[]}>;

  /**
   * Payment options selected by the buyer.
   */
  selectedPaymentOptions: StatefulRemoteSubscribable<SelectedPaymentOption[]>;

  /**
   * Provides access to session tokens, which can be used to verify token claims on your app's server.
   *
   * See [session token examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-session-token) for more information.
   */
  sessionToken: SessionToken;

  /**
   * The settings matching the settings definition written in the
   * [`shopify.ui.extension.toml`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   *  See [settings examples](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#example-settings) for more information.
   *
   * > Note: When an extension is being installed in the editor, the settings will be empty until
   * a merchant sets a value. In that case, this object will be updated in real time as a merchant fills in the settings.
   */
  settings: StatefulRemoteSubscribable<ExtensionSettings>;

  /**
   * The proposed buyer shipping address. During the information step, the address
   * updates when the field is committed (on change) rather than every keystroke.
   * An address value is only present if delivery is required. Otherwise, the
   * subscribable value is undefined.
   *
   * {% include /apps/checkout/privacy-icon.md %} Requires access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).
   */
  shippingAddress?: StatefulRemoteSubscribable<MailingAddress | undefined>;

  /** Shop where the checkout is taking place. */
  shop: Shop;

  /**
   * Key-value storage for the extension point.
   */
  storage: Storage;

  /**
   * Methods to interact with the extension's UI.
   */
  ui: Ui;

  /**
   * The renderer version being used for the extension.
   *
   * @example 'unstable'
   */
  version: Version;
}
  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
  - CheckoutApi: export interface CheckoutApi {
  /**
   * Performs an update on an attribute attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyAttributeChange(change: AttributeChange): Promise<AttributeChangeResult>;

  /**
   * Performs an update on the merchandise line items. It resolves when the new
   * line items have been negotiated and results in an update to the value
   * retrieved through the
   * [`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
   * property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyCartLinesChange(change: CartLineChange): Promise<CartLineChangeResult>;

  /**
   * Performs an update on the discount codes.
   * It resolves when the new discount codes have been negotiated and results in an update
   * to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyDiscountCodeChange(
    change: DiscountCodeChange,
  ): Promise<DiscountCodeChangeResult>;

  /**
   * Performs an update on the gift cards.
   * It resolves when gift card change have been negotiated and results in an update
   * to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.
   *
   * > Caution:
   * > See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyGiftCardChange(change: GiftCardChange): Promise<GiftCardChangeResult>;

  /**
   * Performs an update on a piece of metadata attached to the cart or checkout:
   * - If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
   * - If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.
   *
   * > Tip:
   * > Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.
   */
  applyMetafieldChange(change: MetafieldChange): Promise<MetafieldChangeResult>;

  /**
   * Performs an update on the note attached to the cart and checkout. If
   * successful, this mutation results in an update to the value retrieved
   * through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.
   *
   * > Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.
   */
  applyNoteChange(change: NoteChange): Promise<NoteChangeResult>;
}
  - AllComponents: Components[keyof Components]
  - Components: typeof import('./components')
  - PickupPointsApi: export interface PickupPointsApi {
  /**
   * Whether the customer location input form is shown to the buyer.
   */
  isLocationFormVisible: StatefulRemoteSubscribable<boolean>;
}
A static extension point that is rendered immediately after the pickup points.

### CheckoutApi

### applyAttributeChange

value: `(change: AttributeUpdateChange) => Promise<AttributeChangeResult>`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
  - AttributeUpdateChange: export interface AttributeUpdateChange {
  /**
   * The type of the `AttributeUpdateChange` API.
   */
  type: 'updateAttribute';

  /**
   * Key of the attribute to add or update
   */
  key: string;

  /**
   * Value for the attribute to add or update
   */
  value: string;
}
  - AttributeChangeResult: AttributeChangeResultSuccess | AttributeChangeResultError
Performs an update on an attribute attached to the cart and checkout. If
successful, this mutation results in an update to the value retrieved
through the [`attributes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-applyattributechange) property.

> Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.

### applyCartLinesChange

value: `(change: CartLineChange) => Promise<CartLineChangeResult>`

  - CartLineChange: CartLineAddChange | CartLineRemoveChange | CartLineUpdateChange
  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - CartLineChangeResult: CartLineChangeResultSuccess | CartLineChangeResultError
Performs an update on the merchandise line items. It resolves when the new
line items have been negotiated and results in an update to the value
retrieved through the
[`lines`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-lines)
property.

> Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.

### applyDiscountCodeChange

value: `(change: DiscountCodeChange) => Promise<DiscountCodeChangeResult>`

  - DiscountCodeChange: DiscountCodeAddChange | DiscountCodeRemoveChange
  - DiscountCodeChangeResult: DiscountCodeChangeResultSuccess | DiscountCodeChangeResultError
Performs an update on the discount codes.
It resolves when the new discount codes have been negotiated and results in an update
to the value retrieved through the [`discountCodes`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-discountcodes) property.

> Caution:
> See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves discount codes through a network call.

> Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.

### applyGiftCardChange

value: `(change: GiftCardChange) => Promise<GiftCardChangeResult>`

  - GiftCardChange: GiftCardAddChange | GiftCardRemoveChange
  - GiftCardChangeResult: GiftCardChangeResultSuccess | GiftCardChangeResultError
Performs an update on the gift cards.
It resolves when gift card change have been negotiated and results in an update
to the value retrieved through the [`appliedGiftCards`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-appliedgiftcards) property.

> Caution:
> See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) if your extension retrieves gift card codes through a network call.

> Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.

### applyMetafieldChange

value: `(change: MetafieldChange) => Promise<MetafieldChangeResult>`

  - MetafieldChange: MetafieldRemoveChange | MetafieldUpdateChange | MetafieldRemoveCartChange | MetafieldUpdateCartChange
  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
  - MetafieldChangeResult: MetafieldChangeResultSuccess | MetafieldChangeResultError
Performs an update on a piece of metadata attached to the cart or checkout:
- If `type` is `updateMetafield` or `removeMetafield`, this mutation results in an update to the value retrieved through the [`metafields`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-metafields) property. Metafields written by `updateMetafield` are carried over to the order.
- If `type` is `updateCartMetafield` or `removeCartMetafield`, this mutation updates the metafield attached to the cart and results in an update to the value retrieved through the [`appMetafields`](https://shopify.dev/docs/api/checkout-ui-extensions/2023-04/apis/standardapi#properties-propertydetail-appmetafields) property. Metafields written by `updateCartMetafields` are updated on the cart object only and are **not** carried over to the order.

> Tip:
> Cart metafields are only available on carts created via the Storefront API version `2023-04` or later.

### applyNoteChange

value: `(change: NoteChange) => Promise<NoteChangeResult>`

  - NoteChange: NoteRemoveChange | NoteUpdateChange
  - NoteChangeResult: NoteChangeResultSuccess | NoteChangeResultError
Performs an update on the note attached to the cart and checkout. If
successful, this mutation results in an update to the value retrieved
through the [`note`](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-note) property.

> Note: This method will return an error if the buyer is using an accelerated checkout method, such as Apple Pay, Google Pay, or Meta Pay.

### AttributeUpdateChange

Updates an attribute on the order. If an attribute with the
provided key does not already exist, it gets created.

### type

value: `"updateAttribute"`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
The type of the `AttributeUpdateChange` API.

### key

value: `string`

Key of the attribute to add or update

### value

value: `string`

Value for the attribute to add or update

### AttributeChangeResultSuccess

The returned result of a successful update to an attribute.

### type

value: `"success"`

The type of the `AttributeChangeResultSuccess` API.

### AttributeChangeResultError

The returned result of an unsuccessful update to an attribute
with a message detailing the type of error that occurred.

### type

value: `"error"`

The type of the `AttributeChangeResultError` API.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### CartLineAddChange

### type

value: `"addCartLine"`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
An identifier for changes that add line items.

### merchandiseId

value: `string`

The merchandise ID being added.

### quantity

value: `number`

The quantity of the merchandise being added.

### attributes

value: `Attribute[]`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
The attributes associated with the line item.

### sellingPlanId

value: `string`

The identifier of the selling plan that the merchandise is being purchased
with.

### CartLine

### id

value: `string`

These line item IDs are not stable at the moment, they might change after
any operations on the line items. You should always look up for an updated
ID before any call to `applyCartLinesChange` because you'll need the ID to
create a `CartLineChange` object.

### merchandise

value: `Merchandise`

  - Merchandise: ProductVariant
The merchandise being purchased.

### quantity

value: `number`

The quantity of the merchandise being purchased.

### cost

value: `CartLineCost`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - CartLineCost: export interface CartLineCost {
  /**
   * The total amount after reductions the buyer can expect to pay that is directly attributable to a single
   * cart line.
   */
  totalAmount: Money;
}
The details about the cost components attributed to the cart line.

### attributes

value: `Attribute[]`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
The line item additional custom attributes.

### discountAllocations

value: `CartDiscountAllocation[]`

  - CartDiscountAllocation: CartCodeDiscountAllocation | CartAutomaticDiscountAllocation | CartCustomDiscountAllocation
Discounts applied to the cart line.

### lineComponents

value: `CartBundleLineComponent[]`

  - CartBundleLineComponent: export interface CartBundleLineComponent {
  type: 'bundle';

  /**
   * A unique identifier for the bundle line component.
   *
   * This ID is not stable. If an operation updates the line items in any way, all IDs could change.
   *
   * @example 'gid://shopify/CartLineComponent/123'
   */
  id: string;

  /**
   * The merchandise of this bundle line component.
   */
  merchandise: Merchandise;

  /**
   * The quantity of merchandise being purchased.
   */
  quantity: number;

  /**
   * The cost attributed to this bundle line component.
   */
  cost: CartLineCost;

  /**
   * Additional custom attributes for the bundle line component.
   *
   * @example [{key: 'engraving', value: 'hello world'}]
   */
  attributes: Attribute[];
}
Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.

### Merchandise

### type

value: `"variant"`


### id

value: `string`

A globally-unique identifier.

### title

value: `string`

The product variant’s title.

### subtitle

value: `string`

The product variant's subtitle.

### image

value: `ImageDetails`

  - ImageDetails: export interface ImageDetails {
  /**
   * The image URL.
   */
  url: string;

  /**
   * The alternative text for the image.
   */
  altText?: string;
}
Image associated with the product variant. This field falls back to the product
image if no image is available.

### selectedOptions

value: `SelectedOption[]`

  - SelectedOption: export interface SelectedOption {
  /**
   * The name of the merchandise option.
   */
  name: string;

  /**
   * The value of the merchandise option.
   */
  value: string;
}
List of product options applied to the variant.

### product

value: `Product`

  - Product: export interface Product {
  /**
   * A globally-unique identifier.
   */
  id: string;

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

  /**
   * A categorization that a product can be tagged with, commonly used for filtering and searching.
   */
  productType: string;
}
The product object that the product variant belongs to.

### requiresShipping

value: `boolean`

Whether or not the product requires shipping.

### sellingPlan

value: `SellingPlan`

  - SellingPlan: export interface SellingPlan {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/SellingPlan/1'
   */
  id: string;
}
The selling plan associated with the merchandise.

### SelectedOption

### name

value: `string`

The name of the merchandise option.

### value

value: `string`

The value of the merchandise option.

### Product

### id

value: `string`

A globally-unique identifier.

### vendor

value: `string`

The product’s vendor name.

### productType

value: `string`

A categorization that a product can be tagged with, commonly used for filtering and searching.

### SellingPlan

### id

value: `string`

A globally-unique identifier.

### CartLineCost

### totalAmount

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The total amount after reductions the buyer can expect to pay that is directly attributable to a single
cart line.

### CartBundleLineComponent

### type

value: `"bundle"`


### id

value: `string`

A unique identifier for the bundle line component.

This ID is not stable. If an operation updates the line items in any way, all IDs could change.

### merchandise

value: `Merchandise`

  - Merchandise: ProductVariant
The merchandise of this bundle line component.

### quantity

value: `number`

The quantity of merchandise being purchased.

### cost

value: `CartLineCost`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - CartLineCost: export interface CartLineCost {
  /**
   * The total amount after reductions the buyer can expect to pay that is directly attributable to a single
   * cart line.
   */
  totalAmount: Money;
}
The cost attributed to this bundle line component.

### attributes

value: `Attribute[]`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
Additional custom attributes for the bundle line component.

### CartLineRemoveChange

### type

value: `"removeCartLine"`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
An identifier for changes that remove line items.

### id

value: `string`

Line Item ID.

### quantity

value: `number`

The quantity being removed for this line item.

### CartLineUpdateChange

### type

value: `"updateCartLine"`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
An identifier for changes that update line items.

### id

value: `string`

Line Item ID.

### merchandiseId

value: `string`

The new merchandise ID for the line item.

### quantity

value: `number`

The new quantity for the line item.

### attributes

value: `Attribute[]`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
The new attributes for the line item.

### sellingPlanId

value: `string`

The identifier of the selling plan that the merchandise is being purchased
with or `null` to remove the the product from the selling plan.

### CartLineChangeResultSuccess

### type

value: `"success"`

Indicates that the line item was changed successfully.

### CartLineChangeResultError

### type

value: `"error"`

Indicates that the line item was not changed successfully. Refer to the `message` property for details about the error.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### DiscountCodeAddChange

### type

value: `"addDiscountCode"`

The type of the `DiscountCodeChange` API.

### code

value: `string`

The code for the discount

### DiscountCodeRemoveChange

### type

value: `"removeDiscountCode"`

The type of the `DiscountCodeChange` API.

### code

value: `string`

The code for the discount

### DiscountCodeChangeResultSuccess

### type

value: `"success"`

Indicates that the discount code change was applied successfully.

### DiscountCodeChangeResultError

### type

value: `"error"`

Indicates that the discount code change failed.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### GiftCardAddChange

### type

value: `"addGiftCard"`

The type of the `GiftCardChange` API.

### code

value: `string`

Gift card code.

### GiftCardRemoveChange

### type

value: `"removeGiftCard"`

The type of the `GiftCardChange` API.

### code

value: `string`

Gift card code.

### GiftCardChangeResultSuccess

### type

value: `"success"`

Indicates that the gift card change was applied successfully.

### GiftCardChangeResultError

### type

value: `"error"`

Indicates that the gift card change failed.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### MetafieldRemoveChange

Removes a metafield.

### type

value: `"removeMetafield"`

  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The type of the `MetafieldRemoveChange` API.

### key

value: `string`

The name of the metafield to remove.

### namespace

value: `string`

The namespace of the metafield to remove.

### Metafield

Metadata associated with the checkout.

### key

value: `string`

The name of the metafield. It must be between 3 and 30 characters in
length (inclusive).

### namespace

value: `string`

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. This must be between 2 and 20 characters in length (inclusive).

### value

value: `string | number`

The information to be stored as metadata.

### valueType

value: `"string" | "integer" | "json_string"`

The metafield’s information type.

### MetafieldUpdateChange

Updates a metafield. If a metafield with the
provided key and namespace does not already exist, it gets created.

### type

value: `"updateMetafield"`

  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The type of the `MetafieldUpdateChange` API.

### key

value: `string`

The name of the metafield to update.

### namespace

value: `string`

The namespace of the metafield to add.

### value

value: `string | number`

The new information to store in the metafield.

### valueType

value: `"string" | "integer" | "json_string"`

The metafield’s information type.

### MetafieldRemoveCartChange

Removes a cart metafield.

### type

value: `"removeCartMetafield"`

  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The type of the `MetafieldRemoveCartChange` API.

### key

value: `string`

The name of the metafield to remove.

### namespace

value: `string`

The namespace of the metafield to remove.

### MetafieldUpdateCartChange

Updates a cart metafield. If a metafield with the
provided key and namespace does not already exist, it gets created.

### type

value: `"updateCartMetafield"`

  - Metafield: export interface Metafield {
  /**
   * The name of the metafield. It must be between 3 and 30 characters in
   * length (inclusive).
   */
  key: string;

  /**
   * 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. This must be between 2 and 20 characters in length (inclusive).
   */
  namespace: string;

  /**
   * The information to be stored as metadata.
   */
  value: string | number;

  /** The metafield’s information type. */
  valueType: 'integer' | 'string' | 'json_string';
}
The type of the `MetafieldUpdateCartChange` API.

### metafield

value: `{ key: string; namespace: string; value: string; type: string; }`


### MetafieldChangeResultSuccess

### type

value: `"success"`

The type of the `MetafieldChangeResultSuccess` API.

### MetafieldChangeResultError

### type

value: `"error"`

The type of the `MetafieldChangeResultError` API.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### NoteRemoveChange

Removes a note

### type

value: `"removeNote"`

The type of the `NoteRemoveChange` API.

### NoteUpdateChange

An Update to a note on the order.
for example, the buyer could request detailed packaging instructions in an order note

### type

value: `"updateNote"`

The type of the `NoteUpdateChange` API.

### note

value: `string`

The new value of the note.

### NoteChangeResultSuccess

### type

value: `"success"`

The type of the `NoteChangeResultSuccess` API.

### NoteChangeResultError

### type

value: `"error"`

The type of the `NoteChangeResultError` API.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### OrderStatusApi

### order

value: `StatefulRemoteSubscribable<Order | undefined>`

  - Order: export interface Order {
  /**
   * A globally-unique identifier.
   * @example 'gid://shopify/Order/1'
   */
  id: string;
  /**
   * Unique identifier for the order that appears on the order.
   * @example '#1000'
   */
  name: string;
  /**
   * If cancelled, the time at which the order was cancelled.
   */
  cancelledAt?: string;
}
Order information that's available post-checkout.

### Order

Information about an order that was placed.

### id

value: `string`

A globally-unique identifier.

### name

value: `string`

Unique identifier for the order that appears on the order.

### cancelledAt

value: `string`

If cancelled, the time at which the order was cancelled.

### CartLineDetailsApi

### target

value: `StatefulRemoteSubscribable<PresentmentCartLine>`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - PresentmentCartLine: export interface PresentmentCartLine {
  /**
   * The ID of the present cart line. This ID isn't stable and might change after
   * any operations on the line items.
   * @example 'gid://shopify/PresentmentCartLine/123'
   */
  id: string;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the presentment cart line.
   */
  cost: PresentmentCartLineCost;

  /**
   * The title of the line item.
   */
  title: string;

  /**
   * The subtitle of the line item.
   */
  subtitle?: string;

  /**
   * The image associated with the line item.
   */
  image?: ImageDetails;

  /**
   * The merchandise lines being purchased.
   */
  lines: CartLine[];
}
The cart line the extension is attached to.

### PresentmentCartLine

### id

value: `string`

The ID of the present cart line. This ID isn't stable and might change after
any operations on the line items.

### quantity

value: `number`

The quantity of the merchandise being purchased.

### cost

value: `PresentmentCartLineCost`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
  - CartLineCost: export interface CartLineCost {
  /**
   * The total amount after reductions the buyer can expect to pay that is directly attributable to a single
   * cart line.
   */
  totalAmount: Money;
}
  - PresentmentCartLine: export interface PresentmentCartLine {
  /**
   * The ID of the present cart line. This ID isn't stable and might change after
   * any operations on the line items.
   * @example 'gid://shopify/PresentmentCartLine/123'
   */
  id: string;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the presentment cart line.
   */
  cost: PresentmentCartLineCost;

  /**
   * The title of the line item.
   */
  title: string;

  /**
   * The subtitle of the line item.
   */
  subtitle?: string;

  /**
   * The image associated with the line item.
   */
  image?: ImageDetails;

  /**
   * The merchandise lines being purchased.
   */
  lines: CartLine[];
}
  - PresentmentCartLineCost: export interface PresentmentCartLineCost {
  /**
   * The total cost of the merchandise line.
   */
  totalAmount: Money;
}
The details about the cost components attributed to the presentment cart line.

### title

value: `string`

The title of the line item.

### subtitle

value: `string`

The subtitle of the line item.

### image

value: `ImageDetails`

  - ImageDetails: export interface ImageDetails {
  /**
   * The image URL.
   */
  url: string;

  /**
   * The alternative text for the image.
   */
  altText?: string;
}
The image associated with the line item.

### lines

value: `CartLine[]`

  - CartLine: export interface CartLine {
  /**
   * These line item IDs are not stable at the moment, they might change after
   * any operations on the line items. You should always look up for an updated
   * ID before any call to `applyCartLinesChange` because you'll need the ID to
   * create a `CartLineChange` object.
   * @example 'gid://shopify/CartLine/123'
   */
  id: string;

  /**
   * The merchandise being purchased.
   */
  merchandise: Merchandise;

  /**
   * The quantity of the merchandise being purchased.
   */
  quantity: number;

  /**
   * The details about the cost components attributed to the cart line.
   */
  cost: CartLineCost;

  /**
   * The line item additional custom attributes.
   */
  attributes: Attribute[];

  /**
   * Discounts applied to the cart line.
   */
  discountAllocations: CartDiscountAllocation[];

  /**
   * Sub lines of the merchandise line. If no sub lines are present, this will be an empty array.
   */
  lineComponents: CartLineComponentType[];
}
The merchandise lines being purchased.

### PresentmentCartLineCost

### totalAmount

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The total cost of the merchandise line.

### RedeemableRenderApi

### applyRedeemableChange

value: `(change: RedeemableAddChange) => Promise<RedeemableChangeResult>`

  - RedeemableAddChange: export interface RedeemableAddChange {
  /**
   * The type of the `RedeemableChange` API.
   */
  type: 'redeemableAddChange';

  /**
   * The redeemable attributes
   */
  attributes: RedeemableAttribute[];
}
  - RedeemableChangeResult: RedeemableChangeResultSuccess | RedeemableChangeResultError
Applies a redeemable change to add a redeemable payment method.

### RedeemableAddChange

### type

value: `"redeemableAddChange"`

The type of the `RedeemableChange` API.

### attributes

value: `RedeemableAttribute[]`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
  - RedeemableAttribute: export interface RedeemableAttribute {
  key: string;
  value: string;
}
The redeemable attributes

### RedeemableAttribute

A key-value pair that represents an attribute of a redeemable payment method.

### key

value: `string`


### value

value: `string`


### RedeemableChangeResultSuccess

### type

value: `"success"`

Indicates that the redeemable change was applied successfully.

### RedeemableChangeResultError

### type

value: `"error"`

Indicates that the redeemable change was not applied successfully.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### PaymentMethodRenderApi

### applyPaymentMethodAttributesChange

value: `(change: PaymentMethodAttributesUpdateChange) => Promise<PaymentMethodAttributesResult>`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
  - PaymentMethodAttributesUpdateChange: export interface PaymentMethodAttributesUpdateChange {
  /**
   * The type of the `PaymentMethodAttributesChange` API.
   */
  type: 'updatePaymentMethodAttributes';

  /**
   * The payment method attributes
   */
  attributes: PaymentMethodAttribute[];
}
  - PaymentMethodAttribute: export interface PaymentMethodAttribute {
  key: string;
  value: string | number | boolean;
}
  - PaymentMethodAttributesResult: PaymentMethodAttributesResultSuccess | PaymentMethodAttributesResultError
Sets the attributes of the related payment method.

### PaymentMethodAttributesUpdateChange

### type

value: `"updatePaymentMethodAttributes"`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
  - PaymentMethodAttribute: export interface PaymentMethodAttribute {
  key: string;
  value: string | number | boolean;
}
The type of the `PaymentMethodAttributesChange` API.

### attributes

value: `PaymentMethodAttribute[]`

  - Attribute: export interface Attribute {
  /**
   * The key for the attribute.
   */
  key: string;

  /**
   * The value for the attribute.
   */
  value: string;
}
  - PaymentMethodAttribute: export interface PaymentMethodAttribute {
  key: string;
  value: string | number | boolean;
}
The payment method attributes

### PaymentMethodAttribute

A key-value pair that represents an attribute of a payment method.

### key

value: `string`


### value

value: `string | number | boolean`


### PaymentMethodAttributesResultSuccess

### type

value: `"success"`

Indicates that the payment method attributes were set successfully.

### PaymentMethodAttributesResultError

### type

value: `"error"`

Indicates that the payment method attributes were not set successfully.

### message

value: `string`

A message that explains the error. This message is useful for debugging.
It is **not** localized, and therefore should not be presented directly
to the buyer.

### PickupLocationsApi

### isLocationFormVisible

value: `StatefulRemoteSubscribable<boolean>`

Whether the customer location input form is shown to the buyer.

### ShippingMethodDetailsApi

### target

value: `StatefulRemoteSubscribable<ShippingOption>`

  - ShippingOption: export interface ShippingOption extends DeliveryOption {
  /**
   * The type of this delivery option.
   */
  type: 'shipping' | 'local';

  /**
   * Information about the carrier.
   */
  carrier: ShippingOptionCarrier;

  /**
   * The cost of the delivery.
   */
  cost: Money;

  /**
   * The cost of the delivery including discounts.
   */
  costAfterDiscounts: Money;

  /**
   * Information about the estimated delivery time.
   */
  deliveryEstimate: DeliveryEstimate;
}
The shipping option the extension is attached to.

### targetSelected

value: `StatefulRemoteSubscribable<boolean>`

Whether the shipping option the extension is attached to is currently selected in the UI.

### ShippingOption

Represents a delivery option that is a shipping option.

### type

value: `"shipping" | "local"`

The type of this delivery option.

### carrier

value: `ShippingOptionCarrier`

  - ShippingOption: export interface ShippingOption extends DeliveryOption {
  /**
   * The type of this delivery option.
   */
  type: 'shipping' | 'local';

  /**
   * Information about the carrier.
   */
  carrier: ShippingOptionCarrier;

  /**
   * The cost of the delivery.
   */
  cost: Money;

  /**
   * The cost of the delivery including discounts.
   */
  costAfterDiscounts: Money;

  /**
   * Information about the estimated delivery time.
   */
  deliveryEstimate: DeliveryEstimate;
}
  - ShippingOptionCarrier: export interface ShippingOptionCarrier {
  /**
   * The name of the carrier.
   */
  name?: string;
}
Information about the carrier.

### cost

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The cost of the delivery.

### costAfterDiscounts

value: `Money`

  - Money: export interface Money {
  /**
   * The price amount.
   */
  amount: number;
  /**
   * The ISO 4217 format for the currency.
   * @example 'CAD' for Canadian dollar
   */
  currencyCode: CurrencyCode;
}
The cost of the delivery including discounts.

### deliveryEstimate

value: `DeliveryEstimate`

  - DeliveryEstimate: export interface DeliveryEstimate {
  /**
   * The estimated time in transit for the delivery in seconds.
   */
  timeInTransit?: NumberRange;
}
Information about the estimated delivery time.

### handle

value: `string`

The unique identifier of the delivery option.

### title

value: `string`

The title of the delivery option.

### description

value: `string`

The description of the delivery option.

### ShippingOptionCarrier

### name

value: `string`

The name of the carrier.

### DeliveryEstimate

### timeInTransit

value: `NumberRange`

  - NumberRange: export interface NumberRange {
  /**
   * The lower bound of the number range.
   */
  lower?: number;

  /**
   * The upper bound of the number range.
   */
  upper?: number;
}
The estimated time in transit for the delivery in seconds.

### NumberRange

### lower

value: `number`

The lower bound of the number range.

### upper

value: `number`

The upper bound of the number range.

### PickupPointsApi

### isLocationFormVisible

value: `StatefulRemoteSubscribable<boolean>`

Whether the customer location input form is shown to the buyer.

### I18n

### formatNumber

value: `(number: number | bigint, options?: { inExtensionLocale?: boolean; } & NumberFormatOptions) => string`

  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
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.

### formatCurrency

value: `(number: number | bigint, options?: { inExtensionLocale?: boolean; } & NumberFormatOptions) => string`

  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
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.

### formatDate

value: `(date: Date, options?: { inExtensionLocale?: boolean; } & DateTimeFormatOptions) => string`

  - Extension: export interface Extension<Target extends ExtensionPoint = ExtensionPoint> {
  /**
   * The identifier that specifies where in Shopify’s UI your code is being
   * injected. This will be one of the targets you have included in your
   * extension’s configuration file.
   *
   * @example 'Checkout::Dynamic::Render'
   * @see /docs/api/checkout-ui-extensions/2023-04/extension-targets-overview
   * @see /docs/apps/app-extensions/configuration#targets
   */
  target: Target;

  /**
   * The published version of the running extension point.
   *
   * For unpublished extensions, the value is `undefined`.
   *
   * @example 3.0.10
   */
  version?: string;

  /**
   * The API version that was set in the extension config file.
   *
   * @example '2023-04'
   */
  apiVersion: ApiVersion;

  /**
   * The URL to the script that started the extension point.
   */
  scriptUrl: string;

  /**
   * 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 will appear on a later step of the
   * checkout.
   *
   * Your extension might also continue to run after the buyer has navigated away
   * from where it was rendered. The extension continues running so that
   * your extension is immediately available to render if the buyer navigates back.
   */
  rendered: StatefulRemoteSubscribable<boolean>;

  /**
   * The allowed capabilities of the extension, defined
   * in your [shopify.ui.extension.toml](https://shopify.dev/docs/api/checkout-ui-extensions/configuration) file.
   *
   * * [`api_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access): the extension can access the Storefront API.
   *
   * * [`network_access`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access): the extension can make external network calls.
   *
   * * [`block_progress`](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#block-progress): the extension can block a buyer's progress and the merchant has allowed this blocking behavior.
   */
  capabilities: StatefulRemoteSubscribable<Capability[]>;

  /**
   * Information about the editor where the extension is being rendered.
   *
   * The value is undefined if the extension is not rendering in an editor.
   */
  editor?: Editor;
}
Returns a localized date value.

This function behaves like the standard `Intl.DateTimeFormatOptions()` and uses
the buyer's locale by default. Formatting options can be passed in as
options.

### translate

value: `I18nTranslate`

  - I18n: export interface I18n {
  /**
   * 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.
   *
   * @param options.inExtensionLocale - if true, use the extension's locale
   */
  formatNumber: (
    number: number | bigint,
    options?: {inExtensionLocale?: boolean} & Intl.NumberFormatOptions,
  ) => string;

  /**
   * 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.
   *
   * @param options.inExtensionLocale - if true, use the extension's locale
   */
  formatCurrency: (
    number: number | bigint,
    options?: {inExtensionLocale?: boolean} & Intl.NumberFormatOptions,
  ) => string;

  /**
   * Returns a localized date value.
   *
   * This function behaves like the standard `Intl.DateTimeFormatOptions()` and uses
   * the buyer's locale by default. Formatting options can be passed in as
   * options.
   *
   * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat0
   * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat#using_options
   *
   * @param options.inExtensionLocale - if true, use the extension's locale
   */
  formatDate: (
    date: Date,
    options?: {inExtensionLocale?: boolean} & Intl.DateTimeFormatOptions,
  ) => string;

  /**
   * 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.
   */
  translate: I18nTranslate;
}
  - I18nTranslate: export interface I18nTranslate {
  <ReplacementType = string>(
    key: string,
    options?: {[placeholderKey: string]: ReplacementType | string | number},
  ): ReplacementType extends string | number
    ? string
    : (string | ReplacementType)[];
}
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.

### Localization

### currency

value: `StatefulRemoteSubscribable<Currency>`

  - Currency: export interface Currency {
  /**
   * The ISO-4217 code for this currency.
   * @see https://www.iso.org/iso-4217-currency-codes.html
   */
  isoCode: CurrencyCode;
}
The currency that the buyer sees for money amounts in the checkout.

### timezone

value: `StatefulRemoteSubscribable<Timezone>`

  - Timezone: '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'
The buyer’s time zone.

### language

value: `StatefulRemoteSubscribable<Language>`

  - Language: export interface Language {
  /**
   * The BCP-47 language tag. It may contain a dash followed by an ISO 3166-1 alpha-2 region code.
   *
   * @example 'en' for English, or 'en-US' for English local to United States.
   * @see https://en.wikipedia.org/wiki/IETF_language_tag
   * @see https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2
   */
  isoCode: string;
}
The language the buyer sees in the checkout.

### extensionLanguage

value: `StatefulRemoteSubscribable<Language>`

  - Language: export interface Language {
  /**
   * The BCP-47 language tag. It may contain a dash followed by an ISO 3166-1 alpha-2 region code.
   *
   * @example 'en' for English, or 'en-US' for English local to United States.
   * @see https://en.wikipedia.org/wiki/IETF_language_tag
   * @see https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2
   */
  isoCode: string;
}
This is the buyer's language, as supported by the extension.
If the buyer's actual language is not supported by the extension,
this is the fallback locale used for translations.

For example, if the buyer's language is 'fr-CA' but your extension
only supports translations for 'fr', then the `isoCode` for this
language is 'fr'. If your extension does not provide french
translations at all, this value is the default locale for your
extension (that is, the one matching your .default.json file).

### country

value: `StatefulRemoteSubscribable<Country | undefined>`

  - Country: export interface Country {
  /**
   * The ISO-3166-1 code for this country.
   * @see https://www.iso.org/iso-3166-country-codes.html
   */
  isoCode: CountryCode;
}
The country context of the checkout. This value carries over from the
context of the cart, where it was used to contextualize the storefront
experience. It will update if the buyer changes the country of their
shipping address. The value is undefined if unknown.

### market

value: `StatefulRemoteSubscribable<Market | undefined>`

  - Market: export interface Market {
  /**
   * A globally-unique identifier for a market.
   */
  id: string;

  /**
   * The human-readable, shop-scoped identifier for the market.
   */
  handle: string;
}
The [market](https://shopify.dev/docs/apps/markets) context of the
checkout. This value carries over from the context of the cart, where it
was used to contextualize the storefront experience. It will update if the
buyer changes the country of their shipping address. The value is undefined
if unknown.

### Currency

### isoCode

value: `CurrencyCode`

  - CurrencyCode: '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'
  - Currency: export interface Currency {
  /**
   * The ISO-4217 code for this currency.
   * @see https://www.iso.org/iso-4217-currency-codes.html
   */
  isoCode: CurrencyCode;
}
The ISO-4217 code for this currency.

### Language

### isoCode

value: `string`

The BCP-47 language tag. It may contain a dash followed by an ISO 3166-1 alpha-2 region code.

### Country

### isoCode

value: `CountryCode`

  - Country: export interface Country {
  /**
   * The ISO-3166-1 code for this country.
   * @see https://www.iso.org/iso-3166-country-codes.html
   */
  isoCode: CountryCode;
}
  - CountryCode: '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'
The ISO-3166-1 code for this country.

### Market

### id

value: `string`

A globally-unique identifier for a market.

### handle

value: `string`

The human-readable, shop-scoped identifier for the market.

### SelectedPaymentOption

A payment option selected by the buyer.

### handle

value: `string`

The unique handle referencing `PaymentOption.handle`.

See [availablePaymentOptions](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi#properties-propertydetail-availablepaymentoptions).

### SessionToken

### get

value: `() => Promise<string>`

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 will return cached tokens when possible, so you don’t need to worry
about storing these tokens yourself.

### ExtensionSettings

The merchant-defined setting values for the extension.

### [key: string]

value: `string | number | boolean | undefined`


### MailingAddress

### name

value: `string`

The buyer's full name.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### firstName

value: `string`

The buyer's first name.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### lastName

value: `string`

The buyer's last name.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### company

value: `string`

The buyer's company name.

{% include /apps/checkout/privacy-icon.md %} Requires level 1 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### address1

value: `string`

The first line of the buyer's address, including street name and number.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### address2

value: `string`

The second line of the buyer's address, like apartment number, suite, etc.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### city

value: `string`

The buyer's city.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### zip

value: `string`

The buyer's postal or ZIP code.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### countryCode

value: `CountryCode`

  - Country: export interface Country {
  /**
   * The ISO-3166-1 code for this country.
   * @see https://www.iso.org/iso-3166-country-codes.html
   */
  isoCode: CountryCode;
}
  - CountryCode: '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'
The ISO 3166 Alpha-2 format for the buyer's country. Refer to https://www.iso.org/iso-3166-country-codes.html.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### provinceCode

value: `string`

The buyer's zone code, such as state, province, prefecture, or region.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### phone

value: `string`

The buyer's phone number.

{% include /apps/checkout/privacy-icon.md %} Requires level 2 access to [protected customer data](https://shopify.dev/docs/apps/store/data-protection/protected-customer-data).

### Shop

### id

value: `string`

The shop ID.

### name

value: `string`

The name of the shop.

### storefrontUrl

value: `string`

The primary storefront URL.

### myshopifyDomain

value: `string`

The shop's myshopify.com domain.

### Storage

A key-value storage object for extension points.

Stored data is only available to this specific app
at this specific extension point.

The storage backend is implemented with `localStorage` and
should persist across the buyer's checkout session.
However, data persistence isn't guaranteed.

### read

value: `<T = unknown>(key: string) => Promise<T>`

Read and return a stored value by key.

The stored data is deserialized from JSON and returned as
its original primitive.

Returns `null` if no stored data exists.

### write

value: `(key: string, data: any) => Promise<void>`

Write stored data for this key.

The data must be serializable to JSON.

### delete

value: `(key: string) => Promise<void>`

Delete stored data by key.

### Ui

### overlay

value: `{ close(overlayId: string): void; }`


## Related

- [CheckoutApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/checkoutapi)
- [OrderStatusApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/orderstatusapi)
- [CartLineDetailsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/cartlinedetailsapi)
- [PickupPointsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/pickuppointsapi)
- [PickupLocationsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/pickuplocationsapi)
- [ShippingMethodDetailsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/shippingmethoddetailsapi)
- [ExtensionPoints](https://shopify.dev/docs/api/checkout-ui-extensions/apis/extensionpoints)

## Examples

This base API object is provided to all extension points.


### Using the API


The extension API is passed as a parameter to the extension point function.
In React, you can access it from any component through the `useExtensionApi()` hook.
      ```jsx
import React from 'react';
import {
  render,
  Text,
  useExtensionApi,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {shop} = useExtensionApi();
  return <Text>Shop name: {shop.name}</Text>;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {shop}) => {
    root.appendChild(
      root.createText(`Shop name: ${shop.name}`),
    );
  },
);

```


Some API property values may change after the extension is rendered.
`StatefulRemoteSubscribable` properties allow you to subscribe to changes and perform a function or re-render your extension.

If you are using React, you can utilize the property's corresponding hook, or the [`useSubscription()`](https://shopify.dev/docs/api/checkout-ui-extensions/react-hooks/utilities/usesubscription) hook to subscribe to changes and automatically re-render your extension.
      ```jsx
import React from 'react';
import {
  render,
  Text,
  useNote,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const note = useNote();
  return <Text>Note: {note}</Text>;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {note}) => {
    const text = root.createText('');
    note.subscribe((value) => {
      if (value) {
        text.updateText(value);
      }
    });
    root.appendChild(text);
  },
);

```


### Localization


Define strings in JSON files for each locale and render them using `translate()`.
See [localizing UI extensions](https://shopify.dev/docs/apps/checkout/best-practices/localizing-ui-extensions) for more information.
      ```jsx
/* See the locales/en.default.json tab for the translation keys and values for this example */
import React from 'react';
import {
  render,
  Text,
  useTranslate,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const translate = useTranslate();
  return (
    <Text>{translate('welcomeMessage')}</Text>
  );
}

```

```js
/* See the locales/en.default.json tab for the translation keys and values for this example */
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {i18n}) => {
    const welcomeMsg = i18n.translate(
      'welcomeMessage',
    );

    root.appendChild(root.createText(welcomeMsg));
  },
);

```

```json
{
  "welcomeMessage": "Welcome to our store!"
}

```


You can use the `count` option to get a pluralized string based on the current locale.
See [localizing UI extensions](https://shopify.dev/docs/apps/checkout/best-practices/localizing-ui-extensions) for more information.
      ```jsx
/* See the locales/en.default.json tab for the translation keys and values for this example */
import React from 'react';
import {
  render,
  Banner,
  useExtensionApi,
  useTranslate,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {i18n} = useExtensionApi();
  const translate = useTranslate();

  const points = 10000;
  const formattedPoints =
    i18n.formatNumber(points);
  // Translate the loyalty points message, using pluralization to differentiate messages
  const loyaltyPointsMsg = translate(
    'loyaltyPoints',
    {
      count: points,
      formattedPoints,
    },
  );

  return <Banner title={loyaltyPointsMsg} />;
}

```

```js
/* See the locales/en.default.json tab for the translation keys and values for this example */
import {
  extend,
  Banner,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {i18n}) => {
    const points = 10000;
    const formattedPoints =
      i18n.formatNumber(points);
    // Translate the loyalty points message, using pluralization to differentiate messages
    const loyaltyPointsMsg = i18n.translate(
      'loyaltyPoints',
      {
        count: points,
        formattedPoints,
      },
    );

    const app = root.createComponent(Banner, {
      title: loyaltyPointsMsg,
    });

    root.appendChild(app);
  },
);

```

```json
{
  "loyaltyPoints": {
    "one": "You have {{formattedPoints}} loyalty point",
    "other": "You have {{formattedPoints}} loyalty points"
  }
}

```


### Settings


You can define settings that merchants can edit within the checkout editor.
See [settings](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#settings-definition) for more information on how to define these.
      ```toml
type = "checkout_ui_extension"
name = "my-checkout-extension"

extension_points = [
  'Checkout::Dynamic::Render'
]

[settings]
  [[settings.fields]]
  key = "banner_title"
  type = "single_line_text_field"
  name = "Banner title"
  description = "Enter a title for the banner."
    [[settings.fields.validations]]
    name = "min"
    value = "5"
    [[settings.fields.validations]]
    name = "max"
    value = "20"


```


You can retrieve settings values within your extension. In React, the `useSettings()` hook re-renders your extension with the latest values.
In JavaScript, subscribe to changes and update your UI directly.
      ```jsx
import React from 'react';
import {
  render,
  Banner,
  useSettings,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {banner_title} = useSettings();
  return <Banner title={banner_title} />;
}

```

```js
import {
  extend,
  Banner,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {settings}) => {
    const banner = root.createComponent(Banner, {
      title: settings.current.banner_title,
    });

    // When the merchant updates the banner title in the checkout editor, re-render the banner
    settings.subscribe((newSettings) => {
      banner.updateProps({
        title: newSettings.banner_title,
      });
    });

    root.appendChild(banner);
  },
);

```


### Storefront API access


You can access the [Storefront GraphQL API](https://shopify.dev/docs/api/storefront) via the `query()` helper function.
Ensure your extension can use this API by [enabling the `api_access` capability](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access).
      ```jsx
import React, {useEffect, useState} from 'react';
import {
  useExtensionApi,
  render,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const [data, setData] = useState();
  const {query} = useExtensionApi();

  useEffect(() => {
    query(
      `query ($first: Int!) {
        products(first: $first) {
          nodes {
            id
            title
          }
        }
      }`,
      {
        variables: {first: 5},
      },
    )
      .then(({data, errors}) => setData(data))
      .catch(console.error);
  }, [query]);

  return (
    <List>
      {data?.products?.nodes.map((node) => (
        <ListItem key={node.id}>
          {node.title}
        </ListItem>
      ))}
    </List>
  );
}

```

```js
import {
  extend,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {query}) => {
    query<any>(
      `query ($first: Int!) {
      products(first: $first) {
        nodes {
          id
          title
        }
      }
    }`,
      {
        variables: {first: 5},
      },
    )
      .then(({data}) => {
        const listItems =
          data?.products?.nodes.map((node) =>
            root.createComponent(
              ListItem,
              undefined,
              node.title,
            ),
          );

        root.appendChild(
          root.createComponent(
            List,
            undefined,
            listItems,
          ),
        );
      })
      .catch(console.error);
  },
);

```


You can access the [Storefront GraphQL API](https://shopify.dev/docs/api/storefront) using global `fetch()`.
Ensure your extension can access the Storefront API via the [`api_access` capability](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access).
      ```jsx
import React, {useEffect, useState} from 'react';
import {
  useExtensionApi,
  render,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {shop} = useExtensionApi();
  const [data, setData] = useState();

  useEffect(() => {
    const getProductsQuery = {
      query: `query ($first: Int!) {
        products(first: $first) {
          nodes {
            id
            title
          }
        }
      }`,
      variables: {first: 5},
    };

    const apiVersion = 'unstable';

    fetch(
      `${shop.storefrontUrl}api/${apiVersion}/graphql.json`,
      {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(getProductsQuery),
      },
    )
      .then((response) => response.json())
      .then(({data, errors}) => setData(data))
      .catch(console.error);
  }, [shop]);

  return (
    <List>
      {data?.products?.nodes.map((node) => (
        <ListItem key={node.id}>
          {node.title}
        </ListItem>
      ))}
    </List>
  );
}

```

```js
import {
  extend,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {shop}) => {
    const apiVersion = 'unstable';
    const getProductsQuery = {
      query: `query ($first: Int!) {
      products(first: $first) {
        nodes {
          id
          title
        }
      }
    }`,
      variables: {first: 5},
    };

    fetch(
      `${shop.storefrontUrl}api/${apiVersion}/graphql.json`,
      {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(getProductsQuery),
      },
    )
      .then((response) => response.json())
      .then(({data}) => {
        const listItems =
          data?.products?.nodes.map((node) =>
            root.createComponent(
              ListItem,
              undefined,
              node.title,
            ),
          );

        root.appendChild(
          root.createComponent(
            List,
            undefined,
            listItems,
          ),
        );
      })
      .catch(console.error);
  },
);

```


### Buyer journey

Intercept and prevent a buyer's progress through checkout while targeting a specific checkout UI field.
        See the [validation tutorial](https://shopify.dev/docs/apps/checkout/validation) for more examples and best practices.```jsx
import React from 'react';
import {
  render,
  useBuyerJourneyIntercept,
  useShippingAddress,
} from '@shopify/checkout-ui-extensions-react';

render(
  'Checkout::DeliveryAddress::RenderBefore',
  () => <Extension />,
);

function Extension() {
  const address = useShippingAddress();

  useBuyerJourneyIntercept(
    ({canBlockProgress}) => {
      return canBlockProgress &&
        address?.countryCode &&
        address.countryCode !== 'CA'
        ? {
            behavior: 'block',
            reason: 'Invalid shipping country',
            errors: [
              {
                message:
                  'Sorry, we can only ship to Canada',
                // Show an error underneath the country code field
                target:
                  '$.cart.deliveryGroups[0].deliveryAddress.countryCode',
              },
              {
                // In addition, show an error at the page level
                message:
                  'Please use a different address.',
              },
            ],
          }
        : {
            behavior: 'allow',
          };
    },
  );

  return null;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::DeliveryAddress::RenderBefore',
  (root, {buyerJourney, shippingAddress}) => {
    let address = shippingAddress?.current;
    shippingAddress?.subscribe((newAddress) => {
      address = newAddress;
    });

    buyerJourney.intercept(
      ({canBlockProgress}) => {
        return canBlockProgress &&
          address?.countryCode &&
          address.countryCode !== 'CA'
          ? {
              behavior: 'block',
              reason: 'Invalid shipping country',
              errors: [
                {
                  message:
                    'Sorry, we can only ship to Canada',
                  // Show an error underneath the country code field
                  target:
                    '$.cart.deliveryGroups[0].deliveryAddress.countryCode',
                },
                {
                  // In addition, show an error at the page level
                  message:
                    'Please use a different address.',
                },
              ],
            }
          : {
              behavior: 'allow',
            };
      },
    );
  },
);

```

Intercept and prevent a buyer's progress through checkout while displaying an error message at the page level.
        See the [validation tutorial](https://shopify.dev/docs/apps/checkout/validation) for more examples and best practices.```jsx
import React from 'react';
import {
  render,
  useBuyerJourneyIntercept,
  useShippingAddress,
} from '@shopify/checkout-ui-extensions-react';

render(
  'Checkout::DeliveryAddress::RenderBefore',
  () => <Extension />,
);

function Extension() {
  const address = useShippingAddress();

  useBuyerJourneyIntercept(
    ({canBlockProgress}) => {
      return canBlockProgress &&
        address?.countryCode &&
        address.countryCode !== 'CA'
        ? {
            behavior: 'block',
            reason: 'Invalid shipping country',
            errors: [
              {
                // An error without a `target` property is shown at page level
                message:
                  'Sorry, we can only ship to Canada',
              },
            ],
          }
        : {
            behavior: 'allow',
          };
    },
  );

  return null;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::DeliveryAddress::RenderBefore',
  (root, {buyerJourney, shippingAddress}) => {
    let address = shippingAddress?.current;
    shippingAddress?.subscribe((newAddress) => {
      address = newAddress;
    });

    buyerJourney.intercept(
      ({canBlockProgress}) => {
        return canBlockProgress &&
          address?.countryCode &&
          address.countryCode !== 'CA'
          ? {
              behavior: 'block',
              reason: 'Invalid shipping country',
              errors: [
                {
                  // An error without a `target` property is shown at page level
                  message:
                    'Sorry, we can only ship to Canada',
                },
              ],
            }
          : {
              behavior: 'allow',
            };
      },
    );
  },
);

```

Intercept and prevent a buyer's progress through checkout while displaying an error message in your extension.
        See the [validation tutorial](https://shopify.dev/docs/apps/checkout/validation) for more examples and best practices.```jsx
import React, {useState} from 'react';
import {
  render,
  Banner,
  useBuyerJourneyIntercept,
  useTarget,
} from '@shopify/checkout-ui-extensions-react';

render(
  'Checkout::CartLineDetails::RenderAfter',
  () => <Extension />,
);

function Extension() {
  const [showError, setShowError] =
    useState(false);
  const {quantity} = useTarget();

  useBuyerJourneyIntercept(
    ({canBlockProgress}) => {
      return canBlockProgress && quantity > 1
        ? {
            behavior: 'block',
            reason: 'limited stock',
            perform: (result) => {
              if (result.behavior === 'block') {
                setShowError(true);
              }
            },
          }
        : {
            behavior: 'allow',
            perform: () => {
              setShowError(false);
            },
          };
    },
  );

  return showError ? (
    <Banner>
      This item has a limit of one per customer.
    </Banner>
  ) : null;
}

```

```js
import {
  extend,
  Banner,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::CartLineDetails::RenderAfter',
  (root, {buyerJourney, target}) => {
    const banner = root.createComponent(Banner);

    let quantity = target.current.quantity;

    target?.subscribe((newTarget) => {
      quantity = newTarget.quantity;
    });

    buyerJourney.intercept(
      ({canBlockProgress}) => {
        return canBlockProgress && quantity > 1
          ? {
              behavior: 'block',
              reason: 'limited stock',
              perform: (result) => {
                if (result.behavior === 'block') {
                  banner.appendChild(
                    'This item has a limit of one per customer.',
                  );
                  root.appendChild(banner);
                }
              },
            }
          : {
              behavior: 'allow',
              perform: () => {
                root.removeChild(banner);
              },
            };
      },
    );
  },
);

```


### Session Token


You can request a session token from Shopify to use on your application server.  The contents of the token claims are signed using your shared app secret so you can trust the claims came from Shopify unaltered.

> Note: You will need to [enable the `network_access` capability](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) to use `fetch()`.
```jsx
import React, {useEffect} from 'react';
import {
  render,
  Banner,
  useExtensionApi,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {sessionToken} = useExtensionApi();

  useEffect(() => {
    async function queryApi() {
      // Request a new (or cached) session token from Shopify
      const token = await sessionToken.get();
      console.log('sessionToken.get()', token);

      const apiResponse = await fetchWithToken(
        token,
      );
      // Use your response
      console.log('API response', apiResponse);
    }

    function fetchWithToken(token) {
      const result = fetch(
        'https://myapp.com/api/session-token',
        {
          headers: {
            Authorization: `Bearer ${token}`,
          },
        },
      );
      return result;
    }

    queryApi();
  }, [sessionToken]);

  return (
    <Banner>See console for API response</Banner>
  );
}

```

```js
import {
  extend,
  Banner,
  BlockStack,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {sessionToken}) => {
    async function queryApi() {
      // Request a new (or cached) session token from Shopify
      const token = await sessionToken.get();
      console.log(token);

      const apiResponse = await fetchWithToken(
        token,
      );

      // Use your response
      console.log(apiResponse);
    }

    function fetchWithToken(token) {
      const result = fetch(
        'https://myapp.com/api/session-token',
        {
          headers: {
            Authorization: `Bearer ${token}`,
          },
        },
      );

      return result;
    }

    queryApi();

    root.appendChild(
      root.createComponent(Banner, {
        title: 'Session Token Extension',
      }),
    );
  },
);

```


The contents of the token are signed using your shared app secret.  The optional `sub` claim contains the customer's `gid` if they are logged in and your app has permission to read customer accounts. For example, a loyalty app that needs to check a customer's point balance can use the `sub` claim to verify the customer's account.

> Caution:
> Your app server can only trust the claims within the session token. It cannot use the token to trust the entire HTTP request. See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) for details.
```json
{
  // Shopify URL
  "dest": "store-name.myshopify.com",
  // The Client ID of your app
  "aud": "<clientId>",
  // When the token expires.  Set at 5 minutes.
  "exp": 1679954053,
  // When the token was actived
  "nbf": 1679953753,
  // When the token was issued
  "iat": 1679953753,
  // A unique identifier (a nonce) to prevent replay attacks
  "jti": "6c992878-dbaf-48d1-bb9d-6d9b59814fd1",
  // Optional claim present when a customer is logged in and your app has permissions to read customer data
  "sub": "gid://shopify/Customer/<customerId>"
}

```

## Examples

This base API object is provided to all extension points.


### Using the API


The extension API is passed as a parameter to the extension point function.
In React, you can access it from any component through the `useExtensionApi()` hook.
      ```jsx
import React from 'react';
import {
  render,
  Text,
  useExtensionApi,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {shop} = useExtensionApi();
  return <Text>Shop name: {shop.name}</Text>;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {shop}) => {
    root.appendChild(
      root.createText(`Shop name: ${shop.name}`),
    );
  },
);

```


Some API property values may change after the extension is rendered.
`StatefulRemoteSubscribable` properties allow you to subscribe to changes and perform a function or re-render your extension.

If you are using React, you can utilize the property's corresponding hook, or the [`useSubscription()`](https://shopify.dev/docs/api/checkout-ui-extensions/react-hooks/utilities/usesubscription) hook to subscribe to changes and automatically re-render your extension.
      ```jsx
import React from 'react';
import {
  render,
  Text,
  useNote,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const note = useNote();
  return <Text>Note: {note}</Text>;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {note}) => {
    const text = root.createText('');
    note.subscribe((value) => {
      if (value) {
        text.updateText(value);
      }
    });
    root.appendChild(text);
  },
);

```


### Localization


Define strings in JSON files for each locale and render them using `translate()`.
See [localizing UI extensions](https://shopify.dev/docs/apps/checkout/best-practices/localizing-ui-extensions) for more information.
      ```jsx
/* See the locales/en.default.json tab for the translation keys and values for this example */
import React from 'react';
import {
  render,
  Text,
  useTranslate,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const translate = useTranslate();
  return (
    <Text>{translate('welcomeMessage')}</Text>
  );
}

```

```js
/* See the locales/en.default.json tab for the translation keys and values for this example */
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {i18n}) => {
    const welcomeMsg = i18n.translate(
      'welcomeMessage',
    );

    root.appendChild(root.createText(welcomeMsg));
  },
);

```

```json
{
  "welcomeMessage": "Welcome to our store!"
}

```


You can use the `count` option to get a pluralized string based on the current locale.
See [localizing UI extensions](https://shopify.dev/docs/apps/checkout/best-practices/localizing-ui-extensions) for more information.
      ```jsx
/* See the locales/en.default.json tab for the translation keys and values for this example */
import React from 'react';
import {
  render,
  Banner,
  useExtensionApi,
  useTranslate,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {i18n} = useExtensionApi();
  const translate = useTranslate();

  const points = 10000;
  const formattedPoints =
    i18n.formatNumber(points);
  // Translate the loyalty points message, using pluralization to differentiate messages
  const loyaltyPointsMsg = translate(
    'loyaltyPoints',
    {
      count: points,
      formattedPoints,
    },
  );

  return <Banner title={loyaltyPointsMsg} />;
}

```

```js
/* See the locales/en.default.json tab for the translation keys and values for this example */
import {
  extend,
  Banner,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {i18n}) => {
    const points = 10000;
    const formattedPoints =
      i18n.formatNumber(points);
    // Translate the loyalty points message, using pluralization to differentiate messages
    const loyaltyPointsMsg = i18n.translate(
      'loyaltyPoints',
      {
        count: points,
        formattedPoints,
      },
    );

    const app = root.createComponent(Banner, {
      title: loyaltyPointsMsg,
    });

    root.appendChild(app);
  },
);

```

```json
{
  "loyaltyPoints": {
    "one": "You have {{formattedPoints}} loyalty point",
    "other": "You have {{formattedPoints}} loyalty points"
  }
}

```


### Settings


You can define settings that merchants can edit within the checkout editor.
See [settings](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#settings-definition) for more information on how to define these.
      ```toml
type = "checkout_ui_extension"
name = "my-checkout-extension"

extension_points = [
  'Checkout::Dynamic::Render'
]

[settings]
  [[settings.fields]]
  key = "banner_title"
  type = "single_line_text_field"
  name = "Banner title"
  description = "Enter a title for the banner."
    [[settings.fields.validations]]
    name = "min"
    value = "5"
    [[settings.fields.validations]]
    name = "max"
    value = "20"


```


You can retrieve settings values within your extension. In React, the `useSettings()` hook re-renders your extension with the latest values.
In JavaScript, subscribe to changes and update your UI directly.
      ```jsx
import React from 'react';
import {
  render,
  Banner,
  useSettings,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {banner_title} = useSettings();
  return <Banner title={banner_title} />;
}

```

```js
import {
  extend,
  Banner,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {settings}) => {
    const banner = root.createComponent(Banner, {
      title: settings.current.banner_title,
    });

    // When the merchant updates the banner title in the checkout editor, re-render the banner
    settings.subscribe((newSettings) => {
      banner.updateProps({
        title: newSettings.banner_title,
      });
    });

    root.appendChild(banner);
  },
);

```


### Storefront API access


You can access the [Storefront GraphQL API](https://shopify.dev/docs/api/storefront) via the `query()` helper function.
Ensure your extension can use this API by [enabling the `api_access` capability](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access).
      ```jsx
import React, {useEffect, useState} from 'react';
import {
  useExtensionApi,
  render,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const [data, setData] = useState();
  const {query} = useExtensionApi();

  useEffect(() => {
    query(
      `query ($first: Int!) {
        products(first: $first) {
          nodes {
            id
            title
          }
        }
      }`,
      {
        variables: {first: 5},
      },
    )
      .then(({data, errors}) => setData(data))
      .catch(console.error);
  }, [query]);

  return (
    <List>
      {data?.products?.nodes.map((node) => (
        <ListItem key={node.id}>
          {node.title}
        </ListItem>
      ))}
    </List>
  );
}

```

```js
import {
  extend,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {query}) => {
    query<any>(
      `query ($first: Int!) {
      products(first: $first) {
        nodes {
          id
          title
        }
      }
    }`,
      {
        variables: {first: 5},
      },
    )
      .then(({data}) => {
        const listItems =
          data?.products?.nodes.map((node) =>
            root.createComponent(
              ListItem,
              undefined,
              node.title,
            ),
          );

        root.appendChild(
          root.createComponent(
            List,
            undefined,
            listItems,
          ),
        );
      })
      .catch(console.error);
  },
);

```


You can access the [Storefront GraphQL API](https://shopify.dev/docs/api/storefront) using global `fetch()`.
Ensure your extension can access the Storefront API via the [`api_access` capability](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#api-access).
      ```jsx
import React, {useEffect, useState} from 'react';
import {
  useExtensionApi,
  render,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {shop} = useExtensionApi();
  const [data, setData] = useState();

  useEffect(() => {
    const getProductsQuery = {
      query: `query ($first: Int!) {
        products(first: $first) {
          nodes {
            id
            title
          }
        }
      }`,
      variables: {first: 5},
    };

    const apiVersion = 'unstable';

    fetch(
      `${shop.storefrontUrl}api/${apiVersion}/graphql.json`,
      {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(getProductsQuery),
      },
    )
      .then((response) => response.json())
      .then(({data, errors}) => setData(data))
      .catch(console.error);
  }, [shop]);

  return (
    <List>
      {data?.products?.nodes.map((node) => (
        <ListItem key={node.id}>
          {node.title}
        </ListItem>
      ))}
    </List>
  );
}

```

```js
import {
  extend,
  List,
  ListItem,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {shop}) => {
    const apiVersion = 'unstable';
    const getProductsQuery = {
      query: `query ($first: Int!) {
      products(first: $first) {
        nodes {
          id
          title
        }
      }
    }`,
      variables: {first: 5},
    };

    fetch(
      `${shop.storefrontUrl}api/${apiVersion}/graphql.json`,
      {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(getProductsQuery),
      },
    )
      .then((response) => response.json())
      .then(({data}) => {
        const listItems =
          data?.products?.nodes.map((node) =>
            root.createComponent(
              ListItem,
              undefined,
              node.title,
            ),
          );

        root.appendChild(
          root.createComponent(
            List,
            undefined,
            listItems,
          ),
        );
      })
      .catch(console.error);
  },
);

```


### Buyer journey

Intercept and prevent a buyer's progress through checkout while targeting a specific checkout UI field.
        See the [validation tutorial](https://shopify.dev/docs/apps/checkout/validation) for more examples and best practices.```jsx
import React from 'react';
import {
  render,
  useBuyerJourneyIntercept,
  useShippingAddress,
} from '@shopify/checkout-ui-extensions-react';

render(
  'Checkout::DeliveryAddress::RenderBefore',
  () => <Extension />,
);

function Extension() {
  const address = useShippingAddress();

  useBuyerJourneyIntercept(
    ({canBlockProgress}) => {
      return canBlockProgress &&
        address?.countryCode &&
        address.countryCode !== 'CA'
        ? {
            behavior: 'block',
            reason: 'Invalid shipping country',
            errors: [
              {
                message:
                  'Sorry, we can only ship to Canada',
                // Show an error underneath the country code field
                target:
                  '$.cart.deliveryGroups[0].deliveryAddress.countryCode',
              },
              {
                // In addition, show an error at the page level
                message:
                  'Please use a different address.',
              },
            ],
          }
        : {
            behavior: 'allow',
          };
    },
  );

  return null;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::DeliveryAddress::RenderBefore',
  (root, {buyerJourney, shippingAddress}) => {
    let address = shippingAddress?.current;
    shippingAddress?.subscribe((newAddress) => {
      address = newAddress;
    });

    buyerJourney.intercept(
      ({canBlockProgress}) => {
        return canBlockProgress &&
          address?.countryCode &&
          address.countryCode !== 'CA'
          ? {
              behavior: 'block',
              reason: 'Invalid shipping country',
              errors: [
                {
                  message:
                    'Sorry, we can only ship to Canada',
                  // Show an error underneath the country code field
                  target:
                    '$.cart.deliveryGroups[0].deliveryAddress.countryCode',
                },
                {
                  // In addition, show an error at the page level
                  message:
                    'Please use a different address.',
                },
              ],
            }
          : {
              behavior: 'allow',
            };
      },
    );
  },
);

```

Intercept and prevent a buyer's progress through checkout while displaying an error message at the page level.
        See the [validation tutorial](https://shopify.dev/docs/apps/checkout/validation) for more examples and best practices.```jsx
import React from 'react';
import {
  render,
  useBuyerJourneyIntercept,
  useShippingAddress,
} from '@shopify/checkout-ui-extensions-react';

render(
  'Checkout::DeliveryAddress::RenderBefore',
  () => <Extension />,
);

function Extension() {
  const address = useShippingAddress();

  useBuyerJourneyIntercept(
    ({canBlockProgress}) => {
      return canBlockProgress &&
        address?.countryCode &&
        address.countryCode !== 'CA'
        ? {
            behavior: 'block',
            reason: 'Invalid shipping country',
            errors: [
              {
                // An error without a `target` property is shown at page level
                message:
                  'Sorry, we can only ship to Canada',
              },
            ],
          }
        : {
            behavior: 'allow',
          };
    },
  );

  return null;
}

```

```js
import {extend} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::DeliveryAddress::RenderBefore',
  (root, {buyerJourney, shippingAddress}) => {
    let address = shippingAddress?.current;
    shippingAddress?.subscribe((newAddress) => {
      address = newAddress;
    });

    buyerJourney.intercept(
      ({canBlockProgress}) => {
        return canBlockProgress &&
          address?.countryCode &&
          address.countryCode !== 'CA'
          ? {
              behavior: 'block',
              reason: 'Invalid shipping country',
              errors: [
                {
                  // An error without a `target` property is shown at page level
                  message:
                    'Sorry, we can only ship to Canada',
                },
              ],
            }
          : {
              behavior: 'allow',
            };
      },
    );
  },
);

```

Intercept and prevent a buyer's progress through checkout while displaying an error message in your extension.
        See the [validation tutorial](https://shopify.dev/docs/apps/checkout/validation) for more examples and best practices.```jsx
import React, {useState} from 'react';
import {
  render,
  Banner,
  useBuyerJourneyIntercept,
  useTarget,
} from '@shopify/checkout-ui-extensions-react';

render(
  'Checkout::CartLineDetails::RenderAfter',
  () => <Extension />,
);

function Extension() {
  const [showError, setShowError] =
    useState(false);
  const {quantity} = useTarget();

  useBuyerJourneyIntercept(
    ({canBlockProgress}) => {
      return canBlockProgress && quantity > 1
        ? {
            behavior: 'block',
            reason: 'limited stock',
            perform: (result) => {
              if (result.behavior === 'block') {
                setShowError(true);
              }
            },
          }
        : {
            behavior: 'allow',
            perform: () => {
              setShowError(false);
            },
          };
    },
  );

  return showError ? (
    <Banner>
      This item has a limit of one per customer.
    </Banner>
  ) : null;
}

```

```js
import {
  extend,
  Banner,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::CartLineDetails::RenderAfter',
  (root, {buyerJourney, target}) => {
    const banner = root.createComponent(Banner);

    let quantity = target.current.quantity;

    target?.subscribe((newTarget) => {
      quantity = newTarget.quantity;
    });

    buyerJourney.intercept(
      ({canBlockProgress}) => {
        return canBlockProgress && quantity > 1
          ? {
              behavior: 'block',
              reason: 'limited stock',
              perform: (result) => {
                if (result.behavior === 'block') {
                  banner.appendChild(
                    'This item has a limit of one per customer.',
                  );
                  root.appendChild(banner);
                }
              },
            }
          : {
              behavior: 'allow',
              perform: () => {
                root.removeChild(banner);
              },
            };
      },
    );
  },
);

```


### Session Token


You can request a session token from Shopify to use on your application server.  The contents of the token claims are signed using your shared app secret so you can trust the claims came from Shopify unaltered.

> Note: You will need to [enable the `network_access` capability](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) to use `fetch()`.
```jsx
import React, {useEffect} from 'react';
import {
  render,
  Banner,
  useExtensionApi,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const {sessionToken} = useExtensionApi();

  useEffect(() => {
    async function queryApi() {
      // Request a new (or cached) session token from Shopify
      const token = await sessionToken.get();
      console.log('sessionToken.get()', token);

      const apiResponse = await fetchWithToken(
        token,
      );
      // Use your response
      console.log('API response', apiResponse);
    }

    function fetchWithToken(token) {
      const result = fetch(
        'https://myapp.com/api/session-token',
        {
          headers: {
            Authorization: `Bearer ${token}`,
          },
        },
      );
      return result;
    }

    queryApi();
  }, [sessionToken]);

  return (
    <Banner>See console for API response</Banner>
  );
}

```

```js
import {
  extend,
  Banner,
  BlockStack,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::Dynamic::Render',
  (root, {sessionToken}) => {
    async function queryApi() {
      // Request a new (or cached) session token from Shopify
      const token = await sessionToken.get();
      console.log(token);

      const apiResponse = await fetchWithToken(
        token,
      );

      // Use your response
      console.log(apiResponse);
    }

    function fetchWithToken(token) {
      const result = fetch(
        'https://myapp.com/api/session-token',
        {
          headers: {
            Authorization: `Bearer ${token}`,
          },
        },
      );

      return result;
    }

    queryApi();

    root.appendChild(
      root.createComponent(Banner, {
        title: 'Session Token Extension',
      }),
    );
  },
);

```


The contents of the token are signed using your shared app secret.  The optional `sub` claim contains the customer's `gid` if they are logged in and your app has permission to read customer accounts. For example, a loyalty app that needs to check a customer's point balance can use the `sub` claim to verify the customer's account.

> Caution:
> Your app server can only trust the claims within the session token. It cannot use the token to trust the entire HTTP request. See [security considerations](https://shopify.dev/docs/api/checkout-ui-extensions/configuration#network-access) for details.
```json
{
  // Shopify URL
  "dest": "store-name.myshopify.com",
  // The Client ID of your app
  "aud": "<clientId>",
  // When the token expires.  Set at 5 minutes.
  "exp": 1679954053,
  // When the token was actived
  "nbf": 1679953753,
  // When the token was issued
  "iat": 1679953753,
  // A unique identifier (a nonce) to prevent replay attacks
  "jti": "6c992878-dbaf-48d1-bb9d-6d9b59814fd1",
  // Optional claim present when a customer is logged in and your app has permissions to read customer data
  "sub": "gid://shopify/Customer/<customerId>"
}

```