Skip to main content

Action API
APIs

The Action API allows an action extension to modally present its corresponding modal target.

Supporting targets

Anchor to actionapiActionApi

Anchor to presentModal
presentModal
() => void
required

Presents the action-overlay.render extension target on top of present view.

For example: if we are calling presentModal() from pos.purchase.post.action.menu-item.render, it should present pos.purchase.post.action.render.

Was this section helpful?

Anchor to examplesExamples

Examples of using the Action API.

Anchor to example-present-a-modal-from-post-purchase.Present a modal from post purchase.
Anchor to example-present-a-modal-from-smart-grid.Present a modal from smart grid.
Was this section helpful?

Present a modal from post purchase.

import React from 'react';
import {
reactExtension,
useApi,
Button,
} from '@shopify/ui-extensions-react/point-of-sale';

const PostPurchaseActionItem = () => {
const api = useApi<'pos.purchase.post.action.menu-item.render'>();

return <Button onPress={() => api.action.presentModal()} />;
};

export default reactExtension(
'pos.purchase.post.action.menu-item.render',
() => <PostPurchaseActionItem />,
);