paygate-checkout-sdk 0.0.0 → 0.0.2

package/dist/index.d.ts

@@ -1,45 +1 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-type MerchantDataProps = {
-    clientId?: string;
-    firstName: string;
-    lastName: string;
-    email: string;
-    phoneNumber: string;
-    countryCode: string;
-    currencyCode: string;
-    transactionCurrency?: string;
-    merchantName?: string;
-    amount: number;
-    merchantReference?: string;
-    customerAddress?: string;
-    customerCity?: string;
-    customerState?: string;
-    customerCountry?: string;
-    customerPostalCode?: string;
-    webhookUrl?: string;
-    deviceSignature?: string;
-    ipAddress?: string;
-    metadataOrderId?: string;
-    metadataProductInfo?: string;
-    redirectUrl?: string;
-    merchantPublicKey?: string;
-    merchantSecretKey?: string;
-    merchantAPIKey?: string;
-    merchantSiteUrl: string;
-};
-type PaygateCheckoutSdkProps = {
-    userData: MerchantDataProps;
-    config?: {
-        theme?: "light" | "dark";
-        environment?: "test" | "live";
-        [key: string]: any;
-    };
-    onSuccess?: (response: any) => void;
-    onError?: (error: any) => void;
-};
-
-declare const PaygateCheckoutSdk: ({ userData }: PaygateCheckoutSdkProps) => react_jsx_runtime.JSX.Element;
-
-export { PaygateCheckoutSdk };
-export type { PaygateCheckoutSdkProps, MerchantDataProps as UserBasicDataType };
+import './index.css';

package/dist/index.d.tsx

@@ -0,0 +1,48 @@
+type MerchantDataProps = {
+    clientId?: string;
+    firstName: string;
+    lastName: string;
+    email: string;
+    phoneNumber: string;
+    countryCode: string;
+    currencyCode: string;
+    transactionCurrency?: string;
+    merchantName?: string;
+    amount: number;
+    merchantReference?: string;
+    customerAddress?: string;
+    customerCity?: string;
+    customerState?: string;
+    customerCountry?: string;
+    customerPostalCode?: string;
+    webhookUrl?: string;
+    deviceSignature?: string;
+    ipAddress?: string;
+    metadataOrderId?: string;
+    metadataProductInfo?: string;
+    redirectUrl?: string;
+    merchantPublicKey?: string;
+    merchantSecretKey?: string;
+    merchantAPIKey?: string;
+    merchantSiteUrl: string;
+};
+type PaygateCheckoutSdkProps = {
+    userData: MerchantDataProps;
+    config?: {
+        theme?: "light" | "dark";
+        environment?: "test" | "live";
+        [key: string]: any;
+    };
+    onSuccess?: (response: any) => void;
+    onError?: (error: any) => void;
+};
+
+declare const PaygateSdk: {
+    setup: (config: {
+        targetId: string;
+        props: PaygateCheckoutSdkProps;
+    }) => void;
+};
+
+export { PaygateSdk };
+export type { MerchantDataProps, PaygateCheckoutSdkProps };

package/dist/{index.esm.js → index.esm.jsx}

@@ -1,4 +1,5 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { createRoot } from 'react-dom/client';
 import * as React from 'react';
 import React__default, { useState, useCallback, useRef, useEffect } from 'react';
 import styled, { keyframes, css as css$1 } from 'styled-components';
@@ -7269,5 +7270,24 @@ const PaygateCheckoutSdk = ({ userData }) => {
                                                         }, style: { marginTop: 24 } }, { children: "Try Again" }))] })))] }))] })] }), jsxs(AcceptedCardsBox, { children: [jsx("span", Object.assign({ style: { fontWeight: 600, color: "rgb(40, 17, 156)" } }, { children: "We accept:" })), jsxs(AcceptedCardsInnerBox, { children: [jsx(VisaIcon, { width: "40", height: "30" }), jsx(MasterCardIcon, { width: "40", height: "30" }), jsx(VerveIcon, { width: "40", height: "30" }), jsx(AmexIcon, { width: "40", height: "30" }), jsx(DiscoverIcon, { width: "40", height: "30" })] })] }), jsxs(SecureBox, { children: [jsx(FaLockIcon, {}), jsxs(DivBox, { children: [jsx("span", Object.assign({ style: { fontWeight: 400, margin: "0px 5px", color: "#000" } }, { children: "secured by" })), jsx("span", Object.assign({ style: { color: "#28119C" } }, { children: "Blusalt" }))] })] }), isDrawerOpen && jsx(Overlay, { onClick: () => setIsDrawerOpen(false) })] })), isPaymanetSuccessful && (jsx(PaymentSuccessView, { reason: intiateCardPaymentResponse === null || intiateCardPaymentResponse === void 0 ? void 0 : intiateCardPaymentResponse.message, merchantSiteUrl: userData === null || userData === void 0 ? void 0 : userData.merchantSiteUrl })), isPaymanetFailed && (jsx(PaymentFailedView, { reason: intiateCardPaymentResponse === null || intiateCardPaymentResponse === void 0 ? void 0 : intiateCardPaymentResponse.message, merchantSiteUrl: userData === null || userData === void 0 ? void 0 : userData.merchantSiteUrl, handleReset: resetState, handleSelectedMethod: handleSelectedMethod })), show3DSIframe && redirect3DSUrl && (jsxs(Container, { children: [jsx("h2", { children: "3DS Authentication" }), jsx(Iframe, { ref: iframeRef, src: redirect3DSUrl, allow: "fullscreen" })] })), SnackbarUI()] }));
 };
 
-export { PaygateCheckoutSdk };
-//# sourceMappingURL=index.esm.js.map
+/**
+ * Sets up and renders the Paygate Checkout SDK component into a specified DOM element.
+ * @param config - Configuration object containing the targetId and props for the SDK.
+ */
+const setup = (config) => {
+    const { targetId, props } = config;
+    const container = document.getElementById(targetId);
+    if (container) {
+        const root = createRoot(container);
+        root.render(jsx(PaygateCheckoutSdk, Object.assign({}, props)));
+    }
+    else {
+        console.error(`Paygate SDK: Element with id "${targetId}" not found.`);
+    }
+};
+const PaygateSdk = {
+    setup,
+};
+
+export { PaygateSdk };
+//# sourceMappingURL=index.esm.jsx.map