---
title: Draft Order API
description: >-
  The Draft Order API provides read-only access to draft order data. Use this
  API to get draft order information and build contextual experiences based on
  the selected draft order context. The API offers draft order details for
  implementing order-specific functionality and workflows.
api_version: 2025-10
api_name: pos-ui-extensions
source_url:
  html: >-
    https://shopify.dev/docs/api/pos-ui-extensions/latest/target-apis/contextual-apis/draft-order-api
  md: >-
    https://shopify.dev/docs/api/pos-ui-extensions/latest/target-apis/contextual-apis/draft-order-api.md
---

# Draft Order APIAPIs

The Draft Order API provides read-only access to draft order data. Use this API to get draft order information and build contextual experiences based on the selected draft order context. The API offers draft order details for implementing order-specific functionality and workflows.

## DraftOrderApi

The `DraftOrderApi` object provides access to draft order data. Access this property through `api.draftOrder` to interact with the current draft order context.

* id

  number

  required

  The unique identifier for the draft order. Use for draft order lookups, implementing order-specific functionality, and integrating with external systems.

* name

  string

  required

  The name of the draft order as configured by the merchant. Use for draft order identification, displays, and customer-facing interfaces.

* customerId

  number

  The unique identifier of the customer associated with the draft order. Returns `undefined` if no customer is associated. Use for customer-specific functionality and personalized experiences.

## Best practices

* **Use draft order ID for data lookups:** Use the draft order ID to fetch additional draft order information from external systems, order management platforms, or Shopify APIs when building comprehensive draft order experiences.
* **Implement draft order-specific features:** Use the draft order context to enable specialized functionality like draft order conversion, customer assignment, or order modification workflows.
* **Validate draft order access:** Verify that the draft order ID is valid before performing draft order-specific operations or external API calls.

## Limitations

Draft order data reflects the current POS session and may not include real-time updates from other channels until the session is refreshed.

## Examples

Learn how to access draft order information in draft order detail contexts.

### Examples

* #### Retrieve a draft order ID

  ##### Description

  Access the unique identifier of the current draft order in a draft order detail context. This example shows how to use \`shopify.draftOrder.id\` to retrieve the draft order ID. This can be used for fetching additional order data, implementing custom workflows, or building draft order-specific features.

  ##### jsx

  ```jsx
  import {render} from 'preact';

  export default async () => {
    render(<Extension />, document.body);
  };

  const Extension = () => {
    return (
      <s-page heading='Draft Order Details Action'>
        <s-scroll-box>
          <s-text>Order ID: {shopify.draftOrder.id}</s-text>
        </s-scroll-box>
      </s-page>
    );
  };
  ```

* #### Retrieve a draft order's name, ID, and associated customer ID

  ##### Description

  Access multiple properties from the draft order object including name, ID, and customer information. This example demonstrates using \`shopify.draftOrder\` to retrieve comprehensive draft order details. This enables building contextual interfaces and implementing order-specific workflows.

  ##### jsx

  ```jsx
  import {render} from 'preact';

  export default async () => {
    render(<Extension />, document.body);
  };

  const Extension = () => {
    const {id, name, customerId} = shopify.draftOrder;

    return (
      <s-page heading="Draft Order Details">
        <s-scroll-box>
          <s-stack direction="block">
            <s-text>Draft Order ID: {id}</s-text>
            <s-text>Draft Order Name: {name}</s-text>
            {customerId ? (
              <s-text>Customer ID: {customerId}</s-text>
            ) : (
              <s-text>No customer associated with this draft order</s-text>
            )}
          </s-stack>
        </s-scroll-box>
      </s-page>
    );
  };
  ```