@imtbl/checkout-widgets 2.0.0-alpha.0

package/dist/types/components/RawImage/RawImageStyles.d.ts

@@ -0,0 +1,22 @@
+export declare const rawImageStyles: {
+    minw: string;
+    padding: string;
+    display: string;
+    bg: string;
+    overflow: string;
+    borderRadius: string;
+    objectFit: string;
+    objectPosition: string;
+    backgroundColor: string;
+    justifyContent: string;
+    alignItems: string;
+    flexShrink: number;
+    width: string;
+    height: string;
+};
+export declare const imageStyles: {
+    width: string;
+    height: string;
+    objectFit: string;
+    objectPosition: string;
+};

package/dist/types/components/SimpleLayout/SimpleLayout.d.ts

@@ -0,0 +1,13 @@
+import { BoxProps } from '@biom3/react';
+export interface SimpleLayoutProps {
+    header?: React.ReactNode;
+    footer?: React.ReactNode;
+    children?: React.ReactNode;
+    heroContent?: React.ReactNode;
+    testId?: string;
+    floatHeader?: boolean;
+    footerBackgroundColor?: string;
+    bodyStyleOverrides?: BoxProps['sx'];
+    containerSx?: BoxProps['sx'];
+}
+export declare function SimpleLayout({ header, footer, children, heroContent, testId, floatHeader, footerBackgroundColor, bodyStyleOverrides, containerSx, }: SimpleLayoutProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/SimpleLayout/SimpleLayoutStyles.d.ts

@@ -0,0 +1,49 @@
+export declare const responsiveStyles: {
+    width: string;
+    minHeight: string;
+    height: string;
+    maxHeight: string;
+    position: string;
+    overflow: string;
+    borderRadius: string;
+};
+export declare const simpleLayoutStyle: {
+    position: string;
+    display: string;
+    flexDirection: string;
+    backgroundColor: string;
+    height: string;
+    width: string;
+};
+export declare const headerStyle: (floatHeader: boolean) => {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    alignItems: string;
+    width: string;
+    position: string;
+    zIndex: number;
+};
+export declare const footerStyle: (footerBackgroundColor?: string) => {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    alignItems: string;
+    backgroundColor: string;
+};
+export declare const contentStyle: {
+    flex: number;
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+};
+export declare const heroContentStyle: {
+    flex: string;
+    width: string;
+};
+export declare const bodyStyle: {
+    display: string;
+    flexDirection: string;
+    flex: string;
+    width: string;
+};

package/dist/types/components/Status/StatusBox.d.ts

@@ -0,0 +1,7 @@
+import { StatusType } from './StatusType';
+export interface StatusViewProps {
+    statusText: string;
+    statusType: StatusType;
+    iconStyles?: Record<string, string>;
+}
+export declare function StatusBox({ statusText, statusType, iconStyles }: StatusViewProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/Status/StatusType.d.ts

@@ -0,0 +1,7 @@
+export declare enum StatusType {
+    SUCCESS = "success",
+    FAILURE = "failure",
+    WARNING = "warning",
+    INFORMATION = "information",
+    ALERT = "alert"
+}

package/dist/types/components/Status/StatusView.d.ts

@@ -0,0 +1,14 @@
+import { StatusType } from './StatusType';
+export interface StatusViewProps {
+    actionText?: string;
+    onActionClick?: () => void;
+    secondaryActionText?: string;
+    onSecondaryActionClick?: () => void;
+    onRenderEvent?: () => void;
+    onCloseClick?: () => void;
+    testId: string;
+    statusText: string;
+    statusType: StatusType;
+    statusIconStyles?: Record<string, string>;
+}
+export declare function StatusView({ actionText, onActionClick, secondaryActionText, onSecondaryActionClick, onRenderEvent, onCloseClick, testId, statusText, statusType, statusIconStyles, }: StatusViewProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/Status/StatusViewStyles.d.ts

@@ -0,0 +1,22 @@
+export declare const statusContainerStyles: {
+    height: string;
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+};
+export declare const statusBoxStyles: {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    alignItems: string;
+    alignContent: string;
+    padding: string;
+    width: string;
+    borderRadius: string;
+    background: string;
+    rowGap: string;
+};
+export declare const statusLogoFill: (isSuccess: boolean) => {
+    width: string;
+    fill: string;
+};

package/dist/types/components/ThemeProvider/ThemeProvider.d.ts

@@ -0,0 +1,10 @@
+import React, { ComponentProps } from 'react';
+import { BiomeCombinedProviders } from '@biom3/react';
+import { StrongCheckoutWidgetsConfig } from '../../lib/withDefaultWidgetConfig';
+export interface ThemeProviderProps {
+    id: string;
+    config: StrongCheckoutWidgetsConfig;
+    children?: React.ReactNode;
+    globalSx?: ComponentProps<typeof BiomeCombinedProviders>['globalSx'];
+}
+export declare function ThemeProvider({ id, config, children, globalSx, }: ThemeProviderProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/ThemeProvider/themeProviderStyles.d.ts

@@ -0,0 +1,9 @@
+export declare const containerStyles: {
+    width: string;
+    minHeight: string;
+    height: string;
+    maxHeight: string;
+    position: string;
+    overflow: string;
+    borderRadius: string;
+};

package/dist/types/components/TokenImage/TokenImage.d.ts

@@ -0,0 +1,19 @@
+import { Environment } from '@imtbl/config';
+import { WidgetTheme } from '@imtbl/checkout-sdk';
+type ImageProps = {
+    name?: string;
+    src?: string;
+    theme?: WidgetTheme;
+    environment?: Environment;
+    defaultImage?: string;
+} & ({
+    defaultImage: string;
+    theme?: WidgetTheme;
+    environment?: Environment;
+} | {
+    defaultImage?: never;
+    theme: WidgetTheme;
+    environment: Environment;
+});
+export declare function TokenImage({ src, name, environment, theme, defaultImage, ...forwardedProps }: ImageProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/TransactionRejected/TransactionRejected.d.ts

@@ -0,0 +1,8 @@
+type TransactionRejectedProps = {
+    onCloseDrawer?: () => void;
+    visible?: boolean;
+    showHeaderBar?: boolean;
+    onRetry: () => void;
+};
+export declare function TransactionRejected({ onCloseDrawer, visible, showHeaderBar, onRetry, }: TransactionRejectedProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/TransactionRejected/TransactionRejectedStyles.d.ts

@@ -0,0 +1,26 @@
+export declare const transactionRejectedContainerStyles: {
+    display: string;
+    flexDirection: string;
+    alignItems: string;
+    paddingY: string;
+    paddingX: string;
+    height: string;
+};
+export declare const contentTextStyles: {
+    color: string;
+    fontFamily: string;
+    textAlign: string;
+    marginTop: string;
+};
+export declare const actionButtonContainerStyles: {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    gap: string;
+    height: string;
+    width: string;
+};
+export declare const actionButtonStyles: {
+    width: string;
+    height: string;
+};

package/dist/types/components/Transactions/ChangeWallet.d.ts

@@ -0,0 +1,4 @@
+export interface ChangeWalletProps {
+    onChangeWalletClick: () => void;
+}
+export declare function ChangeWallet({ onChangeWalletClick }: ChangeWalletProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/Transactions/ChangeWalletStyles.d.ts

@@ -0,0 +1,31 @@
+export declare const headingStyles: {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    alignItems: string;
+    p: string;
+    pb: string;
+};
+export declare const wcWalletLogoWrapperStyles: {
+    position: string;
+    pr: string;
+};
+export declare const wcWalletLogoStyles: {
+    width: string;
+};
+export declare const wcStickerLogoStyles: {
+    position: string;
+    top: string;
+    left: string;
+    width: string;
+    padding: string;
+    backgroundColor: string;
+    borderRadius: string;
+};
+export declare const rawImageStyle: {
+    backgroundColor: string;
+    width: string;
+    height: string;
+    marginRight: string;
+    padding: string;
+};

package/dist/types/components/Transactions/ClaimWithdrawalInProgress.d.ts

@@ -0,0 +1,6 @@
+import { TransactionResponse } from 'ethers';
+interface ClaimWithdrawalInProgressProps {
+    transactionResponse: TransactionResponse;
+}
+export declare function ClaimWithdrawalInProgress({ transactionResponse }: ClaimWithdrawalInProgressProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/EmptyStateNotConnected.d.ts

@@ -0,0 +1,5 @@
+type EmptyStateNotConnectedProps = {
+    openWalletDrawer: () => void;
+};
+export declare function EmptyStateNotConnected({ openWalletDrawer }: EmptyStateNotConnectedProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/EmptyStateNotConnectedStyles.d.ts

@@ -0,0 +1,10 @@
+export declare const containerStyle: {
+    bg: string;
+    borderRadius: string;
+    display: string;
+    alignItems: string;
+    justifyContent: string;
+    flexDirection: string;
+    height: string;
+    px: string;
+};

package/dist/types/components/Transactions/NoTransactions.d.ts

@@ -0,0 +1,8 @@
+import { Checkout } from '@imtbl/checkout-sdk';
+type NoTransactionsProps = {
+    checkout: Checkout;
+    isPassport: boolean;
+    changeWallet: () => void;
+};
+export declare function NoTransactions({ checkout, isPassport, changeWallet, }: NoTransactionsProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/NotEnoughEthToWithdraw.d.ts

@@ -0,0 +1,6 @@
+export interface NotEnoughEthToWithdrawProps {
+    visible: boolean;
+    onClose: () => void;
+    onChangeAccount: () => void;
+}
+export declare function NotEnoughEthToWithdraw({ visible, onClose, onChangeAccount, }: NotEnoughEthToWithdrawProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/Transactions/NotEnoughEthToWithdrawStyles.d.ts

@@ -0,0 +1,37 @@
+export declare const containerStyles: {
+    display: string;
+    flexDirection: string;
+    alignItems: string;
+    paddingTop: string;
+    paddingBottom: string;
+    height: string;
+};
+export declare const contentTextStyles: {
+    color: string;
+    fontFamily: string;
+    textAlign: string;
+    marginTop: string;
+};
+export declare const actionButtonContainerStyles: {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    gap: string;
+    height: string;
+    width: string;
+};
+export declare const actionButtonStyles: {
+    width: string;
+    height: string;
+};
+export declare const logoContainerStyles: {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    alignItems: string;
+    paddingTop: string;
+};
+export declare const imxLogoStyles: {
+    height: string;
+    width: string;
+};

package/dist/types/components/Transactions/Shimmer.d.ts

@@ -0,0 +1 @@
+export declare function Shimmer(): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/Transactions/SupportMessage.d.ts

@@ -0,0 +1,7 @@
+import { Checkout } from '@imtbl/checkout-sdk';
+type SupportMessageProps = {
+    checkout: Checkout;
+    isPassport: boolean;
+};
+export declare function SupportMessage({ checkout, isPassport, }: SupportMessageProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/SupportMessageStyles.d.ts

@@ -0,0 +1,9 @@
+export declare const supportMessageBoxStyle: {
+    backgroundColor: string;
+    px: string;
+    p: string;
+    borderRadius: string;
+};
+export declare const bodyStyle: {
+    color: string;
+};

package/dist/types/components/Transactions/TransactionDetails.d.ts

@@ -0,0 +1,7 @@
+import { Environment } from '@imtbl/config';
+import { Transaction } from '../../lib/clients';
+export interface TransactionDetailsProps {
+    transaction: Transaction;
+    environment: Environment;
+}
+export declare function TransactionDetails({ transaction, environment }: TransactionDetailsProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/Transactions/TransactionItem.d.ts

@@ -0,0 +1,18 @@
+import { Environment } from '@imtbl/config';
+import { Transaction } from '../../lib/clients/checkoutApiType';
+type TransactionItemProps = {
+    label: string;
+    details: {
+        text: string;
+        link: string;
+        hash: string;
+    };
+    transaction: Transaction;
+    fiatAmount: string;
+    amount: string;
+    icon: string;
+    defaultTokenImage: string;
+    environment: Environment;
+};
+export declare function TransactionItem({ label, details, transaction, fiatAmount, amount, icon, defaultTokenImage, environment, }: TransactionItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/TransactionItemWithdrawPending.d.ts

@@ -0,0 +1,13 @@
+import { Environment } from '@imtbl/config';
+import { Transaction } from '../../lib/clients/checkoutApiType';
+type TransactionItemWithdrawPendingProps = {
+    label: string;
+    transaction: Transaction;
+    fiatAmount: string;
+    amount: string;
+    icon: string;
+    defaultTokenImage: string;
+    environment: Environment;
+};
+export declare function TransactionItemWithdrawPending({ label, transaction, fiatAmount, amount, icon, defaultTokenImage, environment, }: TransactionItemWithdrawPendingProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/TransactionList.d.ts

@@ -0,0 +1,13 @@
+import { Checkout } from '@imtbl/checkout-sdk';
+import { Transaction } from '../../lib/clients';
+import { KnownNetworkMap } from './transactionsType';
+type TransactionListProps = {
+    checkout: Checkout;
+    transactions: Transaction[];
+    knownTokenMap: KnownNetworkMap;
+    isPassport: boolean;
+    defaultTokenImage: string;
+    changeWallet: () => void;
+};
+export declare function TransactionList({ checkout, transactions, knownTokenMap, isPassport, defaultTokenImage, changeWallet, }: TransactionListProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/TransactionListStyles.d.ts

@@ -0,0 +1,16 @@
+export declare const transactionsListStyle: (showPassportLink: boolean) => {
+    backgroundColor: string;
+    px: string;
+    pt: string;
+    pb: string;
+    borderRadius: string;
+    h: string;
+    w: string;
+    overflowY: string;
+};
+export declare const containerStyles: {
+    borderRadius: string;
+    display: string;
+    flexDirection: string;
+    gap: string;
+};

package/dist/types/components/Transactions/Transactions.d.ts

@@ -0,0 +1,6 @@
+type TransactionsProps = {
+    defaultTokenImage: string;
+    onBackButtonClick: () => void;
+};
+export declare function Transactions({ defaultTokenImage, onBackButtonClick, }: TransactionsProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/Transactions/TransactionsStyles.d.ts

@@ -0,0 +1,26 @@
+export declare const transactionsContainerStyle: {
+    px: string;
+    display: string;
+    flexDirection: string;
+    height: string;
+};
+export declare const transactionsListContainerStyle: {
+    flexGrow: string;
+    flexShrink: string;
+    flexBasis: string;
+};
+export declare const transactionsListStyle: (showPassportLink: boolean) => {
+    backgroundColor: string;
+    px: string;
+    pt: string;
+    pb: string;
+    borderRadius: string;
+    h: string;
+    w: string;
+    overflowY: string;
+};
+export declare const supportBoxContainerStyle: {
+    flexGrow: string;
+    flexShrink: string;
+    mt: string;
+};

package/dist/types/components/Transactions/noTransactionStyles.d.ts

@@ -0,0 +1,26 @@
+export declare const containerStyles: {
+    backgroundColor: string;
+    px: string;
+    pt: string;
+    pb: string;
+    borderRadius: string;
+    h: string;
+    w: string;
+    display: string;
+    flexDirection: string;
+};
+export declare const noTransactionsContainerStyle: {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    alignItems: string;
+    padding: string;
+    flex: number;
+};
+export declare const noTransactionsBodyStyle: {
+    mb: string;
+    color: string;
+};
+export declare const passportBodyStyle: {
+    color: string;
+};

package/dist/types/components/Transactions/transactionItemStyles.d.ts

@@ -0,0 +1,30 @@
+export declare const containerStyles: {
+    display: string;
+    flexDirection: string;
+    borderRadius: string;
+    bg: string;
+};
+export declare const headingStyles: {
+    display: string;
+    flexDirection: string;
+    justifyContent: string;
+    paddingLeft: string;
+    alignItems: string;
+};
+export declare const actionsContainerStyles: {
+    p: string;
+    d: string;
+    justifyContent: string;
+    position: string;
+};
+export declare const actionsLayoutStyles: {
+    display: string;
+    flexGrow: string;
+    alignItems: string;
+    gap: string;
+};
+export declare const actionsBadgeStyles: {
+    position: string;
+    right: string;
+    top: string;
+};

package/dist/types/components/Transactions/transactionsType.d.ts

@@ -0,0 +1,6 @@
+import { TokenInfo } from '@imtbl/checkout-sdk';
+export type KnownNetworkMap = {
+    [chainName: string]: {
+        [address: string]: TokenInfo;
+    };
+};

package/dist/types/components/Transak/TransakEvents.d.ts

@@ -0,0 +1,42 @@
+export declare enum TransakEvents {
+    /**
+     * transak widget initialised
+     */
+    TRANSAK_WIDGET_INITIALISED = "TRANSAK_WIDGET_INITIALISED",
+    /**
+     * transak widget loaded
+     */
+    TRANSAK_WIDGET_OPEN = "TRANSAK_WIDGET_OPEN",
+    /**
+     * order created and awaiting payment from payment
+     */
+    TRANSAK_ORDER_CREATED = "TRANSAK_ORDER_CREATED",
+    /**
+     * order successfully submitted or completed
+     */
+    TRANSAK_ORDER_SUCCESSFUL = "TRANSAK_ORDER_SUCCESSFUL",
+    /**
+     * order processing failed
+     */
+    TRANSAK_ORDER_FAILED = "TRANSAK_ORDER_FAILED"
+}
+export declare enum TransakStatuses {
+    PROCESSING = "PROCESSING",
+    COMPLETED = "COMPLETED"
+}
+type TransakEventData = {
+    id: string;
+    status: string | TransakStatuses;
+    statusReason?: string;
+};
+export type TransakEvent = {
+    event_id: Omit<TransakEvents, TransakEvents.TRANSAK_ORDER_SUCCESSFUL>;
+    data: TransakEventData;
+} | {
+    event_id: TransakEvents.TRANSAK_ORDER_SUCCESSFUL;
+    data: TransakEventData & {
+        status: TransakStatuses.COMPLETED;
+        transactionHash: string;
+    };
+};
+export {};

package/dist/types/components/Transak/TransakIframe.d.ts

@@ -0,0 +1,13 @@
+import { Environment } from '@imtbl/config';
+import { TransakEventHandlers } from './useTransakEvents';
+import { TransakWidgetType, TransakNFTCheckoutParams } from './useTransakIframe';
+export type TransakIframeProps = {
+    id: string;
+    type: TransakWidgetType;
+    email: string;
+    contractId: string;
+    environment: Environment;
+    walletAddress: string;
+    isPassportWallet: boolean;
+} & TransakEventHandlers & TransakNFTCheckoutParams;
+export declare function TransakIframe(props: TransakIframeProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/Transak/TransakTypes.d.ts

@@ -0,0 +1,9 @@
+export type TransakNFTData = {
+    collectionAddress: string;
+    imageURL: string;
+    nftName: string;
+    nftType: string;
+    price: number[];
+    quantity: number;
+    tokenID: string[];
+};

package/dist/types/components/Transak/useTransakEvents.d.ts

@@ -0,0 +1,24 @@
+import { RefObject } from 'react';
+import { UserJourney } from '../../context/analytics-provider/SegmentAnalyticsProvider';
+export declare const TRANSAK_ORIGIN: string[];
+export type TransakEventHandlers = {
+    onInit?: (data: Record<string, unknown>) => void;
+    onOpen?: (data: Record<string, unknown>) => void;
+    onOrderCreated?: (data: Record<string, unknown>) => void;
+    onOrderProcessing?: (data: Record<string, unknown>) => void;
+    onOrderCompleted?: (data: Record<string, unknown>) => void;
+    onOrderFailed?: (data: Record<string, unknown>) => void;
+    onFailedToLoad?: () => void;
+    failedToLoadTimeoutInMs?: number;
+};
+type UseTransakEventsProps = {
+    userJourney: UserJourney;
+    ref: RefObject<HTMLIFrameElement> | undefined;
+    walletAddress: string;
+    isPassportWallet: boolean;
+} & TransakEventHandlers;
+export declare const useTransakEvents: (props: UseTransakEventsProps) => {
+    initialised: boolean;
+    onLoad: () => void;
+};
+export {};