udp-react-enterprise-component-library 1.0.5-beta.2 → 1.0.6

package/dist/types/utilities/form/Field.d.ts

@@ -0,0 +1,23 @@
+import { InputBaseComponentProps } from '@material-ui/core';
+import React, { ElementType, ComponentType } from 'react';
+import { FieldProps as FinalFieldProps, FieldRenderProps } from 'react-final-form';
+export interface MuiFieldComponentProps {
+    error?: boolean;
+    helperText?: React.ReactNode;
+    inputProps?: InputBaseComponentProps;
+    onChange: React.ChangeEventHandler;
+    ComponentProps?: MuiFieldComponentProps;
+}
+export type MuiFieldComponent = ElementType<MuiFieldComponentProps>;
+export type FieldProps<FieldValue, RP extends FieldRenderProps<FieldValue, T>, T extends HTMLElement = HTMLElement> = {
+    component: MuiFieldComponent;
+    // @fixme Some of the onChange handlers pass value instead
+    valueForChange?: (event: React.ChangeEvent<T>) => FieldValue;
+} & Pick<FinalFieldProps<FieldValue, RP, T>, 'afterSubmit' | 'allowNull' | 'beforeSubmit' | 'defaultValue' | 'format' | 'formatOnBlur' | 'initialValue' | 'isEqual' | 'name' | 'parse' | 'subscription' | 'type' | 'validate' | 'validateFields' | 'value' | 'required'> & MuiFieldComponentProps; // @fixme Add another generic to extend this with componentProps
+type FieldComponent<FieldValue = any, RP extends FieldRenderProps<FieldValue, T> = FieldRenderProps<FieldValue, HTMLElement>, T extends HTMLElement = HTMLElement> = ComponentType<FieldProps<FieldValue, RP, T>>;
+/**
+ * final-form Field wrapper that supports using Material UI fields as components
+ * @todo Implement a validation function that uses required, etc... (or defer this till Redwerks' form library is built)
+ */
+export declare let Field: FieldComponent;
+export {};

package/dist/types/utilities/form/Form.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { AnyObject, FormProps as FinalFormProps, FormRenderProps } from 'react-final-form';
+export interface FormProps<FormValues = AnyObject> extends FinalFormProps<FormValues> {
+    children?: (props: FormRenderProps<FormValues>) => React.ReactNode;
+    id?: string;
+}
+export declare const Form: React.FC<FormProps>;

package/dist/types/utilities/form/FormButtons.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export type FormButtonsProps = {};
+export declare const FormButtons: React.FC<FormButtonsProps>;

package/dist/types/utilities/form/FormError.d.ts

@@ -0,0 +1,7 @@
+import { TypographyProps } from '@material-ui/core';
+import { FC } from 'react';
+export type FormErrorProps = TypographyProps<'p', {}>;
+/**
+ * Displays form-wide validation and submit errors in a MUI Typography error element
+ */
+export declare const FormError: FC<FormErrorProps>;

package/dist/types/utilities/form/FormSpy.d.ts

@@ -0,0 +1,10 @@
+import React, { FC } from 'react';
+import { AnyObject, FormSpyProps as FinalFormSpyProps, FormSpyRenderProps } from 'react-final-form';
+export interface FormSpyProps<FormValues = AnyObject> extends FinalFormSpyProps<FormValues> {
+    children?: (props: FormSpyRenderProps<FormValues>) => React.ReactNode;
+    id?: string;
+}
+/**
+ * final-form Form Spy wrapper
+ */
+export declare const FormSpy: FC<FormSpyProps>;

package/dist/types/utilities/form/SubmitButton.d.ts

@@ -0,0 +1,14 @@
+import { ButtonProps } from '@material-ui/core';
+import React, { ComponentType } from 'react';
+import { FluentButton } from '../../UI/inputs/buttons/FluentButton';
+export type SubmitButtonProps<P = {}, D extends React.ElementType = 'button'> = ButtonProps<D, P> & {
+    // @fixme Probably want to swap this with something that'll allow ...otherProps to inherit the specified component's props to pass through
+    ButtonComponent?: typeof FluentButton;
+    disablePristine: boolean;
+};
+type SubmitButtonComponent<P = {}, D extends React.ElementType = 'button'> = ComponentType<SubmitButtonProps<P, D>>;
+/**
+ * A MUI Button varaint intended for use as the submit button for a form
+ */
+export declare let SubmitButton: SubmitButtonComponent;
+export {};

package/dist/types/utilities/form/arrayMutators.d.ts

@@ -0,0 +1,2 @@
+import arrayMutators from 'final-form-arrays';
+export { arrayMutators };

package/dist/types/utilities/form/final-form-scroll/createDecorator.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The decorator is created based on final-form-focus https://github.com/final-form/final-form-focus
+ */
+declare const createDecorator: () => (form: any) => () => void;
+export default createDecorator;

package/dist/types/utilities/form/final-form-scroll/findInput.d.ts

@@ -0,0 +1,2 @@
+declare const findInput: (inputs: any, errors: any) => any;
+export default findInput;

package/dist/types/utilities/form/final-form-scroll/getAllInputs.d.ts

@@ -0,0 +1,2 @@
+declare const getAllInputs: () => any;
+export default getAllInputs;

package/dist/types/utilities/form/final-form-scroll/isFocusableInput.d.ts

@@ -0,0 +1,2 @@
+declare const isFocusableInput: (wtf: any) => boolean;
+export default isFocusableInput;

package/dist/types/utilities/form/formHooks.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @returns {any}
+ */
+export declare const useForm: () => any;
+/**
+ * @returns {any}
+ */
+export declare const useField: () => any;
+/**
+ * @returns {any}
+ */
+export declare const useFormState: () => any;

package/dist/types/utilities/form/index.d.ts

@@ -0,0 +1,9 @@
+export * from './Form';
+export * from './Field';
+export * from './FormError';
+export * from './SubmitButton';
+export * from './FormButtons';
+export * from './useFieldChangeListener';
+export * from './FormSpy';
+export * from './formHooks';
+export * from './arrayMutators';

package/dist/types/utilities/form/paymentForm/AccountPayment.model.d.ts

@@ -0,0 +1,143 @@
+import { PaymentVendorFactoryEnum } from "../../../enums/paymentVendorFactoryEnum";
+export interface PaymentDetails {
+    accountNumber?: string;
+    firstName?: string;
+    lastName?: string;
+    company?: string;
+    amount?: string | number | null | undefined;
+    salesTax?: number;
+    custId?: number | string;
+    street1?: string;
+    street2?: string;
+    city?: string | number;
+    state?: string;
+    zip?: number;
+    email?: string;
+    phone?: string;
+    description?: string;
+    reference1?: string | number;
+    reference2?: string | number;
+    reference3?: string | number;
+}
+export interface PaymentMethodData {
+    businessObjectKey: string;
+    appPaymentVendorID: string;
+    applicationClientID: string;
+    paymentVendorConnectionID: string;
+    merchantIdentifier: string;
+    effectiveStart: Date;
+    effectiveEnd: Date;
+    isDefault: boolean;
+    createDate: Date;
+    serializeFields: null;
+    applicationClient: null;
+    paymentVendorConnection: PaymentVendorConnection;
+    paymentToken: any[];
+    paymentTransaction: any[];
+    udpTags: any[];
+}
+export interface HostedPaymentPageSetup {
+    businessObjectKey: string;
+    hostedPaymentPageSetupID: string;
+    paymentVendorConnectionID: string;
+    useHostedPaymentPage: boolean;
+    hostedPaymentPageConfig: string;
+    customCSS: string;
+    serializeFields: null;
+    paymentVendorConnection: null;
+    udpTags: any[];
+}
+export interface IPaymentMethod {
+    businessObjectKey: string;
+    paymentMethodID: number;
+    name: string;
+    active: string;
+    serializeFields: null;
+    paymentMethodPaymentTransaction: any[];
+    udpTags: any[];
+    systemRule: any[];
+    paymentMethodSystemRule: any[];
+    appPaymentVendorID: string;
+    applicationClientID: string;
+    paymentVendorConnectionID: string;
+    merchantIdentifier: string;
+    effectiveStart: string;
+    effectiveEnd: null;
+    isDefault: boolean;
+    createDate: string;
+    applicationClient: null;
+    paymentVendorConnection?: PaymentVendorConnection;
+    appPaymentVendorPaymentTransaction: any[];
+}
+export interface HostedPaymentPageSetup {
+    businessObjectKey: string;
+    hostedPaymentPageSetupID: string;
+    paymentVendorConnectionID: string;
+    useHostedPaymentPage: boolean;
+    hostedPaymentPageConfig: string;
+    customCSS: string;
+    serializeFields: null;
+    paymentVendorConnection: null;
+    udpTags: any[];
+}
+export interface PaymentVendorConnection {
+    productionConnectionAttributes: null;
+    sandboxConnectionAttributes: null;
+    businessObjectKey: string;
+    paymentVendorConnectionID: string;
+    paymentVendorFactoryID: number;
+    name: string;
+    prodSecretConnection: null;
+    sandboxSecretConnection: null;
+    isLiveMode: boolean;
+    createDate: Date | string;
+    serializeFields: null;
+    appPaymentVendor: any[];
+    hostedPaymentPageSetup: HostedPaymentPageSetup[];
+    paymentVendorFactory: null;
+    paymentVendorConnectionPaymentMethod: any[];
+    udpTags: any[];
+}
+export interface IPaymentMethodTab {
+    paymentMethodID: number;
+    name: string;
+    enabled: boolean;
+    data: IPaymentMethod | null;
+    providerType: PaymentVendorFactoryEnum | null;
+    isHostedPaymentPage: boolean | null;
+    providerProps: {
+        customCss: string | null;
+        attributes: string | null;
+    } | null;
+    paymentVendorConnection?: PaymentVendorConnection;
+    hasReadPropertiesError?: boolean | null;
+    readPropertiesMessageError?: string | null;
+}
+export interface PaymentTransaction {
+    businessObjectKey: string;
+    accountTransactionID: number;
+    accountID: number;
+    authorizationNumber: string;
+    transactionId: string;
+    transactionDate: Date;
+    paymentTenderTypeID: number;
+    paymentTenderTypeName: string;
+    paymentSourceID: number;
+    paymentSourceName: string;
+    transactionTypeID: number;
+    transactionTypeName: string;
+    description: string;
+    cardLast4: string;
+    cardTypeName: null;
+    amount: number;
+    balance: number;
+    ipAddress: string;
+    date: string;
+    confirmationNumber: string;
+    tender: string;
+    source: string;
+    amount_: string;
+    balance_: string;
+    serializeFields: null;
+    searchRank: number;
+}

package/dist/types/utilities/form/paymentForm/BankAccountForm.d.ts

@@ -0,0 +1,48 @@
+import { PaymentDetails, PaymentMethodData } from './AccountPayment.model';
+import { PaymentVendorFactoryEnum } from '../../../enums/paymentVendorFactoryEnum';
+interface BankAccountFormProps {
+    accountTypes?: any[];
+    isFormDisabled?: boolean;
+}
+interface BankAccountFormProps {
+    bankAccountTypes?: any[];
+    isFormDisabled?: boolean;
+    paymentDetails: PaymentDetails;
+    providerType?: PaymentVendorFactoryEnum | null;
+    providerProps?: any;
+    isHostedPaymentPage?: boolean | null;
+    hasReadPropertiesError?: boolean | null;
+    readPropertiesMessageError?: string | null;
+    onStatusChange?: (paymentFormResult: any) => void;
+    enabled?: boolean | null;
+    actionLabel?: string;
+    data?: PaymentMethodData;
+    externalId?: string;
+}
+/**
+ * `BankAccountForm` is a React functional component that renders a form for managing bank accounts.
+ * It supports both hosted payment pages and direct input forms for bank account details.
+ *
+ * @param {Object} props - The properties passed to the component.
+ * @param {Array} props.bankAccountTypes - An array of available bank account types.
+ * @param {Object} props.data - Data related to the bank account form.
+ * @param {string} props.externalId - External identifier for the bank account.
+ * @param {boolean} [props.isFormDisabled=false] - Flag to disable the form.
+ * @param {string|null} [props.providerType=null] - Type of the payment provider.
+ * @param {Object|null} [props.providerProps=null] - Properties for the payment provider.
+ * @param {Object} props.paymentDetails - Details of the payment.
+ * @param {boolean} props.isHostedPaymentPage - Flag to indicate if it is a hosted payment page.
+ * @param {boolean} props.hasReadPropertiesError - Flag to indicate if there was an error reading properties.
+ * @param {string} props.readPropertiesMessageError - Error message for reading properties.
+ * @param {Function} props.onStatusChange - Callback function to handle status changes.
+ * @param {boolean} props.enabled - Flag to indicate if the form is enabled.
+ * @param {Function} props.setSelectedPaymentAccount - Callback function to set the selected payment account.
+ * @param {string} props.actionLabel - The label for the action button.
+ * @param {Object} restProps - Additional properties passed to the component.
+ *
+ * @returns {JSX.Element} The rendered component.
+ */
+export declare const BankAccountForm: ({ bankAccountTypes, data, externalId, isFormDisabled, providerType, providerProps, paymentDetails, isHostedPaymentPage, hasReadPropertiesError, readPropertiesMessageError, onStatusChange, enabled, actionLabel, setSelectedPaymentAccount, ...restProps }: BankAccountFormProps & {
+    [key: string]: any;
+}) => any;
+export {};

package/dist/types/utilities/form/paymentForm/BankIcon.d.ts

@@ -0,0 +1,7 @@
+/**
+ * BankIcon
+ *
+ * @param {(JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>)} props
+ * @return {*}
+ */
+export declare const BankIcon: (props: any) => JSX.Element;

package/dist/types/utilities/form/paymentForm/CashForm.d.ts

@@ -0,0 +1,9 @@
+import { PaymentDetails } from './AccountPayment.model';
+interface CashFormProps {
+    isFormDisabled?: boolean;
+    paymentDetails: PaymentDetails;
+    amountValue?: string | number | null | undefined;
+    onStatusChange?: (paymentFormResult: boolean) => void;
+}
+export declare const CashForm: ({ isFormDisabled, paymentDetails, amountValue, onStatusChange }: CashFormProps) => JSX.Element;
+export {};

package/dist/types/utilities/form/paymentForm/CashIcon.d.ts

@@ -0,0 +1,7 @@
+/**
+ * CashIcon
+ *
+ * @param {(JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>)} props
+ * @return {*}
+ */
+export declare const CashIcon: (props: any) => JSX.Element;

package/dist/types/utilities/form/paymentForm/CheckIcon.d.ts

@@ -0,0 +1,7 @@
+/**
+ * CheckIcon
+ *
+ * @param {(JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>)} props
+ * @return {*}
+ */
+export declare const CheckIcon: (props: any) => JSX.Element;

package/dist/types/utilities/form/paymentForm/CreditCardAdornment.d.ts

@@ -0,0 +1,12 @@
+/**
+ * CreditCardAdornment component displays an icon at the start of an input field.
+ * It shows a default payment card icon if no credit card number is provided.
+ * If a valid credit card number is provided, it displays the corresponding credit card method icon.
+ *
+ * @param {Object} props - The props object.
+ * @param {string} props.creditCardNumberInput - The credit card number input string.
+ * @returns {JSX.Element} The InputAdornment component with the appropriate icon.
+ */
+export declare const CreditCardAdornment: ({ creditCardNumberInput }: {
+    creditCardNumberInput: string;
+}) => JSX.Element;

package/dist/types/utilities/form/paymentForm/CreditCardForm.d.ts

@@ -0,0 +1,41 @@
+import { PaymentDetails, PaymentMethodData } from './AccountPayment.model';
+import { PaymentVendorFactoryEnum } from '../../../enums/paymentVendorFactoryEnum';
+interface CreditCardFormProps {
+    isFormDisabled?: boolean;
+    paymentDetails: PaymentDetails;
+    externalId?: string;
+    tenantId: string;
+    providerType?: PaymentVendorFactoryEnum | null;
+    providerProps?: any;
+    isHostedPaymentPage?: boolean | null;
+    hasReadPropertiesError?: boolean | null;
+    readPropertiesMessageError?: string | null;
+    enabled?: boolean | null;
+    data?: PaymentMethodData;
+    actionLabel?: string;
+    setSelectedPaymentAccount?: (paymentAccount: any) => void;
+    onStatusChange?: (paymentFormResult: any) => void;
+}
+/**
+ * CreditCardForm component handles the rendering of a credit card payment form.
+ * It supports both hosted payment pages and direct credit card input forms.
+ *
+ * @param {boolean} isFormDisabled - Flag to disable the form.
+ * @param {object} data - Data related to the payment form.
+ * @param {string} externalId - External identifier for the payment form.
+ * @param {object} paymentDetails - Details of the payment.
+ * @param {string|null} providerType - Type of the payment provider.
+ * @param {object|null} providerProps - Properties for the payment provider.
+ * @param {boolean} isHostedPaymentPage - Flag to indicate if it is a hosted payment page.
+ * @param {boolean} hasReadPropertiesError - Flag to indicate if there was an error reading properties.
+ * @param {string} readPropertiesMessageError - Error message for reading properties.
+ * @param {boolean} enabled - Flag to indicate if the form is enabled.
+ * @param {function} onStatusChange - Callback function to handle status changes.
+ * @param {function} setSelectedPaymentAccount - Callback function to set the selected payment account.
+ * @param {string} actionLabel - Label for the action button.
+ * @param {object} restProps - Additional properties.
+ *
+ * @returns {JSX.Element} The rendered CreditCardForm component.
+ */
+export declare const CreditCardForm: ({ isFormDisabled, data, externalId, paymentDetails, providerType, providerProps, isHostedPaymentPage, hasReadPropertiesError, readPropertiesMessageError, enabled, actionLabel, onStatusChange, setSelectedPaymentAccount, ...restProps }: CreditCardFormProps) => any;
+export {};

package/dist/types/utilities/form/paymentForm/CreditCardIcon.d.ts

@@ -0,0 +1,7 @@
+/**
+ * CreditCardIcon
+ *
+ * @param {(JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>)} props
+ * @return {*}
+ */
+export declare const CreditCardIcon: (props: any) => JSX.Element;

package/dist/types/utilities/form/paymentForm/CreditCardUtils.d.ts

@@ -0,0 +1,42 @@
+/**
+ * formatCreditCardNumber - Format credit card number
+ *
+ * @export
+ * @param {*} value
+ * @return {*}
+ */
+export declare function formatCreditCardNumber(value: any): any;
+/**
+ * formatCVC - formats the CVC value
+ *
+ * @export
+ * @param {*} value
+ * @param {*} prevValue
+ * @param {*} [allValues={}]
+ * @return {*}
+ */
+export declare function formatCVC(value: any, prevValue: any, allValues?: {
+    number?: string;
+}): string;
+/**
+ * formatExpirationDate - format expiration date
+ * @export
+ * @param {*} value
+ * @return {*}
+ */
+export declare function formatExpirationDate(value: any): string;
+/**
+ * formatBankAccountNumber - Format bank account number
+ * @export
+ * @param {*} value
+ * @return {*}
+ */
+export declare function formatBankAccountNumber(value: any): string;
+/**
+ * formatRoutingNumber - format routing number
+ * @export
+ * @param {*} value
+ * @return {*}
+ */
+export declare function formatRoutingNumber(value: any): string;
+export declare const getCreditCardMethodIcon: (creditCardNumber: any) => any;

package/dist/types/utilities/form/paymentForm/DisableOverlay.d.ts

@@ -0,0 +1,7 @@
+/**
+ * DisabledOverlay
+ *
+ * @param {*} { message }
+ * @return {*}
+ */
+export declare const DisabledOverlay: ({ message }: any) => JSX.Element;

package/dist/types/utilities/form/paymentForm/HostedPaymentError.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @file HostedPaymentError.tsx
+ * @description This component displays an error message when there is an issue rendering the hosted payment form.
+ */
+/**
+ * HostedPaymentError component
+ *
+ * This component is used to display an error message when there is an issue rendering the hosted payment form.
+ * It utilizes the `useTranslation` hook to support internationalization.
+ *
+ * @param {Object} props - The properties object.
+ * @param {string} props.error - The error string.
+ * @param {string} props.message - The error message to be displayed.
+ *
+ * @returns {JSX.Element} The rendered error message component.
+ */
+export declare const HostedPaymentError: ({ error, message }: {
+    error: string;
+    message: string;
+}) => JSX.Element;

package/dist/types/utilities/form/paymentForm/NewCreditCardForm.d.ts

@@ -0,0 +1,18 @@
+import { PaymentDetails } from './AccountPayment.model';
+/**
+ * NewCardForm component renders a form for entering new credit card details.
+ *
+ * @param {Object} props - The properties object.
+ * @param {boolean} props.isFormDisabled - Flag to disable the form fields.
+ * @param {Record<string, string>} props.classes - CSS classes for styling the form controls.
+ * @param {React.Dispatch<React.SetStateAction<string>>} props.setCreditCardNumberInput - Function to set the credit card number input value.
+ *
+ * @returns {JSX.Element} The rendered NewCardForm component.
+ */
+export declare const NewCreditCardForm: ({ isFormDisabled, classes, creditCardNumberInput, paymentDetails, setCreditCardNumberInput, }: {
+    isFormDisabled: boolean;
+    classes: Record<string, string>;
+    creditCardNumberInput: string;
+    paymentDetails: PaymentDetails;
+    setCreditCardNumberInput: React.Dispatch<React.SetStateAction<string>>;
+}) => JSX.Element;

package/dist/types/utilities/form/paymentForm/NewECheckForm.d.ts

@@ -0,0 +1,15 @@
+/**
+ * NewCardForm component renders a form for entering new credit card details.
+ *
+ * @param {Object} props - The properties object.
+ * @param {boolean} props.isFormDisabled - Flag to disable the form fields.
+ * @param {Record<string, string>} props.classes - CSS classes for styling the form controls.
+ * @param {React.Dispatch<React.SetStateAction<string>>} props.setCreditCardNumberInput - Function to set the credit card number input value.
+ *
+ * @returns {JSX.Element} The rendered NewCardForm component.
+ */
+export declare const NewECheckForm: ({ isFormDisabled, classes, bankAccountTypes, }: {
+    isFormDisabled: boolean;
+    classes: Record<string, string>;
+    bankAccountTypes?: any[];
+}) => JSX.Element;

package/dist/types/utilities/form/paymentForm/PaymentAccount.model.d.ts

@@ -0,0 +1,81 @@
+export interface PaymentAccount {
+    firstName: null;
+    lastName: null;
+    businessObjectKey: string;
+    paymentTokenCreditCardID: string;
+    paymentTokenID: string;
+    cardNumber: string;
+    securityCode: string;
+    expirationDate: Date;
+    nameOnAccount: string;
+    address1: string;
+    address2: string;
+    postalCode: string;
+    state: string;
+    city: string;
+    phoneNumber: string;
+    emailAddress: string;
+    country: string;
+    serializeFields: null;
+    paymentToken: PaymentToken;
+    paymentTransaction: PaymentTransaction[];
+    udpTags: any[];
+}
+export interface PaymentToken {
+    businessObjectKey: string;
+    tenantID: string;
+    paymentTokenID: string;
+    appPaymentVendorID: string;
+    paymentMethodID: number;
+    nickname: string;
+    externalID: string;
+    token: string;
+    accountNumber: string;
+    accountName: string;
+    active: boolean;
+    createDate: Date;
+    serializeFields: null;
+    appPaymentVendor: null;
+    paymentMethod: null;
+    paymentTokenCreditCard: any[];
+    paymentTokenECheck: any[];
+    udpTags: any[];
+}
+export interface PaymentTransaction {
+    businessObjectKey: string;
+    tenantID: string;
+    paymentTransactionID: string;
+    appPaymentVendorID: string;
+    paymentDate: Date;
+    paymentMethodID: number;
+    reference1: string;
+    reference2: string;
+    reference3: null;
+    paymentAmount: number;
+    paymentResultID: number;
+    transactionID: string;
+    authorizationNumber: string;
+    responseCode: string;
+    responseReason: string;
+    paymentStatusID: number;
+    paymentSourceID: number;
+    paymentVendorFactoryID: number;
+    applicationClientID: string;
+    currencyCode: string;
+    paymentTokenCreditCardID: string;
+    paymentTokenECheckID: null;
+    serializeFields: null;
+    batchPaymentDetail: any[];
+    paymentReverseTransaction: any[];
+    paymentTokenCreditCard: null;
+    applicationClient: null;
+    appPaymentVendor: null;
+    paymentMethod: null;
+    paymentResult: null;
+    paymentSource: null;
+    currency: null;
+    paymentTransactionStatus: null;
+    paymentTokenECheck: null;
+    udpTags: any[];
+    paymentTransactionDepositReport: any[];
+}

package/dist/types/utilities/form/paymentForm/PaymentBankDetails.d.ts

@@ -0,0 +1,12 @@
+import { CardData } from "./PaymentDropdown";
+/**
+ * PaymentBankDetails component displays the bank details of a payment method.
+ * It shows the card logo, nickname, routing number, and an inactive chip if the card is not active.
+ *
+ * @param {Object} props - The component props.
+ * @param {CardData} props.bankData - The bank data containing payment token and routing number.
+ * @returns {JSX.Element} The rendered PaymentBankDetails component.
+ */
+export declare const PaymentBankDetails: ({ bankData }: {
+    bankData: CardData;
+}) => JSX.Element;

package/dist/types/utilities/form/paymentForm/PaymentBoxDetail.d.ts

@@ -0,0 +1,32 @@
+interface PaymentToken {
+    nickname: string;
+}
+interface CardData {
+    paymentToken: PaymentToken;
+    expirationDate: string;
+    active: boolean;
+    paymentTokenID: string;
+}
+/**
+ * PaymentBoxDetail component displays detailed information about a payment card.
+ *
+ * @param {Object} props - The component props.
+ * @param {CardData} props.cardData - The data of the card to be displayed.
+ * @param {string} props.cardData.paymentToken - The token representing the payment card.
+ * @param {string} props.cardData.expirationDate - The expiration date of the card.
+ * @param {boolean} props.cardData.active - Indicates if the card is the default payment method.
+ * @param {string} props.cardData.paymentTokenID - The unique identifier for the payment token.
+ *
+ * @returns {JSX.Element} The rendered PaymentBoxDetail component.
+ *
+ * The component includes:
+ * - Card logo with a border.
+ * - Card details including nickname and expiration date.
+ * - Actions to set the card as default or indicate if it is the default card.
+ * - Expiration status if the card is expired.
+ * - A delete button to remove the card.
+ */
+export declare const PaymentBoxDetail: ({ cardData }: {
+    cardData: CardData;
+}) => JSX.Element;
+export {};