@heyama/pay-react-native 0.0.0-stage → 1.0.1

package/dist/hooks/use-sheet-resize.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Eases the sheet's height when what it shows changes `shape` (another
+ * screen, tab, method, the card fields' page): the next layout animates,
+ * on iOS and Android alike. The first one does not: the sheet slides up.
+ */
+export declare function useSheetResize(shape: string): void;

package/dist/hooks/use-sheet-resize.js

@@ -0,0 +1,15 @@
+import { useState } from 'react';
+import { LayoutAnimation } from 'react-native';
+import { SHEET_RESIZE } from "../models/sheet.constants.js";
+/**
+ * Eases the sheet's height when what it shows changes `shape` (another
+ * screen, tab, method, the card fields' page): the next layout animates,
+ * on iOS and Android alike. The first one does not: the sheet slides up.
+ */
+export function useSheetResize(shape) {
+    const [last, setLast] = useState(shape);
+    if (last !== shape) {
+        setLast(shape);
+        LayoutAnimation.configureNext(SHEET_RESIZE);
+    }
+}

package/dist/hooks/use-sheet-theme.d.ts

@@ -0,0 +1,4 @@
+import type { SheetTheme } from '../models/sheet.interface.js';
+export declare const SheetThemeContext: import("react").Context<SheetTheme>;
+/** The open sheet's colours. */
+export declare function useSheetTheme(): SheetTheme;

package/dist/hooks/use-sheet-theme.js

@@ -0,0 +1,12 @@
+import { createContext, use } from 'react';
+import { CHECKOUT_COLORS } from "../checkout-core/models/checkout.constants.js";
+import { CheckoutThemeEnum } from "../checkout-core/models/checkout.enum.js";
+export const SheetThemeContext = createContext({
+    colors: CHECKOUT_COLORS[CheckoutThemeEnum.LIGHT],
+    brand: CHECKOUT_COLORS[CheckoutThemeEnum.LIGHT].ink,
+    dark: false,
+});
+/** The open sheet's colours. */
+export function useSheetTheme() {
+    return use(SheetThemeContext);
+}

package/dist/hooks/use-watched-payment.d.ts

@@ -0,0 +1,6 @@
+import type { CheckoutCalls, WatchedPayment } from '../models/sheet.interface.js';
+/**
+ * One payment, live, while `paymentId` is set. Once it is cleared (the sheet
+ * closing) the last answer stays, so the sheet slides away unchanged.
+ */
+export declare function useWatchedPayment(calls: CheckoutCalls, paymentId: string | null): WatchedPayment;

package/dist/hooks/use-watched-payment.js

@@ -0,0 +1,17 @@
+import { useEffect, useState } from 'react';
+/**
+ * One payment, live, while `paymentId` is set. Once it is cleared (the sheet
+ * closing) the last answer stays, so the sheet slides away unchanged.
+ */
+export function useWatchedPayment(calls, paymentId) {
+    const [watched, setWatched] = useState({
+        view: undefined,
+        failed: false,
+    });
+    useEffect(() => {
+        if (!paymentId)
+            return undefined;
+        return calls.watch(paymentId, (view) => setWatched({ view, failed: false }), () => setWatched((previous) => ({ ...previous, failed: true })));
+    }, [calls, paymentId]);
+    return watched;
+}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { BrissotoPayProvider } from './components/BrissotoPayProvider.js';
+export { usePaymentSheet } from './hooks/use-payment-sheet.js';
+export type { BrissotoPayProviderProps, PaymentSheet, PaymentSheetError, PaymentSheetResult, PaymentSheetStatus, PresentPaymentOptions, } from './models/sheet.interface.js';

package/dist/index.js

@@ -0,0 +1,2 @@
+export { BrissotoPayProvider } from "./components/BrissotoPayProvider.js";
+export { usePaymentSheet } from "./hooks/use-payment-sheet.js";

package/dist/models/sheet.constants.d.ts

@@ -0,0 +1,39 @@
+import type { LayoutAnimationConfig } from 'react-native';
+import en from '../checkout-core/messages/en.js';
+import { LangEnum, ProviderLogoEnum } from '../checkout-core/models/domain.enum.js';
+import { FigtreeEnum } from './sheet.enum.js';
+/** The production backend: Live and Test payments alike. */
+export declare const DEFAULT_URL = "https://api-pay.brissoto.com";
+/** The public Convex functions the web checkout calls, by path. */
+export declare const CHECKOUT_FUNCTIONS: {
+    get: string;
+    pay: string;
+    payWithCode: string;
+    checkNow: string;
+    open: string;
+    cancel: string;
+    resend: string;
+    simulate: string;
+};
+/** Figtree ships inside the package: `expo-font` loads it when a sheet opens. */
+export declare const FIGTREE_FILES: Record<FigtreeEnum, number>;
+/** The sheet's timezone for dates, as the web checkout's. */
+export declare const TIME_ZONE = "Africa/Douala";
+/** The payer copy the web checkout shows, by language. */
+export declare const MESSAGES: Record<LangEnum, {
+    checkout: typeof en;
+}>;
+/** Brand tiles, the web's `public/logo/` PNGs bundled with the package. */
+export declare const PROVIDER_LOGOS: Record<ProviderLogoEnum, number>;
+/** At its tallest, the sheet leaves this share of the screen above it, clear of the status bar. */
+export declare const SHEET_TOP_GAP = 0.1;
+/** How dark the app gets behind the sheet. */
+export declare const SHEET_DIM_OPACITY = 0.4;
+/** How long the sheet takes to slide up or away, in ms. */
+export declare const SHEET_SLIDE_MS = 280;
+/** Points down that close the sheet when the finger lets go. */
+export declare const SHEET_SWIPE_DISTANCE = 120;
+/** A flick down this fast (points per ms) closes it, however short. */
+export declare const SHEET_FLICK_SPEED = 0.8;
+/** How the sheet's height eases from one screen to the next. */
+export declare const SHEET_RESIZE: LayoutAnimationConfig;

package/dist/models/sheet.constants.js

@@ -0,0 +1,78 @@
+import figtreeBold from '../../assets/fonts/Figtree-Bold.ttf';
+import figtreeExtraBold from '../../assets/fonts/Figtree-ExtraBold.ttf';
+import figtreeMedium from '../../assets/fonts/Figtree-Medium.ttf';
+import figtreeRegular from '../../assets/fonts/Figtree-Regular.ttf';
+import figtreeSemiBold from '../../assets/fonts/Figtree-SemiBold.ttf';
+import logoApplePay from '../../assets/logos/apple-pay.png';
+import logoCard from '../../assets/logos/card.png';
+import logoGooglePay from '../../assets/logos/google-pay.png';
+import logoMastercard from '../../assets/logos/mastercard.png';
+import logoMixx from '../../assets/logos/mixx.png';
+import logoMoov from '../../assets/logos/moov.png';
+import logoMtn from '../../assets/logos/mtn.png';
+import logoOrange from '../../assets/logos/orange.png';
+import logoPaypal from '../../assets/logos/paypal.png';
+import logoVisa from '../../assets/logos/visa.png';
+import logoWave from '../../assets/logos/wave.png';
+import { LayoutAnimation } from 'react-native';
+import en from "../checkout-core/messages/en.js";
+import fr from "../checkout-core/messages/fr.js";
+import { LangEnum, ProviderLogoEnum, } from "../checkout-core/models/domain.enum.js";
+import { FigtreeEnum } from "./sheet.enum.js";
+/** The production backend: Live and Test payments alike. */
+export const DEFAULT_URL = 'https://api-pay.brissoto.com';
+/** The public Convex functions the web checkout calls, by path. */
+export const CHECKOUT_FUNCTIONS = {
+    get: 'checkout/queries:get',
+    pay: 'checkout/mutations:pay',
+    payWithCode: 'checkout/actions:payWithCode',
+    checkNow: 'checkout/mutations:checkNow',
+    open: 'checkout/mutations:open',
+    cancel: 'checkout/mutations:cancel',
+    resend: 'checkout/mutations:resend',
+    simulate: 'simulator/mutations:decide',
+};
+/** Figtree ships inside the package: `expo-font` loads it when a sheet opens. */
+export const FIGTREE_FILES = {
+    [FigtreeEnum.REGULAR]: figtreeRegular,
+    [FigtreeEnum.MEDIUM]: figtreeMedium,
+    [FigtreeEnum.SEMI_BOLD]: figtreeSemiBold,
+    [FigtreeEnum.BOLD]: figtreeBold,
+    [FigtreeEnum.EXTRA_BOLD]: figtreeExtraBold,
+};
+/** The sheet's timezone for dates, as the web checkout's. */
+export const TIME_ZONE = 'Africa/Douala';
+/** The payer copy the web checkout shows, by language. */
+export const MESSAGES = {
+    [LangEnum.EN]: { checkout: en },
+    [LangEnum.FR]: { checkout: fr },
+};
+/** Brand tiles, the web's `public/logo/` PNGs bundled with the package. */
+export const PROVIDER_LOGOS = {
+    [ProviderLogoEnum.ORANGE]: logoOrange,
+    [ProviderLogoEnum.MTN]: logoMtn,
+    [ProviderLogoEnum.MOOV]: logoMoov,
+    [ProviderLogoEnum.WAVE]: logoWave,
+    [ProviderLogoEnum.MIXX]: logoMixx,
+    [ProviderLogoEnum.VISA]: logoVisa,
+    [ProviderLogoEnum.MASTERCARD]: logoMastercard,
+    [ProviderLogoEnum.PAYPAL]: logoPaypal,
+    [ProviderLogoEnum.CARD]: logoCard,
+    [ProviderLogoEnum.APPLE_PAY]: logoApplePay,
+    [ProviderLogoEnum.GOOGLE_PAY]: logoGooglePay,
+};
+/** At its tallest, the sheet leaves this share of the screen above it, clear of the status bar. */
+export const SHEET_TOP_GAP = 0.1;
+/** How dark the app gets behind the sheet. */
+export const SHEET_DIM_OPACITY = 0.4;
+/** How long the sheet takes to slide up or away, in ms. */
+export const SHEET_SLIDE_MS = 280;
+/** Points down that close the sheet when the finger lets go. */
+export const SHEET_SWIPE_DISTANCE = 120;
+/** A flick down this fast (points per ms) closes it, however short. */
+export const SHEET_FLICK_SPEED = 0.8;
+/** How the sheet's height eases from one screen to the next. */
+export const SHEET_RESIZE = {
+    duration: 220,
+    update: { type: LayoutAnimation.Types.easeInEaseOut },
+};

package/dist/models/sheet.enum.d.ts

@@ -0,0 +1,16 @@
+/** Figtree's weights the sheet uses. Values are the font family names `expo-font` registers. */
+export declare enum FigtreeEnum {
+    REGULAR = "Figtree-Regular",
+    MEDIUM = "Figtree-Medium",
+    SEMI_BOLD = "Figtree-SemiBold",
+    BOLD = "Figtree-Bold",
+    EXTRA_BOLD = "Figtree-ExtraBold"
+}
+/** The signs the sheet draws, in a disc. */
+export declare enum SheetIconEnum {
+    BAN = "ban",
+    CLOCK = "clock",
+    LOCK = "lock",
+    CROSS = "cross",
+    CHECK = "check"
+}

package/dist/models/sheet.enum.js

@@ -0,0 +1,18 @@
+/** Figtree's weights the sheet uses. Values are the font family names `expo-font` registers. */
+export var FigtreeEnum;
+(function (FigtreeEnum) {
+    FigtreeEnum["REGULAR"] = "Figtree-Regular";
+    FigtreeEnum["MEDIUM"] = "Figtree-Medium";
+    FigtreeEnum["SEMI_BOLD"] = "Figtree-SemiBold";
+    FigtreeEnum["BOLD"] = "Figtree-Bold";
+    FigtreeEnum["EXTRA_BOLD"] = "Figtree-ExtraBold";
+})(FigtreeEnum || (FigtreeEnum = {}));
+/** The signs the sheet draws, in a disc. */
+export var SheetIconEnum;
+(function (SheetIconEnum) {
+    SheetIconEnum["BAN"] = "ban";
+    SheetIconEnum["CLOCK"] = "clock";
+    SheetIconEnum["LOCK"] = "lock";
+    SheetIconEnum["CROSS"] = "cross";
+    SheetIconEnum["CHECK"] = "check";
+})(SheetIconEnum || (SheetIconEnum = {}));

package/dist/models/sheet.interface.d.ts

@@ -0,0 +1,232 @@
+import type { ReactNode, Ref, RefObject } from 'react';
+import type { Animated, DimensionValue, GestureResponderHandlers, StyleProp, TextInputInstance, TextInputProps, TextProps, TextStyle } from 'react-native';
+import type { WebView } from 'react-native-webview';
+import type { CheckoutButtonVariantEnum, TerminalKindEnum } from '../checkout-core/models/checkout.enum.js';
+import type { LangEnum, ProviderLogoEnum } from '../checkout-core/models/domain.enum.js';
+import type { CardFieldsMessage, CheckoutColors, CheckoutCore, CheckoutMutations, CheckoutPlatform, CheckoutView } from '../checkout-core/models/checkout.interface.js';
+import type { FigtreeEnum, SheetIconEnum } from './sheet.enum.js';
+/**
+ * How the sheet ended. `closed`: the payer closed it with the payment still
+ * open. A hint only: ship on `payment.paid` from the webhook or `getPayment`.
+ */
+export type PaymentSheetStatus = 'paid' | 'pending' | 'cancelled' | 'expired' | 'locked' | 'closed';
+/** Why the sheet could not show the payment: no payment has this id, or it could not load. */
+export type PaymentSheetError = 'not_found' | 'network';
+export interface PaymentSheetResult {
+    status: PaymentSheetStatus;
+    error?: PaymentSheetError;
+}
+export interface PresentPaymentOptions {
+    /** The payment id the app's server got from the server SDK (`pay_…`). */
+    paymentId: string;
+}
+export interface PaymentSheet {
+    /** Opens the sheet for one payment; resolves when it closes. A second call while one is open rejects. */
+    presentPayment: (options: PresentPaymentOptions) => Promise<PaymentSheetResult>;
+}
+export interface BrissotoPayProviderProps {
+    /** The Brissoto Pay backend; the production one by default. One backend serves Live and Test. */
+    url?: string;
+    children?: ReactNode;
+}
+/** The checkout's gateway calls, one interface for the sheet whatever client is behind it. */
+export interface CheckoutCalls {
+    /**
+     * Follows one payment's checkout view live: `onView` with each answer
+     * (null: no payment has this id), `onError` when it cannot load. Answers how to stop.
+     */
+    watch: (paymentId: string, onView: (view: CheckoutView | null) => void, onError: () => void) => () => void;
+    mutations: CheckoutMutations;
+}
+/** The sheet the app asked for, and how to answer it. */
+export interface SheetRequest {
+    paymentId: string;
+    /** False once closed: the sheet slides away showing its last screen. */
+    open: boolean;
+    resolve: (result: PaymentSheetResult) => void;
+}
+/** A payment as the sheet follows it: undefined while loading, null for an id that matches none. */
+export interface WatchedPayment {
+    view: CheckoutView | null | undefined;
+    /** It could not load. */
+    failed: boolean;
+}
+export interface PaymentSheetModalProps {
+    calls: CheckoutCalls;
+    request: SheetRequest;
+    onClose: (result: PaymentSheetResult) => void;
+}
+export interface SheetContentProps {
+    calls: CheckoutCalls;
+    watched: WatchedPayment;
+    /** Fonts still loading: the sheet shows its skeleton. */
+    fontsReady: boolean;
+    deviceLocale: string;
+    onClose: () => void;
+    /** On the sheet's top: dragged down, the sheet follows, and far enough it closes. */
+    dragHandlers: GestureResponderHandlers;
+}
+/** How the bottom sheet moves: up when it opens, with the finger, away once closed. */
+export interface SheetMotion {
+    /** Still on screen: open, or sliding away. */
+    shown: boolean;
+    /** How far below its place the sheet is drawn. */
+    translateY: Animated.AnimatedAddition;
+    /** The dim over the app, lighter as the sheet goes down. */
+    dim: Animated.AnimatedInterpolation<number>;
+    dragHandlers: GestureResponderHandlers;
+    /** Room left above the sheet at its tallest, in points. */
+    topGap: number;
+}
+/** The sheet's look: the checkout colours of its theme and the app's colour. */
+export interface SheetTheme {
+    colors: CheckoutColors;
+    brand: string;
+    dark: boolean;
+}
+export interface SheetTextProps extends TextProps {
+    weight?: FigtreeEnum;
+    size?: number;
+    color?: string;
+    style?: StyleProp<TextStyle>;
+}
+export interface SheetHeaderProps {
+    view: CheckoutView | null | undefined;
+    /** Bones for the logo and name; close works from the first frame. */
+    loading: boolean;
+    onClose: () => void;
+    dragHandlers: GestureResponderHandlers;
+}
+export interface SheetSummaryProps {
+    view: CheckoutView;
+}
+export interface SheetInputProps extends TextInputProps {
+    ref?: Ref<TextInputInstance>;
+}
+/** A dead end: what happened, why, and its sign. */
+export interface SheetMessageProps {
+    title: string;
+    body: string;
+    /** A ban sign by default: a payment the sheet cannot show. */
+    icon?: SheetIconEnum;
+    /** The lock is red. */
+    danger?: boolean;
+}
+/** A screen the payer cannot act on (expired, cancelled, locked, nothing to pay with). */
+export interface SheetTerminalProps extends SheetClosingProps {
+    kind: TerminalKindEnum;
+}
+/** A screen of the sheet: what scrolls, then what stays pinned at the bottom above "Payment secured by". */
+export interface SheetLayoutProps {
+    children: ReactNode;
+    foot?: ReactNode;
+    /** "Payment secured by Brissoto Pay" under the foot: once a payment shows. */
+    secure?: boolean;
+}
+/** A screen drawn from the shared checkout controller. */
+export interface SheetScreenProps {
+    core: CheckoutCore;
+}
+/** A screen that can close the sheet itself (Done, Return to the app). */
+export interface SheetClosingProps extends SheetScreenProps {
+    onClose: () => void;
+}
+export interface SheetPhoneFieldProps extends SheetScreenProps {
+    /** The number field, so a Pay with a wrong number can bring it to the payer. */
+    phoneRef: Ref<TextInputInstance>;
+}
+export interface SheetFormProps extends SheetPhoneFieldProps {
+    cardFields: CardFieldsBridge;
+}
+/** The card fields' WebView, and the way what its page says reaches the core. */
+export interface CardFieldsBridge {
+    /** `WebView<object>`: its default `WebView<undefined>` types no props. */
+    page: RefObject<WebView<object> | null>;
+    /** A message the card fields page sent, already checked to come from it. */
+    receive: (message: CardFieldsMessage) => void;
+}
+/** What only the phone does for the checkout core, and the card fields' end of it. */
+export interface NativePlatform {
+    platform: CheckoutPlatform;
+    cardFields: CardFieldsBridge;
+}
+export interface SheetCardFieldsProps extends SheetScreenProps {
+    bridge: CardFieldsBridge;
+}
+export interface SheetButtonProps {
+    label: string;
+    onPress: () => void;
+    variant?: CheckoutButtonVariantEnum;
+    /** On its way: a spinner, and no second press. */
+    busy?: boolean;
+    disabled?: boolean;
+    /** Looks off but still answers: Pay says what is missing. */
+    inactive?: boolean;
+}
+/** A brand tile: the provider's logo, square, at one of `LOGO_SIZE`. */
+export interface SheetLogoProps {
+    logo: ProviderLogoEnum;
+    size?: number;
+    /** Greyed with its method. */
+    muted?: boolean;
+}
+/** One method in the grid: its logo, name, network or why it is greyed, and a radio dot. */
+export interface MethodCardProps {
+    logo: ProviderLogoEnum;
+    name: string;
+    sub: string;
+    /** Greyed and not pressable: in maintenance, or not offered yet. */
+    muted: boolean;
+    onSelect?: () => void;
+}
+export interface ChosenMethodProps {
+    logo: ProviderLogoEnum;
+    name: string;
+    /** Its network. */
+    sub: string;
+    /** Back to the list. */
+    onChange: () => void;
+}
+export interface MethodGridCard extends MethodCardProps {
+    id: string;
+}
+export interface MethodGridProps {
+    cards: Array<MethodGridCard>;
+}
+export interface SheetIconProps {
+    kind: SheetIconEnum;
+    color: string;
+    /** The disc behind it. */
+    background: string;
+    /** The disc's side; the sign grows with it. */
+    size?: number;
+}
+/** A label and its value, one row of a receipt or a waiting payment. */
+export interface SheetRowProps {
+    label: string;
+    children: ReactNode;
+    /** The value in the danger colour: the last seconds of the clock. */
+    urgent?: boolean;
+}
+export interface SheetToastProps {
+    message: string | null;
+}
+export interface BoneProps {
+    /** Points, or a share of the row (`100%`). */
+    width: DimensionValue;
+    height: number;
+    radius?: number;
+}
+/** What the card fields page's address carries. */
+export interface CardFieldsAddress {
+    /** Where the checkout is served (`CheckoutView.siteUrl`). */
+    siteUrl: string;
+    /** The method's `cardFieldsPath`. */
+    path: string;
+    paymentId: string;
+    method: string;
+    /** The app colour, a hex code. */
+    color: string;
+    dark: boolean;
+    lang: LangEnum;
+}

package/dist/models/sheet.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/models/sheet.utils.d.ts

@@ -0,0 +1,43 @@
+import { CheckoutThemeEnum } from '../checkout-core/models/checkout.enum.js';
+import { LangEnum } from '../checkout-core/models/domain.enum.js';
+import type { CountryEnum } from '../checkout-core/models/domain.enum.js';
+import type { CardFieldsMessage, CheckoutView } from '../checkout-core/models/checkout.interface.js';
+import type { CardFieldsAddress, PaymentSheetResult } from './sheet.interface.js';
+/** The payment's language, else the device's when the sheet speaks it, else English. */
+export declare function sheetLanguage(payment: LangEnum | null, deviceLocale: string): LangEnum;
+/** The payment's theme, else the device's scheme. */
+export declare function sheetTheme(payment: CheckoutThemeEnum | null, scheme: string | null | undefined): CheckoutThemeEnum;
+/** What `presentPayment` answers when the sheet closes on this payment. */
+export declare function sheetResult(view: CheckoutView | null | undefined, failed: boolean): PaymentSheetResult;
+/** `cm` → 🇨🇲: the country's flag, as the phone draws it. */
+export declare function flagOf(country: CountryEnum): string;
+/**
+ * Seconds before the prompt can be sent again, from the waiting clock
+ * (`waitLeft`) and the second of the wait it was last sent at (0: Pay).
+ */
+export declare function resendLeftOf(waitLeft: number, sentAt: number): number;
+/**
+ * The card fields page the sheet loads: English under `/en`, French the bare
+ * path asking for French (as the checkout link does), with the payment, the
+ * method and the sheet's look.
+ */
+export declare function cardFieldsUrl({ siteUrl, path, paymentId, method, color, dark, lang, }: CardFieldsAddress): string;
+/** `https://pay.brissoto.com/en/checkout` → `https://pay.brissoto.com`; null for anything not on the web. */
+export declare function originOf(url: string): string | null;
+/** The card fields page itself, in either language: the one page its WebView may load. */
+export declare function isCardFieldsPage(url: string, page: string): boolean;
+/**
+ * What the card fields page said, as the core reads it, when it is one of
+ * its messages; anything else, Pay itself included, is dropped.
+ */
+export declare function cardFieldsMessageOf(data: string): CardFieldsMessage | null;
+/**
+ * Runs in the card fields page before it loads. At the top of a WebView the
+ * page tells its checkout by posting to itself: what it posts from its own
+ * origin goes on to the sheet, Pay (which only the sheet sends) aside.
+ */
+export declare function cardFieldsBridge(): string;
+/** Tells the card fields page that Pay was pressed, as the web checkout does. */
+export declare function cardFieldsSubmit(): string;
+/** Letting go of the sheet's top `dy` points lower, at `vy` points per ms: far enough, or flicked, it closes. */
+export declare function sheetSwipeCloses(dy: number, vy: number): boolean;

package/dist/models/sheet.utils.js

@@ -0,0 +1,132 @@
+import { RESEND_SECONDS, WAIT_SECONDS, } from "../checkout-core/models/checkout.constants.js";
+import { CardFieldsMessageEnum, CheckoutPaymentStatusEnum, CheckoutThemeEnum, PayRefusalEnum, } from "../checkout-core/models/checkout.enum.js";
+import { AttemptStatusEnum, LangEnum, } from "../checkout-core/models/domain.enum.js";
+import { SHEET_FLICK_SPEED, SHEET_SWIPE_DISTANCE } from "./sheet.constants.js";
+/** The payment's language, else the device's when the sheet speaks it, else English. */
+export function sheetLanguage(payment, deviceLocale) {
+    if (payment)
+        return payment;
+    const device = deviceLocale.slice(0, 2).toLowerCase();
+    return Object.values(LangEnum).find((lang) => lang === device) ?? LangEnum.EN;
+}
+/** The payment's theme, else the device's scheme. */
+export function sheetTheme(payment, scheme) {
+    return (payment ??
+        (scheme === CheckoutThemeEnum.DARK
+            ? CheckoutThemeEnum.DARK
+            : CheckoutThemeEnum.LIGHT));
+}
+/** What `presentPayment` answers when the sheet closes on this payment. */
+export function sheetResult(view, failed) {
+    if (view === null)
+        return { status: 'closed', error: 'not_found' };
+    if (!view)
+        return failed
+            ? { status: 'closed', error: 'network' }
+            : { status: 'closed' };
+    if (view.status !== CheckoutPaymentStatusEnum.PENDING) {
+        return { status: view.status };
+    }
+    // A prompt still on the phone: approved later, the payment goes through.
+    return {
+        status: view.attempt?.status === AttemptStatusEnum.PENDING ? 'pending' : 'closed',
+    };
+}
+/** `cm` → 🇨🇲: the country's flag, as the phone draws it. */
+export function flagOf(country) {
+    return String.fromCodePoint(...[...country.toUpperCase()].map((letter) => 0x1f1e6 + letter.charCodeAt(0) - 'A'.charCodeAt(0)));
+}
+/**
+ * Seconds before the prompt can be sent again, from the waiting clock
+ * (`waitLeft`) and the second of the wait it was last sent at (0: Pay).
+ */
+export function resendLeftOf(waitLeft, sentAt) {
+    const waited = WAIT_SECONDS - waitLeft - sentAt;
+    return Math.max(0, RESEND_SECONDS - waited);
+}
+/**
+ * The card fields page the sheet loads: English under `/en`, French the bare
+ * path asking for French (as the checkout link does), with the payment, the
+ * method and the sheet's look.
+ */
+export function cardFieldsUrl({ siteUrl, path, paymentId, method, color, dark, lang, }) {
+    const query = new URLSearchParams({
+        payment: paymentId,
+        method,
+        color,
+        theme: dark ? CheckoutThemeEnum.DARK : CheckoutThemeEnum.LIGHT,
+        ...(lang === LangEnum.FR ? { lang } : {}),
+    });
+    const prefix = lang === LangEnum.EN ? `/${lang}` : '';
+    return `${siteUrl}${prefix}${path}?${query.toString()}`;
+}
+const WEB_ADDRESS = /^(https?:\/\/[^/?#]+)([^?#]*)/i;
+const LANG_PREFIX = new RegExp(`^/(?:${Object.values(LangEnum).join('|')})(?=/|$)`);
+/** `https://pay.brissoto.com/en/checkout` → `https://pay.brissoto.com`; null for anything not on the web. */
+export function originOf(url) {
+    return WEB_ADDRESS.exec(url)?.[1].toLowerCase() ?? null;
+}
+/** The path of a web address without its language and trailing slash. */
+function pageOf(url) {
+    const path = WEB_ADDRESS.exec(url)[2].replace(LANG_PREFIX, '');
+    return path.replace(/\/+$/, '');
+}
+/** The card fields page itself, in either language: the one page its WebView may load. */
+export function isCardFieldsPage(url, page) {
+    const origin = originOf(url);
+    return (origin !== null && origin === originOf(page) && pageOf(url) === pageOf(page));
+}
+/**
+ * What the card fields page said, as the core reads it, when it is one of
+ * its messages; anything else, Pay itself included, is dropped.
+ */
+export function cardFieldsMessageOf(data) {
+    let message;
+    try {
+        message = JSON.parse(data);
+    }
+    catch {
+        return null;
+    }
+    switch (message?.type) {
+        case CardFieldsMessageEnum.STATE:
+            return typeof message.complete === 'boolean'
+                ? { type: message.type, complete: message.complete }
+                : null;
+        case CardFieldsMessageEnum.HEIGHT:
+            return typeof message.height === 'number' && message.height >= 0
+                ? { type: message.type, height: message.height }
+                : null;
+        case CardFieldsMessageEnum.DONE:
+            return { type: message.type };
+        case CardFieldsMessageEnum.REFUSED:
+            return Object.values(PayRefusalEnum).includes(message.reason)
+                ? { type: message.type, reason: message.reason }
+                : { type: message.type };
+        default:
+            return null;
+    }
+}
+/**
+ * Runs in the card fields page before it loads. At the top of a WebView the
+ * page tells its checkout by posting to itself: what it posts from its own
+ * origin goes on to the sheet, Pay (which only the sheet sends) aside.
+ */
+export function cardFieldsBridge() {
+    return `window.addEventListener('message', function (event) {
+  var data = event.data;
+  if (event.origin !== window.location.origin || event.source !== window) return;
+  if (!data || typeof data.type !== 'string' || data.type === '${CardFieldsMessageEnum.SUBMIT}') return;
+  window.ReactNativeWebView.postMessage(JSON.stringify(data));
+});
+true;`;
+}
+/** Tells the card fields page that Pay was pressed, as the web checkout does. */
+export function cardFieldsSubmit() {
+    return `window.postMessage({ type: '${CardFieldsMessageEnum.SUBMIT}' }, window.location.origin);
+true;`;
+}
+/** Letting go of the sheet's top `dy` points lower, at `vy` points per ms: far enough, or flicked, it closes. */
+export function sheetSwipeCloses(dy, vy) {
+    return dy > SHEET_SWIPE_DISTANCE || (dy > 0 && vy > SHEET_FLICK_SPEED);
+}

package/dist/services/checkout.service.d.ts

@@ -0,0 +1,7 @@
+import type { ConvexReactClient } from 'convex/react';
+import type { CheckoutCalls } from '../models/sheet.interface.js';
+/**
+ * The checkout's calls over the Convex client: the same public functions the
+ * web checkout calls, by path, so the package needs none of the backend's code.
+ */
+export declare function convexCheckoutCalls(client: ConvexReactClient): CheckoutCalls;