@proximafortedev/payxy-payment-gateway-core 1.0.0 → 1.0.2

package/dist/index.d.ts

@@ -1 +1,483 @@
-export {}
+import { AxiosError } from 'axios';
+import { AxiosInstance } from 'axios';
+import { AxiosRequestConfig } from 'axios';
+import { Emitter } from 'mitt';
+import { FC } from 'react';
+import { FormInstance } from 'antd';
+import { InputRef } from 'antd';
+import { JSX } from 'react/jsx-runtime';
+import { Method } from 'axios';
+import { ModalFuncProps } from 'antd';
+import { NoInfer as NoInfer_2 } from '@tanstack/query-core';
+import { PropsWithChildren } from 'react';
+import { ReactNode } from 'react';
+import { RefObject } from 'react';
+import { RuleObject } from 'antd/es/form';
+import * as signalR from '@microsoft/signalr';
+import { StoreApi } from 'zustand';
+import { ThemeConfig } from 'antd';
+import { UseBoundStore } from 'zustand';
+import { UseMutationOptions } from '@tanstack/react-query';
+import { UseMutationResult } from '@tanstack/react-query';
+import { UseQueryOptions } from '@tanstack/react-query';
+import { UseQueryResult } from '@tanstack/react-query';
+
+export declare const AntdProvider: FC<PropsWithChildren>;
+
+export declare const apiClient: AxiosInstance;
+
+export declare type ApiError = AxiosError<BaseApiError>;
+
+export declare interface ApiResponse<T> {
+    responseCode: string;
+    responseMessage: string;
+    data: T;
+}
+
+export declare const App: () => JSX.Element;
+
+export declare type AppEvents = {
+    "payment-method:selected": number;
+    "payment-info:loaded": PaymentInfoData;
+    "payment:terminal": undefined;
+    "signalr:connected": undefined;
+    "signalr:reconnecting": undefined;
+    "signalr:reconnected": string | undefined;
+    "signalr:closed": Error | undefined;
+    "signalr:error": unknown;
+};
+
+export declare const BankTransfer: () => JSX.Element;
+
+export declare interface BaseApiError {
+    message: string;
+    code: string;
+}
+
+export declare interface Bin {
+    Id: number;
+    Name: string;
+    MinPanLength: number;
+    MaxPanLength: number;
+    BinRangeMinimum: number;
+    BinRangeMaximum: number;
+    BinImage: string;
+}
+
+export declare const Card: () => JSX.Element;
+
+export declare interface Customization {
+    bodyColor: string;
+    buttonColor: string;
+    footerText: string;
+    footerLink: string;
+    footerLogo: string;
+}
+
+export declare interface DeviceInformation {
+    httpBrowserLanguage?: string;
+    httpBrowserJavaEnabled?: boolean;
+    httpBrowserJavaScriptEnabled?: boolean;
+    httpBrowserColorDepth?: number;
+    httpBrowserScreenHeight?: number;
+    httpBrowserScreenWidth?: number;
+    httpBrowserTimeDifference?: string;
+    userAgentBrowserValue?: string;
+}
+
+export declare const emitter: Emitter<AppEvents>;
+
+export declare const errorModalProps: (callbackUrl?: string, data?: ValidatePaymentResponse | MakePaymentResponse) => ModalFuncProps;
+
+export declare const formatPrice: (amount: number | string, currency?: string) => string;
+
+export declare const getConnection: () => signalR.HubConnection | null;
+
+export declare const isStoreUrl: (url?: string) => boolean;
+
+export declare const isValidUrl: (str: string | undefined) => boolean;
+
+export declare interface MakePaymentRequest {
+    transactionId?: string;
+    paymentType?: number;
+    mode?: number;
+    bankCode?: string;
+    accountNumber?: string;
+    accountName?: string;
+    cardNumber?: string;
+    cvv?: string;
+    expiryMonth?: string;
+    expiryYear?: string;
+    expiryDate?: string;
+    currency?: string;
+    country?: string;
+    amount?: string;
+    email?: string;
+    phoneNumber?: string;
+    firstName?: string;
+    lastName?: string;
+    ip?: string;
+    dateOfBirth?: string;
+    bvn?: string;
+    redirectUrl?: string;
+    billingZip?: string;
+    billingCity?: string;
+    deviceFingerPrint?: string;
+    billingAddress?: string;
+    billingState?: string;
+    billingCountry?: string;
+    pin?: string;
+    callbackUrl?: string;
+    productId?: string;
+    productDescription?: string;
+    pageKey?: string;
+    productKey?: string;
+    authenticationResend?: string;
+    merchantType?: number;
+    metaData?: string;
+    narration?: string;
+    merchantId?: number;
+    cardBrand?: string;
+    token?: string;
+    entryType?: number;
+    deviceInformation?: DeviceInformation;
+    walletOption?: string;
+    invoiceId?: string;
+    isRecurring?: boolean;
+    isStaticRoute?: number;
+    ussdString?: string;
+    encrypted?: string;
+    accessCode?: string;
+    cardHolderName?: string;
+}
+
+export declare interface MakePaymentResponse {
+    responseCode: string;
+    responseMessage: string;
+    authenticatePaymentResponseCode: string;
+    authenticatePaymentResponseMessage: string;
+    transactionId: string;
+    providerReference: string;
+    transactionNumber: string;
+    isWebhookUrlSet: boolean;
+    accountNumber: string;
+    accountName: string;
+    bankName: string;
+}
+
+declare interface PaymentGatewayLayoutProps extends PropsWithChildren {
+    heading?: string;
+    subtext?: string;
+    showSidebar?: boolean;
+    footer?: ReactNode;
+}
+
+export declare const PaymentGatewayLayoutWrapper: FC<PaymentGatewayLayoutProps>;
+
+export declare interface PaymentInfoData {
+    email: string;
+    amount: string;
+    transactionId: string;
+    link: string;
+    reference: string;
+    businessName: string;
+    isActive: boolean;
+    cardPayment: boolean;
+    accountPayment: boolean;
+    ussdPayment: boolean;
+    qrPayment: boolean;
+    eNaira: boolean;
+    walletPayment: boolean;
+    bankTrasferPayment: boolean;
+    webHookUrl: string;
+    token: string;
+    currency: string;
+    callbackUrl: string;
+    publicKey: string;
+    transactionHistoryId: number;
+    productId: string;
+    productDescription: string;
+    totalAmount: string;
+    isChargeTransferedToCustomer: boolean;
+    isPaymentPageCustomizationEnabled: boolean;
+    customization: Customization;
+    merchantCode: string;
+    firstName: string;
+    lastName: string;
+    billingCountry: string;
+    billingState: string;
+    billingZip: string;
+    billingCity: string;
+    billingAddress: string;
+    phoneNumber?: string;
+}
+
+export declare const paymentOptions: {
+    value: number;
+    label: string;
+    key: string;
+}[];
+
+declare interface PaymentStore {
+    env: PayxyEnv;
+    paymentInfo: PaymentInfoData | null;
+    selectedSavedCard: SavedCards | null;
+    cardOption: string;
+    isMakePaymentSuccessful: boolean | null;
+    setEnv: (env: PayxyEnv) => void;
+    setMakePaymentSuccessful: (value: boolean | null) => void;
+    setCardOption: (value: string) => void;
+    setSelectedSavedCard: (card: SavedCards | null) => void;
+    setPaymentInfo: (info: PaymentInfoData) => void;
+    clearPaymentInfo: () => void;
+}
+
+declare class Payxy {
+    private options;
+    constructor(options: PayxyOptions);
+    /**
+     * Launch the payment gateway
+     */
+    init(): void;
+}
+export { Payxy }
+export default Payxy;
+
+export declare type PayxyEnv = "test" | "prod" | "staging" | "development";
+
+export declare interface PayxyOptions {
+    env?: PayxyEnv;
+    accessCode: string;
+    onSuccess?: (data: any) => void;
+    onError?: (data: any) => void;
+}
+
+export declare const ReactQueryProvider: FC<PropsWithChildren>;
+
+export declare interface RemoveCardRequest {
+    pan: string;
+    email: string;
+}
+
+export declare interface SavedCardRequest {
+    cardPan: string;
+    expiryMonth: string;
+    expiryYear: string;
+    cvv: string;
+    cardBrand: string;
+    firstname: string;
+    lastname: string;
+    billingZip: string;
+    billingCity: string;
+    billingAddress: string;
+    billingState: string;
+    billingCountry: string;
+    cardHolderName: string;
+    email: string;
+}
+
+export declare interface SavedCards {
+    cardPan: string;
+    expiryMonth: string;
+    expiryYear: string;
+    cvv: string;
+    cardBrand: string;
+    email: string;
+    billingZip: string;
+    billingCity: string;
+    billingAddress: string;
+    billingState: string;
+    billingCountry: string;
+    cardHolderName: string;
+}
+
+declare class SecureStorageUtil {
+    private getRawStorage;
+    private saveRawStorage;
+    setItem<T>(key: string, value: T): void;
+    getItem<T>(key: string): T | null;
+    removeItem(key: string): void;
+    clear(): void;
+    hasItem(key: string): boolean;
+}
+
+export declare const SideBar: FC<SideBarProps>;
+
+declare interface SideBarProps {
+    paymentInfo: PaymentInfoData;
+    onSelect?: (value: number) => void;
+}
+
+export declare const startConnection: () => Promise<signalR.HubConnection>;
+
+export declare const stopConnection: () => Promise<void>;
+
+export declare const storageHelper: SecureStorageUtil;
+
+export declare const successModalProps: (callbackUrl?: string, data?: ValidatePaymentResponse) => ModalFuncProps;
+
+export declare const themeConfig: ThemeConfig;
+
+export declare const useCardInfo: () => {
+    cardImg: () => string;
+    cardNumberValidator: (_rule: RuleObject, value: string) => Promise<void>;
+    formatCardNumber: (value: string) => string;
+    getCardNumberMaxLength: () => 24 | 19 | 23 | 22;
+    validateAndFormatExpiryDate: (cardExpiry: string) => string;
+    validateExpiryDate: (cardExpiry: string) => boolean | string;
+    handleCardInput: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    handleCardExpiry: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    handleOnSavedCard: () => void;
+    handleCardPayment: (request: Record<string, string>) => Promise<MakePaymentResponse | undefined>;
+    isSavingCard: boolean;
+    form: FormInstance<any>;
+    paymentInfo: PaymentInfoData | null;
+    isFormIncomplete: boolean;
+    cardNumber: any;
+    expiryDate: any;
+    cvv: any;
+    cardHolderName: any;
+    cardType: string;
+    isPending: boolean;
+    data: MakePaymentResponse | undefined;
+};
+
+export declare const useDisableEvent: () => {
+    cardNumberInputRef: RefObject<InputRef | null>;
+    cvvInputRef: RefObject<InputRef | null>;
+    expiryInputRef: RefObject<InputRef | null>;
+};
+
+export declare const useGetPaymentInfo: () => UseQueryResult<ApiResponse<PaymentInfoData>, ApiError>;
+
+export declare const useGetSavedCards: () => UseQueryResult<ApiResponse<SavedCards[]>, ApiError>;
+
+/**
+ * @example
+ *
+ * const { mutate, isLoading, error } = useHttpMutation({
+ *  url: "/api/user",
+ *  method: "POST",
+ *  onSuccess: () => queryClient.invalidateQueries("user"),
+ *  onError: (error) => console.error(error),
+ * });
+ */
+export declare function useHttpMutation<Data = unknown, Response = unknown>(options?: UseHttpMutationOptions<UseHttpMutationFunctionProps<Data>, Response>): UseMutationResult<Response, AxiosError<unknown, any>, UseHttpMutationFunctionProps<Data>, unknown>;
+
+export declare type UseHttpMutationAxiosOptions<Data> = Pick<AxiosRequestConfig<Data>, "url" | "data" | "method" | "headers">;
+
+export declare type UseHttpMutationFunctionProps<Data> = {
+    data?: Data;
+    config?: AxiosRequestConfig;
+};
+
+declare type UseHttpMutationOptions<Data, Response> = {
+    url?: string;
+    data?: Data;
+    method?: Method | string;
+    headers?: Record<string, string>;
+    axiosInstance?: AxiosInstance;
+    isAuthorized?: boolean;
+    enableEntityId?: boolean;
+} & UseMutationOptions<Response, AxiosError, Data>;
+
+/**
+ * @example
+ * const { data, isLoading, error } = useHttpQuery({
+ *  url: "/api/user",
+ *  enabled: !!token,
+ *  select: (data) => data.user,
+ *  headers: {
+ *    Authorization: `Bearer ${token}`,
+ *  }
+ * }
+ */
+export declare function useHttpQuery<Data = unknown, Response = unknown, Selected = Response, Error = ApiError>({ api, url, data, params, headers, responseType, method, ...queryOptions }: UseHttpQueryOptions<Data, Response, Selected, Error>): UseQueryResult<NoInfer_2<Selected>, Error>;
+
+export declare type UseHttpQueryAxiosOptions<Data> = Pick<AxiosRequestConfig<Data>, "url" | "data" | "method" | "headers" | "params" | "responseType">;
+
+export declare type UseHttpQueryOptions<Data, Response, Selected, Error> = UseHttpQueryAxiosOptions<Data> & UseQueryOptions<Response, Error, Selected> & {
+    /** Optional axios instance */
+    api?: AxiosInstance;
+};
+
+export declare const useMakePayment: () => {
+    isPending: boolean;
+    data: MakePaymentResponse | undefined;
+    onMakePayment: (form: MakePaymentRequest) => Promise<MakePaymentResponse | undefined>;
+};
+
+export declare const usePaymentPolling: ({ validatePaymentData, makePaymentData, onValidatePayment, validatePending, timeValue, }: {
+    validatePaymentData: {
+        responseCode: string;
+        responseMessage: string;
+    } | undefined;
+    makePaymentData: MakePaymentResponse | undefined;
+    onValidatePayment: (data: ValidatePaymentRequest) => Promise<{
+        responseCode: string;
+        responseMessage: string;
+    } | undefined>;
+    validatePending: boolean;
+    timeValue: number;
+}) => {
+    isPolling: boolean;
+};
+
+export declare const useRemoveCard: () => {
+    isPending: boolean;
+    data: {
+        responseCode: string;
+        responseMessage: string;
+    } | undefined;
+    onRemoveCard: (data: RemoveCardRequest) => Promise<{
+        responseCode: string;
+        responseMessage: string;
+    } | undefined>;
+};
+
+export declare const useSavedCard: () => {
+    isPending: boolean;
+    data: {
+        responseCode: string;
+        responseMessage: string;
+    } | undefined;
+    onSavedCard: (data: SavedCardRequest) => Promise<{
+        responseCode: string;
+        responseMessage: string;
+    } | undefined>;
+};
+
+export declare const useStore: UseBoundStore<StoreApi<PaymentStore>>;
+
+export declare const useTimer: (seconds?: number) => {
+    timeRemaining: string;
+    resetTimer: () => void;
+    timeValue: number;
+};
+
+export declare const useTransactionTimeout: (timeValue: number, callbackUrl?: string) => void;
+
+export declare const useValidatePayment: () => {
+    onValidatePayment: (data: ValidatePaymentRequest) => Promise<ValidatePaymentResponse | undefined>;
+    isPending: boolean;
+    data: ValidatePaymentResponse | undefined;
+};
+
+export declare const USSD: () => JSX.Element;
+
+export declare interface ValidatePaymentRequest {
+    transactionId: string;
+    providerReference: string;
+    otp?: string;
+    entryType?: number;
+}
+
+export declare interface ValidatePaymentResponse {
+    responseCode: string;
+    responseMessage: string;
+    orderReference: string;
+    chargedAmount: string;
+    providerReference: string;
+}
+
+export { }

package/dist/payxy-payment-gateway-core.css

@@ -1 +1 @@
-.ant-radio-wrapper{border-bottom:1px solid #00000010!important;padding-top:3rem;padding-bottom:2rem;width:100%!important}.ant-radio-wrapper:first-child{padding-top:0!important}.ant-radio-wrapper .ant-radio-checked .ant-radio-inner{border:5px solid #e1edff!important}.ant-radio-wrapper .ant-radio-inner:after{background-color:#0569ff!important}@media (width <= 767px){.ant-radio-wrapper{padding-top:1rem;padding-bottom:1rem}}.ant-tabs-tab{font-weight:300!important}
+.ant-radio-wrapper{border-bottom:1px solid #00000010!important;padding-top:3rem;padding-bottom:2rem;width:100%!important}.ant-radio-wrapper:first-child{padding-top:0!important}.ant-radio-wrapper .ant-radio-checked .ant-radio-inner{border:5px solid #e1edff!important}.ant-radio-wrapper .ant-radio-inner:after{background-color:#0569ff!important}@media(max-width:767px){.ant-radio-wrapper{padding-top:1rem;padding-bottom:1rem}}.ant-tabs-tab{font-weight:300!important}