@capitalos/react 0.1.1-beta.2 → 0.2.0

package/dist/_tsup-dts-rollup.d.mts

@@ -1,3 +1,5 @@
+/// <reference types="react" />
+
 import { IFrameComponent } from 'iframe-resizer';
 import { IFrameMessageData } from 'iframe-resizer';
 import { IFrameOptions } from 'iframe-resizer';
@@ -5,11 +7,195 @@ import { IFrameResizedData } from 'iframe-resizer';
 import { IFrameScrollData } from 'iframe-resizer';
 import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
+import * as z from 'zod';
+import { z as z_2 } from 'zod';
 
 /**
  * Renders the CapitalOS App.
  */
-export declare function App(props: {
+export declare function App(props: CommonProps): JSX.Element;
+
+/**
+ * The internal component that handles all the heavy lifting of connecting to the iframe and rendering the app.
+ * all user facing components are basically  a syntactic sugar on top of this.
+ */
+export declare function CapitalOS<T>(props: CapitalOsProps<T>): JSX.Element;
+
+/**
+ * Base class for all SDK errors
+ */
+export declare class CapitalOSError extends Error {
+    constructor(message: string);
+}
+
+declare type CapitalOsProps<T> = CommonProps & {
+    renderingContext?: T | undefined;
+    methods?: Partial<IframeConnectionMethods>;
+};
+
+export declare type CardApiDto = z.infer<typeof cardApiDtoSchema>;
+
+declare const cardApiDtoSchema: z.ZodObject<{
+    accountUserId: z.ZodNullable<z.ZodString>;
+    status: z.ZodEnum<["active", "inactive", "canceled", "frozen"]>;
+    id: z.ZodString;
+    last4: z.ZodString;
+    platformId: z.ZodString;
+    cardholderFirstName: z.ZodString;
+    cardholderLastName: z.ZodString;
+    cardholderPhoneNumber: z.ZodEffects<z.ZodString, string, string>;
+    nickname: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    spend: z.ZodObject<{
+        daily: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+        weekly: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+        monthly: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+        lifetime: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+    }, "strip", z.ZodTypeAny, {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    }, {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    }>;
+    allowedSpendCategories: z.ZodArray<z.ZodEnum<["airlines", "carRental", "carService", "education", "electronics", "gasPump", "gasStation", "generalMerchandise", "government", "hardwareAndConstruction", "insurance", "legal", "lodging", "medical", "other", "parking", "phoneAndInternet", "professionalServices", "recreationAndEntertainment", "restaurants", "shipping", "software", "taxisAndRideshare", "transportation", "travelMisc", "utilities"]>, "many">;
+    physicalCard: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+        id: z.ZodString;
+    }, "strip", z.ZodTypeAny, {
+        id: string;
+    }, {
+        id: string;
+    }>>>;
+}, "strip", z.ZodTypeAny, {
+    id: string;
+    status: "active" | "inactive" | "canceled" | "frozen";
+    platformId: string;
+    accountUserId: string | null;
+    last4: string;
+    cardholderFirstName: string;
+    cardholderLastName: string;
+    cardholderPhoneNumber: string;
+    spend: {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    };
+    allowedSpendCategories: ("other" | "airlines" | "carRental" | "carService" | "education" | "electronics" | "gasPump" | "gasStation" | "generalMerchandise" | "government" | "hardwareAndConstruction" | "insurance" | "legal" | "lodging" | "medical" | "parking" | "phoneAndInternet" | "professionalServices" | "recreationAndEntertainment" | "restaurants" | "shipping" | "software" | "taxisAndRideshare" | "transportation" | "travelMisc" | "utilities")[];
+    nickname?: string | null | undefined;
+    physicalCard?: {
+        id: string;
+    } | null | undefined;
+}, {
+    id: string;
+    status: "active" | "inactive" | "canceled" | "frozen";
+    platformId: string;
+    accountUserId: string | null;
+    last4: string;
+    cardholderFirstName: string;
+    cardholderLastName: string;
+    cardholderPhoneNumber: string;
+    spend: {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    };
+    allowedSpendCategories: ("other" | "airlines" | "carRental" | "carService" | "education" | "electronics" | "gasPump" | "gasStation" | "generalMerchandise" | "government" | "hardwareAndConstruction" | "insurance" | "legal" | "lodging" | "medical" | "parking" | "phoneAndInternet" | "professionalServices" | "recreationAndEntertainment" | "restaurants" | "shipping" | "software" | "taxisAndRideshare" | "transportation" | "travelMisc" | "utilities")[];
+    nickname?: string | null | undefined;
+    physicalCard?: {
+        id: string;
+    } | null | undefined;
+}>;
+
+export declare type CommonProps = {
     /**
      * The token provided by initiate-login.
      */
@@ -30,14 +216,48 @@ export declare function App(props: {
      * Optional component to render while the app is loading.
      */
     loadingComponent?: ReactNode;
-}): JSX.Element;
+};
+
+export declare function decodeToken(token: string): any;
 
 /**
- * Base class for all SDK errors
+ * Renders the CapitalOS Dispute Transaction experience.
  */
-export declare class CapitalOSError extends Error {
-    constructor(message: string);
-}
+export declare function DisputeTransaction({ transactionId, onDone, onCancel, ...restOfProps }: DisputeTransactionProps): JSX.Element;
+
+export declare type DisputeTransactionProps = CommonProps & {
+    /**
+     * The ID of the transaction to dispute.
+     */
+    transactionId: string;
+    /**
+     * Callback to invoke when the dispute was successfully submitted.
+     */
+    onDone: () => void;
+    /**
+     * Callback to invoke when the user cancels the dispute submission.
+     */
+    onCancel: () => void;
+};
+
+/**
+ * Encodes the rendering context as base64 and then URI encodes it.
+ */
+export declare function encodeRenderingContext<T>(renderingContext: NonNullable<T>): string;
+
+export declare type EntryPoint = RenderingContext_2['entryPoint'];
+
+export declare type IframeConnectionMethods = {
+    onLoad: () => void;
+    createCard?: {
+        onDone?: () => void;
+        onCancel?: () => void;
+    };
+    createDispute?: {
+        onDone?: () => void;
+        onCancel?: () => void;
+    };
+};
 
 export declare const IframeResizer: React_2.ForwardRefExoticComponent<Omit<IFrameOptions, "closedCallback" | "scrollCallback" | "resizedCallback" | "messageCallback" | "initCallback"> & {
     onClosed?(iframeId: string): void;
@@ -54,4 +274,134 @@ export declare class InvalidTokenError extends CapitalOSError {
     constructor();
 }
 
+/**
+ * Renders the CapitalOS Issue Card experience.
+ */
+export declare function IssueCard({ defaultValues, onDone, onCancel, ...restOfProps }: IssueCardProps): JSX.Element;
+
+export declare type IssueCardDefaultValues = z_2.infer<typeof issueCardDefaultValuesSchema>;
+
+declare const issueCardDefaultValuesSchema: z_2.ZodIntersection<z_2.ZodUnion<[z_2.ZodObject<{
+    firstName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    lastName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    phone: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    userId: z_2.ZodOptional<z_2.ZodUndefined>;
+}, "strip", z_2.ZodTypeAny, {
+    firstName?: string | null | undefined;
+    lastName?: string | null | undefined;
+    phone?: string | null | undefined;
+    userId?: undefined;
+}, {
+    firstName?: string | null | undefined;
+    lastName?: string | null | undefined;
+    phone?: string | null | undefined;
+    userId?: undefined;
+}>, z_2.ZodObject<{
+    userId: z_2.ZodString;
+}, "strip", z_2.ZodTypeAny, {
+    userId: string;
+}, {
+    userId: string;
+}>]>, z_2.ZodObject<{
+    nickname: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+}, "strip", z_2.ZodTypeAny, {
+    nickname?: string | null | undefined;
+}, {
+    nickname?: string | null | undefined;
+}>>;
+
+export declare type IssueCardProps = CommonProps & {
+    /**
+     * Default values to prefill the form with.
+     *
+     * Either provide a userId, in which case the default values will be taken from that user's profile, or provide the cardholder's details directly.
+     */
+    defaultValues?: IssueCardDefaultValues;
+    /**
+     * Callback to invoke when the card was created successfully.
+     */
+    onDone: () => void;
+    /**
+     * Callback to invoke when the card creation was cancelled by the user.
+     */
+    onCancel: () => void;
+};
+
+declare type RenderingContext_2 = z_2.infer<typeof renderingContextSchema>;
+
+declare const renderingContextSchema: z_2.ZodDiscriminatedUnion<"entryPoint", [z_2.ZodObject<{
+    entryPoint: z_2.ZodLiteral<"createCard">;
+    defaultValues: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodIntersection<z_2.ZodUnion<[z_2.ZodObject<{
+        firstName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+        lastName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+        phone: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+        userId: z_2.ZodOptional<z_2.ZodUndefined>;
+    }, "strip", z_2.ZodTypeAny, {
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    }, {
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    }>, z_2.ZodObject<{
+        userId: z_2.ZodString;
+    }, "strip", z_2.ZodTypeAny, {
+        userId: string;
+    }, {
+        userId: string;
+    }>]>, z_2.ZodObject<{
+        nickname: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    }, "strip", z_2.ZodTypeAny, {
+        nickname?: string | null | undefined;
+    }, {
+        nickname?: string | null | undefined;
+    }>>>>;
+}, "strip", z_2.ZodTypeAny, {
+    entryPoint: "createCard";
+    defaultValues?: (({
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    } | {
+        userId: string;
+    }) & {
+        nickname?: string | null | undefined;
+    }) | null | undefined;
+}, {
+    entryPoint: "createCard";
+    defaultValues?: (({
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    } | {
+        userId: string;
+    }) & {
+        nickname?: string | null | undefined;
+    }) | null | undefined;
+}>, z_2.ZodObject<{
+    entryPoint: z_2.ZodLiteral<"createDispute">;
+    transactionId: z_2.ZodString;
+}, "strip", z_2.ZodTypeAny, {
+    entryPoint: "createDispute";
+    transactionId: string;
+}, {
+    entryPoint: "createDispute";
+    transactionId: string;
+}>]>;
+
+/**
+ * connects to child iframe and returns whether the iframe is loaded or not.
+ */
+export declare function useIframeConnection({ iframeRef, token, onError, methods, }: {
+    iframeRef: React.RefObject<HTMLIFrameElement>;
+    token: string;
+    onError: ((error: Error) => void) | undefined | null;
+    methods: IframeConnectionMethods;
+}): void;
+
 export { }

package/dist/_tsup-dts-rollup.d.ts

@@ -1,3 +1,5 @@
+/// <reference types="react" />
+
 import { IFrameComponent } from 'iframe-resizer';
 import { IFrameMessageData } from 'iframe-resizer';
 import { IFrameOptions } from 'iframe-resizer';
@@ -5,11 +7,195 @@ import { IFrameResizedData } from 'iframe-resizer';
 import { IFrameScrollData } from 'iframe-resizer';
 import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
+import * as z from 'zod';
+import { z as z_2 } from 'zod';
 
 /**
  * Renders the CapitalOS App.
  */
-export declare function App(props: {
+export declare function App(props: CommonProps): JSX.Element;
+
+/**
+ * The internal component that handles all the heavy lifting of connecting to the iframe and rendering the app.
+ * all user facing components are basically  a syntactic sugar on top of this.
+ */
+export declare function CapitalOS<T>(props: CapitalOsProps<T>): JSX.Element;
+
+/**
+ * Base class for all SDK errors
+ */
+export declare class CapitalOSError extends Error {
+    constructor(message: string);
+}
+
+declare type CapitalOsProps<T> = CommonProps & {
+    renderingContext?: T | undefined;
+    methods?: Partial<IframeConnectionMethods>;
+};
+
+export declare type CardApiDto = z.infer<typeof cardApiDtoSchema>;
+
+declare const cardApiDtoSchema: z.ZodObject<{
+    accountUserId: z.ZodNullable<z.ZodString>;
+    status: z.ZodEnum<["active", "inactive", "canceled", "frozen"]>;
+    id: z.ZodString;
+    last4: z.ZodString;
+    platformId: z.ZodString;
+    cardholderFirstName: z.ZodString;
+    cardholderLastName: z.ZodString;
+    cardholderPhoneNumber: z.ZodEffects<z.ZodString, string, string>;
+    nickname: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    spend: z.ZodObject<{
+        daily: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+        weekly: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+        monthly: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+        lifetime: z.ZodObject<{
+            limit: z.ZodOptional<z.ZodNumber>;
+            amount: z.ZodNumber;
+        }, "strip", z.ZodTypeAny, {
+            amount: number;
+            limit?: number | undefined;
+        }, {
+            amount: number;
+            limit?: number | undefined;
+        }>;
+    }, "strip", z.ZodTypeAny, {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    }, {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    }>;
+    allowedSpendCategories: z.ZodArray<z.ZodEnum<["airlines", "carRental", "carService", "education", "electronics", "gasPump", "gasStation", "generalMerchandise", "government", "hardwareAndConstruction", "insurance", "legal", "lodging", "medical", "other", "parking", "phoneAndInternet", "professionalServices", "recreationAndEntertainment", "restaurants", "shipping", "software", "taxisAndRideshare", "transportation", "travelMisc", "utilities"]>, "many">;
+    physicalCard: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+        id: z.ZodString;
+    }, "strip", z.ZodTypeAny, {
+        id: string;
+    }, {
+        id: string;
+    }>>>;
+}, "strip", z.ZodTypeAny, {
+    id: string;
+    status: "active" | "inactive" | "canceled" | "frozen";
+    platformId: string;
+    accountUserId: string | null;
+    last4: string;
+    cardholderFirstName: string;
+    cardholderLastName: string;
+    cardholderPhoneNumber: string;
+    spend: {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    };
+    allowedSpendCategories: ("other" | "airlines" | "carRental" | "carService" | "education" | "electronics" | "gasPump" | "gasStation" | "generalMerchandise" | "government" | "hardwareAndConstruction" | "insurance" | "legal" | "lodging" | "medical" | "parking" | "phoneAndInternet" | "professionalServices" | "recreationAndEntertainment" | "restaurants" | "shipping" | "software" | "taxisAndRideshare" | "transportation" | "travelMisc" | "utilities")[];
+    nickname?: string | null | undefined;
+    physicalCard?: {
+        id: string;
+    } | null | undefined;
+}, {
+    id: string;
+    status: "active" | "inactive" | "canceled" | "frozen";
+    platformId: string;
+    accountUserId: string | null;
+    last4: string;
+    cardholderFirstName: string;
+    cardholderLastName: string;
+    cardholderPhoneNumber: string;
+    spend: {
+        daily: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        weekly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        monthly: {
+            amount: number;
+            limit?: number | undefined;
+        };
+        lifetime: {
+            amount: number;
+            limit?: number | undefined;
+        };
+    };
+    allowedSpendCategories: ("other" | "airlines" | "carRental" | "carService" | "education" | "electronics" | "gasPump" | "gasStation" | "generalMerchandise" | "government" | "hardwareAndConstruction" | "insurance" | "legal" | "lodging" | "medical" | "parking" | "phoneAndInternet" | "professionalServices" | "recreationAndEntertainment" | "restaurants" | "shipping" | "software" | "taxisAndRideshare" | "transportation" | "travelMisc" | "utilities")[];
+    nickname?: string | null | undefined;
+    physicalCard?: {
+        id: string;
+    } | null | undefined;
+}>;
+
+export declare type CommonProps = {
     /**
      * The token provided by initiate-login.
      */
@@ -30,14 +216,48 @@ export declare function App(props: {
      * Optional component to render while the app is loading.
      */
     loadingComponent?: ReactNode;
-}): JSX.Element;
+};
+
+export declare function decodeToken(token: string): any;
 
 /**
- * Base class for all SDK errors
+ * Renders the CapitalOS Dispute Transaction experience.
  */
-export declare class CapitalOSError extends Error {
-    constructor(message: string);
-}
+export declare function DisputeTransaction({ transactionId, onDone, onCancel, ...restOfProps }: DisputeTransactionProps): JSX.Element;
+
+export declare type DisputeTransactionProps = CommonProps & {
+    /**
+     * The ID of the transaction to dispute.
+     */
+    transactionId: string;
+    /**
+     * Callback to invoke when the dispute was successfully submitted.
+     */
+    onDone: () => void;
+    /**
+     * Callback to invoke when the user cancels the dispute submission.
+     */
+    onCancel: () => void;
+};
+
+/**
+ * Encodes the rendering context as base64 and then URI encodes it.
+ */
+export declare function encodeRenderingContext<T>(renderingContext: NonNullable<T>): string;
+
+export declare type EntryPoint = RenderingContext_2['entryPoint'];
+
+export declare type IframeConnectionMethods = {
+    onLoad: () => void;
+    createCard?: {
+        onDone?: () => void;
+        onCancel?: () => void;
+    };
+    createDispute?: {
+        onDone?: () => void;
+        onCancel?: () => void;
+    };
+};
 
 export declare const IframeResizer: React_2.ForwardRefExoticComponent<Omit<IFrameOptions, "closedCallback" | "scrollCallback" | "resizedCallback" | "messageCallback" | "initCallback"> & {
     onClosed?(iframeId: string): void;
@@ -54,4 +274,134 @@ export declare class InvalidTokenError extends CapitalOSError {
     constructor();
 }
 
+/**
+ * Renders the CapitalOS Issue Card experience.
+ */
+export declare function IssueCard({ defaultValues, onDone, onCancel, ...restOfProps }: IssueCardProps): JSX.Element;
+
+export declare type IssueCardDefaultValues = z_2.infer<typeof issueCardDefaultValuesSchema>;
+
+declare const issueCardDefaultValuesSchema: z_2.ZodIntersection<z_2.ZodUnion<[z_2.ZodObject<{
+    firstName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    lastName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    phone: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    userId: z_2.ZodOptional<z_2.ZodUndefined>;
+}, "strip", z_2.ZodTypeAny, {
+    firstName?: string | null | undefined;
+    lastName?: string | null | undefined;
+    phone?: string | null | undefined;
+    userId?: undefined;
+}, {
+    firstName?: string | null | undefined;
+    lastName?: string | null | undefined;
+    phone?: string | null | undefined;
+    userId?: undefined;
+}>, z_2.ZodObject<{
+    userId: z_2.ZodString;
+}, "strip", z_2.ZodTypeAny, {
+    userId: string;
+}, {
+    userId: string;
+}>]>, z_2.ZodObject<{
+    nickname: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+}, "strip", z_2.ZodTypeAny, {
+    nickname?: string | null | undefined;
+}, {
+    nickname?: string | null | undefined;
+}>>;
+
+export declare type IssueCardProps = CommonProps & {
+    /**
+     * Default values to prefill the form with.
+     *
+     * Either provide a userId, in which case the default values will be taken from that user's profile, or provide the cardholder's details directly.
+     */
+    defaultValues?: IssueCardDefaultValues;
+    /**
+     * Callback to invoke when the card was created successfully.
+     */
+    onDone: () => void;
+    /**
+     * Callback to invoke when the card creation was cancelled by the user.
+     */
+    onCancel: () => void;
+};
+
+declare type RenderingContext_2 = z_2.infer<typeof renderingContextSchema>;
+
+declare const renderingContextSchema: z_2.ZodDiscriminatedUnion<"entryPoint", [z_2.ZodObject<{
+    entryPoint: z_2.ZodLiteral<"createCard">;
+    defaultValues: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodIntersection<z_2.ZodUnion<[z_2.ZodObject<{
+        firstName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+        lastName: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+        phone: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+        userId: z_2.ZodOptional<z_2.ZodUndefined>;
+    }, "strip", z_2.ZodTypeAny, {
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    }, {
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    }>, z_2.ZodObject<{
+        userId: z_2.ZodString;
+    }, "strip", z_2.ZodTypeAny, {
+        userId: string;
+    }, {
+        userId: string;
+    }>]>, z_2.ZodObject<{
+        nickname: z_2.ZodOptional<z_2.ZodNullable<z_2.ZodString>>;
+    }, "strip", z_2.ZodTypeAny, {
+        nickname?: string | null | undefined;
+    }, {
+        nickname?: string | null | undefined;
+    }>>>>;
+}, "strip", z_2.ZodTypeAny, {
+    entryPoint: "createCard";
+    defaultValues?: (({
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    } | {
+        userId: string;
+    }) & {
+        nickname?: string | null | undefined;
+    }) | null | undefined;
+}, {
+    entryPoint: "createCard";
+    defaultValues?: (({
+        firstName?: string | null | undefined;
+        lastName?: string | null | undefined;
+        phone?: string | null | undefined;
+        userId?: undefined;
+    } | {
+        userId: string;
+    }) & {
+        nickname?: string | null | undefined;
+    }) | null | undefined;
+}>, z_2.ZodObject<{
+    entryPoint: z_2.ZodLiteral<"createDispute">;
+    transactionId: z_2.ZodString;
+}, "strip", z_2.ZodTypeAny, {
+    entryPoint: "createDispute";
+    transactionId: string;
+}, {
+    entryPoint: "createDispute";
+    transactionId: string;
+}>]>;
+
+/**
+ * connects to child iframe and returns whether the iframe is loaded or not.
+ */
+export declare function useIframeConnection({ iframeRef, token, onError, methods, }: {
+    iframeRef: React.RefObject<HTMLIFrameElement>;
+    token: string;
+    onError: ((error: Error) => void) | undefined | null;
+    methods: IframeConnectionMethods;
+}): void;
+
 export { }

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-"use client";var z=Object.defineProperty,T=Object.defineProperties;var O=Object.getOwnPropertyDescriptors;var h=Object.getOwnPropertySymbols;var R=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var L=(t,e,r)=>e in t?z(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,d=(t,e)=>{for(var r in e||(e={}))R.call(e,r)&&L(t,r,e[r]);if(h)for(var r of h(e))H.call(e,r)&&L(t,r,e[r]);return t},M=(t,e)=>T(t,O(e));import{connectToChild as A}from"penpal";import l,{useEffect as D,useMemo as P}from"react";var f=class extends Error{constructor(e){super(e),this.name="CapitalOSError"}},m=class extends f{constructor(){super("Invalid token"),this.name="CapitalOSInvalidTokenError"}};import{iframeResizer as k}from"iframe-resizer";import C,{forwardRef as E,useEffect as y,useImperativeHandle as v,useRef as N}from"react";var p=E((t,e)=>{let r=t.title||"iframe",{iframeHTMLAttributes:o,resizerOptions:i}=x(t),a=N(null);return y(()=>{let n=a.current;return k(d({},i),n),()=>n.iFrameResizer&&n.iFrameResizer.removeListeners()}),v(e,()=>a.current),C.createElement("iframe",M(d({},o),{title:r,ref:a}))});p.displayName="IframeResizer";var S=["autoResize","bodyBackground","bodyMargin","bodyPadding","checkOrigin","inPageLinks","heightCalculationMethod","interval","log","maxHeight","maxWidth","minHeight","minWidth","resizeFrom","scrolling","sizeHeight","sizeWidth","warningTimeout","tolerance","widthCalculationMethod","onClosed","onInit","onMessage","onResized","onScroll"],w=new Set(S);function x(t){return Object.keys(t).reduce((r,o)=>(w.has(o)?r.resizerOptions[o]=t[o]:r.iframeHTMLAttributes[o]=t[o],r),{resizerOptions:{},iframeHTMLAttributes:{}})}var W=1e4;function oe(t){let{token:e,className:r,enableLogging:o,onError:i,loadingComponent:a}=t,n=l.useRef(null),[u,I]=l.useState(!1),F=P(()=>{try{let s=decodeURIComponent(e),c=atob(s),b=JSON.parse(c),{path:g}=b;if(!g)throw new m;return`${g}?token=${e}`}catch(s){i==null||i(new m);return}},[e,i]);return D(()=>{let s=A({iframe:n.current,childOrigin:"*",debug:!0,timeout:W,methods:{onLoad:()=>{I(!0)}}});return s.promise.catch(c=>{i==null||i(c),I(!0)}),()=>{s.destroy()}},[e]),l.createElement(l.Fragment,null,!u&&a,l.createElement(p,{src:F,allow:"clipboard-write",checkOrigin:!1,style:{width:"1px",height:"0px",minWidth:"100%"},className:r,log:!!o,ref:n,hidden:!u}))}export{oe as App};
+"use client";var H=Object.defineProperty,v=Object.defineProperties;var D=Object.getOwnPropertyDescriptors;var p=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable;var y=(e,t,o)=>t in e?H(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,a=(e,t)=>{for(var o in t||(t={}))L.call(t,o)&&y(e,o,t[o]);if(p)for(var o of p(t))b.call(t,o)&&y(e,o,t[o]);return e},l=(e,t)=>v(e,D(t));var u=(e,t)=>{var o={};for(var r in e)L.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&p)for(var r of p(e))t.indexOf(r)<0&&b.call(e,r)&&(o[r]=e[r]);return o};import h,{useMemo as P}from"react";import g,{useMemo as q,useRef as G,useState as K}from"react";var I=class extends Error{constructor(t){super(t),this.name="CapitalOSError"}},m=class extends I{constructor(){super("Invalid token"),this.name="CapitalOSInvalidTokenError"}};import{connectToChild as S}from"penpal";import{useEffect as w}from"react";var N=1e4;function F({iframeRef:e,token:t,onError:o,methods:r}){w(()=>{let n=S({iframe:e.current,childOrigin:"*",debug:!0,timeout:N,methods:r});return n.promise.catch(i=>{o==null||o(i)}),()=>{n.destroy()}},[t])}import{iframeResizer as A}from"iframe-resizer";import B,{forwardRef as W,useEffect as _,useImperativeHandle as j,useRef as J}from"react";var C=W((e,t)=>{let o=e.title||"iframe",{iframeHTMLAttributes:r,resizerOptions:n}=$(e),i=J(null);return _(()=>{let s=i.current;return A(a({},n),s),()=>s.iFrameResizer&&s.iFrameResizer.removeListeners()}),j(t,()=>i.current),B.createElement("iframe",l(a({},r),{title:o,ref:i}))});C.displayName="IframeResizer";var U=["autoResize","bodyBackground","bodyMargin","bodyPadding","checkOrigin","inPageLinks","heightCalculationMethod","interval","log","maxHeight","maxWidth","minHeight","minWidth","resizeFrom","scrolling","sizeHeight","sizeWidth","warningTimeout","tolerance","widthCalculationMethod","onClosed","onInit","onMessage","onResized","onScroll"],V=new Set(U);function $(e){return Object.keys(e).reduce((o,r)=>(V.has(r)?o.resizerOptions[r]=e[r]:o.iframeHTMLAttributes[r]=e[r],o),{resizerOptions:{},iframeHTMLAttributes:{}})}function z(e){let t=JSON.stringify(e),o=btoa(t);return encodeURIComponent(o)}function R(e){try{let t=decodeURIComponent(e),o=atob(t);return JSON.parse(o)}catch(t){throw new m}}function f(e){let{token:t,className:o,enableLogging:r,onError:n,loadingComponent:i,renderingContext:s,methods:c}=e,[T,M]=K(!1),x=G(null),k=q(()=>{try{let d=s?z(s):null,E=R(t),{path:O}=E;if(!O)throw new m;return`${O}?token=${t}&renderingContext=${d!=null?d:""}`}catch(d){n==null||n(new m);return}},[t,n]);return F({iframeRef:x,token:t,onError:d=>{n==null||n(d),M(!0)},methods:a({onLoad:()=>M(!0)},c)}),g.createElement(g.Fragment,null,!T&&i,g.createElement(C,{src:k,allow:"clipboard-write",checkOrigin:!1,style:{width:"1px",height:"0px",minWidth:"100%"},className:o,log:!!r,ref:x,hidden:!T}))}function ye(e){return h.createElement(f,a({},e))}function Le(n){var i=n,{defaultValues:e,onDone:t,onCancel:o}=i,r=u(i,["defaultValues","onDone","onCancel"]);let s="createCard",c=P(()=>({entryPoint:s,defaultValues:e}),[e]);return h.createElement(f,l(a({},r),{renderingContext:c,methods:{createCard:{onDone:t,onCancel:o}}}))}function be(n){var i=n,{transactionId:e,onDone:t,onCancel:o}=i,r=u(i,["transactionId","onDone","onCancel"]);let s="createDispute",c=P(()=>({entryPoint:s,transactionId:e}),[e]);return h.createElement(f,l(a({},r),{renderingContext:c,methods:{createDispute:{onDone:t,onCancel:o}}}))}export{ye as App,be as DisputeTransaction,Le as IssueCard};
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.tsx","../../src/error.ts","../../src/iframe-resizer.tsx"],"sourcesContent":["'use client'\n\nimport { connectToChild } from 'penpal'\nimport React, { ReactNode, useEffect, useMemo } from 'react'\n\nimport { InvalidTokenError } from './error'\nimport { IframeResizer } from './iframe-resizer'\n\nconst IFRAME_CONNECTION_TIMEOUT_MILLISECONDS = 10_000\n\n/**\n * Renders the CapitalOS App.\n */\nexport function App(props: {\n  /**\n   * The token provided by initiate-login.\n   */\n  token: string\n  /**\n   * Optional CSS class name for the component.\n   */\n  className?: string\n  /**\n   * Optional flag indicating whether to log events to the console.\n   */\n  enableLogging?: boolean\n\n  /**\n   * Optional callback for when the app encounters an error.\n   */\n  onError?: (error: Error) => void\n\n  /**\n   * Optional component to render while the app is loading.\n   */\n  loadingComponent?: ReactNode\n}) {\n  const { token, className, enableLogging, onError, loadingComponent: LoadingComponent } = props\n\n  const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n  // represents the state of whether all required react queries returned and the page should be visible\n  const [isLoaded, setIsLoaded] = React.useState(false)\n\n  // memoize the url based on the token so we don't redo the computation on each render.\n  const url = useMemo(() => {\n    try {\n      const urlDecodedToken = decodeURIComponent(token)\n      const base64DecodedToken = atob(urlDecodedToken)\n      const jsonToken = JSON.parse(base64DecodedToken)\n      const { path } = jsonToken\n      if (!path) {\n        throw new InvalidTokenError()\n      }\n      return `${path}?token=${token}`\n    } catch (error) {\n      onError?.(new InvalidTokenError())\n      return undefined\n    }\n  }, [token, onError])\n\n  // connect to child iframe\n  useEffect(() => {\n    const connection = connectToChild({\n      iframe: iframeRef.current!,\n      childOrigin: '*',\n      debug: true,\n      timeout: IFRAME_CONNECTION_TIMEOUT_MILLISECONDS,\n      methods: {\n        onLoad: () => {\n          setIsLoaded(true)\n        },\n      },\n    })\n\n    connection.promise.catch((error) => {\n      onError?.(error)\n\n      // when connection fails it's probably a handshake timeout with the iframe. we will stop showing the loader\n      // since the fact we failed communication doesn't necessarily mean the iframe didn't load\n      setIsLoaded(true)\n    })\n\n    return () => {\n      connection.destroy()\n    }\n  }, [token])\n\n  return (\n    <>\n      {/* show loader as long as we're not loaded */}\n      {!isLoaded && LoadingComponent}\n      {/* hide the iframe as long as we're not loaded */}\n      <IframeResizer\n        src={url}\n        allow=\"clipboard-write\"\n        checkOrigin={false}\n        style={{ width: '1px', height: '0px', minWidth: '100%' }}\n        className={className}\n        log={!!enableLogging}\n        ref={iframeRef}\n        hidden={!isLoaded}\n      />\n    </>\n  )\n}\n","/**\n * Base class for all SDK errors\n */\nexport class CapitalOSError extends Error {\n  constructor(message: string) {\n    super(message)\n    this.name = 'CapitalOSError'\n  }\n}\n\n/**\n * Represents an error that occurs when an invalid token is encountered.\n */\nexport class InvalidTokenError extends CapitalOSError {\n  constructor() {\n    super('Invalid token')\n    this.name = 'CapitalOSInvalidTokenError'\n  }\n}\n","import {\n  IFrameOptions as BrokenIframeOptions,\n  IFrameComponent,\n  IFrameMessageData,\n  IFrameResizedData,\n  IFrameScrollData,\n  iframeResizer,\n} from 'iframe-resizer'\nimport React, { IframeHTMLAttributes, forwardRef, useEffect, useImperativeHandle, useRef } from 'react'\n\n// the events were renamed but package maintainers didn't update the types.\ntype IFrameOptions = Omit<\n  BrokenIframeOptions,\n  'closedCallback' | 'scrollCallback' | 'resizedCallback' | 'messageCallback' | 'initCallback'\n> & {\n  onClosed?(iframeId: string): void\n  onInit?(iframe: IFrameComponent): void\n  onMessage?(data: IFrameMessageData): void\n  onResized?(data: IFrameResizedData): void\n  onScroll?(data: IFrameScrollData): boolean\n}\n\ntype IframeResizerProps = IFrameOptions & IframeHTMLAttributes<HTMLIFrameElement>\ntype EnrichedHtmlIframeElement = HTMLIFrameElement & { iFrameResizer: { removeListeners: () => void } }\n\nexport const IframeResizer = forwardRef((props: IframeResizerProps, ref: React.Ref<HTMLIFrameElement>) => {\n  const title = props.title || 'iframe'\n  const { iframeHTMLAttributes, resizerOptions } = splitProps(props)\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n\n  useEffect(() => {\n    // effects run after render, so the ref is guaranteed to be set (unless the component conditionally renders the iframe, which is not the case)\n    const iframe = iframeRef.current as EnrichedHtmlIframeElement\n\n    iframeResizer({ ...resizerOptions }, iframe)\n\n    return () => iframe.iFrameResizer && iframe.iFrameResizer.removeListeners()\n  })\n\n  // make the ref provided as a prop point to the same place as the internal iframe ref.\n  useImperativeHandle(ref, () => iframeRef.current as HTMLIFrameElement)\n\n  return <iframe {...iframeHTMLAttributes} title={title} ref={iframeRef} />\n})\n\nIframeResizer.displayName = 'IframeResizer'\n\nconst resizerOptions = [\n  'autoResize',\n  'bodyBackground',\n  'bodyMargin',\n  'bodyPadding',\n  'checkOrigin',\n  'inPageLinks',\n  'heightCalculationMethod',\n  'interval',\n  'log',\n  'maxHeight',\n  'maxWidth',\n  'minHeight',\n  'minWidth',\n  'resizeFrom',\n  'scrolling',\n  'sizeHeight',\n  'sizeWidth',\n  'warningTimeout',\n  'tolerance',\n  'widthCalculationMethod',\n  'onClosed',\n  'onInit',\n  'onMessage',\n  'onResized',\n  'onScroll',\n]\n\nconst resizerOptionsSet = new Set(resizerOptions)\n\n/**\n * split props into the resizer library options and the native iframe attributes.\n * the code is contains many type assertions because typescript doesn't handle reduce well.\n */\nfunction splitProps(props: IframeResizerProps) {\n  const split = Object.keys(props).reduce<{\n    resizerOptions: IFrameOptions\n    iframeHTMLAttributes: IframeHTMLAttributes<HTMLIFrameElement>\n  }>(\n    (acc, key) => {\n      if (resizerOptionsSet.has(key)) {\n        acc.resizerOptions[key as keyof IFrameOptions] = props[key as keyof typeof props]\n      } else {\n        acc.iframeHTMLAttributes[key as keyof IframeHTMLAttributes<HTMLIFrameElement>] =\n          props[key as keyof typeof props]\n      }\n      return acc\n    },\n    { resizerOptions: {}, iframeHTMLAttributes: {} },\n  )\n\n  return split\n}\n"],"mappings":"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","names":["connectToChild","React","useEffect","useMemo","CapitalOSError","message","InvalidTokenError","iframeResizer","React","forwardRef","useEffect","useImperativeHandle","useRef","IframeResizer","forwardRef","props","ref","title","iframeHTMLAttributes","resizerOptions","splitProps","iframeRef","useRef","useEffect","iframe","iframeResizer","__spreadValues","useImperativeHandle","React","__spreadProps","resizerOptionsSet","acc","key","IFRAME_CONNECTION_TIMEOUT_MILLISECONDS","App","props","token","className","enableLogging","onError","LoadingComponent","iframeRef","React","isLoaded","setIsLoaded","url","useMemo","urlDecodedToken","base64DecodedToken","jsonToken","path","InvalidTokenError","error","useEffect","connection","connectToChild","IframeResizer"]}
+{"version":3,"sources":["../../src/index.tsx","../../src/capital-os.tsx","../../src/error.ts","../../src/hooks.ts","../../src/iframe-resizer.tsx","../../src/utils.ts"],"sourcesContent":["'use client'\n\nimport React, { useMemo } from 'react'\n\nimport { CapitalOS } from './capital-os'\nimport type { EntryPoint, IssueCardDefaultValues } from './external-types'\nimport type { CommonProps } from './types'\n\n/**\n * Renders the CapitalOS App.\n */\nexport function App(props: CommonProps) {\n  return <CapitalOS {...props} />\n}\n\nexport type IssueCardProps = CommonProps & {\n  /**\n   * Default values to prefill the form with.\n   *\n   * Either provide a userId, in which case the default values will be taken from that user's profile, or provide the cardholder's details directly.\n   */\n  defaultValues?: IssueCardDefaultValues\n\n  /**\n   * Callback to invoke when the card was created successfully.\n   */\n  onDone: () => void\n\n  /**\n   * Callback to invoke when the card creation was cancelled by the user.\n   */\n  onCancel: () => void\n}\n\n/**\n * Renders the CapitalOS Issue Card experience.\n */\nexport function IssueCard({ defaultValues, onDone, onCancel, ...restOfProps }: IssueCardProps) {\n  const entryPoint: EntryPoint = 'createCard'\n  const renderingContext = useMemo(\n    () => ({\n      entryPoint,\n      defaultValues: defaultValues,\n    }),\n    [defaultValues],\n  )\n\n  return (\n    <CapitalOS {...restOfProps} renderingContext={renderingContext} methods={{ createCard: { onDone, onCancel } }} />\n  )\n}\n\nexport type DisputeTransactionProps = CommonProps & {\n  /**\n   * The ID of the transaction to dispute.\n   */\n  transactionId: string\n\n  /**\n   * Callback to invoke when the dispute was successfully submitted.\n   */\n  onDone: () => void\n\n  /**\n   * Callback to invoke when the user cancels the dispute submission.\n   */\n  onCancel: () => void\n}\n\n/**\n * Renders the CapitalOS Dispute Transaction experience.\n */\nexport function DisputeTransaction({ transactionId, onDone, onCancel, ...restOfProps }: DisputeTransactionProps) {\n  const entryPoint: EntryPoint = 'createDispute'\n  const renderingContext = useMemo(() => ({ entryPoint, transactionId }), [transactionId])\n\n  return (\n    <CapitalOS {...restOfProps} renderingContext={renderingContext} methods={{ createDispute: { onDone, onCancel } }} />\n  )\n}\n","import React, { useMemo, useRef, useState } from 'react'\n\nimport { InvalidTokenError } from './error'\nimport { IframeConnectionMethods, useIframeConnection } from './hooks'\nimport { IframeResizer } from './iframe-resizer'\nimport { CommonProps } from './types'\nimport { decodeToken, encodeRenderingContext } from './utils'\n\ntype CapitalOsProps<T> = CommonProps & {\n  renderingContext?: T | undefined\n  methods?: Partial<IframeConnectionMethods>\n}\n\n/**\n * The internal component that handles all the heavy lifting of connecting to the iframe and rendering the app.\n * all user facing components are basically  a syntactic sugar on top of this.\n */\nexport function CapitalOS<T>(props: CapitalOsProps<T>) {\n  const {\n    token,\n    className,\n    enableLogging,\n    onError,\n    loadingComponent: LoadingComponent,\n    renderingContext,\n    methods,\n  } = props\n  // represents the state of whether all required react queries returned and the page should be visible\n  const [isLoaded, setIsLoaded] = useState(false)\n\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n\n  // memoize the url based on the token so we don't redo the computation on each render.\n  const url = useMemo(() => {\n    try {\n      const encodedRenderingContext = renderingContext ? encodeRenderingContext(renderingContext) : null\n\n      const tokenObject = decodeToken(token)\n\n      const { path } = tokenObject\n      if (!path) {\n        throw new InvalidTokenError()\n      }\n      return `${path}?token=${token}&renderingContext=${encodedRenderingContext ?? ''}`\n    } catch (error) {\n      // communicate a general error about the token being invalid to the parent component, no matter which internal error we encountered during token parsing.\n      onError?.(new InvalidTokenError())\n      return undefined\n    }\n    // renderingContext is not part of the dependencies since we do not want to reload the iframe unless the token changes.\n  }, [token, onError])\n\n  useIframeConnection({\n    iframeRef,\n    token,\n    onError: (error) => {\n      onError?.(error)\n      // when connection fails it's probably a handshake timeout with the iframe. we will stop showing the loader\n      // since the fact we failed communication doesn't necessarily mean the iframe didn't load\n      setIsLoaded(true)\n    },\n    methods: { onLoad: () => setIsLoaded(true), ...methods },\n  })\n\n  return (\n    <>\n      {/* show loader as long as we're not loaded */}\n      {!isLoaded && LoadingComponent}\n      {/* hide the iframe as long as we're not loaded */}\n      <IframeResizer\n        src={url}\n        allow=\"clipboard-write\"\n        checkOrigin={false}\n        style={{ width: '1px', height: '0px', minWidth: '100%' }}\n        className={className}\n        log={!!enableLogging}\n        ref={iframeRef}\n        hidden={!isLoaded}\n      />\n    </>\n  )\n}\n","/**\n * Base class for all SDK errors\n */\nexport class CapitalOSError extends Error {\n  constructor(message: string) {\n    super(message)\n    this.name = 'CapitalOSError'\n  }\n}\n\n/**\n * Represents an error that occurs when an invalid token is encountered.\n */\nexport class InvalidTokenError extends CapitalOSError {\n  constructor() {\n    super('Invalid token')\n    this.name = 'CapitalOSInvalidTokenError'\n  }\n}\n","import { connectToChild } from 'penpal'\nimport { useEffect } from 'react'\n\nconst IFRAME_CONNECTION_TIMEOUT_MILLISECONDS = 10_000\n\nexport type IframeConnectionMethods = {\n  onLoad: () => void\n  createCard?: {\n    onDone?: () => void\n    onCancel?: () => void\n  }\n  createDispute?: {\n    onDone?: () => void\n    onCancel?: () => void\n  }\n}\n\n/**\n * connects to child iframe and returns whether the iframe is loaded or not.\n */\nexport function useIframeConnection({\n  iframeRef,\n  token,\n  onError,\n  methods,\n}: {\n  iframeRef: React.RefObject<HTMLIFrameElement>\n  token: string\n  onError: ((error: Error) => void) | undefined | null\n  methods: IframeConnectionMethods\n}) {\n  // connect to child iframe\n  useEffect(() => {\n    const connection = connectToChild({\n      iframe: iframeRef.current!,\n      childOrigin: '*',\n      debug: true,\n      timeout: IFRAME_CONNECTION_TIMEOUT_MILLISECONDS,\n      methods: methods,\n    })\n\n    connection.promise.catch((error) => {\n      onError?.(error)\n    })\n\n    return () => {\n      connection.destroy()\n    }\n  }, [token])\n}\n","import {\n  IFrameOptions as BrokenIframeOptions,\n  IFrameComponent,\n  IFrameMessageData,\n  IFrameResizedData,\n  IFrameScrollData,\n  iframeResizer,\n} from 'iframe-resizer'\nimport React, { IframeHTMLAttributes, forwardRef, useEffect, useImperativeHandle, useRef } from 'react'\n\n// the events were renamed but package maintainers didn't update the types.\ntype IFrameOptions = Omit<\n  BrokenIframeOptions,\n  'closedCallback' | 'scrollCallback' | 'resizedCallback' | 'messageCallback' | 'initCallback'\n> & {\n  onClosed?(iframeId: string): void\n  onInit?(iframe: IFrameComponent): void\n  onMessage?(data: IFrameMessageData): void\n  onResized?(data: IFrameResizedData): void\n  onScroll?(data: IFrameScrollData): boolean\n}\n\ntype IframeResizerProps = IFrameOptions & IframeHTMLAttributes<HTMLIFrameElement>\ntype EnrichedHtmlIframeElement = HTMLIFrameElement & { iFrameResizer: { removeListeners: () => void } }\n\nexport const IframeResizer = forwardRef((props: IframeResizerProps, ref: React.Ref<HTMLIFrameElement>) => {\n  const title = props.title || 'iframe'\n  const { iframeHTMLAttributes, resizerOptions } = splitProps(props)\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n\n  useEffect(() => {\n    // effects run after render, so the ref is guaranteed to be set (unless the component conditionally renders the iframe, which is not the case)\n    const iframe = iframeRef.current as EnrichedHtmlIframeElement\n\n    iframeResizer({ ...resizerOptions }, iframe)\n\n    return () => iframe.iFrameResizer && iframe.iFrameResizer.removeListeners()\n  })\n\n  // make the ref provided as a prop point to the same place as the internal iframe ref.\n  useImperativeHandle(ref, () => iframeRef.current as HTMLIFrameElement)\n\n  return <iframe {...iframeHTMLAttributes} title={title} ref={iframeRef} />\n})\n\nIframeResizer.displayName = 'IframeResizer'\n\nconst resizerOptions = [\n  'autoResize',\n  'bodyBackground',\n  'bodyMargin',\n  'bodyPadding',\n  'checkOrigin',\n  'inPageLinks',\n  'heightCalculationMethod',\n  'interval',\n  'log',\n  'maxHeight',\n  'maxWidth',\n  'minHeight',\n  'minWidth',\n  'resizeFrom',\n  'scrolling',\n  'sizeHeight',\n  'sizeWidth',\n  'warningTimeout',\n  'tolerance',\n  'widthCalculationMethod',\n  'onClosed',\n  'onInit',\n  'onMessage',\n  'onResized',\n  'onScroll',\n]\n\nconst resizerOptionsSet = new Set(resizerOptions)\n\n/**\n * split props into the resizer library options and the native iframe attributes.\n * the code is contains many type assertions because typescript doesn't handle reduce well.\n */\nfunction splitProps(props: IframeResizerProps) {\n  const split = Object.keys(props).reduce<{\n    resizerOptions: IFrameOptions\n    iframeHTMLAttributes: IframeHTMLAttributes<HTMLIFrameElement>\n  }>(\n    (acc, key) => {\n      if (resizerOptionsSet.has(key)) {\n        acc.resizerOptions[key as keyof IFrameOptions] = props[key as keyof typeof props]\n      } else {\n        acc.iframeHTMLAttributes[key as keyof IframeHTMLAttributes<HTMLIFrameElement>] =\n          props[key as keyof typeof props]\n      }\n      return acc\n    },\n    { resizerOptions: {}, iframeHTMLAttributes: {} },\n  )\n\n  return split\n}\n","import { InvalidTokenError } from './error'\n\n/**\n * Encodes the rendering context as base64 and then URI encodes it.\n */\nexport function encodeRenderingContext<T>(renderingContext: NonNullable<T>) {\n  const renderingContextJson = JSON.stringify(renderingContext)\n  const renderingContextBase64 = btoa(renderingContextJson)\n  const renderingContextEncoded = encodeURIComponent(renderingContextBase64)\n\n  return renderingContextEncoded\n}\n\nexport function decodeToken(token: string) {\n  try {\n    const urlDecodedToken = decodeURIComponent(token)\n    const base64DecodedToken = atob(urlDecodedToken)\n    return JSON.parse(base64DecodedToken)\n  } catch (error) {\n    throw new InvalidTokenError()\n  }\n}\n"],"mappings":"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","names":["React","useMemo","React","useMemo","useRef","useState","CapitalOSError","message","InvalidTokenError","connectToChild","useEffect","IFRAME_CONNECTION_TIMEOUT_MILLISECONDS","useIframeConnection","iframeRef","token","onError","methods","connection","error","iframeResizer","React","forwardRef","useEffect","useImperativeHandle","useRef","IframeResizer","forwardRef","props","ref","title","iframeHTMLAttributes","resizerOptions","splitProps","iframeRef","useRef","useEffect","iframe","iframeResizer","__spreadValues","useImperativeHandle","React","__spreadProps","resizerOptionsSet","acc","key","encodeRenderingContext","renderingContext","renderingContextJson","renderingContextBase64","decodeToken","token","urlDecodedToken","base64DecodedToken","error","InvalidTokenError","CapitalOS","props","token","className","enableLogging","onError","LoadingComponent","renderingContext","methods","isLoaded","setIsLoaded","useState","iframeRef","useRef","url","useMemo","encodedRenderingContext","encodeRenderingContext","tokenObject","decodeToken","path","InvalidTokenError","error","useIframeConnection","__spreadValues","React","IframeResizer","App","props","React","CapitalOS","__spreadValues","IssueCard","_a","_b","defaultValues","onDone","onCancel","restOfProps","__objRest","entryPoint","renderingContext","useMemo","__spreadProps","DisputeTransaction","transactionId"]}

package/dist/index.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var E=Object.create;var c=Object.defineProperty,y=Object.defineProperties,v=Object.getOwnPropertyDescriptor,N=Object.getOwnPropertyDescriptors,S=Object.getOwnPropertyNames,M=Object.getOwnPropertySymbols,w=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable;var F=(e,t,r)=>t in e?c(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,p=(e,t)=>{for(var r in t||(t={}))b.call(t,r)&&F(e,r,t[r]);if(M)for(var r of M(t))x.call(t,r)&&F(e,r,t[r]);return e},z=(e,t)=>y(e,N(t));var A=(e,t)=>{for(var r in t)c(e,r,{get:t[r],enumerable:!0})},T=(e,t,r,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of S(t))!b.call(e,o)&&o!==r&&c(e,o,{get:()=>t[o],enumerable:!(i=v(t,o))||i.enumerable});return e};var O=(e,t,r)=>(r=e!=null?E(w(e)):{},T(t||!e||!e.__esModule?c(r,"default",{value:e,enumerable:!0}):r,e)),D=e=>T(c({},"__esModule",{value:!0}),e);var U={};A(U,{App:()=>j});module.exports=D(U);var H=require("penpal"),a=O(require("react"));var u=class extends Error{constructor(t){super(t),this.name="CapitalOSError"}},d=class extends u{constructor(){super("Invalid token"),this.name="CapitalOSInvalidTokenError"}};var R=require("iframe-resizer"),n=O(require("react"));var I=(0,n.forwardRef)((e,t)=>{let r=e.title||"iframe",{iframeHTMLAttributes:i,resizerOptions:o}=_(e),m=(0,n.useRef)(null);return(0,n.useEffect)(()=>{let s=m.current;return(0,R.iframeResizer)(p({},o),s),()=>s.iFrameResizer&&s.iFrameResizer.removeListeners()}),(0,n.useImperativeHandle)(t,()=>m.current),n.default.createElement("iframe",z(p({},i),{title:r,ref:m}))});I.displayName="IframeResizer";var P=["autoResize","bodyBackground","bodyMargin","bodyPadding","checkOrigin","inPageLinks","heightCalculationMethod","interval","log","maxHeight","maxWidth","minHeight","minWidth","resizeFrom","scrolling","sizeHeight","sizeWidth","warningTimeout","tolerance","widthCalculationMethod","onClosed","onInit","onMessage","onResized","onScroll"],W=new Set(P);function _(e){return Object.keys(e).reduce((r,i)=>(W.has(i)?r.resizerOptions[i]=e[i]:r.iframeHTMLAttributes[i]=e[i],r),{resizerOptions:{},iframeHTMLAttributes:{}})}var B=1e4;function j(e){let{token:t,className:r,enableLogging:i,onError:o,loadingComponent:m}=e,s=a.default.useRef(null),[g,h]=a.default.useState(!1),k=(0,a.useMemo)(()=>{try{let l=decodeURIComponent(t),f=atob(l),C=JSON.parse(f),{path:L}=C;if(!L)throw new d;return`${L}?token=${t}`}catch(l){o==null||o(new d);return}},[t,o]);return(0,a.useEffect)(()=>{let l=(0,H.connectToChild)({iframe:s.current,childOrigin:"*",debug:!0,timeout:B,methods:{onLoad:()=>{h(!0)}}});return l.promise.catch(f=>{o==null||o(f),h(!0)}),()=>{l.destroy()}},[t]),a.default.createElement(a.default.Fragment,null,!g&&m,a.default.createElement(I,{src:k,allow:"clipboard-write",checkOrigin:!1,style:{width:"1px",height:"0px",minWidth:"100%"},className:r,log:!!i,ref:s,hidden:!g}))}0&&(module.exports={App});
+"use strict";"use client";var A=Object.create;var u=Object.defineProperty,B=Object.defineProperties,W=Object.getOwnPropertyDescriptor,_=Object.getOwnPropertyDescriptors,j=Object.getOwnPropertyNames,C=Object.getOwnPropertySymbols,J=Object.getPrototypeOf,h=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var z=(e,t,o)=>t in e?u(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,d=(e,t)=>{for(var o in t||(t={}))h.call(t,o)&&z(e,o,t[o]);if(C)for(var o of C(t))R.call(t,o)&&z(e,o,t[o]);return e},I=(e,t)=>B(e,_(t));var T=(e,t)=>{var o={};for(var r in e)h.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&C)for(var r of C(e))t.indexOf(r)<0&&R.call(e,r)&&(o[r]=e[r]);return o};var U=(e,t)=>{for(var o in t)u(e,o,{get:t[o],enumerable:!0})},P=(e,t,o,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of j(t))!h.call(e,n)&&n!==o&&u(e,n,{get:()=>t[n],enumerable:!(r=W(t,n))||r.enumerable});return e};var M=(e,t,o)=>(o=e!=null?A(J(e)):{},P(t||!e||!e.__esModule?u(o,"default",{value:e,enumerable:!0}):o,e)),V=e=>P(u({},"__esModule",{value:!0}),e);var Z={};U(Z,{App:()=>Q,DisputeTransaction:()=>Y,IssueCard:()=>X});module.exports=V(Z);var l=M(require("react"));var m=M(require("react"));var x=class extends Error{constructor(t){super(t),this.name="CapitalOSError"}},c=class extends x{constructor(){super("Invalid token"),this.name="CapitalOSInvalidTokenError"}};var k=require("penpal"),E=require("react"),$=1e4;function H({iframeRef:e,token:t,onError:o,methods:r}){(0,E.useEffect)(()=>{let n=(0,k.connectToChild)({iframe:e.current,childOrigin:"*",debug:!0,timeout:$,methods:r});return n.promise.catch(i=>{o==null||o(i)}),()=>{n.destroy()}},[t])}var v=require("iframe-resizer"),a=M(require("react"));var O=(0,a.forwardRef)((e,t)=>{let o=e.title||"iframe",{iframeHTMLAttributes:r,resizerOptions:n}=K(e),i=(0,a.useRef)(null);return(0,a.useEffect)(()=>{let s=i.current;return(0,v.iframeResizer)(d({},n),s),()=>s.iFrameResizer&&s.iFrameResizer.removeListeners()}),(0,a.useImperativeHandle)(t,()=>i.current),a.default.createElement("iframe",I(d({},r),{title:o,ref:i}))});O.displayName="IframeResizer";var q=["autoResize","bodyBackground","bodyMargin","bodyPadding","checkOrigin","inPageLinks","heightCalculationMethod","interval","log","maxHeight","maxWidth","minHeight","minWidth","resizeFrom","scrolling","sizeHeight","sizeWidth","warningTimeout","tolerance","widthCalculationMethod","onClosed","onInit","onMessage","onResized","onScroll"],G=new Set(q);function K(e){return Object.keys(e).reduce((o,r)=>(G.has(r)?o.resizerOptions[r]=e[r]:o.iframeHTMLAttributes[r]=e[r],o),{resizerOptions:{},iframeHTMLAttributes:{}})}function D(e){let t=JSON.stringify(e),o=btoa(t);return encodeURIComponent(o)}function S(e){try{let t=decodeURIComponent(e),o=atob(t);return JSON.parse(o)}catch(t){throw new c}}function g(e){let{token:t,className:o,enableLogging:r,onError:n,loadingComponent:i,renderingContext:s,methods:f}=e,[y,L]=(0,m.useState)(!1),b=(0,m.useRef)(null),w=(0,m.useMemo)(()=>{try{let p=s?D(s):null,N=S(t),{path:F}=N;if(!F)throw new c;return`${F}?token=${t}&renderingContext=${p!=null?p:""}`}catch(p){n==null||n(new c);return}},[t,n]);return H({iframeRef:b,token:t,onError:p=>{n==null||n(p),L(!0)},methods:d({onLoad:()=>L(!0)},f)}),m.default.createElement(m.default.Fragment,null,!y&&i,m.default.createElement(O,{src:w,allow:"clipboard-write",checkOrigin:!1,style:{width:"1px",height:"0px",minWidth:"100%"},className:o,log:!!r,ref:b,hidden:!y}))}function Q(e){return l.default.createElement(g,d({},e))}function X(n){var i=n,{defaultValues:e,onDone:t,onCancel:o}=i,r=T(i,["defaultValues","onDone","onCancel"]);let s="createCard",f=(0,l.useMemo)(()=>({entryPoint:s,defaultValues:e}),[e]);return l.default.createElement(g,I(d({},r),{renderingContext:f,methods:{createCard:{onDone:t,onCancel:o}}}))}function Y(n){var i=n,{transactionId:e,onDone:t,onCancel:o}=i,r=T(i,["transactionId","onDone","onCancel"]);let s="createDispute",f=(0,l.useMemo)(()=>({entryPoint:s,transactionId:e}),[e]);return l.default.createElement(g,I(d({},r),{renderingContext:f,methods:{createDispute:{onDone:t,onCancel:o}}}))}0&&(module.exports={App,DisputeTransaction,IssueCard});
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.tsx","../src/error.ts","../src/iframe-resizer.tsx"],"sourcesContent":["'use client'\n\nimport { connectToChild } from 'penpal'\nimport React, { ReactNode, useEffect, useMemo } from 'react'\n\nimport { InvalidTokenError } from './error'\nimport { IframeResizer } from './iframe-resizer'\n\nconst IFRAME_CONNECTION_TIMEOUT_MILLISECONDS = 10_000\n\n/**\n * Renders the CapitalOS App.\n */\nexport function App(props: {\n  /**\n   * The token provided by initiate-login.\n   */\n  token: string\n  /**\n   * Optional CSS class name for the component.\n   */\n  className?: string\n  /**\n   * Optional flag indicating whether to log events to the console.\n   */\n  enableLogging?: boolean\n\n  /**\n   * Optional callback for when the app encounters an error.\n   */\n  onError?: (error: Error) => void\n\n  /**\n   * Optional component to render while the app is loading.\n   */\n  loadingComponent?: ReactNode\n}) {\n  const { token, className, enableLogging, onError, loadingComponent: LoadingComponent } = props\n\n  const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n  // represents the state of whether all required react queries returned and the page should be visible\n  const [isLoaded, setIsLoaded] = React.useState(false)\n\n  // memoize the url based on the token so we don't redo the computation on each render.\n  const url = useMemo(() => {\n    try {\n      const urlDecodedToken = decodeURIComponent(token)\n      const base64DecodedToken = atob(urlDecodedToken)\n      const jsonToken = JSON.parse(base64DecodedToken)\n      const { path } = jsonToken\n      if (!path) {\n        throw new InvalidTokenError()\n      }\n      return `${path}?token=${token}`\n    } catch (error) {\n      onError?.(new InvalidTokenError())\n      return undefined\n    }\n  }, [token, onError])\n\n  // connect to child iframe\n  useEffect(() => {\n    const connection = connectToChild({\n      iframe: iframeRef.current!,\n      childOrigin: '*',\n      debug: true,\n      timeout: IFRAME_CONNECTION_TIMEOUT_MILLISECONDS,\n      methods: {\n        onLoad: () => {\n          setIsLoaded(true)\n        },\n      },\n    })\n\n    connection.promise.catch((error) => {\n      onError?.(error)\n\n      // when connection fails it's probably a handshake timeout with the iframe. we will stop showing the loader\n      // since the fact we failed communication doesn't necessarily mean the iframe didn't load\n      setIsLoaded(true)\n    })\n\n    return () => {\n      connection.destroy()\n    }\n  }, [token])\n\n  return (\n    <>\n      {/* show loader as long as we're not loaded */}\n      {!isLoaded && LoadingComponent}\n      {/* hide the iframe as long as we're not loaded */}\n      <IframeResizer\n        src={url}\n        allow=\"clipboard-write\"\n        checkOrigin={false}\n        style={{ width: '1px', height: '0px', minWidth: '100%' }}\n        className={className}\n        log={!!enableLogging}\n        ref={iframeRef}\n        hidden={!isLoaded}\n      />\n    </>\n  )\n}\n","/**\n * Base class for all SDK errors\n */\nexport class CapitalOSError extends Error {\n  constructor(message: string) {\n    super(message)\n    this.name = 'CapitalOSError'\n  }\n}\n\n/**\n * Represents an error that occurs when an invalid token is encountered.\n */\nexport class InvalidTokenError extends CapitalOSError {\n  constructor() {\n    super('Invalid token')\n    this.name = 'CapitalOSInvalidTokenError'\n  }\n}\n","import {\n  IFrameOptions as BrokenIframeOptions,\n  IFrameComponent,\n  IFrameMessageData,\n  IFrameResizedData,\n  IFrameScrollData,\n  iframeResizer,\n} from 'iframe-resizer'\nimport React, { IframeHTMLAttributes, forwardRef, useEffect, useImperativeHandle, useRef } from 'react'\n\n// the events were renamed but package maintainers didn't update the types.\ntype IFrameOptions = Omit<\n  BrokenIframeOptions,\n  'closedCallback' | 'scrollCallback' | 'resizedCallback' | 'messageCallback' | 'initCallback'\n> & {\n  onClosed?(iframeId: string): void\n  onInit?(iframe: IFrameComponent): void\n  onMessage?(data: IFrameMessageData): void\n  onResized?(data: IFrameResizedData): void\n  onScroll?(data: IFrameScrollData): boolean\n}\n\ntype IframeResizerProps = IFrameOptions & IframeHTMLAttributes<HTMLIFrameElement>\ntype EnrichedHtmlIframeElement = HTMLIFrameElement & { iFrameResizer: { removeListeners: () => void } }\n\nexport const IframeResizer = forwardRef((props: IframeResizerProps, ref: React.Ref<HTMLIFrameElement>) => {\n  const title = props.title || 'iframe'\n  const { iframeHTMLAttributes, resizerOptions } = splitProps(props)\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n\n  useEffect(() => {\n    // effects run after render, so the ref is guaranteed to be set (unless the component conditionally renders the iframe, which is not the case)\n    const iframe = iframeRef.current as EnrichedHtmlIframeElement\n\n    iframeResizer({ ...resizerOptions }, iframe)\n\n    return () => iframe.iFrameResizer && iframe.iFrameResizer.removeListeners()\n  })\n\n  // make the ref provided as a prop point to the same place as the internal iframe ref.\n  useImperativeHandle(ref, () => iframeRef.current as HTMLIFrameElement)\n\n  return <iframe {...iframeHTMLAttributes} title={title} ref={iframeRef} />\n})\n\nIframeResizer.displayName = 'IframeResizer'\n\nconst resizerOptions = [\n  'autoResize',\n  'bodyBackground',\n  'bodyMargin',\n  'bodyPadding',\n  'checkOrigin',\n  'inPageLinks',\n  'heightCalculationMethod',\n  'interval',\n  'log',\n  'maxHeight',\n  'maxWidth',\n  'minHeight',\n  'minWidth',\n  'resizeFrom',\n  'scrolling',\n  'sizeHeight',\n  'sizeWidth',\n  'warningTimeout',\n  'tolerance',\n  'widthCalculationMethod',\n  'onClosed',\n  'onInit',\n  'onMessage',\n  'onResized',\n  'onScroll',\n]\n\nconst resizerOptionsSet = new Set(resizerOptions)\n\n/**\n * split props into the resizer library options and the native iframe attributes.\n * the code is contains many type assertions because typescript doesn't handle reduce well.\n */\nfunction splitProps(props: IframeResizerProps) {\n  const split = Object.keys(props).reduce<{\n    resizerOptions: IFrameOptions\n    iframeHTMLAttributes: IframeHTMLAttributes<HTMLIFrameElement>\n  }>(\n    (acc, key) => {\n      if (resizerOptionsSet.has(key)) {\n        acc.resizerOptions[key as keyof IFrameOptions] = props[key as keyof typeof props]\n      } else {\n        acc.iframeHTMLAttributes[key as keyof IframeHTMLAttributes<HTMLIFrameElement>] =\n          props[key as keyof typeof props]\n      }\n      return acc\n    },\n    { resizerOptions: {}, iframeHTMLAttributes: {} },\n  )\n\n  return split\n}\n"],"mappings":"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","names":["src_exports","__export","App","__toCommonJS","import_penpal","import_react","CapitalOSError","message","InvalidTokenError","import_iframe_resizer","import_react","IframeResizer","props","ref","title","iframeHTMLAttributes","resizerOptions","splitProps","iframeRef","iframe","__spreadValues","React","__spreadProps","resizerOptionsSet","acc","key","IFRAME_CONNECTION_TIMEOUT_MILLISECONDS","App","props","token","className","enableLogging","onError","LoadingComponent","iframeRef","React","isLoaded","setIsLoaded","url","urlDecodedToken","base64DecodedToken","jsonToken","path","InvalidTokenError","error","connection","IframeResizer"]}
+{"version":3,"sources":["../src/index.tsx","../src/capital-os.tsx","../src/error.ts","../src/hooks.ts","../src/iframe-resizer.tsx","../src/utils.ts"],"sourcesContent":["'use client'\n\nimport React, { useMemo } from 'react'\n\nimport { CapitalOS } from './capital-os'\nimport type { EntryPoint, IssueCardDefaultValues } from './external-types'\nimport type { CommonProps } from './types'\n\n/**\n * Renders the CapitalOS App.\n */\nexport function App(props: CommonProps) {\n  return <CapitalOS {...props} />\n}\n\nexport type IssueCardProps = CommonProps & {\n  /**\n   * Default values to prefill the form with.\n   *\n   * Either provide a userId, in which case the default values will be taken from that user's profile, or provide the cardholder's details directly.\n   */\n  defaultValues?: IssueCardDefaultValues\n\n  /**\n   * Callback to invoke when the card was created successfully.\n   */\n  onDone: () => void\n\n  /**\n   * Callback to invoke when the card creation was cancelled by the user.\n   */\n  onCancel: () => void\n}\n\n/**\n * Renders the CapitalOS Issue Card experience.\n */\nexport function IssueCard({ defaultValues, onDone, onCancel, ...restOfProps }: IssueCardProps) {\n  const entryPoint: EntryPoint = 'createCard'\n  const renderingContext = useMemo(\n    () => ({\n      entryPoint,\n      defaultValues: defaultValues,\n    }),\n    [defaultValues],\n  )\n\n  return (\n    <CapitalOS {...restOfProps} renderingContext={renderingContext} methods={{ createCard: { onDone, onCancel } }} />\n  )\n}\n\nexport type DisputeTransactionProps = CommonProps & {\n  /**\n   * The ID of the transaction to dispute.\n   */\n  transactionId: string\n\n  /**\n   * Callback to invoke when the dispute was successfully submitted.\n   */\n  onDone: () => void\n\n  /**\n   * Callback to invoke when the user cancels the dispute submission.\n   */\n  onCancel: () => void\n}\n\n/**\n * Renders the CapitalOS Dispute Transaction experience.\n */\nexport function DisputeTransaction({ transactionId, onDone, onCancel, ...restOfProps }: DisputeTransactionProps) {\n  const entryPoint: EntryPoint = 'createDispute'\n  const renderingContext = useMemo(() => ({ entryPoint, transactionId }), [transactionId])\n\n  return (\n    <CapitalOS {...restOfProps} renderingContext={renderingContext} methods={{ createDispute: { onDone, onCancel } }} />\n  )\n}\n","import React, { useMemo, useRef, useState } from 'react'\n\nimport { InvalidTokenError } from './error'\nimport { IframeConnectionMethods, useIframeConnection } from './hooks'\nimport { IframeResizer } from './iframe-resizer'\nimport { CommonProps } from './types'\nimport { decodeToken, encodeRenderingContext } from './utils'\n\ntype CapitalOsProps<T> = CommonProps & {\n  renderingContext?: T | undefined\n  methods?: Partial<IframeConnectionMethods>\n}\n\n/**\n * The internal component that handles all the heavy lifting of connecting to the iframe and rendering the app.\n * all user facing components are basically  a syntactic sugar on top of this.\n */\nexport function CapitalOS<T>(props: CapitalOsProps<T>) {\n  const {\n    token,\n    className,\n    enableLogging,\n    onError,\n    loadingComponent: LoadingComponent,\n    renderingContext,\n    methods,\n  } = props\n  // represents the state of whether all required react queries returned and the page should be visible\n  const [isLoaded, setIsLoaded] = useState(false)\n\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n\n  // memoize the url based on the token so we don't redo the computation on each render.\n  const url = useMemo(() => {\n    try {\n      const encodedRenderingContext = renderingContext ? encodeRenderingContext(renderingContext) : null\n\n      const tokenObject = decodeToken(token)\n\n      const { path } = tokenObject\n      if (!path) {\n        throw new InvalidTokenError()\n      }\n      return `${path}?token=${token}&renderingContext=${encodedRenderingContext ?? ''}`\n    } catch (error) {\n      // communicate a general error about the token being invalid to the parent component, no matter which internal error we encountered during token parsing.\n      onError?.(new InvalidTokenError())\n      return undefined\n    }\n    // renderingContext is not part of the dependencies since we do not want to reload the iframe unless the token changes.\n  }, [token, onError])\n\n  useIframeConnection({\n    iframeRef,\n    token,\n    onError: (error) => {\n      onError?.(error)\n      // when connection fails it's probably a handshake timeout with the iframe. we will stop showing the loader\n      // since the fact we failed communication doesn't necessarily mean the iframe didn't load\n      setIsLoaded(true)\n    },\n    methods: { onLoad: () => setIsLoaded(true), ...methods },\n  })\n\n  return (\n    <>\n      {/* show loader as long as we're not loaded */}\n      {!isLoaded && LoadingComponent}\n      {/* hide the iframe as long as we're not loaded */}\n      <IframeResizer\n        src={url}\n        allow=\"clipboard-write\"\n        checkOrigin={false}\n        style={{ width: '1px', height: '0px', minWidth: '100%' }}\n        className={className}\n        log={!!enableLogging}\n        ref={iframeRef}\n        hidden={!isLoaded}\n      />\n    </>\n  )\n}\n","/**\n * Base class for all SDK errors\n */\nexport class CapitalOSError extends Error {\n  constructor(message: string) {\n    super(message)\n    this.name = 'CapitalOSError'\n  }\n}\n\n/**\n * Represents an error that occurs when an invalid token is encountered.\n */\nexport class InvalidTokenError extends CapitalOSError {\n  constructor() {\n    super('Invalid token')\n    this.name = 'CapitalOSInvalidTokenError'\n  }\n}\n","import { connectToChild } from 'penpal'\nimport { useEffect } from 'react'\n\nconst IFRAME_CONNECTION_TIMEOUT_MILLISECONDS = 10_000\n\nexport type IframeConnectionMethods = {\n  onLoad: () => void\n  createCard?: {\n    onDone?: () => void\n    onCancel?: () => void\n  }\n  createDispute?: {\n    onDone?: () => void\n    onCancel?: () => void\n  }\n}\n\n/**\n * connects to child iframe and returns whether the iframe is loaded or not.\n */\nexport function useIframeConnection({\n  iframeRef,\n  token,\n  onError,\n  methods,\n}: {\n  iframeRef: React.RefObject<HTMLIFrameElement>\n  token: string\n  onError: ((error: Error) => void) | undefined | null\n  methods: IframeConnectionMethods\n}) {\n  // connect to child iframe\n  useEffect(() => {\n    const connection = connectToChild({\n      iframe: iframeRef.current!,\n      childOrigin: '*',\n      debug: true,\n      timeout: IFRAME_CONNECTION_TIMEOUT_MILLISECONDS,\n      methods: methods,\n    })\n\n    connection.promise.catch((error) => {\n      onError?.(error)\n    })\n\n    return () => {\n      connection.destroy()\n    }\n  }, [token])\n}\n","import {\n  IFrameOptions as BrokenIframeOptions,\n  IFrameComponent,\n  IFrameMessageData,\n  IFrameResizedData,\n  IFrameScrollData,\n  iframeResizer,\n} from 'iframe-resizer'\nimport React, { IframeHTMLAttributes, forwardRef, useEffect, useImperativeHandle, useRef } from 'react'\n\n// the events were renamed but package maintainers didn't update the types.\ntype IFrameOptions = Omit<\n  BrokenIframeOptions,\n  'closedCallback' | 'scrollCallback' | 'resizedCallback' | 'messageCallback' | 'initCallback'\n> & {\n  onClosed?(iframeId: string): void\n  onInit?(iframe: IFrameComponent): void\n  onMessage?(data: IFrameMessageData): void\n  onResized?(data: IFrameResizedData): void\n  onScroll?(data: IFrameScrollData): boolean\n}\n\ntype IframeResizerProps = IFrameOptions & IframeHTMLAttributes<HTMLIFrameElement>\ntype EnrichedHtmlIframeElement = HTMLIFrameElement & { iFrameResizer: { removeListeners: () => void } }\n\nexport const IframeResizer = forwardRef((props: IframeResizerProps, ref: React.Ref<HTMLIFrameElement>) => {\n  const title = props.title || 'iframe'\n  const { iframeHTMLAttributes, resizerOptions } = splitProps(props)\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n\n  useEffect(() => {\n    // effects run after render, so the ref is guaranteed to be set (unless the component conditionally renders the iframe, which is not the case)\n    const iframe = iframeRef.current as EnrichedHtmlIframeElement\n\n    iframeResizer({ ...resizerOptions }, iframe)\n\n    return () => iframe.iFrameResizer && iframe.iFrameResizer.removeListeners()\n  })\n\n  // make the ref provided as a prop point to the same place as the internal iframe ref.\n  useImperativeHandle(ref, () => iframeRef.current as HTMLIFrameElement)\n\n  return <iframe {...iframeHTMLAttributes} title={title} ref={iframeRef} />\n})\n\nIframeResizer.displayName = 'IframeResizer'\n\nconst resizerOptions = [\n  'autoResize',\n  'bodyBackground',\n  'bodyMargin',\n  'bodyPadding',\n  'checkOrigin',\n  'inPageLinks',\n  'heightCalculationMethod',\n  'interval',\n  'log',\n  'maxHeight',\n  'maxWidth',\n  'minHeight',\n  'minWidth',\n  'resizeFrom',\n  'scrolling',\n  'sizeHeight',\n  'sizeWidth',\n  'warningTimeout',\n  'tolerance',\n  'widthCalculationMethod',\n  'onClosed',\n  'onInit',\n  'onMessage',\n  'onResized',\n  'onScroll',\n]\n\nconst resizerOptionsSet = new Set(resizerOptions)\n\n/**\n * split props into the resizer library options and the native iframe attributes.\n * the code is contains many type assertions because typescript doesn't handle reduce well.\n */\nfunction splitProps(props: IframeResizerProps) {\n  const split = Object.keys(props).reduce<{\n    resizerOptions: IFrameOptions\n    iframeHTMLAttributes: IframeHTMLAttributes<HTMLIFrameElement>\n  }>(\n    (acc, key) => {\n      if (resizerOptionsSet.has(key)) {\n        acc.resizerOptions[key as keyof IFrameOptions] = props[key as keyof typeof props]\n      } else {\n        acc.iframeHTMLAttributes[key as keyof IframeHTMLAttributes<HTMLIFrameElement>] =\n          props[key as keyof typeof props]\n      }\n      return acc\n    },\n    { resizerOptions: {}, iframeHTMLAttributes: {} },\n  )\n\n  return split\n}\n","import { InvalidTokenError } from './error'\n\n/**\n * Encodes the rendering context as base64 and then URI encodes it.\n */\nexport function encodeRenderingContext<T>(renderingContext: NonNullable<T>) {\n  const renderingContextJson = JSON.stringify(renderingContext)\n  const renderingContextBase64 = btoa(renderingContextJson)\n  const renderingContextEncoded = encodeURIComponent(renderingContextBase64)\n\n  return renderingContextEncoded\n}\n\nexport function decodeToken(token: string) {\n  try {\n    const urlDecodedToken = decodeURIComponent(token)\n    const base64DecodedToken = atob(urlDecodedToken)\n    return JSON.parse(base64DecodedToken)\n  } catch (error) {\n    throw new InvalidTokenError()\n  }\n}\n"],"mappings":"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","names":["src_exports","__export","App","DisputeTransaction","IssueCard","__toCommonJS","import_react","import_react","CapitalOSError","message","InvalidTokenError","import_penpal","import_react","IFRAME_CONNECTION_TIMEOUT_MILLISECONDS","useIframeConnection","iframeRef","token","onError","methods","connection","error","import_iframe_resizer","import_react","IframeResizer","props","ref","title","iframeHTMLAttributes","resizerOptions","splitProps","iframeRef","iframe","__spreadValues","React","__spreadProps","resizerOptionsSet","acc","key","encodeRenderingContext","renderingContext","renderingContextJson","renderingContextBase64","decodeToken","token","urlDecodedToken","base64DecodedToken","error","InvalidTokenError","CapitalOS","props","token","className","enableLogging","onError","LoadingComponent","renderingContext","methods","isLoaded","setIsLoaded","iframeRef","url","encodedRenderingContext","encodeRenderingContext","tokenObject","decodeToken","path","InvalidTokenError","error","useIframeConnection","__spreadValues","React","IframeResizer","App","props","React","CapitalOS","__spreadValues","IssueCard","_a","_b","defaultValues","onDone","onCancel","restOfProps","__objRest","entryPoint","renderingContext","__spreadProps","DisputeTransaction","transactionId"]}

package/dist/src/index.d.mts

@@ -1 +1,5 @@
 export { App } from '../_tsup-dts-rollup';
+export { IssueCard } from '../_tsup-dts-rollup';
+export { DisputeTransaction } from '../_tsup-dts-rollup';
+export { IssueCardProps } from '../_tsup-dts-rollup';
+export { DisputeTransactionProps } from '../_tsup-dts-rollup';

package/dist/src/index.d.ts

@@ -1 +1,5 @@
 export { App } from '../_tsup-dts-rollup';
+export { IssueCard } from '../_tsup-dts-rollup';
+export { DisputeTransaction } from '../_tsup-dts-rollup';
+export { IssueCardProps } from '../_tsup-dts-rollup';
+export { DisputeTransactionProps } from '../_tsup-dts-rollup';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@capitalos/react",
-  "version": "0.1.1-beta.2",
+  "version": "0.2.0",
   "description": "integrate CapitalOS into your react app",
   "main": "dist/index.js",
   "module": "dist/esm/index.js",