v6 - Exporting types from root level (#2405)

* feat: exporting types

* feat: clean up

* fix: types

packages/lib/config/rollup.prod.js

@@ -122,17 +122,17 @@ export default () => {
 
         // Types CJS
         {
-            input: 'dist/temp-types/index.d.ts',
+            input: 'dist/temp-types/types.d.ts',
             output: [{ file: './dist/cjs/index.d.cts', format: 'commonjs' }],
             external: [/\.scss$/u],
             plugins: [generateTypes()]
         },
 
         // Types ES
         {
-            input: 'dist/temp-types/index.d.ts',
+            input: 'dist/temp-types/types.d.ts',
             output: [{ file: './dist/es/index.d.ts', format: 'es' }],
-            external: [/\.scss$/u],
+            external: [/\.scss$/u, /\.json$/u],
             plugins: [generateTypes()]
         }
     ];

packages/lib/src/components/ANCV/ANCV.tsx

@@ -1,26 +1,16 @@
 import { h } from 'preact';
-import UIElement from '../UIElement';
+import UIElement from '../internal/UIElement/UIElement';
 import ANCVInput from './components/ANCVInput';
 import CoreProvider from '../../core/Context/CoreProvider';
 import config from './components/ANCVAwait/config';
 import Await from '../../components/internal/Await';
 import SRPanelProvider from '../../core/Errors/SRPanelProvider';
-import { PaymentResponse, UIElementProps } from '../types';
 import AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';
 import PayButton from '../internal/PayButton';
+import { ANCVConfiguration } from './types';
+import { PaymentResponseData } from '../../types/global-types';
 
-export interface ANCVProps extends UIElementProps {
-    paymentData?: any;
-    data: ANCVDataState;
-    onOrderRequest?: any;
-    onOrderCreated?: any;
-}
-
-export interface ANCVDataState {
-    beneficiaryId: string;
-}
-
-export class ANCVElement extends UIElement<ANCVProps> {
+export class ANCVElement extends UIElement<ANCVConfiguration> {
     public static type = 'ancv';
 
     /**
@@ -46,7 +36,7 @@ export class ANCVElement extends UIElement<ANCVProps> {
         }
     };
 
-    protected handleOrder = ({ order }: PaymentResponse) => {
+    protected handleOrder = ({ order }: PaymentResponseData) => {
         this.updateParent({ order });
         if (this.props.session && this.props.onOrderCreated) {
             return this.props.onOrderCreated(order);

packages/lib/src/components/ANCV/components/ANCVInput.tsx

@@ -5,9 +5,9 @@ import LoadingWrapper from '../../internal/LoadingWrapper';
 import InputText from '../../internal/FormFields/InputText';
 import Field from '../../internal/FormFields/Field';
 import useForm from '../../../utils/useForm';
-import { UIElementProps } from '../../types';
 import { ancvValidationRules } from '../validate';
-import { ANCVDataState } from '../ANCV';
+import { ANCVDataState } from '../types';
+import { UIElementProps } from '../../internal/UIElement/types';
 
 export interface ANCVInputProps extends UIElementProps {
     ref?: any;

packages/lib/src/components/ANCV/types.ts

@@ -0,0 +1,12 @@
+import { UIElementProps } from '../internal/UIElement/types';
+
+export interface ANCVConfiguration extends UIElementProps {
+    paymentData?: any;
+    data: ANCVDataState;
+    onOrderRequest?: any;
+    onOrderCreated?: any;
+}
+
+export interface ANCVDataState {
+    beneficiaryId: string;
+}

packages/lib/src/components/Ach/Ach.tsx

@@ -1,15 +1,15 @@
 import { h } from 'preact';
-import UIElement from '../UIElement';
+import UIElement from '../internal/UIElement/UIElement';
 import AchInput from './components/AchInput';
 import CoreProvider from '../../core/Context/CoreProvider';
 import RedirectButton from '../internal/RedirectButton';
-import { AchElementProps } from './types';
+import { AchConfiguration } from './types';
 import { TxVariants } from '../tx-variants';
 
-export class AchElement extends UIElement<AchElementProps> {
+export class AchElement extends UIElement<AchConfiguration> {
     public static type = TxVariants.ach;
 
-    formatProps(props: AchElementProps) {
+    formatProps(props: AchConfiguration) {
         return {
             ...props,
             // Fix mismatch between passed hasHolderName & holderNameRequired props

packages/lib/src/components/Ach/components/AchInput/AchInput.tsx

@@ -12,9 +12,9 @@ import useCoreContext from '../../../../core/Context/useCoreContext';
 import './AchInput.scss';
 import { ACHInputDataState, ACHInputProps, ACHInputStateError, ACHInputStateValid } from './types';
 import StoreDetails from '../../../internal/StoreDetails';
-import { ComponentMethodsRef } from '../../../types';
 import InputText from '../../../internal/FormFields/InputText';
 import FormInstruction from '../../../internal/FormInstruction';
+import { ComponentMethodsRef } from '../../../internal/UIElement/types';
 
 function validateHolderName(holderName, holderNameRequired = false) {
     if (holderNameRequired) {

packages/lib/src/components/Ach/components/AchInput/types.ts

@@ -1,6 +1,6 @@
 import Language from '../../../../language/Language';
 import { StylesObject } from '../../../internal/SecuredFields/lib/types';
-import UIElement from '../../../UIElement';
+import UIElement from '../../../internal/UIElement/UIElement';
 import { Resources } from '../../../../core/Context/Resources';
 
 export interface ACHInputStateValid {

packages/lib/src/components/Ach/index.ts

@@ -1 +1,2 @@
 export { default } from './Ach';
+export * from './types';

packages/lib/src/components/Ach/types.ts

@@ -1,7 +1,7 @@
-import { UIElementProps } from '../types';
 import { Placeholders } from './components/AchInput/types';
+import { UIElementProps } from '../internal/UIElement/types';
 
-export interface AchElementProps extends UIElementProps {
+export interface AchConfiguration extends UIElementProps {
     storedPaymentMethodId?: string;
     holderNameRequired?: boolean;
     hasHolderName?: boolean;

packages/lib/src/components/Address/Address.tsx

@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import UIElement from '../UIElement';
+import UIElement from '../internal/UIElement/UIElement';
 import Address from '../internal/Address';
 import CoreProvider from '../../core/Context/CoreProvider';
 import { TxVariants } from '../tx-variants';

packages/lib/src/components/AfterPay/AfterPayB2B.tsx

@@ -2,13 +2,13 @@ import { h } from 'preact';
 import OpenInvoiceContainer from '../helpers/OpenInvoiceContainer';
 import ConsentCheckboxLabel from './components/ConsentCheckboxLabel';
 import { AFTERPAY_B2B_CONSENT_URL, ALLOWED_COUNTRIES } from './config';
-import { OpenInvoiceContainerProps } from '../helpers/OpenInvoiceContainer/OpenInvoiceContainer';
 import { TxVariants } from '../tx-variants';
+import { OpenInvoiceConfiguration } from '../helpers/OpenInvoiceContainer/types';
 
 export default class AfterPayB2B extends OpenInvoiceContainer {
     public static type = TxVariants.afterpay_b2b;
 
-    protected static defaultProps: Partial<OpenInvoiceContainerProps> = {
+    protected static defaultProps: Partial<OpenInvoiceConfiguration> = {
         onChange: () => {},
         data: { companyDetails: {}, personalDetails: {}, billingAddress: {}, deliveryAddress: {} },
         visibility: {

packages/lib/src/components/AmazonPay/AmazonPay.test.tsx

@@ -2,7 +2,7 @@ import AmazonPay from './AmazonPay';
 import defaultProps from './defaultProps';
 import { httpPost } from '../../core/Services/http';
 import { mock } from 'jest-mock-extended';
-import { AmazonPayElementProps } from './types';
+import { AmazonPayConfiguration } from './types';
 
 jest.mock('../../core/Services/http');
 
@@ -13,7 +13,7 @@ const declineFlowMock = {
 const spyFetch = (httpPost as jest.Mock).mockImplementation(jest.fn(() => Promise.resolve(declineFlowMock)));
 
 describe('AmazonPay', () => {
-    const amazonProps = mock<AmazonPayElementProps>();
+    const amazonProps = mock<AmazonPayConfiguration>();
     const getElement = (props = {}) =>
         new AmazonPay({
             ...defaultProps,

packages/lib/src/components/AmazonPay/AmazonPay.tsx

@@ -1,15 +1,15 @@
 import { h } from 'preact';
-import UIElement from '../UIElement';
+import UIElement from '../internal/UIElement/UIElement';
 import CoreProvider from '../../core/Context/CoreProvider';
 import collectBrowserInfo from '../../utils/browserInfo';
 import AmazonPayComponent from './components/AmazonPayComponent';
-import { AmazonPayElementData, AmazonPayElementProps, CheckoutDetailsRequest } from './types';
+import { AmazonPayElementData, AmazonPayConfiguration, CheckoutDetailsRequest } from './types';
 import defaultProps from './defaultProps';
 import { getCheckoutDetails } from './services';
 import './AmazonPay.scss';
 import { TxVariants } from '../tx-variants';
 
-export class AmazonPayElement extends UIElement<AmazonPayElementProps> {
+export class AmazonPayElement extends UIElement<AmazonPayConfiguration> {
     public static type = TxVariants.amazonpay;
 
     protected static defaultProps = defaultProps;

packages/lib/src/components/AmazonPay/defaultProps.ts

@@ -1,6 +1,6 @@
-import { AmazonPayElementProps } from './types';
+import { AmazonPayConfiguration } from './types';
 
-const defaultProps: Partial<AmazonPayElementProps> = {
+const defaultProps: Partial<AmazonPayConfiguration> = {
     cancelUrl: typeof window !== 'undefined' ? window.location.href : '',
     configuration: {},
     environment: 'TEST',

packages/lib/src/components/AmazonPay/index.ts

@@ -1 +1,2 @@
 export { default } from './AmazonPay';
+// export * from './types';

packages/lib/src/components/AmazonPay/types.ts

@@ -1,8 +1,8 @@
 import Language from '../../language/Language';
 import { SUPPORTED_LOCALES_EU, SUPPORTED_LOCALES_US } from './config';
-import { BrowserInfo, PaymentAmount } from '../../types';
-import UIElement from '../UIElement';
-import { UIElementProps } from '../types';
+import UIElement from '../internal/UIElement/UIElement';
+import { UIElementProps } from '../internal/UIElement/types';
+import { BrowserInfo, PaymentAmount } from '../../types/global-types';
 
 declare global {
     interface Window {
@@ -30,14 +30,14 @@ export interface RecurringMetadata {
     };
 }
 
-export interface AmazonPayConfiguration {
+export interface AmazonPayBackendConfiguration {
     merchantId?: string;
     publicKeyId?: string;
     region?: Region;
     storeId?: string;
 }
 
-export interface AmazonPayElementProps extends UIElementProps {
+export interface AmazonPayConfiguration extends UIElementProps {
     addressDetails?: AddressDetails;
     amazonPayToken?: string;
     amazonCheckoutSessionId?: string;
@@ -46,7 +46,7 @@ export interface AmazonPayElementProps extends UIElementProps {
     cancelUrl?: string;
     chargePermissionType?: ChargePermissionType;
     clientKey?: string;
-    configuration?: AmazonPayConfiguration;
+    configuration?: AmazonPayBackendConfiguration;
     currency?: Currency;
     deliverySpecifications?: DeliverySpecifications;
     environment?: string;
@@ -70,7 +70,7 @@ export interface AmazonPayElementProps extends UIElementProps {
     onSignOut: (resolve, reject) => Promise<void>;
 }
 
-export interface AmazonPayComponentProps extends AmazonPayElementProps {
+export interface AmazonPayComponentProps extends AmazonPayConfiguration {
     ref: any;
 }
 
@@ -81,7 +81,7 @@ export interface AmazonPayButtonProps {
     cancelUrl?: string;
     chargePermissionType?: ChargePermissionType;
     clientKey?: string;
-    configuration?: AmazonPayConfiguration;
+    configuration?: AmazonPayBackendConfiguration;
     currency?: Currency;
     deliverySpecifications?: DeliverySpecifications;
     design?: string;

packages/lib/src/components/AmazonPay/utils.ts

@@ -8,7 +8,7 @@ import {
     SUPPORTED_LOCALES_US
 } from './config';
 import { AmazonPayButtonProps, AmazonPayButtonSettings, ChargeAmount, Currency, PayloadJSON, Region, SupportedLocale } from './types';
-import { PaymentAmount } from '../../types';
+import { PaymentAmount } from '../../types/global-types';
 import { getDecimalAmount } from '../../utils/amount-util';
 
 /**

packages/lib/src/components/ApplePay/ApplePay.tsx

@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import UIElement from '../UIElement';
+import UIElement from '../internal/UIElement/UIElement';
 import ApplePayButton from './components/ApplePayButton';
 import ApplePayService from './ApplePayService';
 import base64 from '../../utils/base64';
@@ -8,17 +8,17 @@ import { httpPost } from '../../core/Services/http';
 import { APPLEPAY_SESSION_ENDPOINT } from './config';
 import { preparePaymentRequest } from './payment-request';
 import { resolveSupportedVersion, mapBrands } from './utils';
-import { ApplePayElementProps, ApplePayElementData, ApplePaySessionRequest, OnAuthorizedCallback } from './types';
+import { ApplePayConfiguration, ApplePayElementData, ApplePaySessionRequest, OnAuthorizedCallback } from './types';
 import AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';
 import { TxVariants } from '../tx-variants';
 
 const latestSupportedVersion = 14;
 
-class ApplePayElement extends UIElement<ApplePayElementProps> {
+class ApplePayElement extends UIElement<ApplePayConfiguration> {
     public static type = TxVariants.applepay;
     protected static defaultProps = defaultProps;
 
-    constructor(props: ApplePayElementProps) {
+    constructor(props: ApplePayConfiguration) {
         super(props);
         this.startSession = this.startSession.bind(this);
         this.submit = this.submit.bind(this);

packages/lib/src/components/ApplePay/payment-request.ts

@@ -1,5 +1,5 @@
 import { getDecimalAmount } from '../../utils/amount-util';
-import { PaymentAmount } from '../../types';
+import { PaymentAmount } from '../../types/global-types';
 
 const formatAmount = (amount: PaymentAmount) => String(getDecimalAmount(amount.value, amount.currency));
 

packages/lib/src/components/ApplePay/types.ts

@@ -1,6 +1,6 @@
-import { UIElementProps } from '../types';
-
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { UIElementProps } from '../internal/UIElement/types';
+
 declare global {
     interface Window {
         ApplePaySession: ApplePaySession;
@@ -31,7 +31,7 @@ export type OnAuthorizedCallback = (
     event: ApplePayJS.ApplePayPaymentAuthorizedEvent
 ) => void;
 
-export interface ApplePayElementProps extends UIElementProps {
+export interface ApplePayConfiguration extends UIElementProps {
     /**
      * The Apple Pay version number your website supports.
      * @default highest supported version by the shopper device

packages/lib/src/components/BacsDD/BacsDD.tsx

@@ -1,23 +1,14 @@
 import { h } from 'preact';
-import UIElement from '../UIElement';
+import UIElement from '../internal/UIElement/UIElement';
 import BacsInput from './components/BacsInput';
 import CoreProvider from '../../core/Context/CoreProvider';
 import BacsResult from './components/BacsResult';
 import PayButton from '../internal/PayButton';
 import { TxVariants } from '../tx-variants';
-import { VoucherActionElement } from '../types';
+import { VoucherConfiguration } from '../internal/Voucher/types';
+import { BacsElementData } from './types';
 
-interface BacsElementData {
-    paymentMethod: {
-        type: string;
-        holderName: string;
-        bankAccountNumber: string;
-        bankLocationId: string;
-    };
-    shopperEmail: string;
-}
-
-class BacsElement extends UIElement<VoucherActionElement> {
+class BacsElement extends UIElement<VoucherConfiguration> {
     public static type = TxVariants.directdebit_GB;
 
     protected static defaultProps = {

packages/lib/src/components/BacsDD/components/types.ts

@@ -1,4 +1,4 @@
-import { UIElementProps } from '../../types';
+import { UIElementProps } from '../../internal/UIElement/types';
 
 export interface BacsInputData {
     holderName?: string;

packages/lib/src/components/BacsDD/types.ts

@@ -0,0 +1,9 @@
+export interface BacsElementData {
+    paymentMethod: {
+        type: string;
+        holderName: string;
+        bankAccountNumber: string;
+        bankLocationId: string;
+    };
+    shopperEmail: string;
+}

packages/lib/src/components/BankTransfer/BankTransfer.tsx

@@ -1,13 +1,13 @@
 import { h } from 'preact';
-import UIElement from '../UIElement';
+import UIElement from '../internal/UIElement/UIElement';
 import CoreProvider from '../../core/Context/CoreProvider';
 import RedirectButton from '../internal/RedirectButton';
-import { BankTransferProps, BankTransferState } from './types';
+import { BankTransferConfiguration, BankTransferState } from './types';
 import BankTransferResult from './components/BankTransferResult';
 import BankTransferInput from './components/BankTransferInput';
 import { TxVariants } from '../tx-variants';
 
-export class BankTransferElement extends UIElement<BankTransferProps> {
+export class BankTransferElement extends UIElement<BankTransferConfiguration> {
     public static type = TxVariants.bankTransfer_IBAN;
 
     public static defaultProps = {

packages/lib/src/components/BankTransfer/types.ts

@@ -1,6 +1,6 @@
-import { UIElementProps } from '../types';
+import { UIElementProps } from '../internal/UIElement/types';
 
-export interface BankTransferProps extends UIElementProps {
+export interface BankTransferConfiguration extends UIElementProps {
     reference?: string;
 
     /**