# Targets Overview A [target](/docs/apps/app-extensions/configuration#targets) represents where your admin UI extension will appear. You register targets in your `shopify.extension.toml` and inside the Javascript file denoted by your toml's `module` property. ## Admin action locations Admin action extensions appear on resource pages throughout the admin. Learn more about [admin actions](/docs/apps/admin/admin-actions-and-blocks#admin-actions). Each target has a companion target that supports [controlling the visibility of the admin action menu item](/docs/apps/build/admin/actions-blocks/hide-extensions?extension=react). ### Abandoned checkout details This page shows information about a single abandoned checkout. The `admin.abandoned-checkout-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.abandoned-checkout-details.action.should-render` target. ### Catalog details This page shows information about a single catalog. The `admin.catalog-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.catalog-details.action.should-render` target. ### Collection details This page shows information about a single collection. The `admin.collection-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.collection-details.action.should-render` target. ### Collection index This page shows a table of multiple collections. The `admin.collection-index.action.render` target is available on this page. You can control the visibility of the action by using the `admin.collection-index.action.should-render` target. ### Company details This page shows information about a single company. The `admin.company-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.company-details.action.should-render` target. ### Customer details This page shows information about a single customer. The `admin.customer-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.customer-details.action.should-render` target. ### Customer index This page shows a table of multiple customers. The `admin.customer-index.action.render` target is available on this page. You can control the visibility of the action by using the `admin.customer-index.action.should-render` target. ### Customer index selection This page shows a table of multiple customers. The `admin.customer-index.selection-action.render` target is available on this page when multiple customers are selected. You can control the visibility of the action by using the `admin.customer-index.selection-action.should-render` target. ### Customer segment details This page shows information about a single customer segment. The `admin.customer-segment-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.customer-segment-details.action.should-render` target. ### Discount details This page shows information about a single discount. The `admin.discount-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.discount-details.action.should-render` target. ### Discount index This page shows a table of multiple discounts. The `admin.discount-index.action.render` target is available on this page. You can control the visibility of the action by using the `admin.discount-index.action.should-render` target. ### Draft order details This page shows information about a single draft order. The `admin.draft-order-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.draft-order-details.action.should-render` target. ### Draft order index This page shows a table of multiple draft orders. The `admin.draft-order-index.action.render` target is available on this page. You can control the visibility of the action by using the `admin.draft-order-index.action.should-render` target. ### Draft order index selection This page shows a table of multiple draft orders. The `admin.draft-order-index.selection-action.render` target is available on this page when multiple draft orders are selected. You can control the visibility of the action by using the `admin.draft-order-index.selection-action.should-render` target. ### Gift card details This page shows information about a single gift card. The `admin.gift-card-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.gift-card-details.action.should-render` target. ### Order details This page shows information about a single order. The `admin.order-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.order-details.action.should-render` target. ### Order details fulfilled card This page shows information about a single order, including a card showing the fulfillment details. The `admin.order-fulfilled-card.action.render` target is available on this page, but only if your app is selected as the fulfillment app for that order. You can control the visibility of the action by using the `admin.order-fulfilled-card.action.should-render` target. ### Order index This page shows a table of multiple orders. The `admin.order-index.action.render` target is available on this page. You can control the visibility of the action by using the `admin.order-index.action.should-render` target. ### Order index selection This page shows a table of multiple orders. The `admin.order-index.selection-action.render` target is available on this page when multiple orders are selected. You can control the visibility of the action by using the `admin.order-index.selection-action.should-render` target. ### Product details This page shows information about a single product. The `admin.product-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.product-details.action.should-render` target. ### Product index This page shows a table of multiple products. The `admin.product-index.action.render` target is available on this page. You can control the visibility of the action by using the `admin.product-index.action.should-render` target. ### Product index selection This page shows a table of multiple products. The `admin.product-index.selection-action.render` target is available on this page when multiple products are selected. You can control the visibility of the action by using the `admin.product-index.selection-action.should-render` target. ### Product variant details This page shows information about a single product variant. The `admin.product-variant-details.action.render` target is available on this page. You can control the visibility of the action by using the `admin.product-variant-details.action.should-render` target. ### Product detail purchase options card This page shows information about a single product, including a card showing purchase options. The `admin.product-purchase-option.action.render` target is available on this page when selling plans exists. You can control the visibility of the action by using the `admin.product-purchase-option.action.should-render` target. ### Product variant detail purchase options card This page shows information about a single product variant, including a card showing purchase options. The `admin.product-variant-purchase-option.action.render` target is available on this page when selling plans exists. You can control the visibility of the action by using the `admin.product-variant-purchase-option.action.should-render` target. ## Admin block locations Admin block extensions appear on resource detail pages throughout the admin. Learn more about [admin blocks](/docs/apps/admin/admin-actions-and-blocks#admin-blocks). ### Abandoned checkout details This page shows information about a single abandoned checkout. The `admin.abandoned-checkout-details.block.render` target is available on this page. ### Catalog details This page shows information about a single catalog. The `admin.catalog-details.block.render` target is available on this page. ### Collection details This page shows information about a single collection. The `admin.collection-details.block.render` target is available on this page. ### Company details This page shows information about a single company. The `admin.company-details.block.render` target is available on this page. ### Company location details This page shows information about a location for a company. The `admin.company-location-details.block.render` target is available on this page. ### Customer details This page shows information about a single customer. The `admin.customer-details.block.render` target is available on this page. ### Draft order details This page shows information about a single draft order. The `admin.draft-order-details.block.render` target is available on this page. ### Gift card details This page shows information about a single gift card. The `admin.gift-card-details.block.render` target is available on this page. ### Discount details function settings This page shows information about a single discount. The `admin.discount-details.function-settings.render` target is available on this page. ### Order details This page shows information about a single order. The `admin.order-details.block.render` target is available on this page. ### Product details This page shows information about a single product. The `admin.product-details.block.render` target is available on this page. ### Product variant details This page shows information about a single product variant. The `admin.product-variant-details.block.render` target is available on this page. ## Admin print action locations Admin print action extensions appear on order and product pages in the admin. ### Order details This page shows information about a single order. The `admin.order-details.print-action.render` target is available on this page. ### Product details This page shows information about a single product. The `admin.product-details.print-action.render` target is available on this page. ### Order index selection This page shows a table of multiple orders. The `admin.order-index.selection-print-action.render` target is available on this page when multiple orders are selected. ### Product index selection This page shows a table of multiple products. The `admin.product-index.selection-print-action.render` target is available on this page when multiple products are selected. ## Admin link extension locations Admin link extensions appear on resource pages throughout the admin. Learn more about [admin actions](/docs/apps/admin/admin-actions-and-blocks#admin-actions). ### Abandoned checkout details This page shows information about a single abandoned checkout. The `admin.abandoned-checkout-details.action.link` target is available in the "More actions" on the page. ### Collection details This page shows information about a single collection. The `admin.collection-details.action.link` target is available in the "More actions" on the page. ### Collection index This page shows a table of multiple collections. The `admin.collection-index.action.link` target is available in the "More actions" on the page. ### Customer details This page shows information about a single customer. The `admin.customer-details.action.link` target is available in the "More actions" on the page. ### Customer index This page shows a table of multiple customers. The `admin.customer-index.action.link` target is available in the "More actions" on the page. ### Customer index selection This page shows a table of multiple customers. The `admin.customer-index.selection-action.link` target is available on this page when multiple customers are selected. ### Discount index This page shows a table of multiple discounts. The `admin.discount-index.action.link` target is available in the "More actions" on the page. ### Draft order details This page shows information about a single draft order. The `admin.draft-order-details.action.link` target is available in the "More actions" on the page. ### Draft order index This page shows a table of multiple draft orders. The `admin.draft-order-index.action.link` target is available in the "More actions" on the page. ### Draft order index selection This page shows a table of multiple draft orders. The `admin.draft-order-index.selection-action.link` target is available on this page when multiple draft orders are selected. ### Order details This page shows information about a single order. The `admin.order-details.action.link` target is available in the "More actions" on the page. ### Order index This page shows a table of multiple orders. The `admin.order-index.action.link` target is available in the "More actions" on the page. ### Order index selection This page shows a table of multiple orders. The `admin.order-index.selection-action.link` target is available on this page when multiple orders are selected. ### Product details This page shows information about a single product. The `admin.product-details.action.link` target is available in the "More actions" on the page. ### Product index This page shows a table of multiple products. The `admin.product-index.action.link` target is available in the "More actions" on the page. ### Product index selection This page shows a table of multiple products. The `admin.product-index.selection-action.link` target is available on this page when multiple products are selected. ### Product variant details This page shows information about a single product variant. The `admin.product-variant-details.action.link` target is available in the "More actions" on the page. ## Customer segmentation locations Customer segmentation extensions appear in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/create-customer-segments). Learn more about [customer segmentation](/docs/apps/marketing/customer-segments). ## Product configuration locations Product configuration extensions appear on the product details and product variant details pages, and allow configuration of product bundles. Learn more about [product configuration](/docs/apps/selling-strategies/bundles/product-config). ## Validation settings locations Validation settings extensions appear in the checkout rules section of the settings page. They allow merchants to configure validation rules for their checkout. Learn more about [validation settings](/docs/apps/checkout/validation). ## References - [Action Extension API](https://shopify.dev/docs/api/admin-extensions/2023-10/api/action-extension-api.txt): This API is available to all action extension types. - [Block Extension API](https://shopify.dev/docs/api/admin-extensions/2023-10/api/block-extension-api.txt): This API is available to all block extension types. - [CustomerSegmentTemplate Extension API](https://shopify.dev/docs/api/admin-extensions/2023-10/api/customersegmenttemplate-extension-api.txt): This API is available to all customer segment template extension types. - [Extension Targets](https://shopify.dev/docs/api/admin-extensions/2023-10/api/extension-targets.txt): This is a list of all the available extension targets for Admin App Extensions. - [Standard API](https://shopify.dev/docs/api/admin-extensions/2023-10/api/standard-api.txt): This API is available to all extension types. - [AdminAction](https://shopify.dev/docs/api/admin-extensions/2023-10/components/other/adminaction.txt): AdminAction is a component used by Admin Action extensions to configure a primary and secondary action and title. - [AdminBlock](https://shopify.dev/docs/api/admin-extensions/2023-10/components/other/adminblock.txt): This component is similar to the AdminBlock, providing a deeper integration with the container your UI is rendered into. However, this only applies to Block Extensions which render inline on a resource page. - [BlockStack](https://shopify.dev/docs/api/admin-extensions/2023-10/components/structure/blockstack.txt): This structures layout elements along the vertical axis of the page. It's useful for vertical alignment. - [Box](https://shopify.dev/docs/api/admin-extensions/2023-10/components/structure/box.txt): This is your foundational structural element for composing UI. It can be styled using predefined tokens. Use it to build your layout. - [Button](https://shopify.dev/docs/api/admin-extensions/2023-10/components/actions/button.txt): Use this component when you want to provide users the ability to perform specific actions, like saving data. - [Checkbox](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/checkbox.txt): Use this component when you want to provide users with a clear selection option, such as for agreeing to terms and conditions or selecting multiple options from a list. - [CustomerSegmentTemplate](https://shopify.dev/docs/api/admin-extensions/2023-10/components/other/customersegmenttemplate.txt): CustomerSegmentTemplate is used to configure a template rendered in the **Customers** section of the Shopify admin. Templates can be applied in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments) and used to create segments. - [Divider](https://shopify.dev/docs/api/admin-extensions/2023-10/components/structure/divider.txt): Use this to create a clear visual separation between different elements in your user interface. - [EmailField](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/emailfield.txt): Use this when you need users to provide their email addresses. - [Form](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/form.txt): Use this component when you want to collect input from users. It provides a structure for various input fields and controls, such as text fields, checkboxes, and buttons. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [Heading](https://shopify.dev/docs/api/admin-extensions/2023-10/components/titles-and-text/heading.txt): Use this to display a title. It's similar to the h1-h6 tags in HTML - [HeadingGroup](https://shopify.dev/docs/api/admin-extensions/2023-10/components/titles-and-text/headinggroup.txt): This groups headings together, much like the hgroup element in HTML. - [Icon](https://shopify.dev/docs/api/admin-extensions/2023-10/components/media/icon.txt): This component renders an icon from a predefined list. Choose the one that suits your needs. - [Image](https://shopify.dev/docs/api/admin-extensions/2023-10/components/media/image.txt): Use this when you want to display an image. - [InlineStack](https://shopify.dev/docs/api/admin-extensions/2023-10/components/structure/inlinestack.txt): Use this to organize layout elements along the horizontal axis of the page. It's great for horizontal alignment. - [Link](https://shopify.dev/docs/api/admin-extensions/2023-10/components/actions/link.txt): This is an interactive component that directs users to a specified URL. It even supports custom protocols. - [NumberField](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/numberfield.txt): This component is specifically designed for numeric data entry. - [PasswordField](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/passwordfield.txt): This component is for secure input, it obfuscates any text that users enter. - [Pressable](https://shopify.dev/docs/api/admin-extensions/2023-10/components/actions/pressable.txt): Use this component when you need to capture click or press events on its child elements without adding any additional visual styling. It subtly enhances user interaction by changing the cursor when hovering over the child elements, providing a clear indication of interactivity. - [Select](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/select.txt): Use this when you want to give users a predefined list of options to choose from. - [Text](https://shopify.dev/docs/api/admin-extensions/2023-10/components/titles-and-text/text.txt): This component renders text. Remember, you can also add your own styling. - [TextArea](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/textarea.txt): This component is perfect when you need to allow users to input larger amounts of text, such as for comments, feedback, or any other multi-line input. - [TextField](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/textfield.txt): This is your go-to component when you need to let users input textual information. - [URLField](https://shopify.dev/docs/api/admin-extensions/2023-10/components/forms/urlfield.txt): This is the right component for letting users enter a URL. - [Action Extension API](https://shopify.dev/docs/api/admin-extensions/2024-01/api/action-extension-api.txt): This API is available to all action extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-action) for more information. - [Block Extension API](https://shopify.dev/docs/api/admin-extensions/2024-01/api/block-extension-api.txt): This API is available to all block extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-block) for more information. - [CustomerSegmentTemplate Extension API](https://shopify.dev/docs/api/admin-extensions/2024-01/api/customersegmenttemplate-extension-api.txt): This API is available to all customer segment template extension types. - [Extension Targets](https://shopify.dev/docs/api/admin-extensions/2024-01/api/extension-targets.txt): This is a list of all the available extension targets for Admin App Extensions. - [Standard API](https://shopify.dev/docs/api/admin-extensions/2024-01/api/standard-api.txt): This API is available to all extension types. - [AdminAction](https://shopify.dev/docs/api/admin-extensions/2024-01/components/other/adminaction.txt): AdminAction is a component used by Admin Action extensions to configure a primary and secondary action and title. - [AdminBlock](https://shopify.dev/docs/api/admin-extensions/2024-01/components/other/adminblock.txt): This component is similar to the AdminBlock, providing a deeper integration with the container your UI is rendered into. However, this only applies to Block Extensions which render inline on a resource page. - [Badge](https://shopify.dev/docs/api/admin-extensions/2024-01/components/titles-and-text/badge.txt): Use this component to inform merchants of the status of an object or of an action that’s been taken. - [Banner](https://shopify.dev/docs/api/admin-extensions/2024-01/components/titles-and-text/banner.txt): Use this component if you need to communicate to merchants in a prominent way. - [BlockStack](https://shopify.dev/docs/api/admin-extensions/2024-01/components/structure/blockstack.txt): This structures layout elements along the vertical axis of the page. It's useful for vertical alignment. - [Box](https://shopify.dev/docs/api/admin-extensions/2024-01/components/structure/box.txt): This is your foundational structural element for composing UI. It can be styled using predefined tokens. Use it to build your layout. - [Button](https://shopify.dev/docs/api/admin-extensions/2024-01/components/actions/button.txt): Use this component when you want to provide users the ability to perform specific actions, like saving data. - [Checkbox](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/checkbox.txt): Use this component when you want to provide users with a clear selection option, such as for agreeing to terms and conditions or selecting multiple options from a list. - [ChoiceList](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/choicelist.txt): Use this component if you need to group together a related list of interactive choices as radio buttons or checkboxes. - [ColorPicker](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/colorpicker.txt): Use this component if you need to select a color. - [CustomerSegmentTemplate](https://shopify.dev/docs/api/admin-extensions/2024-01/components/other/customersegmenttemplate.txt): CustomerSegmentTemplate is used to configure a template rendered in the **Customers** section of the Shopify admin. Templates can be applied in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments) and used to create segments. - [DateField](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/datefield.txt): This is a form field that lets users select a date using the DatePicker component. - [DatePicker](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/datepicker.txt): Date pickers let merchants choose dates from a visual calendar that’s consistently applied wherever dates need to be selected across Shopify. - [Divider](https://shopify.dev/docs/api/admin-extensions/2024-01/components/structure/divider.txt): Use this to create a clear visual separation between different elements in your user interface. - [EmailField](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/emailfield.txt): Use this when you need users to provide their email addresses. - [Form](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/form.txt): Use this component when you want to collect input from users. It provides a structure for various input fields and controls, such as text fields, checkboxes, and buttons. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [Heading](https://shopify.dev/docs/api/admin-extensions/2024-01/components/titles-and-text/heading.txt): Use this to display a title. It's similar to the h1-h6 tags in HTML - [HeadingGroup](https://shopify.dev/docs/api/admin-extensions/2024-01/components/titles-and-text/headinggroup.txt): This groups headings together, much like the hgroup element in HTML. - [Icon](https://shopify.dev/docs/api/admin-extensions/2024-01/components/media/icon.txt): This component renders an icon from a predefined list. Choose the one that suits your needs. - [Image](https://shopify.dev/docs/api/admin-extensions/2024-01/components/media/image.txt): Use this when you want to display an image. - [InlineStack](https://shopify.dev/docs/api/admin-extensions/2024-01/components/structure/inlinestack.txt): Use this to organize layout elements along the horizontal axis of the page. It's great for horizontal alignment. - [Link](https://shopify.dev/docs/api/admin-extensions/2024-01/components/actions/link.txt): This is an interactive component that directs users to a specified URL. It even supports custom protocols. - [MoneyField](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/moneyfield.txt): This is the right component for letting users enter Money digits. - [NumberField](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/numberfield.txt): This component is specifically designed for numeric data entry. - [Paragraph](https://shopify.dev/docs/api/admin-extensions/2024-01/components/titles-and-text/paragraph.txt): Use this to display a block of text similar to the `<p>` tag in HTML. - [PasswordField](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/passwordfield.txt): This component is for secure input, it obfuscates any text that users enter. - [Pressable](https://shopify.dev/docs/api/admin-extensions/2024-01/components/actions/pressable.txt): Use this component when you need to capture click or press events on its child elements without adding any additional visual styling. It subtly enhances user interaction by changing the cursor when hovering over the child elements, providing a clear indication of interactivity. - [ProgressIndicator](https://shopify.dev/docs/api/admin-extensions/2024-01/components/media/progressindicator.txt): Use this component to notify merchants that their action is being processed or loaded. - [Select](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/select.txt): Use this when you want to give users a predefined list of options to choose from. - [Text](https://shopify.dev/docs/api/admin-extensions/2024-01/components/titles-and-text/text.txt): This component renders text. Remember, you can also add your own styling. - [TextArea](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/textarea.txt): This component is perfect when you need to allow users to input larger amounts of text, such as for comments, feedback, or any other multi-line input. - [TextField](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/textfield.txt): This is your go-to component when you need to let users input textual information. - [URLField](https://shopify.dev/docs/api/admin-extensions/2024-01/components/forms/urlfield.txt): This is the right component for letting users enter a URL. - [Action Extension API](https://shopify.dev/docs/api/admin-extensions/2024-04/api/action-extension-api.txt): This API is available to all action extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-action) for more information. Note that the [`AdminAction`](/docs/api/admin-extensions/components/other/adminaction) component is required to build Admin action extensions. - [Block Extension API](https://shopify.dev/docs/api/admin-extensions/2024-04/api/block-extension-api.txt): This API is available to all block extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-block) for more information. - [Validation Settings API](https://shopify.dev/docs/api/admin-extensions/2024-04/api/validation-settings-api.txt): This API is available Validation Settings extensions. Refer to the [tutorial](/docs/apps/checkout/validation/create-complex-validation-rules) for more information. Note that the [`FunctionSettings`](/docs/api/admin-extensions/components/forms/functionsettings) component is required to build Validation Settings extensions. - [CustomerSegmentTemplate Extension API](https://shopify.dev/docs/api/admin-extensions/2024-04/api/customersegmenttemplate-extension-api.txt): This API is available to all customer segment template extension types. - [Extension Targets](https://shopify.dev/docs/api/admin-extensions/2024-04/api/extension-targets.txt): This is a list of all the available extension targets for Admin App Extensions. - [Standard API](https://shopify.dev/docs/api/admin-extensions/2024-04/api/standard-api.txt): This API is available to all extension types. - [AdminAction](https://shopify.dev/docs/api/admin-extensions/2024-04/components/other/adminaction.txt): AdminAction is a component used by Admin action extensions to configure a primary and secondary action and title. Use of this component is required in order to use Admin action extensions. - [AdminBlock](https://shopify.dev/docs/api/admin-extensions/2024-04/components/other/adminblock.txt): This component is similar to the AdminBlock, providing a deeper integration with the container your UI is rendered into. However, this only applies to Block Extensions which render inline on a resource page. - [Badge](https://shopify.dev/docs/api/admin-extensions/2024-04/components/titles-and-text/badge.txt): Use this component to inform merchants of the status of an object or of an action that’s been taken. - [Banner](https://shopify.dev/docs/api/admin-extensions/2024-04/components/titles-and-text/banner.txt): Use this component if you need to communicate to merchants in a prominent way. - [BlockStack](https://shopify.dev/docs/api/admin-extensions/2024-04/components/structure/blockstack.txt): This structures layout elements along the vertical axis of the page. It's useful for vertical alignment. - [Box](https://shopify.dev/docs/api/admin-extensions/2024-04/components/structure/box.txt): This is your foundational structural element for composing UI. It can be styled using predefined tokens. Use it to build your layout. - [Button](https://shopify.dev/docs/api/admin-extensions/2024-04/components/actions/button.txt): Use this component when you want to provide users the ability to perform specific actions, like saving data. - [Checkbox](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/checkbox.txt): Use this component when you want to provide users with a clear selection option, such as for agreeing to terms and conditions or selecting multiple options from a list. - [ChoiceList](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/choicelist.txt): Use this component if you need to group together a related list of interactive choices as radio buttons or checkboxes. - [ColorPicker](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/colorpicker.txt): Use this component if you need to select a color. - [CustomerSegmentTemplate](https://shopify.dev/docs/api/admin-extensions/2024-04/components/other/customersegmenttemplate.txt): CustomerSegmentTemplate is used to configure a template rendered in the **Customers** section of the Shopify admin. Templates can be applied in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments) and used to create segments. - [DateField](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/datefield.txt): This is a form field that lets users select a date using the DatePicker component. - [DatePicker](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/datepicker.txt): Date pickers let merchants choose dates from a visual calendar that’s consistently applied wherever dates need to be selected across Shopify. - [Divider](https://shopify.dev/docs/api/admin-extensions/2024-04/components/structure/divider.txt): Use this to create a clear visual separation between different elements in your user interface. - [EmailField](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/emailfield.txt): Use this when you need users to provide their email addresses. - [Form](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/form.txt): Use this component when you want to collect input from users. It provides a structure for various input fields and controls, such as text fields, checkboxes, and buttons. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [FunctionSettings](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/functionsettings.txt): FunctionSettings should be used when configuring the metafield configuration of a Shopify Function. It provides a structure for various input fields and controls, such as text fields, checkboxes, and selections. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [Heading](https://shopify.dev/docs/api/admin-extensions/2024-04/components/titles-and-text/heading.txt): Use this to display a title. It's similar to the h1-h6 tags in HTML - [HeadingGroup](https://shopify.dev/docs/api/admin-extensions/2024-04/components/titles-and-text/headinggroup.txt): This groups headings together, much like the hgroup element in HTML. - [Icon](https://shopify.dev/docs/api/admin-extensions/2024-04/components/media/icon.txt): This component renders an icon from a predefined list. Choose the one that suits your needs. - [Image](https://shopify.dev/docs/api/admin-extensions/2024-04/components/media/image.txt): Use this when you want to display an image. - [InlineStack](https://shopify.dev/docs/api/admin-extensions/2024-04/components/structure/inlinestack.txt): Use this to organize layout elements along the horizontal axis of the page. It's great for horizontal alignment. - [Link](https://shopify.dev/docs/api/admin-extensions/2024-04/components/actions/link.txt): This is an interactive component that directs users to a specified URL. It even supports custom protocols. - [MoneyField](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/moneyfield.txt): This is the right component for letting users enter Money digits. - [NumberField](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/numberfield.txt): This component is specifically designed for numeric data entry. - [Paragraph](https://shopify.dev/docs/api/admin-extensions/2024-04/components/titles-and-text/paragraph.txt): Use this to display a block of text similar to the `<p>` tag in HTML. - [PasswordField](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/passwordfield.txt): This component is for secure input, it obfuscates any text that users enter. - [Pressable](https://shopify.dev/docs/api/admin-extensions/2024-04/components/actions/pressable.txt): Use this component when you need to capture click or press events on its child elements without adding any additional visual styling. It subtly enhances user interaction by changing the cursor when hovering over the child elements, providing a clear indication of interactivity. - [ProgressIndicator](https://shopify.dev/docs/api/admin-extensions/2024-04/components/media/progressindicator.txt): Use this component to notify merchants that their action is being processed or loaded. - [Section](https://shopify.dev/docs/api/admin-extensions/2024-04/components/structure/section.txt): `Section` is a structural component that allows thematic grouping of content. Its visual style is contextual and controlled by Shopify, so a `Section` may look different depending on the component it is nested inside. `Section` also automatically increases the heading level for its content to ensure a semantically correct heading structure in the document. To further increase the heading level inside the `Section`, consider nesting new `Section`s. - [Select](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/select.txt): Use this when you want to give users a predefined list of options to choose from. - [Text](https://shopify.dev/docs/api/admin-extensions/2024-04/components/titles-and-text/text.txt): This component renders text. Remember, you can also add your own styling. - [TextArea](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/textarea.txt): This component is perfect when you need to allow users to input larger amounts of text, such as for comments, feedback, or any other multi-line input. - [TextField](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/textfield.txt): This is your go-to component when you need to let users input textual information. - [URLField](https://shopify.dev/docs/api/admin-extensions/2024-04/components/forms/urlfield.txt): This is the right component for letting users enter a URL. - [Action Extension API](https://shopify.dev/docs/api/admin-extensions/2024-07/api/action-extension-api.txt): This API is available to all action extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-action) for more information. Note that the [`AdminAction`](/docs/api/admin-extensions/components/other/adminaction) component is required to build Admin action extensions. - [Block Extension API](https://shopify.dev/docs/api/admin-extensions/2024-07/api/block-extension-api.txt): This API is available to all block extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-block) for more information. - [Validation Settings API](https://shopify.dev/docs/api/admin-extensions/2024-07/api/validation-settings-api.txt): This API is available to Validation Settings extensions. Refer to the [tutorial](/docs/apps/checkout/validation/create-complex-validation-rules) for more information. Note that the [`FunctionSettings`](/docs/api/admin-extensions/components/forms/functionsettings) component is required to build Validation Settings extensions. - [CustomerSegmentTemplate Extension API](https://shopify.dev/docs/api/admin-extensions/2024-07/api/customersegmenttemplate-extension-api.txt): This API is available to all customer segment template extension types. - [Print Action Extension API](https://shopify.dev/docs/api/admin-extensions/2024-07/api/print-action-extension-api.txt): This API is available to all print action extension types. Note that the [`AdminPrintAction`](/docs/api/admin-extensions/components/other/adminprintaction) component is required to build admin print action extensions. - [Standard API](https://shopify.dev/docs/api/admin-extensions/2024-07/api/standard-api.txt): This API is available to all extension types. - [AdminAction](https://shopify.dev/docs/api/admin-extensions/2024-07/components/other/adminaction.txt): AdminAction is a component used by Admin action extensions to configure a primary and secondary action and title. Use of this component is required in order to use Admin action extensions. - [AdminBlock](https://shopify.dev/docs/api/admin-extensions/2024-07/components/other/adminblock.txt): This component is similar to the AdminBlock, providing a deeper integration with the container your UI is rendered into. However, this only applies to Block Extensions which render inline on a resource page. - [AdminPrintAction](https://shopify.dev/docs/api/admin-extensions/2024-07/components/other/adminprintaction.txt): AdminPrintAction is a component used by admin print action extensions to denote a URL to print. Admin print action extensions require the use of this component. - [Badge](https://shopify.dev/docs/api/admin-extensions/2024-07/components/titles-and-text/badge.txt): Use this component to inform merchants of the status of an object or of an action that’s been taken. - [Banner](https://shopify.dev/docs/api/admin-extensions/2024-07/components/titles-and-text/banner.txt): Use this component if you need to communicate to merchants in a prominent way. - [BlockStack](https://shopify.dev/docs/api/admin-extensions/2024-07/components/structure/blockstack.txt): This structures layout elements along the vertical axis of the page. It's useful for vertical alignment. - [Box](https://shopify.dev/docs/api/admin-extensions/2024-07/components/structure/box.txt): This is your foundational structural element for composing UI. It can be styled using predefined tokens. Use it to build your layout. - [Button](https://shopify.dev/docs/api/admin-extensions/2024-07/components/actions/button.txt): Use this component when you want to provide users the ability to perform specific actions, like saving data. - [Checkbox](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/checkbox.txt): Use this component when you want to provide users with a clear selection option, such as for agreeing to terms and conditions or selecting multiple options from a list. - [ChoiceList](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/choicelist.txt): Use this component if you need to group together a related list of interactive choices as radio buttons or checkboxes. - [ColorPicker](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/colorpicker.txt): Use this component if you need to select a color. - [CustomerSegmentTemplate](https://shopify.dev/docs/api/admin-extensions/2024-07/components/other/customersegmenttemplate.txt): CustomerSegmentTemplate is used to configure a template rendered in the **Customers** section of the Shopify admin. Templates can be applied in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments) and used to create segments. - [DateField](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/datefield.txt): This is a form field that lets users select a date using the DatePicker component. - [DatePicker](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/datepicker.txt): Date pickers let merchants choose dates from a visual calendar that’s consistently applied wherever dates need to be selected across Shopify. - [Divider](https://shopify.dev/docs/api/admin-extensions/2024-07/components/structure/divider.txt): Use this to create a clear visual separation between different elements in your user interface. - [EmailField](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/emailfield.txt): Use this when you need users to provide their email addresses. - [Form](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/form.txt): Use this component when you want to collect input from users. It provides a structure for various input fields and controls, such as text fields, checkboxes, and buttons. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [FunctionSettings](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/functionsettings.txt): FunctionSettings should be used when configuring the metafield configuration of a Shopify Function. It provides a structure for various input fields and controls, such as text fields, checkboxes, and selections. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [Heading](https://shopify.dev/docs/api/admin-extensions/2024-07/components/titles-and-text/heading.txt): Use this to display a title. It's similar to the h1-h6 tags in HTML - [HeadingGroup](https://shopify.dev/docs/api/admin-extensions/2024-07/components/titles-and-text/headinggroup.txt): This groups headings together, much like the hgroup element in HTML. - [Icon](https://shopify.dev/docs/api/admin-extensions/2024-07/components/media/icon.txt): This component renders an icon from a predefined list. Choose the one that suits your needs. - [Image](https://shopify.dev/docs/api/admin-extensions/2024-07/components/media/image.txt): Use this when you want to display an image. - [InlineStack](https://shopify.dev/docs/api/admin-extensions/2024-07/components/structure/inlinestack.txt): Use this to organize layout elements along the horizontal axis of the page. It's great for horizontal alignment. - [Link](https://shopify.dev/docs/api/admin-extensions/2024-07/components/actions/link.txt): This is an interactive component that directs users to a specified URL. It even supports custom protocols. - [MoneyField](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/moneyfield.txt): This is the right component for letting users enter Money digits. - [NumberField](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/numberfield.txt): This component is specifically designed for numeric data entry. - [Paragraph](https://shopify.dev/docs/api/admin-extensions/2024-07/components/titles-and-text/paragraph.txt): Use this to display a block of text similar to the `<p>` tag in HTML. - [PasswordField](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/passwordfield.txt): This component is for secure input, it obfuscates any text that users enter. - [Pressable](https://shopify.dev/docs/api/admin-extensions/2024-07/components/actions/pressable.txt): Use this component when you need to capture click or press events on its child elements without adding any additional visual styling. It subtly enhances user interaction by changing the cursor when hovering over the child elements, providing a clear indication of interactivity. - [ProgressIndicator](https://shopify.dev/docs/api/admin-extensions/2024-07/components/media/progressindicator.txt): Use this component to notify merchants that their action is being processed or loaded. - [Section](https://shopify.dev/docs/api/admin-extensions/2024-07/components/structure/section.txt): `Section` is a structural component that allows thematic grouping of content. Its visual style is contextual and controlled by Shopify, so a `Section` may look different depending on the component it is nested inside. `Section` also automatically increases the heading level for its content to ensure a semantically correct heading structure in the document. To further increase the heading level inside the `Section`, consider nesting new `Section`s. - [Select](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/select.txt): Use this when you want to give users a predefined list of options to choose from. - [Text](https://shopify.dev/docs/api/admin-extensions/2024-07/components/titles-and-text/text.txt): This component renders text. Remember, you can also add your own styling. - [TextArea](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/textarea.txt): This component is perfect when you need to allow users to input larger amounts of text, such as for comments, feedback, or any other multi-line input. - [TextField](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/textfield.txt): This is your go-to component when you need to let users input textual information. - [URLField](https://shopify.dev/docs/api/admin-extensions/2024-07/components/forms/urlfield.txt): This is the right component for letting users enter a URL. - [Action Extension API](https://shopify.dev/docs/api/admin-extensions/2024-10/api/action-extension-api.txt): This API is available to all action extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-action) for more information. Note that the [`AdminAction`](/docs/api/admin-extensions/components/other/adminaction) component is required to build Admin action extensions. - [Block Extension API](https://shopify.dev/docs/api/admin-extensions/2024-10/api/block-extension-api.txt): This API is available to all block extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-block) for more information. - [Validation Settings API](https://shopify.dev/docs/api/admin-extensions/2024-10/api/validation-settings-api.txt): This API is available to Validation Settings extensions. Refer to the [tutorial](/docs/apps/checkout/validation/create-complex-validation-rules) for more information. Note that the [`FunctionSettings`](/docs/api/admin-extensions/components/forms/functionsettings) component is required to build Validation Settings extensions. - [CustomerSegmentTemplate Extension API](https://shopify.dev/docs/api/admin-extensions/2024-10/api/customersegmenttemplate-extension-api.txt): This API is available to all customer segment template extension types. - [Print Action Extension API](https://shopify.dev/docs/api/admin-extensions/2024-10/api/print-action-extension-api.txt): This API is available to all print action extension types. Note that the [`AdminPrintAction`](/docs/api/admin-extensions/components/other/adminprintaction) component is required to build admin print action extensions. - [Standard API](https://shopify.dev/docs/api/admin-extensions/2024-10/api/standard-api.txt): This API is available to all extension types. - [AdminAction](https://shopify.dev/docs/api/admin-extensions/2024-10/components/other/adminaction.txt): AdminAction is a component used by Admin action extensions to configure a primary and secondary action and title. Use of this component is required in order to use Admin action extensions. - [AdminBlock](https://shopify.dev/docs/api/admin-extensions/2024-10/components/other/adminblock.txt): This component is similar to the AdminBlock, providing a deeper integration with the container your UI is rendered into. However, this only applies to Block Extensions which render inline on a resource page. - [AdminPrintAction](https://shopify.dev/docs/api/admin-extensions/2024-10/components/other/adminprintaction.txt): AdminPrintAction is a component used by admin print action extensions to denote a URL to print. Admin print action extensions require the use of this component. - [Badge](https://shopify.dev/docs/api/admin-extensions/2024-10/components/titles-and-text/badge.txt): Use this component to inform merchants of the status of an object or of an action that’s been taken. - [Banner](https://shopify.dev/docs/api/admin-extensions/2024-10/components/titles-and-text/banner.txt): Use this component if you need to communicate to merchants in a prominent way. - [BlockStack](https://shopify.dev/docs/api/admin-extensions/2024-10/components/structure/blockstack.txt): This structures layout elements along the vertical axis of the page. It's useful for vertical alignment. - [Box](https://shopify.dev/docs/api/admin-extensions/2024-10/components/structure/box.txt): This is your foundational structural element for composing UI. It can be styled using predefined tokens. Use it to build your layout. - [Button](https://shopify.dev/docs/api/admin-extensions/2024-10/components/actions/button.txt): Use this component when you want to provide users the ability to perform specific actions, like saving data. - [Checkbox](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/checkbox.txt): Use this component when you want to provide users with a clear selection option, such as for agreeing to terms and conditions or selecting multiple options from a list. - [ChoiceList](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/choicelist.txt): Use this component if you need to group together a related list of interactive choices as radio buttons or checkboxes. - [ColorPicker](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/colorpicker.txt): Use this component if you need to select a color. - [CustomerSegmentTemplate](https://shopify.dev/docs/api/admin-extensions/2024-10/components/other/customersegmenttemplate.txt): CustomerSegmentTemplate is used to configure a template rendered in the **Customers** section of the Shopify admin. Templates can be applied in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments) and used to create segments. - [DateField](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/datefield.txt): This is a form field that lets users select a date using the DatePicker component. - [DatePicker](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/datepicker.txt): Date pickers let merchants choose dates from a visual calendar that’s consistently applied wherever dates need to be selected across Shopify. - [Divider](https://shopify.dev/docs/api/admin-extensions/2024-10/components/structure/divider.txt): Use this to create a clear visual separation between different elements in your user interface. - [EmailField](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/emailfield.txt): Use this when you need users to provide their email addresses. - [Form](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/form.txt): Use this component when you want to collect input from users. It provides a structure for various input fields and controls, such as text fields, checkboxes, and buttons. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [FunctionSettings](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/functionsettings.txt): FunctionSettings should be used when configuring the metafield configuration of a Shopify Function. It provides a structure for various input fields and controls, such as text fields, checkboxes, and selections. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [Heading](https://shopify.dev/docs/api/admin-extensions/2024-10/components/titles-and-text/heading.txt): Use this to display a title. It's similar to the h1-h6 tags in HTML - [HeadingGroup](https://shopify.dev/docs/api/admin-extensions/2024-10/components/titles-and-text/headinggroup.txt): This groups headings together, much like the hgroup element in HTML. - [Icon](https://shopify.dev/docs/api/admin-extensions/2024-10/components/media/icon.txt): This component renders an icon from a predefined list. Choose the one that suits your needs. - [Image](https://shopify.dev/docs/api/admin-extensions/2024-10/components/media/image.txt): Use this when you want to display an image. - [InlineStack](https://shopify.dev/docs/api/admin-extensions/2024-10/components/structure/inlinestack.txt): Use this to organize layout elements along the horizontal axis of the page. It's great for horizontal alignment. - [Link](https://shopify.dev/docs/api/admin-extensions/2024-10/components/actions/link.txt): This is an interactive component that directs users to a specified URL. It even supports custom protocols. - [MoneyField](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/moneyfield.txt): This is the right component for letting users enter Money digits. - [NumberField](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/numberfield.txt): This component is specifically designed for numeric data entry. - [Paragraph](https://shopify.dev/docs/api/admin-extensions/2024-10/components/titles-and-text/paragraph.txt): Use this to display a block of text similar to the `<p>` tag in HTML. - [PasswordField](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/passwordfield.txt): This component is for secure input, it obfuscates any text that users enter. - [Pressable](https://shopify.dev/docs/api/admin-extensions/2024-10/components/actions/pressable.txt): Use this component when you need to capture click or press events on its child elements without adding any additional visual styling. It subtly enhances user interaction by changing the cursor when hovering over the child elements, providing a clear indication of interactivity. - [ProgressIndicator](https://shopify.dev/docs/api/admin-extensions/2024-10/components/media/progressindicator.txt): Use this component to notify merchants that their action is being processed or loaded. - [Section](https://shopify.dev/docs/api/admin-extensions/2024-10/components/structure/section.txt): `Section` is a structural component that allows thematic grouping of content. Its visual style is contextual and controlled by Shopify, so a `Section` may look different depending on the component it is nested inside. `Section` also automatically increases the heading level for its content to ensure a semantically correct heading structure in the document. To further increase the heading level inside the `Section`, consider nesting new `Section`s. - [Select](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/select.txt): Use this when you want to give users a predefined list of options to choose from. - [Text](https://shopify.dev/docs/api/admin-extensions/2024-10/components/titles-and-text/text.txt): This component renders text. Remember, you can also add your own styling. - [TextArea](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/textarea.txt): This component is perfect when you need to allow users to input larger amounts of text, such as for comments, feedback, or any other multi-line input. - [TextField](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/textfield.txt): This is your go-to component when you need to let users input textual information. - [URLField](https://shopify.dev/docs/api/admin-extensions/2024-10/components/forms/urlfield.txt): This is the right component for letting users enter a URL. - [Action Extension API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/action-extension-api.txt): This API is available to all action extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-action) for more information. Note that the [`AdminAction`](/docs/api/admin-extensions/components/other/adminaction) component is required to build Admin action extensions. - [Block Extension API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/block-extension-api.txt): This API is available to all block extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-block) for more information. - [Validation Settings API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/validation-settings-api.txt): This API is available to Validation Settings extensions. Refer to the [tutorial](/docs/apps/checkout/validation/create-complex-validation-rules) for more information. Note that the [`FunctionSettings`](/docs/api/admin-extensions/components/forms/functionsettings) component is required to build Validation Settings extensions. - [CustomerSegmentTemplate Extension API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/customersegmenttemplate-extension-api.txt): This API is available to all customer segment template extension types. - [Discount Function Settings API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/discount-function-settings-api.txt): This API is available to Discount Function Settings extensions. Refer to the [tutorial](/docs/apps/build/discounts/build-ui-extension) for more information. Note that the [`FunctionSettings`](/docs/api/admin-extensions/components/forms/functionsettings) component is required to build Discount Function Settings extensions. - [Picker](https://shopify.dev/docs/api/admin-extensions/2025-01/api/picker.txt): Opens a Picker in your app - [Print Action Extension API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/print-action-extension-api.txt): This API is available to all print action extension types. Note that the [`AdminPrintAction`](/docs/api/admin-extensions/components/other/adminprintaction) component is required to build admin print action extensions. - [Resource Picker](https://shopify.dev/docs/api/admin-extensions/2025-01/api/resource-picker.txt): Opens a Resource Picker in your app - [ShouldRender API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/shouldrender-api.txt): This API is available to all shouldRender extension types. - [Standard API](https://shopify.dev/docs/api/admin-extensions/2025-01/api/target-apis/standard-api.txt): This API is available to all extension types. - [AdminAction](https://shopify.dev/docs/api/admin-extensions/2025-01/components/other/adminaction.txt): AdminAction is a component used by Admin action extensions to configure a primary and secondary action and title. Use of this component is required in order to use Admin action extensions. - [AdminBlock](https://shopify.dev/docs/api/admin-extensions/2025-01/components/other/adminblock.txt): This component is similar to the AdminBlock, providing a deeper integration with the container your UI is rendered into. However, this only applies to Block Extensions which render inline on a resource page. - [AdminPrintAction](https://shopify.dev/docs/api/admin-extensions/2025-01/components/other/adminprintaction.txt): AdminPrintAction is a component used by admin print action extensions to denote a URL to print. Admin print action extensions require the use of this component. - [Badge](https://shopify.dev/docs/api/admin-extensions/2025-01/components/titles-and-text/badge.txt): Use this component to inform merchants of the status of an object or of an action that’s been taken. - [Banner](https://shopify.dev/docs/api/admin-extensions/2025-01/components/titles-and-text/banner.txt): Use this component if you need to communicate to merchants in a prominent way. - [BlockStack](https://shopify.dev/docs/api/admin-extensions/2025-01/components/structure/blockstack.txt): This structures layout elements along the vertical axis of the page. It's useful for vertical alignment. - [Box](https://shopify.dev/docs/api/admin-extensions/2025-01/components/structure/box.txt): This is your foundational structural element for composing UI. It can be styled using predefined tokens. Use it to build your layout. - [Button](https://shopify.dev/docs/api/admin-extensions/2025-01/components/actions/button.txt): Use this component when you want to provide users the ability to perform specific actions, like saving data. - [Checkbox](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/checkbox.txt): Use this component when you want to provide users with a clear selection option, such as for agreeing to terms and conditions or selecting multiple options from a list. - [ChoiceList](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/choicelist.txt): Use this component if you need to group together a related list of interactive choices as radio buttons or checkboxes. - [ColorPicker](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/colorpicker.txt): Use this component if you need to select a color. - [CustomerSegmentTemplate](https://shopify.dev/docs/api/admin-extensions/2025-01/components/other/customersegmenttemplate.txt): CustomerSegmentTemplate is used to configure a template rendered in the **Customers** section of the Shopify admin. Templates can be applied in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments) and used to create segments. - [DateField](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/datefield.txt): This is a form field that lets users select a date using the DatePicker component. - [DatePicker](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/datepicker.txt): Date pickers let merchants choose dates from a visual calendar that’s consistently applied wherever dates need to be selected across Shopify. - [Divider](https://shopify.dev/docs/api/admin-extensions/2025-01/components/structure/divider.txt): Use this to create a clear visual separation between different elements in your user interface. - [EmailField](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/emailfield.txt): Use this when you need users to provide their email addresses. - [Form](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/form.txt): Use this component when you want to collect input from users. It provides a structure for various input fields and controls, such as text fields, checkboxes, and buttons. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [FunctionSettings](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/functionsettings.txt): FunctionSettings should be used when configuring the metafield configuration of a Shopify Function. It provides a structure for various input fields and controls, such as text fields, checkboxes, and selections. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [Heading](https://shopify.dev/docs/api/admin-extensions/2025-01/components/titles-and-text/heading.txt): Use this to display a title. It's similar to the h1-h6 tags in HTML - [HeadingGroup](https://shopify.dev/docs/api/admin-extensions/2025-01/components/titles-and-text/headinggroup.txt): This groups headings together, much like the hgroup element in HTML. - [Icon](https://shopify.dev/docs/api/admin-extensions/2025-01/components/media/icon.txt): This component renders an icon from a predefined list. Choose the one that suits your needs. - [Image](https://shopify.dev/docs/api/admin-extensions/2025-01/components/media/image.txt): Use this when you want to display an image. - [InlineStack](https://shopify.dev/docs/api/admin-extensions/2025-01/components/structure/inlinestack.txt): Use this to organize layout elements along the horizontal axis of the page. It's great for horizontal alignment. - [Link](https://shopify.dev/docs/api/admin-extensions/2025-01/components/actions/link.txt): This is an interactive component that directs users to a specified URL. It even supports custom protocols. - [MoneyField](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/moneyfield.txt): This is the right component for letting users enter Money digits. - [NumberField](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/numberfield.txt): This component is specifically designed for numeric data entry. - [Paragraph](https://shopify.dev/docs/api/admin-extensions/2025-01/components/titles-and-text/paragraph.txt): Use this to display a block of text similar to the `<p>` tag in HTML. - [PasswordField](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/passwordfield.txt): This component is for secure input, it obfuscates any text that users enter. - [Pressable](https://shopify.dev/docs/api/admin-extensions/2025-01/components/actions/pressable.txt): Use this component when you need to capture click or press events on its child elements without adding any additional visual styling. It subtly enhances user interaction by changing the cursor when hovering over the child elements, providing a clear indication of interactivity. - [ProgressIndicator](https://shopify.dev/docs/api/admin-extensions/2025-01/components/media/progressindicator.txt): Use this component to notify merchants that their action is being processed or loaded. - [Section](https://shopify.dev/docs/api/admin-extensions/2025-01/components/structure/section.txt): `Section` is a structural component that allows thematic grouping of content. Its visual style is contextual and controlled by Shopify, so a `Section` may look different depending on the component it is nested inside. `Section` also automatically increases the heading level for its content to ensure a semantically correct heading structure in the document. To further increase the heading level inside the `Section`, consider nesting new `Section`s. - [Select](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/select.txt): Use this when you want to give users a predefined list of options to choose from. - [Text](https://shopify.dev/docs/api/admin-extensions/2025-01/components/titles-and-text/text.txt): This component renders text. Remember, you can also add your own styling. - [TextArea](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/textarea.txt): This component is perfect when you need to allow users to input larger amounts of text, such as for comments, feedback, or any other multi-line input. - [TextField](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/textfield.txt): This is your go-to component when you need to let users input textual information. - [URLField](https://shopify.dev/docs/api/admin-extensions/2025-01/components/forms/urlfield.txt): This is the right component for letting users enter a URL. - [Action Extension API](https://shopify.dev/docs/api/admin-extensions/unstable/api/action-extension-api.txt): This API is available to all action extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-action) for more information. Note that the [`AdminAction`](/docs/api/admin-extensions/components/other/adminaction) component is required to build Admin action extensions. - [Block Extension API](https://shopify.dev/docs/api/admin-extensions/unstable/api/block-extension-api.txt): This API is available to all block extension types. Refer to the [tutorial](/docs/apps/admin/admin-actions-and-blocks/build-an-admin-block) for more information. - [Validation Settings API](https://shopify.dev/docs/api/admin-extensions/unstable/api/validation-settings-api.txt): This API is available to Validation Settings extensions. Refer to the [tutorial](/docs/apps/checkout/validation/create-complex-validation-rules) for more information. Note that the [`FunctionSettings`](/docs/api/admin-extensions/components/forms/functionsettings) component is required to build Validation Settings extensions. - [CustomerSegmentTemplate Extension API](https://shopify.dev/docs/api/admin-extensions/unstable/api/customersegmenttemplate-extension-api.txt): This API is available to all customer segment template extension types. - [Print Action Extension API](https://shopify.dev/docs/api/admin-extensions/unstable/api/print-action-extension-api.txt): This API is available to all print action extension types. Note that the [`AdminPrintAction`](/docs/api/admin-extensions/components/other/adminprintaction) component is required to build admin print action extensions. - [ShouldRender API](https://shopify.dev/docs/api/admin-extensions/unstable/api/shouldrender-api.txt): This API is available to all shouldRender extension types. - [Standard API](https://shopify.dev/docs/api/admin-extensions/unstable/api/standard-api.txt): This API is available to all extension types. - [AdminAction](https://shopify.dev/docs/api/admin-extensions/unstable/components/other/adminaction.txt): AdminAction is a component used by Admin action extensions to configure a primary and secondary action and title. Use of this component is required in order to use Admin action extensions. - [AdminBlock](https://shopify.dev/docs/api/admin-extensions/unstable/components/other/adminblock.txt): This component is similar to the AdminBlock, providing a deeper integration with the container your UI is rendered into. However, this only applies to Block Extensions which render inline on a resource page. - [AdminPrintAction](https://shopify.dev/docs/api/admin-extensions/unstable/components/other/adminprintaction.txt): AdminPrintAction is a component used by admin print action extensions to denote a URL to print. Admin print action extensions require the use of this component. - [Badge](https://shopify.dev/docs/api/admin-extensions/unstable/components/titles-and-text/badge.txt): Use this component to inform merchants of the status of an object or of an action that’s been taken. - [Banner](https://shopify.dev/docs/api/admin-extensions/unstable/components/titles-and-text/banner.txt): Use this component if you need to communicate to merchants in a prominent way. - [BlockStack](https://shopify.dev/docs/api/admin-extensions/unstable/components/structure/blockstack.txt): This structures layout elements along the vertical axis of the page. It's useful for vertical alignment. - [Box](https://shopify.dev/docs/api/admin-extensions/unstable/components/structure/box.txt): This is your foundational structural element for composing UI. It can be styled using predefined tokens. Use it to build your layout. - [Button](https://shopify.dev/docs/api/admin-extensions/unstable/components/actions/button.txt): Use this component when you want to provide users the ability to perform specific actions, like saving data. - [Checkbox](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/checkbox.txt): Use this component when you want to provide users with a clear selection option, such as for agreeing to terms and conditions or selecting multiple options from a list. - [ChoiceList](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/choicelist.txt): Use this component if you need to group together a related list of interactive choices as radio buttons or checkboxes. - [ColorPicker](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/colorpicker.txt): Use this component if you need to select a color. - [CustomerSegmentTemplate](https://shopify.dev/docs/api/admin-extensions/unstable/components/other/customersegmenttemplate.txt): CustomerSegmentTemplate is used to configure a template rendered in the **Customers** section of the Shopify admin. Templates can be applied in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments) and used to create segments. - [DateField](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/datefield.txt): This is a form field that lets users select a date using the DatePicker component. - [DatePicker](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/datepicker.txt): Date pickers let merchants choose dates from a visual calendar that’s consistently applied wherever dates need to be selected across Shopify. - [Divider](https://shopify.dev/docs/api/admin-extensions/unstable/components/structure/divider.txt): Use this to create a clear visual separation between different elements in your user interface. - [EmailField](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/emailfield.txt): Use this when you need users to provide their email addresses. - [Form](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/form.txt): Use this component when you want to collect input from users. It provides a structure for various input fields and controls, such as text fields, checkboxes, and buttons. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [FunctionSettings](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/functionsettings.txt): FunctionSettings should be used when configuring the metafield configuration of a Shopify Function. It provides a structure for various input fields and controls, such as text fields, checkboxes, and selections. It also integrates with the native Contextual Save Bar to handle form submission and reset actions. - [Heading](https://shopify.dev/docs/api/admin-extensions/unstable/components/titles-and-text/heading.txt): Use this to display a title. It's similar to the h1-h6 tags in HTML - [HeadingGroup](https://shopify.dev/docs/api/admin-extensions/unstable/components/titles-and-text/headinggroup.txt): This groups headings together, much like the hgroup element in HTML. - [Icon](https://shopify.dev/docs/api/admin-extensions/unstable/components/media/icon.txt): This component renders an icon from a predefined list. Choose the one that suits your needs. - [Image](https://shopify.dev/docs/api/admin-extensions/unstable/components/media/image.txt): Use this when you want to display an image. - [InlineStack](https://shopify.dev/docs/api/admin-extensions/unstable/components/structure/inlinestack.txt): Use this to organize layout elements along the horizontal axis of the page. It's great for horizontal alignment. - [Link](https://shopify.dev/docs/api/admin-extensions/unstable/components/actions/link.txt): This is an interactive component that directs users to a specified URL. It even supports custom protocols. - [MoneyField](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/moneyfield.txt): This is the right component for letting users enter Money digits. - [NumberField](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/numberfield.txt): This component is specifically designed for numeric data entry. - [Paragraph](https://shopify.dev/docs/api/admin-extensions/unstable/components/titles-and-text/paragraph.txt): Use this to display a block of text similar to the `<p>` tag in HTML. - [PasswordField](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/passwordfield.txt): This component is for secure input, it obfuscates any text that users enter. - [Pressable](https://shopify.dev/docs/api/admin-extensions/unstable/components/actions/pressable.txt): Use this component when you need to capture click or press events on its child elements without adding any additional visual styling. It subtly enhances user interaction by changing the cursor when hovering over the child elements, providing a clear indication of interactivity. - [ProgressIndicator](https://shopify.dev/docs/api/admin-extensions/unstable/components/media/progressindicator.txt): Use this component to notify merchants that their action is being processed or loaded. - [Section](https://shopify.dev/docs/api/admin-extensions/unstable/components/structure/section.txt): `Section` is a structural component that allows thematic grouping of content. Its visual style is contextual and controlled by Shopify, so a `Section` may look different depending on the component it is nested inside. `Section` also automatically increases the heading level for its content to ensure a semantically correct heading structure in the document. To further increase the heading level inside the `Section`, consider nesting new `Section`s. - [Select](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/select.txt): Use this when you want to give users a predefined list of options to choose from. - [Text](https://shopify.dev/docs/api/admin-extensions/unstable/components/titles-and-text/text.txt): This component renders text. Remember, you can also add your own styling. - [TextArea](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/textarea.txt): This component is perfect when you need to allow users to input larger amounts of text, such as for comments, feedback, or any other multi-line input. - [TextField](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/textfield.txt): This is your go-to component when you need to let users input textual information. - [URLField](https://shopify.dev/docs/api/admin-extensions/unstable/components/forms/urlfield.txt): This is the right component for letting users enter a URL.