Choose a version:

Note
API

The API for interacting with the note applied to checkout.

Anchor to standardapiStandardApi

The base API object provided to purchase, and customer-account.order-status extension targets.

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

Docs_Standard_NoteApi

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

export interface Docs_Standard_NoteApi extends Pick<StandardApi, 'note'> {}

Was this section helpful?

Anchor to useNote
useNote()

Returns the proposed note applied to the checkout.

Anchor to useNote-returnsReturns

string | undefined

UseNoteGeneratedType

Returns the proposed `note` applied to the checkout.

string | undefined

string | undefined

export function useNote<
  Target extends RenderExtensionTarget = RenderExtensionTarget,
>(): string | undefined {
  return useSubscription(useApi<Target>().note);
}

Was this section helpful?

Anchor to checkoutapiCheckoutApi

The API object provided to purchase.checkout extension targets.

Anchor to applyNoteChange applyNoteChange (change: ) => Promise<> required: 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 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.

Docs_Checkout_NoteApi

applyNoteChange
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`](/docs/api/checkout-ui-extensions/apis/note#standardapi-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.
```
(change: NoteChange) => Promise<NoteChangeResult>
```

export interface Docs_Checkout_NoteApi
  extends Pick<CheckoutApi, 'applyNoteChange'> {}

NoteChange

NoteRemoveChange | NoteUpdateChange

NoteRemoveChange

Removes a note

type
The type of the `NoteRemoveChange` API.
```
"removeNote"
```

export interface NoteRemoveChange {
  /**
   * The type of the `NoteRemoveChange` API.
   */
  type: 'removeNote';
}

NoteUpdateChange

An Update to a note on the order. for example, the buyer could request detailed packaging instructions in an order note

type
The type of the `NoteUpdateChange` API.
```
"updateNote"
```
note
The new value of the note.
```
string
```

export interface NoteUpdateChange {
  /**
   * The type of the `NoteUpdateChange` API.
   */
  type: 'updateNote';
  /**
   * The new value of the note.
   */
  note: string;
}

NoteChangeResult

NoteChangeResultSuccess | NoteChangeResultError

NoteChangeResultSuccess

type
The type of the `NoteChangeResultSuccess` API.
```
"success"
```

export interface NoteChangeResultSuccess {
  /**
   * The type of the `NoteChangeResultSuccess` API.
   */
  type: 'success';
}

NoteChangeResultError

type
The type of the `NoteChangeResultError` API.
```
"error"
```
message
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.
```
string
```

export interface NoteChangeResultError {
  /**
   * The type of the `NoteChangeResultError` API.
   */
  type: 'error';

  /**
   * 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.
   */
  message: string;
}

Was this section helpful?

Anchor to useApplyNoteChange
useApplyNoteChange()

Returns a function to mutate the note property of the checkout.

Anchor to useApplyNoteChange-returnsReturns

(change: ) => Promise<>

UseApplyNoteChangeGeneratedType

Returns a function to mutate the `note` property of the checkout.

(change: NoteChange) => Promise<NoteChangeResult>

(change: NoteChange) => Promise<NoteChangeResult>

export function useApplyNoteChange<
  Target extends RenderExtensionTarget = RenderExtensionTarget,
>(): (change: NoteChange) => Promise<NoteChangeResult> {
  const api = useApi<Target>();

  if ('applyNoteChange' in api) {
    return api.applyNoteChange;
  }

  throw new ExtensionHasNoMethodError('applyNoteChange', api.extension.target);
}

NoteChange

NoteRemoveChange | NoteUpdateChange

NoteRemoveChange

Removes a note

type
The type of the `NoteRemoveChange` API.
```
"removeNote"
```

export interface NoteRemoveChange {
  /**
   * The type of the `NoteRemoveChange` API.
   */
  type: 'removeNote';
}

NoteUpdateChange

An Update to a note on the order. for example, the buyer could request detailed packaging instructions in an order note

type
The type of the `NoteUpdateChange` API.
```
"updateNote"
```
note
The new value of the note.
```
string
```

export interface NoteUpdateChange {
  /**
   * The type of the `NoteUpdateChange` API.
   */
  type: 'updateNote';
  /**
   * The new value of the note.
   */
  note: string;
}

NoteChangeResult

NoteChangeResultSuccess | NoteChangeResultError

NoteChangeResultSuccess

type
The type of the `NoteChangeResultSuccess` API.
```
"success"
```

export interface NoteChangeResultSuccess {
  /**
   * The type of the `NoteChangeResultSuccess` API.
   */
  type: 'success';
}

NoteChangeResultError

type
The type of the `NoteChangeResultError` API.
```
"error"
```
message
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.
```
string
```

export interface NoteChangeResultError {
  /**
   * The type of the `NoteChangeResultError` API.
   */
  type: 'error';

  /**
   * 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.
   */
  message: string;
}

Was this section helpful?