How to get and set checkout form details (address, first name, last name, pincode) in Shopify UI Extensions?

Extensions
1

I am developing a Shopify Checkout UI Extension and need to work with the checkout form details, including the customer’s first name, last name, shipping address, and postal code.

I am using extension points such as:

purchase.checkout.shipping-address.render
purchase.checkout.shipping-address.block.render

I can successfully render UI, but I am unsure how to perform the following:

  1. Read the current checkout shipping address (e.g., first name, last name, address lines, postal code).

  2. Programmatically update or set these fields from within the extension.

  3. Understand which fields Shopify allows developers to modify and which are restricted.

  4. Confirm whether certain APIs require a specific version of @shopify/ui-extensions (for example, 2025.10.x).

I have tried accessing the state using:

const address = useShippingAddress();

I would appreciate guidance on the correct way to read these fields and whether programmatic updates (such as auto-filling postal code or validating the address) are supported in Checkout UI Extensions. Documentation references or examples would also be very helpful.

Thank you.

2

Question 1: How to Read Current Checkout Shipping Address?

:white_check_mark: Yes, you’re on the right track. Use the useShippingAddress() hook:

import { useShippingAddress } from '@shopify/ui-extensions-react/checkout';

const address = useShippingAddress();

// Access fields:
address?.firstName
address?.lastName
address?.address1
address?.address2
address?.city
address?.zip         // postal code
address?.provinceCode
address?.countryCode
address?.phone

:warning: Requires: Level 2 access to protected customer data for most fields.

Question 2: Can You Programmatically Update These Fields?

:white_check_mark: YES, you can update shipping address fields. Use applyShippingAddressChange():

import { useApplyShippingAddressChange } from '@shopify/ui-extensions-react/checkout';

const applyChange = useApplyShippingAddressChange();

const result = await applyChange({
  type: 'updateShippingAddress',
  address: {
    zip: '10001',           // Update postal code
    firstName: 'John',      // Update first name
    // Only include fields you want to change
  }
});

if (result.type === 'success') {
  // Update succeeded
} else {
  // Handle errors: result.errors
}

Question 3: Which Fields Can Be Modified & Which Are Restricted?

:white_check_mark: Fields You CAN Modify:

All standard shipping address fields:

  • firstName, lastName
  • address1, address2
  • city, zip, countryCode, provinceCode
  • phone, company

:cross_mark: When Updates Are BLOCKED:

  1. Cart instruction restriction: instructions.delivery.canSelectCustomAddress is false
  2. Accelerated checkout: Buyer using Apple Pay, Google Pay, Shop Pay
  3. Missing permissions: No access to protected customer data

Check before updating:

const { instructions } = useExtensionApi();

if (!instructions.delivery.canSelectCustomAddress) {

// Cannot update address

}

No specific field-level restrictions - either all fields are editable or none are.

Question 4: API Version Requirements?

:white_check_mark: No specific version required - applyShippingAddressChange is available in all recent API versions.

Package versions: Standard @shopify/ui-extensions-react or @shopify/ui-extensions packages work - no special version needed for address APIs.