@frak-labs/core-sdk 0.0.2

package/dist/actions/index.d.ts

@@ -0,0 +1,503 @@
+import { a as FrakClient, W as WalletStatusReturnType, M as ModalStepTypes, D as DisplayModalParamsType, f as ModalRpcStepsResultType, O as OpenSsoParamsType, G as GetProductInformationReturnType, i as SiweAuthenticationParams, d as ModalRpcMetadata, j as SiweAuthenticateReturnType, l as SendTransactionModalStepType, m as SendTransactionReturnType, q as FinalModalStepType, r as FinalActionType, L as LoginModalStepType, o as OpenInteractionSessionModalStepType, b as FrakContext } from '../context-B0trlYGx.js';
+import { S as SendInteractionParamsType, a as SendInteractionReturnType } from '../interaction-CTQ5-kqe.js';
+import { Hex } from 'viem';
+import 'viem/chains';
+import 'viem/siwe';
+
+/**
+ * Function used to watch the current frak wallet status
+ * @param client - The current Frak Client
+ * @param callback - The callback that will receive any wallet status change
+ * @returns A rpomise resolving with the initial wallet status
+ *
+ * @description This function will return the current wallet status, and will listen to any change in the wallet status.
+ *
+ * @example
+ * await watchWalletStatus(frakConfig, (status: WalletStatusReturnType) => {
+ *     if (status.key === "connected") {
+ *         console.log("Wallet connected:", status.wallet);
+ *         console.log("Current interaction session:", status.interactionSession);
+ *     } else {
+ *         console.log("Wallet not connected");
+ *     }
+ * });
+ */
+declare function watchWalletStatus(client: FrakClient, callback?: (status: WalletStatusReturnType) => void): Promise<WalletStatusReturnType>;
+
+/**
+ * Function used to send an interaction
+ * @param client - The current Frak Client
+ * @param args
+ *
+ * @example
+ * const interaction = PressInteractionEncoder.openArticle({
+ *     articleId: keccak256(toHex("article-slug")),
+ * });
+ * const { delegationId } = await sendInteraction(frakConfig, {
+ *     interaction,
+ * });
+ * console.log("Delegated interaction id", delegationId);
+ */
+declare function sendInteraction(client: FrakClient, { productId, interaction, validation }: SendInteractionParamsType): Promise<SendInteractionReturnType>;
+
+/**
+ * Function used to display a modal
+ * @param client - The current Frak Client
+ * @param args
+ * @param args.steps - The different steps of the modal
+ * @param args.metadata - The metadata for the modal (customisation, language etc)
+ * @returns The result of each modal steps
+ *
+ * @description This function will display a modal to the user with the provided steps and metadata.
+ *
+ * @remarks
+ * - The UI of the displayed modal can be configured with the `customCss` property in the `metadata.css` field of the top-level config.
+ * - The `login` and `openSession` steps will be automatically skipped if the user is already logged in or has an active session. It's safe to include these steps in all cases to ensure proper user state.
+ * - Steps are automatically reordered in the following sequence:
+ *     1. `login` (if needed)
+ *     2. `openSession` (if needed)
+ *     3. All other steps in the order specified
+ *     4. `success` (if included, always last)
+ *
+ * @example
+ * Simple sharing modal with steps:
+ *  1. Login (Skipped if already logged in)
+ *  2. Open a session (Skipped if already opened)
+ *  3. Display a success message with sharing link option
+ *
+ * ```ts
+ * const results = await displayModal(frakConfig, {
+ *     steps: {
+ *         // Simple login with no SSO, nor customisation
+ *         login: { allowSso: false },
+ *         // Simple session opening, with no customisation
+ *         openSession: {},
+ *         // Success message
+ *         final: {
+ *             action: { key: "reward" },
+ *             // Skip this step, it will be only displayed in the stepper within the modal
+ *             autoSkip: true,
+ *         },
+ *     },
+ * });
+ *
+ * console.log("Login step - wallet", results.login.wallet);
+ * console.log("Open session step - start + end", {
+ *     start: results.openSession.startTimestamp,
+ *     end: results.openSession.endTimestamp,
+ * });
+ * ```
+ *
+ * @example
+ * A full modal example, with a few customisation options, with the steps:
+ *  1. Login (Skipped if already logged in)
+ *  2. Open a session (Skipped if already opened)
+ *  3. Authenticate via SIWE
+ *  4. Send a transaction
+ *  5. Display a success message with sharing link options
+ *
+ * ```ts
+ * const results = await displayModal(frakConfig, {
+ *     steps: {
+ *         // Login step
+ *         login: {
+ *             allowSso: true,
+ *             ssoMetadata: {
+ *                 logoUrl: "https://my-app.com/logo.png",
+ *                 homepageLink: "https://my-app.com",
+ *                 links: {
+ *                     confidentialityLink: "https://my-app.com/confidentiality",
+ *                     helpLink: "https://my-app.com/help",
+ *                     cguLink: "https://my-app.com/cgu",
+ *                 },
+ *             },
+ *             metadata: {
+ *                 // Modal title on desktop
+ *                 title: "Login on My-App",
+ *                 // Modal description (and yep it accept markdown)
+ *                 description: "## Please login to continue",
+ *                 // Primary button text
+ *                 primaryActionText: "Register",
+ *                 // Secondary button text
+ *                 secondaryActionText: "Login",
+ *             },
+ *         },
+ *         // Simple session opening, with no customisation
+ *         openSession: {},
+ *         // Siwe authentication
+ *         siweAuthenticate: {
+ *             siwe: {
+ *                 domain: "my-app.com",
+ *                 uri: "https://my-app.com/",
+ *                 nonce: generateSiweNonce(),
+ *                 version: "1",
+ *             },
+ *             metadata: {
+ *                 title: "Authenticate with SIWE",
+ *                 description: "Please authenticate with SIWE to continue",
+ *                 primaryActionText: "Authenticate",
+ *             },
+ *         },
+ *         // Send batched transaction
+ *         sendTransaction: {
+ *             tx: [
+ *                 { to: "0xdeadbeef", data: "0xdeadbeef" },
+ *                 { to: "0xdeadbeef", data: "0xdeadbeef" },
+ *             ],
+ *             metadata: {
+ *                 title: "Send a transaction",
+ *                 description: "Please send a transaction to continue",
+ *             },
+ *         },
+ *         // Success message with sharing options
+ *         final: {
+ *             action: {
+ *                 key: "sharing",
+ *                 options: {
+ *                     popupTitle: "Share the app",
+ *                     text: "Discover my super app website",
+ *                     link: "https://my-app.com",
+ *                 },
+ *             },
+ *             dismissedMetadata: {
+ *                 title: "Dismiss",
+ *                 description: "You won't be rewarded for this sharing action",
+ *             },
+ *         },
+ *     },
+ *     metadata: {
+ *         // Header of desktop modals
+ *         header: {
+ *             title: "My-App",
+ *             icon: "https://my-app.com/logo.png",
+ *         },
+ *         // Context that will be present in every modal steps
+ *         context: "My-app overkill flow",
+ *         // Language of the modal
+ *         lang: "fr",
+ *     },
+ * });
+ * ```
+ */
+declare function displayModal<T extends ModalStepTypes[] = ModalStepTypes[]>(client: FrakClient, { steps, metadata }: DisplayModalParamsType<T>): Promise<ModalRpcStepsResultType<T>>;
+
+/**
+ * Function used to open the SSO
+ * @param client - The current Frak Client
+ * @param args - The SSO parameters
+ *
+ * @description This function will open the SSO with the provided parameters.
+ *
+ * @example
+ * First we build the sso metadata
+ * ```ts
+ * // Build the metadata
+ * const metadata: SsoMetadata = {
+ *     logoUrl: "https://my-app.com/logo.png",
+ *     homepageLink: "https://my-app.com",
+ *     links: {
+ *         confidentialityLink: "https://my-app.com/confidentiality",
+ *         helpLink: "https://my-app.com/help",
+ *         cguLink: "https://my-app.com/cgu",
+ *     },
+ * };
+ * ```
+ *
+ * Then, either use it with direct exit (and so user is directly redirected to your website), or a custom redirect URL
+ * :::code-group
+ * ```ts [Direct exit]
+ * // Trigger an sso opening with redirection
+ * await openSso(frakConfig, {
+ *     directExit: true,
+ *     metadata,
+ * });
+ * ```
+ * ```ts [Redirection]
+ * // Trigger an sso opening within a popup with direct exit
+ * await openSso(frakConfig, {
+ *     redirectUrl: "https://my-app.com/nexus-sso",
+ *     metadata,
+ * });
+ * ```
+ * :::
+ */
+declare function openSso(client: FrakClient, args: OpenSsoParamsType): Promise<void>;
+
+/**
+ * Function used to get the current product information
+ * @param client - The current Frak Client
+ * @returns The product information in a promise
+ */
+declare function getProductInformation(client: FrakClient): Promise<GetProductInformationReturnType>;
+
+/**
+ * Function used to track the status of a purchase
+ * when a purchase is tracked, the `purchaseCompleted` interactions will be automatically send for the user when we receive the purchase confirmation via webhook.
+ *
+ * @param args.customerId - The customer id that made the purchase (on your side)
+ * @param args.orderId - The order id of the purchase (on your side)
+ * @param args.token - The token of the purchase
+ *
+ * @description This function will send a request to the backend to listen for the purchase status.
+ *
+ * @example
+ * async function trackPurchase(checkout) {
+ *   const payload = {
+ *     customerId: checkout.order.customer.id,
+ *     orderId: checkout.order.id,
+ *     token: checkout.token,
+ *   };
+ *
+ *   await trackPurchaseStatus(payload);
+ * }
+ *
+ * @remarks
+ * - The `trackPurchaseStatus` function requires the `frak-wallet-interaction-token` stored in the session storage to authenticate the request.
+ * - This function will print a warning if used in a non-browser environment or if the wallet interaction token is not available.
+ */
+declare function trackPurchaseStatus(args: {
+    customerId: string | number;
+    orderId: string | number;
+    token: string;
+}): Promise<void>;
+
+/**
+ * Parameter used to directly show a modal used to authenticate with SIWE
+ * @inline
+ */
+type SiweAuthenticateModalParams = {
+    /**
+     * Partial SIWE params, since we can rebuild them from the SDK if they are empty
+     *
+     * If no parameters provider, some fields will be recomputed from the current configuration and environment.
+     *  - `statement` will be set to a default value
+     *  - `nonce` will be generated
+     *  - `uri` will be set to the current domain
+     *  - `version` will be set to "1"
+     *  - `domain` will be set to the current window domain
+     *
+     * @default {}
+     */
+    siwe?: Partial<SiweAuthenticationParams>;
+    /**
+     * Custom metadata to be passed to the modal
+     */
+    metadata?: ModalRpcMetadata;
+};
+/**
+ * Function used to launch a siwe authentication
+ * @param client - The current Frak Client
+ * @param args - The parameters
+ * @returns The SIWE authentication result (message + signature) in a promise
+ *
+ * @description This function will display a modal to the user with the provided SIWE parameters and metadata.
+ *
+ * @example
+ * import { siweAuthenticate } from "@frak-labs/core-sdk/actions";
+ * import { parseSiweMessage } from "viem/siwe";
+ *
+ * const { signature, message } = await siweAuthenticate(frakConfig, {
+ *     siwe: {
+ *         statement: "Sign in to My App",
+ *         domain: "my-app.com",
+ *         expirationTimeTimestamp: Date.now() + 1000 * 60 * 5,
+ *     },
+ *     metadata: {
+ *         header: {
+ *             title: "Sign in",
+ *         },
+ *         context: "Sign in to My App",
+ *     },
+ * });
+ * console.log("Parsed final message:", parseSiweMessage(message));
+ * console.log("Siwe signature:", signature);
+ */
+declare function siweAuthenticate(client: FrakClient, { siwe, metadata }: SiweAuthenticateModalParams): Promise<SiweAuthenticateReturnType>;
+
+/**
+ * Parameters to directly show a modal used to send a transaction
+ * @inline
+ */
+type SendTransactionParams = {
+    /**
+     * The transaction to be sent (either a single tx or multiple ones)
+     */
+    tx: SendTransactionModalStepType["params"]["tx"];
+    /**
+     * Custom metadata to be passed to the modal
+     */
+    metadata?: ModalRpcMetadata;
+};
+/**
+ * Function used to send a user transaction, simple wrapper around the displayModal function to ease the send transaction process
+ * @param client - The current Frak Client
+ * @param args - The parameters
+ * @returns The hash of the transaction that was sent in a promise
+ *
+ * @description This function will display a modal to the user with the provided transaction and metadata.
+ *
+ * @example
+ * const { hash } = await sendTransaction(frakConfig, {
+ *     tx: {
+ *         to: "0xdeadbeef",
+ *         value: toHex(100n),
+ *     },
+ *     metadata: {
+ *         header: {
+ *             title: "Sending eth",
+ *         },
+ *         context: "Send 100wei to 0xdeadbeef",
+ *     },
+ * });
+ * console.log("Transaction hash:", hash);
+ */
+declare function sendTransaction(client: FrakClient, { tx, metadata }: SendTransactionParams): Promise<SendTransactionReturnType>;
+
+/**
+ * Represent the type of the modal step builder
+ */
+type ModalStepBuilder<Steps extends ModalStepTypes[] = ModalStepTypes[]> = {
+    /**
+     * The current modal params
+     */
+    params: DisplayModalParamsType<Steps>;
+    /**
+     * Add a send transaction step to the modal
+     */
+    sendTx: (options: SendTransactionModalStepType["params"]) => ModalStepBuilder<[...Steps, SendTransactionModalStepType]>;
+    /**
+     * Add a final step of type reward to the modal
+     */
+    reward: (options?: Omit<FinalModalStepType["params"], "action">) => ModalStepBuilder<[...Steps, FinalModalStepType]>;
+    /**
+     * Add a final step of type sharing to the modal
+     */
+    sharing: (sharingOptions?: Extract<FinalActionType, {
+        key: "sharing";
+    }>["options"], options?: Omit<FinalModalStepType["params"], "action">) => ModalStepBuilder<[...Steps, FinalModalStepType]>;
+    /**
+     * Display the modal
+     */
+    display: () => Promise<ModalRpcStepsResultType<Steps>>;
+};
+/**
+ * Represent the output type of the modal builder
+ */
+type ModalBuilder = ModalStepBuilder<[
+    LoginModalStepType,
+    OpenInteractionSessionModalStepType
+]>;
+/**
+ * Helper to craft Frak modal, and share a base initial config
+ * @param client - The current Frak Client
+ * @param args
+ * @param args.metadata - Common modal metadata (customisation, language etc)
+ * @param args.login - Login step parameters
+ * @param args.openSession - Open session step parameters
+ *
+ * @description This function will create a modal builder with the provided metadata, login and open session parameters.
+ *
+ * @example
+ * Here is an example of how to use the `modalBuilder` to create and display a sharing modal:
+ *
+ * ```js
+ * // Create the modal builder
+ * const modalBuilder = window.FrakSDK.modalBuilder(frakClient, baseModalConfig);
+ *
+ * // Configure the information to be shared via the sharing link
+ * const sharingConfig = {
+ *   popupTitle: "Share this with your friends",
+ *   text: "Discover our product!",
+ *   link: window.location.href,
+ * };
+ *
+ * // Display the sharing modal
+ * function modalShare() {
+ *   modalBuilder.sharing(sharingConfig).display();
+ * }
+ * ```
+ *
+ * @see {@link ModalStepTypes} for more info about each modal step types and their parameters
+ * @see {@link ModalRpcMetadata} for more info about the metadata that can be passed to the modal
+ * @see {@link ModalRpcStepsResultType} for more info about the result of each modal steps
+ * @see {@link displayModal} for more info about how the modal is displayed
+ */
+declare function modalBuilder(client: FrakClient, { metadata, login, openSession, }: {
+    metadata?: ModalRpcMetadata;
+    login?: LoginModalStepType["params"];
+    openSession?: OpenInteractionSessionModalStepType["params"];
+}): ModalBuilder;
+
+/**
+ * The different states of the referral process
+ * @inline
+ */
+type ReferralState = "idle" | "processing" | "success" | "no-wallet" | "no-session" | "error" | "no-referrer" | "self-referral";
+/**
+ * Options for the referral auto-interaction process
+ */
+type ProcessReferralOptions = {
+    /**
+     * If we want to always append the url with the frak context or not
+     * @defaultValue false
+     */
+    alwaysAppendUrl?: boolean;
+};
+/**
+ * This function handle all the heavy lifting of the referral interaction process
+ *  1. Check if the user has been referred or not (if not, early exit)
+ *  2. Then check if the user is logged in or not
+ *  2.1 If not logged in, try a soft login, if it fail, display a modal for the user to login
+ *  3. Check if that's not a self-referral (if yes, early exit)
+ *  4. Check if the user has an interaction session or not
+ *  4.1 If not, display a modal for the user to open a session
+ *  5. Push the referred interaction
+ *  6. Update the current url with the right data
+ *  7. Return the resulting referral state
+ *
+ *  If any error occurs during the process, the function will catch it and return an error state
+ *
+ * @param client - The current Frak Client
+ * @param args
+ * @param args.walletStatus - The current user wallet status
+ * @param args.frakContext - The current frak context
+ * @param args.modalConfig - The modal configuration to display if the user is not logged in
+ * @param args.productId - The product id to interact with (if not specified will be recomputed from the current domain)
+ * @param args.options - Some options for the referral interaction
+ * @returns  A promise with the resulting referral state
+ *
+ * @see {@link displayModal} for more details about the displayed modal
+ * @see {@link sendInteraction} for more details on the interaction submission part
+ * @see {@link ReferralInteractionEncoder} for more details about the referred interaction
+ * @see {@link ModalStepTypes} for more details on each modal steps types
+ */
+declare function processReferral(client: FrakClient, { walletStatus, frakContext, modalConfig, productId, options, }: {
+    walletStatus?: WalletStatusReturnType;
+    frakContext?: Partial<FrakContext> | null;
+    modalConfig?: DisplayModalParamsType<ModalStepTypes[]>;
+    productId?: Hex;
+    options?: ProcessReferralOptions;
+}): Promise<ReferralState>;
+
+/**
+ * Function used to display a modal
+ * @param client - The current Frak Client
+ * @param args
+ * @param args.productId - The product id to interact with (if not specified will be recomputed from the current domain)
+ * @param args.modalConfig - The modal configuration to display if the user is not logged in
+ * @param args.options - Some options for the referral interaction
+ *
+ * @returns  A promise with the resulting referral state, or undefined in case of an error
+ *
+ * @description This function will automatically handle the referral interaction process
+ *
+ * @see {@link processReferral} for more details on the automatic referral handling process
+ * @see {@link ModalStepTypes} for more details on each modal steps types
+ */
+declare function referralInteraction(client: FrakClient, { productId, modalConfig, options, }?: {
+    productId?: Hex;
+    modalConfig?: DisplayModalParamsType<ModalStepTypes[]>;
+    options?: ProcessReferralOptions;
+}): Promise<("error" | "idle" | "processing" | "success" | "no-wallet" | "no-session" | "no-referrer" | "self-referral") | undefined>;
+
+export { type ModalBuilder, type ModalStepBuilder, type ProcessReferralOptions, type SendTransactionParams, type SiweAuthenticateModalParams, displayModal, getProductInformation, modalBuilder, openSso, processReferral, referralInteraction, sendInteraction, sendTransaction, siweAuthenticate, trackPurchaseStatus, watchWalletStatus };