@spot-flow/checkout-inline-js 0.1.16 → 0.1.22

package/README.md

@@ -3,36 +3,44 @@
 
 This project is an inline library that enables users to make payments seamlessly. It integrates smoothly into your application, providing a streamlined checkout experience.
 
-For React components and usage, [link](https://github.com/Spotflow-One/react-spotflow-checkout)
+For React components and usage, [React NPM Package](https://www.npmjs.com/package/@spot-flow/react-spotflow-checkout)
 
-For Vue.js components and usage, [link](https://github.com/Spotflow-One/vue-spotflow-checkout)
-
-For Angular components and usage, [link](https://github.com/Spotflow-One/angular-spotflow-checkout)
+For Vue.js components and usage, [Vue NPM Package](https://www.npmjs.com/package/@spot-flow/vue-spotflow-checkout)
 
+For Angular components and usage, [Angular NPM Package](https://www.npmjs.com/package/@spot-flow/ng-spotflow-checkout)
 
 ## Demo
-<img width="808" alt="Screenshot 2024-07-26 at 16 05 52" src="https://github.com/user-attachments/assets/4dbb0b2e-2142-4f04-994a-5c352de7d30e">
 
+<img width="808" alt="Screenshot 2024-07-26 at 16 05 52" src="https://github.com/user-attachments/assets/4dbb0b2e-2142-4f04-994a-5c352de7d30e">
 
 ## Installation
+
  ```sh
 npm install @spot-flow/checkout-inline-js
    ```
 
 ## Usage
- ```sh
+
+ ```javascript
  import { CheckoutForm } from "@spot-flow/checkout-inline-js";
 
- const checkout = new CheckoutForm(
-       merchantKey = "<sk_test_f998479c0eedhXXXXXXXXXXXXXXXX>"// This is your Merchant Key generated for your Merchant on Spotflow
-       email = "email",
-       amount = 1000,
-     );
- checkout.setup();
+      const { CheckoutForm } = SpotflowCheckout;
+      const checkout = new CheckoutForm({});
+      checkout.setup({
+        email: "oludkhsdksn@gmail.com",
+        encryptionKey: "g4ryXXXXXXXXXXXX=",
+        merchantKey: "sk_test_d96889XXXXXXX684adXXXXX5b69",
+        planId: "3c902af2-3333-333-xxxxxxx,
+        amount: 5,
+        onSuccess: (value) => {
+          console.log("Fully Success", { value })
+        }
+      });
  ```
 
 Alternatively, you can include it directly in your HTML via a CDN:
-```sh 
+
+```sh
 <script src="https://dr4h9151gox1m.cloudfront.net/dist/checkout-inline.js"></script>  
 ```
 
@@ -41,50 +49,24 @@ Alternatively, you can include it directly in your HTML via a CDN:
     Make Payment
  </button>
  ```
- ```sh
+
+ ```javascript
  <script>
+
    const openCheckout = () => {
-     const { CheckoutForm } = SpotflowCheckout
-     const checkout = new CheckoutForm(
-       merchantKey = "<sk_test_f998479c0eedhXXXXXXXXXXXXXXXX>"// This is your Merchant Key generated for your Merchant on Spotflow
-       email = "temi@mailinator.com",
-       amount = 1000,
-     );
-     checkout.setup();
+      const { CheckoutForm } = SpotflowCheckout;
+      const checkout = new CheckoutForm({});
+      checkout.setup({
+        email: "oludkhsdksn@gmail.com",
+        encryptionKey: "g4ryXXXXXXXXXXXX=",
+        merchantKey: "sk_test_d96889XXXXXXX684adXXXXX5b69",
+        planId: "3c902af2-3333-333-xxxxxxx,
+        amount: 5,
+        onSuccess: (value) => {
+          console.log("Fully Success", { value })
+        }
+      });
    };
+
  </script>
  ```
-
-
-## Contributing
-
-We welcome contributions! Follow the steps below to get started:
-
-### Getting Started
-
-1. **Clone the repository:**
-
-   ```sh
-   git clone https://github.com/Spotflow-One/spotflow-checkout.git
-   cd your-repo
-   ```
-
-2. **Install dependencies:**
-
-   ```sh
-   npm install
-   ```
-
-### Example Usage
-
-You can see an example of how to use the library in `index.html`. Open this file in your browser to see it in action.
-
-### Building the Project
-
-To build the project, run:
-
-```sh
-npm run build
-```
-
-This will compile the source files and generate the output in the `dist` directory.

package/dist/api.d.ts

@@ -1,9 +1,10 @@
 import { CardPaymentRequestPayload, PaymentResponseData, AuthorizeCardPaymentRequestPayload, ValidateCardPaymentRequestPayload, PaymentRequestPayload, GetPaymentRateParams, Rate, GetMerchantPlanDetail } from './types/types';
 
-export declare const createCardPayment: (token: string, payload: CardPaymentRequestPayload) => Promise<PaymentResponseData>;
-export declare const authorizeCardPayment: (token: string, payload: AuthorizeCardPaymentRequestPayload) => Promise<PaymentResponseData>;
-export declare const validateCardPayment: (token: string, payload: ValidateCardPaymentRequestPayload) => Promise<PaymentResponseData>;
-export declare const createTransferPayment: (token: string, payload: PaymentRequestPayload) => Promise<PaymentResponseData>;
-export declare const verifyPayment: (token: string, reference: string, signal?: AbortSignal) => Promise<PaymentResponseData>;
-export declare function getRate(token: string, payload: GetPaymentRateParams): Promise<Rate>;
-export declare function getCheckoutConfiguration(secret: string, planId: string): Promise<GetMerchantPlanDetail>;
+export declare const getHeaders: (token: string, rdtCode?: string) => Headers;
+export declare const createCardPayment: (token: string, payload: CardPaymentRequestPayload, rdtCode?: string, url?: string) => Promise<PaymentResponseData>;
+export declare const authorizeCardPayment: (token: string, payload: AuthorizeCardPaymentRequestPayload, rdtCode?: string, url?: string) => Promise<PaymentResponseData>;
+export declare const validateCardPayment: (token: string, payload: ValidateCardPaymentRequestPayload, rdtCode?: string, url?: string) => Promise<PaymentResponseData>;
+export declare const createTransferPayment: (token: string, payload: PaymentRequestPayload, rdtCode?: string, url?: string) => Promise<PaymentResponseData>;
+export declare const verifyPayment: (token: string, reference: string, signal?: AbortSignal, rdtCode?: string, url?: string) => Promise<PaymentResponseData>;
+export declare function getRate(token: string, payload: GetPaymentRateParams, rdtCode?: string, url?: string): Promise<Rate>;
+export declare function getCheckoutConfiguration(secret: string, planId: string, rdtCode?: string, url?: string): Promise<GetMerchantPlanDetail>;

package/dist/apis/payment.service.d.ts

@@ -0,0 +1,47 @@
+import { AuthorizeCardPaymentRequestPayload, CardPaymentRequestPayload, GetBanksResponse, GetMerchantPlanDetail, GetPaymentRateParams, PaymentRequestPayload, PaymentResponseData, Rate, UssdPaymentRequestPayload, ValidateCardPaymentRequestPayload } from '../types/types';
+
+type Props = {
+    token: string;
+    rdtCode?: string;
+    url?: string;
+};
+export declare class BaseService {
+    protected token: string;
+    protected baseurl: string;
+    protected headers: Headers;
+    protected rdtCode?: string;
+    protected url?: string;
+    constructor(props: Props);
+    protected getHeaders: (token: string, rdtCode?: string) => Headers;
+}
+type PaymentServiceProps = Props;
+export declare class PaymentService extends BaseService {
+    constructor(props: PaymentServiceProps);
+    createCardPayment(payload: CardPaymentRequestPayload): Promise<PaymentResponseData>;
+    createUssdPayment(payload: UssdPaymentRequestPayload): Promise<PaymentResponseData>;
+    validateCardPayment(payload: ValidateCardPaymentRequestPayload): Promise<PaymentResponseData>;
+    authorizeCardPayment(payload: AuthorizeCardPaymentRequestPayload): Promise<PaymentResponseData>;
+    createTransferPayment(payload: PaymentRequestPayload): Promise<PaymentResponseData>;
+    verifyPayment(reference: string, signal?: AbortSignal): Promise<PaymentResponseData>;
+}
+type RateServiceProps = Props;
+export declare class RateService extends BaseService {
+    constructor(props: RateServiceProps);
+    getRate(payload: GetPaymentRateParams): Promise<Rate>;
+}
+type MerchantConfigServiceProps = Props;
+export declare class MerchantConfigService extends BaseService {
+    constructor(props: MerchantConfigServiceProps);
+    /**
+     *
+     * @param planId this is the planId for the subscriptions
+     * @returns {Promise<GetMerchantPlanDetail>}
+     */
+    getMerchantConfig(planId: string): Promise<GetMerchantPlanDetail>;
+}
+type BankServiceProps = Props;
+export declare class BankService extends BaseService {
+    constructor(props: BankServiceProps);
+    getBankList(): Promise<GetBanksResponse>;
+}
+export {};

package/dist/checkout-class.d.ts

@@ -12,6 +12,7 @@ declare class CheckoutForm {
     private onClose;
     encryption: string;
     mainScreen: MainPageScreen;
+    private merchantConfigService;
     mainError: SharedErrorScreen;
     mainLoader: PageLoader;
     private merchantPlanDetail;
@@ -20,8 +21,13 @@ declare class CheckoutForm {
     email: string;
     amount: number;
     isMobile: boolean;
+    rdtCode: string;
+    url: string;
+    reference: string;
+    currency: string;
     constructor(config: Partial<SpotflowProps>);
     closeBTN(): void;
+    getDeviceType(): "Mobile" | "Tablet" | "Desktop";
     setup(config: Partial<SpotflowProps>): void;
     private getPlanDetails;
     closeModal(): void;