# Payment & Transactions / Payment Redirect Full-screen payment gateway redirect/hand-off modal shown while payment is being processed. **Category:** Patterns **Storybook:** https://doc.ux4g.gov.in/web/?path=/story/ux4g-patterns-payment-transactions-payment-redirect--redirecting ## Pattern variants - Redirecting: https://doc.ux4g.gov.in/web/?path=/story/ux4g-patterns-payment-transactions-payment-redirect--redirecting ## When to use this pattern Use Payment & Transactions / Payment Redirect when building citizen-facing flows that match the described government journey. Combine components such as cards, forms, tables, buttons, and status indicators as shown in Storybook. ## Framework setup ### HTML / CDN ```html ``` ### React ```bash npm install ux4g-web-components ``` ```jsx import 'ux4g-web-components/styles.css'; import 'ux4g-web-components/design-system'; ``` ### Angular Update `angular.json`: ```json { "styles": [ "node_modules/ux4g-web-components/styles/ux4g.css", "src/styles.css" ], "scripts": [ "node_modules/ux4g-web-components/dist/runtime/design-system.js" ] } ``` ## Code examples The snippets below are extracted from the Storybook canvas for Payment & Transactions / Payment Redirect. Each example shows the rendered HTML, the equivalent React JSX, and the Angular template markup. ### 1. Redirecting — Redirecting to Payment Gateway HTML: ```html

Redirecting to payment gateway

Please do not press back or refresh the page while we securely redirect you.

Secure payment via PayGov - National Information Centre payment gateway.

``` React: ```jsx import React from 'react'; const PaymentTransactionsPaymentRedirectExample1Demo = () => ( <>

Redirecting to payment gateway

Please do not press back or refresh the page while we securely redirect you.

info

Secure payment via PayGov - National Information Centre payment gateway.

); export default PaymentTransactionsPaymentRedirectExample1Demo; ``` Angular: ```html

Redirecting to payment gateway

Please do not press back or refresh the page while we securely redirect you.

Secure payment via PayGov - National Information Centre payment gateway.

```