# Action Extension API This API is available to all action extension types. Refer to the [tutorial](https://shopify.dev/docs/apps/admin/admin-actions-and-blocks/build-an-admin-action) for more information. Note that the [`AdminAction`](https://shopify.dev/docs/api/admin-extensions/components/other/adminaction) component is required to build Admin action extensions. ## ActionExtensionApi ### ActionExtensionApi ### close value: `() => void` Closes the extension. Calling this method is equivalent to the merchant clicking the "x" in the corner of the overlay. ### data value: `Data` Information about the currently viewed or selected items. ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### ExtensionTargets ### Playground value: `RenderExtension, AllComponents>` ### admin.customers.segmentation-templates.render value: `RenderExtension< CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.render'>, CustomerSegmentTemplateComponent >` Renders a [`CustomerSegmentTemplate`](https://shopify.dev/docs/api/admin-extensions/components/customersegmenttemplate) in the [customer segment editor](https://help.shopify.com/en/manual/customers/customer-segmentation/customer-segments). ### admin.product-details.block.render value: `RenderExtension< BlockExtensionApi<'admin.product-details.block.render'>, AllComponents >` Renders an Admin Block in the product details page. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.order-details.block.render value: `RenderExtension< BlockExtensionApi<'admin.order-details.block.render'>, AllComponents >` Renders an Admin Block in the order details page. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.customer-details.block.render value: `RenderExtension< BlockExtensionApi<'admin.customer-details.block.render'>, AllComponents >` Renders an Admin Block in the customer details page. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.product-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.product-details.action.render'>, AllComponents >` Renders an admin action extension in the product details page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.order-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.order-details.action.render'>, AllComponents >` Renders an admin action extension in the order details page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.customer-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.customer-details.action.render'>, AllComponents >` Renders an admin action extension in the customer details page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.customer-segment-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.customer-segment-details.action.render'>, AllComponents >` Renders an admin action extension in the customer segment details page. Open this extension from the "Use segment" button. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.product-index.action.render value: `RenderExtension< ActionExtensionApi<'admin.product-index.action.render'>, AllComponents >` Renders an admin action extension in the product index page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.order-index.action.render value: `RenderExtension< ActionExtensionApi<'admin.order-index.action.render'>, AllComponents >` Renders an admin action extension in the order index page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.customer-index.action.render value: `RenderExtension< ActionExtensionApi<'admin.customer-index.action.render'>, AllComponents >` Renders an admin action extension in the customer index page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.discount-index.action.render value: `RenderExtension< ActionExtensionApi<'admin.discount-index.action.render'>, AllComponents >` Renders an admin action extension in the discount index page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.collection-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.collection-details.action.render'>, AllComponents >` Renders an admin action extension in the collection details page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.collection-index.action.render value: `RenderExtension< ActionExtensionApi<'admin.collection-index.action.render'>, AllComponents >` Renders an admin action extension in the collection index page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.abandoned-checkout-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>, AllComponents >` Renders an admin action extension in the abandonded checkout page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.product-variant-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.product-variant-details.action.render'>, AllComponents >` Renders an admin action extension in the product variant details page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.draft-order-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.draft-order-details.action.render'>, AllComponents >` Renders an admin action extension in the draft order details page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.draft-order-index.action.render value: `RenderExtension< ActionExtensionApi<'admin.draft-order-index.action.render'>, AllComponents >` Renders an admin action extension in the draft orders page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.discount-details.action.render value: `RenderExtension< ActionExtensionApi<'admin.discount-details.action.render'>, AllComponents >` Renders an admin action extension in the discount details page. Open this extension from the "More Actions" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.order-fulfilled-card.action.render value: `RenderExtension< ActionExtensionApi<'admin.order-fulfilled-card.action.render'>, AllComponents >` Renders an admin action extension in the order fulfilled card. Open this extension from the "3-dot" menu inside the order fulfilled card. Note: This extension will only be visible on orders which were fulfilled by your app. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.product-index.selection-action.render value: `RenderExtension< ActionExtensionApi<'admin.product-index.selection-action.render'>, AllComponents >` Renders an admin action extension in the product index page when multiple resources are selected. Open this extension from the "More Actions" menu of the resource list. The resource ids are available to this extension at runtime. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.order-index.selection-action.render value: `RenderExtension< ActionExtensionApi<'admin.order-index.selection-action.render'>, AllComponents >` Renders an admin action extension in the order index page when multiple resources are selected. Open this extension from the "More Actions" menu of the resource list. The resource ids are available to this extension at runtime. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.customer-index.selection-action.render value: `RenderExtension< ActionExtensionApi<'admin.customer-index.selection-action.render'>, AllComponents >` Renders an admin action extension in the customer index page when multiple resources are selected. Open this extension from the "More Actions" menu of the resource list. The resource ids are available to this extension at runtime. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.draft-order-index.selection-action.render value: `RenderExtension< ActionExtensionApi<'admin.draft-order-index.selection-action.render'>, AllComponents >` Renders an admin action extension in the draft order page when multiple resources are selected. Open this extension from the "3-dot" menu. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.product-details.configuration.render value: `RenderExtension< ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>, ProductConfigurationComponents >` Renders Product Configuration on product details and product variant details See the [tutorial](https://shopify.dev/docs/apps/selling-strategies/bundles/product-config) for more information ### admin.product-variant-details.configuration.render value: `RenderExtension< ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>, ProductConfigurationComponents >` Renders Product Configuration on product details and product variant details See the [tutorial](https://shopify.dev/docs/apps/selling-strategies/bundles/product-config) for more information ### admin.settings.internal-order-routing-rule.render value: `RenderExtension< OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>, AllComponents | OrderRoutingComponents >` Renders Order Routing Rule Configuration on order routing settings. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### admin.settings.order-routing-rule.render value: `RenderExtension< OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>, AllComponents >` ### admin.settings.validation.render value: `RenderExtension< ValidationSettingsApi<'admin.settings.validation.render'>, AllComponents >` Renders Validation Settings within a given validation's add and edit views. See the [list of available components](https://shopify.dev/docs/api/admin-extensions/components). ### StandardApi The following APIs are provided to all extension targets. ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### I18n ### formatNumber value: `(number: number | bigint, options?: { inExtensionLocale?: boolean; } & NumberFormatOptions) => string` Returns a localized number. This function behaves like the standard `Intl.NumberFormat()` with a style of `decimal` applied. It uses the buyer's locale by default. ### formatCurrency value: `(number: number | bigint, options?: { inExtensionLocale?: boolean; } & NumberFormatOptions) => string` Returns a localized currency value. This function behaves like the standard `Intl.NumberFormat()` with a style of `currency` applied. It uses the buyer's locale by default. ### formatDate value: `(date: Date, options?: { inExtensionLocale?: boolean; } & DateTimeFormatOptions) => string` Returns a localized date value. This function behaves like the standard `Intl.DateTimeFormatOptions()` and uses the buyer's locale by default. Formatting options can be passed in as options. ### translate value: `I18nTranslate` Returns translated content in the buyer's locale, as supported by the extension. - `options.count` is a special numeric value used in pluralization. - The other option keys and values are treated as replacements for interpolation. - If the replacements are all primitives, then `translate()` returns a single string. - If replacements contain UI components, then `translate()` returns an array of elements. ### Intents ### launchUrl value: `string | URL` The URL that was used to launch the intent. ### CustomerSegmentTemplateApi ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### __enabledFeatures value: `"b2bEnabled"[]` ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### BlockExtensionApi ### data value: `Data` Information about the currently viewed or selected items. ### navigation value: `Navigation` Provides methods to navigate to other features in the Admin. Currently, only navigation from an admin block to an admin action extension *on the same resource page* is supported. For example, you can navigate from an admin block on the product details page (`admin.product-details.block.render`) to an admin action on the product details page (`admin.product-details.action.render`). ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### Navigation ### navigate value: `(url: string | URL) => void` Navigate to a specific route. ### ProductDetailsConfigurationApi ### data value: `{ product: Product; app: { launchUrl: string; applicationUrl: string; }; }` ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### Product ### id value: `string` ### title value: `string` ### handle value: `string` ### status value: `"ACTIVE" | "ARCHIVED" | "DRAFT"` ### totalVariants value: `number` ### totalInventory value: `number` ### hasOnlyDefaultVariant value: `boolean` ### onlineStoreUrl value: `string` ### options value: `{ id: string; name: string; position: number; values: string[]; }[]` ### productType value: `string` ### productCategory value: `string` ### productComponents value: `ProductComponent[]` ### ProductComponent ### id value: `string` ### title value: `string` ### featuredImage value: `{ id?: string; url?: string; altText?: string; }` ### totalVariants value: `number` ### productUrl value: `string` ### componentVariantsCount value: `number` ### nonComponentVariantsCount value: `number` ### ProductVariantDetailsConfigurationApi ### data value: `{ variant: ProductVariant; app: { launchUrl: string; applicationUrl: string; }; }` ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### ProductVariant ### id value: `string` ### sku value: `string` ### barcode value: `string` ### title value: `string` ### displayName value: `string` ### price value: `string` ### compareAtPrice value: `string` ### taxable value: `boolean` ### taxCode value: `string` ### weight value: `number` ### selectedOptions value: `{ name: string; value: string; }[]` ### productVariantComponents value: `ProductVariantComponent[]` ### ProductVariantComponent ### id value: `string` ### displayName value: `string` ### title value: `string` ### sku value: `string` ### image value: `{ id?: string; url?: string; altText?: string; }` ### productVariantUrl value: `string` ### selectedOptions value: `{ name: string; value: string; }[]` ### OrderRoutingRuleApi ### applyMetafieldsChange value: `ApplyMetafieldsChange` ### data value: `Data` ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### MetafieldUpdateChange ### type value: `"updateMetafield"` ### key value: `string` ### namespace value: `string` ### value value: `string | number` ### valueType value: `SupportedDefinitionType` ### MetafieldRemoveChange ### type value: `"removeMetafield"` ### key value: `string` ### namespace value: `string` ### InternalLocationListProps ### locationGroups value: `LocationGroup[]` An array of location groups. ### onMoveGroup value: `(oldIndex: number, newIndex: number) => void` Callback when a location group is moved. It receives the old index and the new index as parameters. ### onRenameGroup value: `(id: string, name: string) => void` Callback when a location group is renamed. It receives the id of the group and the new name as parameters. ### onDeleteGroup value: `(id: string) => void` Callback when a location group is deleted. It receives the id of the group as a parameter. ### onMoveTag value: `(tagId: number, oldGroupIndex: number, newGroupIndex: number) => void` Callback when a tag is moved from one group to another. It receives the id of the tag, the old group index, and the new group index as parameters. ### onCreateGroup value: `(id: string) => void` Callback when a new group is created. It receives the id of the new group as a parameter. ### LocationGroup ### locations value: `Location[]` An array of locations within the group. ### label value: `string` The label for the location group. ### id value: `string` A unique identifier for the location group. ### Location ### id value: `string` A unique identifier for the location. ### name value: `string` The name of the location. ### ValidationSettingsApi ### applyMetafieldChange value: `ApplyMetafieldChange` Applies a change to the validation settings. ### data value: `ValidationData` ### extension value: `{ target: ExtensionTarget; }` The identifier of the running extension target. ### i18n value: `I18n` Utilities for translating content according to the current localization of the admin. More info - /docs/apps/checkout/best-practices/localizing-ui-extensions ### intents value: `Intents` Provides information to the receiver the of an intent. ### query value: `(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>` Used to query the Admin GraphQL API ### MetafieldChangeSuccess ### type value: `"success"` ### MetafieldChangeResultError ### type value: `"error"` ### message value: `string` ### ValidationData The object that exposes the validation with its settings. ### validation value: `Validation` ### shopifyFunction value: `ShopifyFunction` ### Validation ### id value: `string` the validation's gid when active in a shop ### metafields value: `Metafield[]` the metafields owned by the validation ### Metafield ### description value: `string` ### id value: `string` ### namespace value: `string` ### key value: `string` ### value value: `string` ### type value: `string` ### ShopifyFunction ### id value: `string` the validation function's unique identifier