# Customer account UI extensions Customer account UI extensions let app developers build custom functionality that merchants can install at defined points on the **Order index**, **Order status**, and **Profile** pages in customer accounts. > Shopify Plus: >Some static extensions on the Profile page only render for B2B customers. B2B on Shopify is only available on the [Shopify Plus](https://www.shopify.com/plus) plan. [See B2B Profile targets](/api/customer-account-ui-extensions/unstable/extension-targets-overview#profile-b2b) ## Scaffolding an extension Use Shopify CLI to [generate a new extension](/apps/tools/cli/commands#generate-extension) in the directory of your app. ### Scaffolding ```bash npm init @shopify/app@latest cd your-app npm run shopify app generate extension ``` ```bash yarn create @shopify/app cd your-app yarn shopify app generate extension ``` ```bash pnpm create @shopify/app cd your-app pnpm shopify app generate extension ``` - [Navigate to](/docs/apps/customer-accounts/getting-started): Getting started ## Extension targets Extension targets provide locations for customer account UI extensions to appear. Extension UIs are rendered using [remote UI](https://github.com/Shopify/remote-ui), a fast and secure environment for custom [(non-DOM)](#security) UIs. ### Extension targets ```tsx import { reactExtension, Banner, useTranslate, } from '@shopify/ui-extensions-react/customer-account'; reactExtension('customer-account.order-index.block.render', () => ( <App /> )); function App() { const translate = useTranslate(); return <Banner>{translate('welcomeMessage')}</Banner>; } ``` ```js import { extension, Banner, } from '@shopify/ui-extensions/customer-account'; extension( 'customer-account.order-status.block.render', (root, api) => { const banner = root.createComponent( Banner, {}, api.i18n.translate('welcomeMessage'), ); root.appendChild(banner); }, ); ``` - [Overview](/api/customer-account-ui-extensions/extension-targets-overview): Extension targets ## Configuration file When you create a customer account UI extension, the shopify.extension.toml file is automatically generated in your customer account UI extension directory. It contains the extension's configuration, which includes the extension name, extension targets, metafields, capabilities and settings definition. ### shopify.ui.extension.example.toml ```toml api_version = "unstable" [[extensions]] name = "My customer account ui extension" handle = "customer-account-ui" type = "ui_extension" [[extensions.targeting]] target = "customer-account.order-status.block.render" module = "./Extension.jsx" ``` - [Navigate to](/api/customer-account-ui-extensions/configuration): Configuration guide ## Extension APIs APIs enable customer account UI extensions to get information about the customer or related objects and to perform actions. For example, you can use APIs to retrieve previous orders of the customer so that you can offer related products as upsells. Extensions use JavaScript to read and write data and call external services, and natively render UIs built using Shopify's checkout and customer account components. ### Extension APIs ```tsx import { reactExtension, Banner, useTranslate, } from '@shopify/ui-extensions-react/customer-account'; reactExtension( 'customer-account.order-status.block.render', () => <App />, ); function App() { const translate = useTranslate(); return <Banner>{translate('welcomeMessage')}</Banner>; } ``` ```js import { extension, Banner, } from '@shopify/ui-extensions/customer-account'; extension( 'customer-account.order-status.block.render', (root, api) => { renderApp(root, api); }, ); function renderApp(root, api) { // In case of a re-render, remove previous children. for (const child of root.children) { root.removeChild(child); } const banner = root.createComponent( Banner, {}, api.i18n.translate('welcomeMessage'), ); root.appendChild(banner); } ``` - [Navigate to](/api/customer-account-ui-extensions/apis): Customer account UI extensions APIs ## UI components Customer account UI extensions declare their interface using supported UI components. Shopify renders the UI natively so it's performant, accessible, and works in all of customer account supported browsers. Components are designed to be flexible, enabling you to layer and mix them to create highly-customized app extensions that feel seamless within the customer account experience. All components that will inherit a merchant's brand settings and the CSS cannot be altered or overridden. To build customer account UI extensions, you can use checkout components, and customer account components. ### UI components ```tsx import { reactExtension, BlockStack, InlineStack, Button, Image, Text, } from '@shopify/ui-extensions-react/customer-account'; reactExtension( 'customer-account.order-status.block.render', () => <App />, ); function App() { return ( <InlineStack> <Image source="/url/for/image" /> <BlockStack> <Text size="large">Heading</Text> <Text size="small">Description</Text> </BlockStack> <Button onPress={() => { console.log('button was pressed'); }} > Button </Button> </InlineStack> ); } ``` ```js import { extension, BlockStack, Button, Image, InlineStack, Text, } from '@shopify/ui-extensions/customer-account'; extension( 'customer-account.order-status.block.render', (root) => { const inlineStack = root.createComponent( InlineStack, {}, [ root.createComponent(Image, { source: '/url/for/image', }), root.createComponent(BlockStack, {}, [ root.createComponent( Text, {size: 'large'}, 'Heading', ), root.createComponent( Text, {size: 'small'}, 'Description', ), ]), root.createComponent( Button, { onPress: () => { console.log('button was pressed'); }, }, 'Button', ), ], ); void root.appendChild(inlineStack); }, ); ``` - [API Reference](/api/checkout-ui-extensions/components): Checkout components - [API Reference](/api/customer-account-ui-extensions/components): Customer account components - [UI Reference](https://www.figma.com/community/file/1304881365343613949/checkout-and-account-components): Figma UI kit ## Custom protocols Custom protocols make it easier to navigate to common locations, and construct URLs. ### Shopify protocol Use the `shopify:customer-account` protocol when you want to construct a URL with a root of customer accounts. ### shopify:customer-account ```tsx <Link to="shopify:customer-account/orders" /> ``` ```js fetch( 'shopify:customer-account/api/unstable/graphql.json', { method: 'POST', body: JSON.stringify(simpleOrderQuery), }, ); ``` ### Relative URLs Relative URLs are relative to your extension and are useful when you want to link to a route in your extension. ### /relative/urls ```tsx <Link to={`/subscriptions/${subscription.id}`} /> ``` ### Extension Protocol Triggers a navigation to an extension using the `extension:` protocol. The handle is the handle of the extension that will be navigated to in the same application. Build a [full-page extension](/apps/customer-accounts/full-page-extension) to create a new page in customer accounts and handle the navigation. ### extension:handle ```tsx <Link to={`extension:${extension.handle}/${path}`} > To full-page extension </Link>; <Link to={`extension:${extension.handle}/customer-account.order.page.render/${orderId}/${path}`} > To full-page extension (order-specific) </Link>; ``` ## Security Customer account UI extensions are a safe and secure way to customize the appearance and functionality of the customer account pages without compromising the security of customer data. - They run in an isolated sandbox, separate from the customer account page and other UI extensions. - They don't have access to sensitive payment information or the customer account page itself (HTML or other assets). - They are limited to specific UI components and APIs that are exposed by the platform. - They have limited access to [global web APIs](https://github.com/Shopify/ui-extensions/blob/unstable/documentation/runtime-environment.md). - Apps that wish to access [protected customer data](/docs/apps/store/data-protection/protected-customer-data), must submit an application and are subject to strict security guidelines and review proccesses by Shopify. - [Learn more](https://shopify.engineering/remote-rendering-ui-extensibility): Rendering extensions ## Troubleshooting Find an end-to-end guide to testing your extensions in [Testing customer account UI extensions](https://shopify.dev/docs/apps/customer-accounts/best-practices/testing-ui-extensions). ## Tutorials Learn how to build customer account UI extensions using APIs and UI components. - [Tutorial](/docs/apps/customer-accounts/build-inline-extensions/order-status): Inline extensions - [Tutorial](/docs/apps/customer-accounts/order-action-menu-extensions/build-order-action-menu-extensions): Order action menu extensions - [Tutorial](/docs/apps/customer-accounts/full-page-extensions/build-full-page-extensions): Full-page extensions - [Tutorial](/docs/apps/build/customer-accounts/metafields): Building metafield writes into extensions - [Tutorial](/docs/apps/build/customer-accounts/pre-auth-order-status-page-extensions/build-pre-auth-order-status-page-extensions): Build Pre-auth Order Status page extensions ## Resources ## References - [Authenticated Account](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/authenticated-account.txt): The API for interacting with an account in which the customer is fully authenticated. - [Customer Account API](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/customer-account-api.txt): Create unique customer experiences with the Customer Account API. The API offers a full range of options making it possible for customers to view their orders, manage their profile and much more. - [Extension](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/extension.txt): The API for interacting with the metadata of an extension. - [Localization](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/localization.txt): The API for localizing your extension. - [Navigation](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/navigation.txt): The API provided to extensions to navigate to extensions or host page. - [Addresses](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/addresses.txt): The API for interacting with addresses. - [Attributes](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/attributes.txt): The API for interacting with cart and checkout attributes. - [Authentication State](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/authentication-state.txt): The API for interacting with authentication state. - [Buyer Identity](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/buyer-identity.txt): The API for interacting with the buyer identity. - [Cart Lines](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/cart-lines.txt): The APIs for interacting with the cart lines. - [Checkout Settings](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/checkout-settings.txt): The API for interacting with the checkout settings. - [Cost](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/cost.txt): The API for interacting with the cost of a checkout. - [Discounts](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/discounts.txt): The API for interacting with discounts. - [Gift Cards](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/gift-cards.txt): The API for interacting with gift cards. - [Localization (Order Status API)](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/localization-(order-status-api).txt): The API for localizing your extension. - [Metafields](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/metafields.txt): The API for interacting with metafields. - [Note](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/note.txt): The API for interacting with the note applied to checkout. - [Order](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/order.txt): The API for interacting with the order, available on the Order Status Page. - [Require Login](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/require-login.txt): The API for interacting with the authentication. - [Shop](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/order-status-api/shop.txt): The API for interacting with shop. - [Storefront API](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/storefront-api.txt): Querying the Storefront API. - [Session Token](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/session-token.txt): The API for interacting with session tokens. - [Settings](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/settings.txt): The API for interacting with merchant settings. - [Storage](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/storage.txt): The API for interacting with local storage. - [UI](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/ui.txt): The API for interacting with UI. - [Version](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/apis/version.txt): The API for interacting with version. - [customer-account.order-index.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-index/customer-account-order-index-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Order Index page in customer accounts. Merchants can choose to place this extension in any of the supported locations. To preview your extension in each supported location, use the placement reference for that location as a URL parameter. - [customer-account.order-status.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Order Status Page. - [customer-account.order-status.cart-line-item.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-cart-line-item-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on every line item, inside the details under the line item properties element on the Order Status Page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.cart-line-list.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-cart-line-list-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders after all line items on the Order Status page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.customer-information.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-customer-information-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders below the order details section of the Order Status page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.fulfillment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-fulfillment-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the delivery status card on the Order Status page. A separate delivery status card is shown for each fulfillment. - [customer-account.order-status.payment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-payment-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the payment status section of the Order Status page. - [customer-account.order-status.return-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-return-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the return status card on the Order Status page. This card only shows when a return has been requested. - [customer-account.order-status.unfulfilled-items.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-status/customer-account-order-status-unfulfilled-items-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the delivery status card for unfulfilled items on the Order Status page. - [customer-account.order.action.menu-item.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-action-menu/customer-account-order-action-menu-item-render.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders as 1 order action on the Order Index and Order Status pages in customer accounts. - [customer-account.order.action.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/order-action-menu/customer-account-order-action-render.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders inside a modal, as a result of the customer clicking the button rendered via the `customer-account.order.action.menu-item.render` extension target. - [customer-account.order.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/full-page/customer-account-order-page-render.txt): This [full-page extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#full-page-extension-full-page-extension-(order-specific)) allows you to create a new page in customer accounts, **tied to a specific order**. It renders in the main content area—below the header, and above the footer. If the page you're building is not tied to a specific order, use [customer-account.page.render](/docs/api/customer-account-ui-extensions/targets/full-page/customer-account-page-render) instead. For example: - A Return Request page that requires the context of a specific order should use `customer-account.order.page.render` - A Wishlist page that does **not** require the context of a specific order should use `customer-account.page.render` - [customer-account.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/full-page/customer-account-page-render.txt): This [full-page extension](/docs/api/customer-account-ui-extensions/2024-10/extension-targets-overview#full-page-extension-full-page-extension) allows you to create a new page in customer accounts. It renders in the main content area—below the header, and above the footer. If the page you're building is tied to a specific order, use [customer-account.order.page.render](/docs/api/customer-account-ui-extensions/targets/full-page/customer-account-order-page-render) instead. For example: - A Return Request page that requires the context of a specific order should use `customer-account.order.page.render` - A Wishlist page that does **not** require the context of a specific order should use `customer-account.page.render` - [customer-account.profile.addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/profile-(default)/customer-account-profile-addresses-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the Addresses section of the Profile page in customer accounts. This does not show to B2B customers. - [customer-account.profile.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/profile-(default)/customer-account-profile-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Profile page in customer accounts. This extension target renders for all customers, including B2B customers. Merchants can choose to place this extension in any of the supported locations. To preview your extension in each supported location, use the placement reference for that location as a URL parameter. - [customer-account.profile.company-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/profile-(b2b)/customer-account-profile-company-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the company name, and before company location information. - [customer-account.profile.company-location-addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/profile-(b2b)/customer-account-profile-company-location-addresses-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Addresses section for the company location. - [customer-account.profile.company-location-payment.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/profile-(b2b)/customer-account-profile-company-location-payment-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Payment methods section for the company location. - [customer-account.profile.company-location-staff.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/targets/profile-(b2b)/customer-account-profile-company-location-staff-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Staff and permissions section for the company location. - [Avatar](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/avatar.txt): Avatar component is used to show a thumbnail representation of an individual or business in the interface. It can be a graphical representation or visual depiction, such as an image, initials, or an icon. - [Card](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/card.txt): Group related content and functionality together in a familiar and consistent style, for customers to scan, read, and get things done. - [CustomerAccountAction](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/customeraccountaction.txt): A modal to complete an order action flow. This component can only be used to populate the [customer-account.order.action.render](/docs/api/customer-account-ui-extensions/2024-10/targets/order-action-menu/customer-account-order-action-render) extension target, which renders as a result of the customer clicking the order action button rendered via the [customer-account.order.action.menu-item.render](/docs/api/customer-account-ui-extensions/2024-10/targets/order-action-menu/customer-account-order-action-menu-item-render) extension target. - [DropZone](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/dropzone.txt): Dropzone allows file uploads through drag-and-drop functionality into a designated area on a page, or by activating a button. At present, Dropzone does not offer image upload preview capabilities. The use of object URLs directly in an image component is not possible due to the extension and host operating on separate domains. Any element focused within the Dropzone component, including child elements such as the 'Add file' button, will initiate the file selector when the Enter or Spacebar key is pressed. - [ImageGroup](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/imagegroup.txt): Display up to 4 images in a grid or stacked layout. For example, images of products in a wishlist or subscription. When there are more than 4 images, the component indicates how many more images are not displayed. - [Menu](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/menu.txt): Use a menu to display a list of actions in a popover. Actions can open a modal, trigger an event, or link to an external page. - [Page](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/page.txt): The outer wrapper of the page—including the page title, subtitle, and page-level actions—displayed in a familiar and consistent style that sets expectations about the purpose of the page. - [ResourceItem](https://shopify.dev/docs/api/customer-account-ui-extensions/2024-10/components/resourceitem.txt): Use to represent a specific object within a collection, that a customer can take action on. For example, a list of active subscriptions or redeemable offers, in a style consistent with the order index page. - [Authenticated Account](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/authenticated-account.txt): The API for interacting with an account in which the customer is fully authenticated. - [Customer Account API](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/customer-account-api.txt): Create unique customer experiences with the Customer Account API. The API offers a full range of options making it possible for customers to view their orders, manage their profile and much more. - [Extension](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/extension.txt): The API for interacting with the metadata of an extension. - [Localization](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/localization.txt): The API for localizing your extension. - [Navigation](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/navigation.txt): The API provided to extensions to navigate to extensions or host page. - [Addresses](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/addresses.txt): The API for interacting with addresses. - [Attributes](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/attributes.txt): The API for interacting with cart and checkout attributes. - [Authentication State](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/authentication-state.txt): The API for interacting with authentication state. - [Buyer Identity](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/buyer-identity.txt): The API for interacting with the buyer identity. - [Cart Lines](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/cart-lines.txt): The APIs for interacting with the cart lines. - [Checkout Settings](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/checkout-settings.txt): The API for interacting with the checkout settings. - [Cost](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/cost.txt): The API for interacting with the cost of a checkout. - [Discounts](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/discounts.txt): The API for interacting with discounts. - [Gift Cards](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/gift-cards.txt): The API for interacting with gift cards. - [Localization (Order Status API)](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/localization-(order-status-api).txt): The API for localizing your extension. - [Metafields](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/metafields.txt): The API for interacting with metafields. - [Note](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/note.txt): The API for interacting with the note applied to checkout. - [Order](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/order.txt): The API for interacting with the order, available on the Order Status Page. - [Require Login](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/require-login.txt): The API for interacting with the authentication. - [Shop](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/order-status-api/shop.txt): The API for interacting with shop. - [Storefront API](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/storefront-api.txt): Querying the Storefront API. - [Session Token](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/session-token.txt): The API for interacting with session tokens. - [Settings](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/settings.txt): The API for interacting with merchant settings. - [Storage](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/storage.txt): The API for interacting with local storage. - [UI](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/ui.txt): The API for interacting with UI. - [Version](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/apis/version.txt): The API for interacting with version. - [customer-account.order-index.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-index/customer-account-order-index-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Order Index page in customer accounts. Merchants can choose to place this extension in any of the supported locations. To preview your extension in each supported location, use the placement reference for that location as a URL parameter. - [customer-account.order-status.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Order Status Page. - [customer-account.order-status.cart-line-item.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-cart-line-item-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on every line item, inside the details under the line item properties element on the Order Status Page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.cart-line-list.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-cart-line-list-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders after all line items on the Order Status page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.customer-information.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-customer-information-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders below the order details section of the Order Status page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.fulfillment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-fulfillment-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the delivery status card on the Order Status page. A separate delivery status card is shown for each fulfillment. - [customer-account.order-status.payment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-payment-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the payment status section of the Order Status page. - [customer-account.order-status.return-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-return-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the return status card on the Order Status page. This card only shows when a return has been requested. - [customer-account.order-status.unfulfilled-items.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-status/customer-account-order-status-unfulfilled-items-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the delivery status card for unfulfilled items on the Order Status page. - [customer-account.order.action.menu-item.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-action-menu/customer-account-order-action-menu-item-render.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders as 1 order action on the Order Index and Order Status pages in customer accounts. - [customer-account.order.action.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/order-action-menu/customer-account-order-action-render.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders inside a modal, as a result of the customer clicking the button rendered via the `customer-account.order.action.menu-item.render` extension target. - [customer-account.order.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/full-page/customer-account-order-page-render.txt): This [full-page extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#full-page-extension-full-page-extension-(order-specific)) allows you to create a new page in customer accounts, **tied to a specific order**. It renders in the main content area—below the header, and above the footer. If the page you're building is not tied to a specific order, use [customer-account.page.render](/docs/api/customer-account-ui-extensions/targets/full-page/customer-account-page-render) instead. For example: - A Return Request page that requires the context of a specific order should use `customer-account.order.page.render` - A Wishlist page that does **not** require the context of a specific order should use `customer-account.page.render` - [customer-account.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/full-page/customer-account-page-render.txt): This [full-page extension](/docs/api/customer-account-ui-extensions/2025-01/extension-targets-overview#full-page-extension-full-page-extension) allows you to create a new page in customer accounts. It renders in the main content area—below the header, and above the footer. If the page you're building is tied to a specific order, use [customer-account.order.page.render](/docs/api/customer-account-ui-extensions/targets/full-page/customer-account-order-page-render) instead. For example: - A Return Request page that requires the context of a specific order should use `customer-account.order.page.render` - A Wishlist page that does **not** require the context of a specific order should use `customer-account.page.render` - [customer-account.profile.addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/profile-(default)/customer-account-profile-addresses-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the Addresses section of the Profile page in customer accounts. This does not show to B2B customers. - [customer-account.profile.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/profile-(default)/customer-account-profile-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Profile page in customer accounts. This extension target renders for all customers, including B2B customers. Merchants can choose to place this extension in any of the supported locations. To preview your extension in each supported location, use the placement reference for that location as a URL parameter. - [customer-account.profile.company-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/profile-(b2b)/customer-account-profile-company-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the company name, and before company location information. - [customer-account.profile.company-location-addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/profile-(b2b)/customer-account-profile-company-location-addresses-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Addresses section for the company location. - [customer-account.profile.company-location-payment.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/profile-(b2b)/customer-account-profile-company-location-payment-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Payment methods section for the company location. - [customer-account.profile.company-location-staff.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/targets/profile-(b2b)/customer-account-profile-company-location-staff-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Staff and permissions section for the company location. - [Avatar](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/avatar.txt): Avatar component is used to show a thumbnail representation of an individual or business in the interface. It can be a graphical representation or visual depiction, such as an image, initials, or an icon. - [Card](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/card.txt): Group related content and functionality together in a familiar and consistent style, for customers to scan, read, and get things done. - [CustomerAccountAction](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/customeraccountaction.txt): A modal to complete an order action flow. This component can only be used to populate the [customer-account.order.action.render](/docs/api/customer-account-ui-extensions/2025-01/targets/order-action-menu/customer-account-order-action-render) extension target, which renders as a result of the customer clicking the order action button rendered via the [customer-account.order.action.menu-item.render](/docs/api/customer-account-ui-extensions/2025-01/targets/order-action-menu/customer-account-order-action-menu-item-render) extension target. - [DropZone](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/dropzone.txt): Dropzone allows file uploads through drag-and-drop functionality into a designated area on a page, or by activating a button. At present, Dropzone does not offer image upload preview capabilities. The use of object URLs directly in an image component is not possible due to the extension and host operating on separate domains. Any element focused within the Dropzone component, including child elements such as the 'Add file' button, will initiate the file selector when the Enter or Spacebar key is pressed. - [ImageGroup](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/imagegroup.txt): Display up to 4 images in a grid or stacked layout. For example, images of products in a wishlist or subscription. When there are more than 4 images, the component indicates how many more images are not displayed. - [Menu](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/menu.txt): Use a menu to display a list of actions in a popover. Actions can open a modal, trigger an event, or link to an external page. - [Page](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/page.txt): The outer wrapper of the page—including the page title, subtitle, and page-level actions—displayed in a familiar and consistent style that sets expectations about the purpose of the page. - [ResourceItem](https://shopify.dev/docs/api/customer-account-ui-extensions/2025-01/components/resourceitem.txt): Use to represent a specific object within a collection, that a customer can take action on. For example, a list of active subscriptions or redeemable offers, in a style consistent with the order index page. - [Authenticated Account](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/authenticated-account.txt): The API for interacting with an account in which the customer is fully authenticated. - [Customer Account API](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/customer-account-api.txt): Create unique customer experiences with the Customer Account API. The API offers a full range of options making it possible for customers to view their orders, manage their profile and much more. - [Extension](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/extension.txt): The API for interacting with the metadata of an extension. - [Localization](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/localization.txt): The API for localizing your extension. - [Navigation](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/navigation.txt): The API provided to extensions to navigate to extensions or host page. - [Addresses](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/addresses.txt): The API for interacting with addresses. - [Attributes](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/attributes.txt): The API for interacting with cart and checkout attributes. - [Authentication State](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/authentication-state.txt): The API for interacting with authentication state. - [Buyer Identity](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/buyer-identity.txt): The API for interacting with the buyer identity. - [Cart Lines](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/cart-lines.txt): The APIs for interacting with the cart lines. - [Checkout Settings](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/checkout-settings.txt): The API for interacting with the checkout settings. - [Cost](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/cost.txt): The API for interacting with the cost of a checkout. - [Discounts](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/discounts.txt): The API for interacting with discounts. - [Gift Cards](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/gift-cards.txt): The API for interacting with gift cards. - [Localization (Order Status API)](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/localization-(order-status-api).txt): The API for localizing your extension. - [Metafields](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/metafields.txt): The API for interacting with metafields. - [Note](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/note.txt): The API for interacting with the note applied to checkout. - [Order](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/order.txt): The API for interacting with the order, available on the Order Status Page. - [Require Login](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/require-login.txt): The API for interacting with the authentication. - [Shop](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/order-status-api/shop.txt): The API for interacting with shop. - [Storefront API](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/storefront-api.txt): Querying the Storefront API. - [Session Token](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/session-token.txt): The API for interacting with session tokens. - [Settings](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/settings.txt): The API for interacting with merchant settings. - [Storage](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/storage.txt): The API for interacting with local storage. - [UI](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/ui.txt): The API for interacting with UI. - [Version](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/apis/version.txt): The API for interacting with version. - [customer-account.order-index.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-index/customer-account-order-index-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Order Index page in customer accounts. Merchants can choose to place this extension in any of the supported locations. To preview your extension in each supported location, use the placement reference for that location as a URL parameter. - [customer-account.order-status.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Order Status Page. - [customer-account.order-status.cart-line-item.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-cart-line-item-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on every line item, inside the details under the line item properties element on the Order Status Page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.cart-line-list.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-cart-line-list-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders after all line items on the Order Status page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.customer-information.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-customer-information-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders below the order details section of the Order Status page. > Caution: Use the `@shopify/ui-extensions/customer-account` or `@shopify/ui-extensions-react/customer-account` surfaces when targeting order status targets. Importing from the `checkout` surface is deprecated as of version `2023-10`. - [customer-account.order-status.fulfillment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-fulfillment-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the delivery status card on the Order Status page. A separate delivery status card is shown for each fulfillment. - [customer-account.order-status.payment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-payment-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the payment status section of the Order Status page. - [customer-account.order-status.return-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-return-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the return status card on the Order Status page. This card only shows when a return has been requested. - [customer-account.order-status.unfulfilled-items.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-status/customer-account-order-status-unfulfilled-items-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the delivery status card for unfulfilled items on the Order Status page. - [customer-account.order.action.menu-item.render](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-action-menu/customer-account-order-action-menu-item-render.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders as 1 order action on the Order Index and Order Status pages in customer accounts. - [customer-account.order.action.render](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/order-action-menu/customer-account-order-action-render.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders inside a modal, as a result of the customer clicking the button rendered via the `customer-account.order.action.menu-item.render` extension target. - [customer-account.order.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/full-page/customer-account-order-page-render.txt): This [full-page extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#full-page-extension-full-page-extension-(order-specific)) allows you to create a new page in customer accounts, **tied to a specific order**. It renders in the main content area—below the header, and above the footer. If the page you're building is not tied to a specific order, use [customer-account.page.render](/docs/api/customer-account-ui-extensions/targets/full-page/customer-account-page-render) instead. For example: - A Return Request page that requires the context of a specific order should use `customer-account.order.page.render` - A Wishlist page that does **not** require the context of a specific order should use `customer-account.page.render` - [customer-account.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/full-page/customer-account-page-render.txt): This [full-page extension](/docs/api/customer-account-ui-extensions/unstable/extension-targets-overview#full-page-extension-full-page-extension) allows you to create a new page in customer accounts. It renders in the main content area—below the header, and above the footer. If the page you're building is tied to a specific order, use [customer-account.order.page.render](/docs/api/customer-account-ui-extensions/targets/full-page/customer-account-order-page-render) instead. For example: - A Return Request page that requires the context of a specific order should use `customer-account.order.page.render` - A Wishlist page that does **not** require the context of a specific order should use `customer-account.page.render` - [customer-account.profile.addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/profile-(default)/customer-account-profile-addresses-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders in the Addresses section of the Profile page in customer accounts. This does not show to B2B customers. - [customer-account.profile.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/profile-(default)/customer-account-profile-block-render.txt): A [block extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that renders exclusively on the Profile page in customer accounts. This extension target renders for all customers, including B2B customers. Merchants can choose to place this extension in any of the supported locations. To preview your extension in each supported location, use the placement reference for that location as a URL parameter. - [customer-account.profile.company-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/profile-(b2b)/customer-account-profile-company-details-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the company name, and before company location information. - [customer-account.profile.company-location-addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/profile-(b2b)/customer-account-profile-company-location-addresses-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Addresses section for the company location. - [customer-account.profile.company-location-payment.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/profile-(b2b)/customer-account-profile-company-location-payment-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Payment methods section for the company location. - [customer-account.profile.company-location-staff.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/targets/profile-(b2b)/customer-account-profile-company-location-staff-render-after.txt): A [static extension target](/docs/api/customer-account-ui-extensions/extension-targets-overview#static-extension-targets) that renders on the Profile page in customer accounts—for B2B customers only. It renders after the Staff and permissions section for the company location. - [Avatar](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/components/avatar.txt): Avatar component is used to show a thumbnail representation of an individual or business in the interface. It can be a graphical representation or visual depiction, such as an image, initials, or an icon. - [Card](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/components/card.txt): Group related content and functionality together in a familiar and consistent style, for customers to scan, read, and get things done. - [CustomerAccountAction](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/components/customeraccountaction.txt): A modal to complete an order action flow. This component can only be used to populate the [customer-account.order.action.render](/docs/api/customer-account-ui-extensions/unstable/targets/order-action-menu/customer-account-order-action-render) extension target, which renders as a result of the customer clicking the order action button rendered via the [customer-account.order.action.menu-item.render](/docs/api/customer-account-ui-extensions/unstable/targets/order-action-menu/customer-account-order-action-menu-item-render) extension target. - [ImageGroup](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/components/imagegroup.txt): Display up to 4 images in a grid or stacked layout. For example, images of products in a wishlist or subscription. When there are more than 4 images, the component indicates how many more images are not displayed. - [Menu](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/components/menu.txt): Use a menu to display a list of actions in a popover. Actions can open a modal, trigger an event, or link to an external page. - [Page](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/components/page.txt): The outer wrapper of the page—including the page title, subtitle, and page-level actions—displayed in a familiar and consistent style that sets expectations about the purpose of the page. - [ResourceItem](https://shopify.dev/docs/api/customer-account-ui-extensions/unstable/components/resourceitem.txt): Use to represent a specific object within a collection, that a customer can take action on. For example, a list of active subscriptions or redeemable offers, in a style consistent with the order index page.