@flopay/react 1.9.11 → 1.9.14

package/dist/index.d.cts

@@ -374,6 +374,20 @@ interface FloPayCheckoutProps {
     cardPreFormSlot?: React.ReactNode;
     /** Layout for AVS fields: 'row' (side-by-side, default) or 'column' (stacked). */
     avsLayout?: 'row' | 'column';
+    /**
+     * Final wording for the hosted card form's submit button in full checkout
+     * (billing API v1.9.35+), e.g. `'Pay $10'`. Pass final, already-localized
+     * plain text from your own order summary — the SDK does not format amounts
+     * or translate. Updates apply live without remounting the card form or
+     * clearing entered card details; omitting or clearing it (or passing `null`
+     * or blank text) shows the hosted default, `CONFIRM PAYMENT`. Direct
+     * custom-layout children receive it unless they set their own `submitLabel`.
+     *
+     * Only the hosted card submit button changes: `confirmLabel` still owns the
+     * saved-payment confirm button, `cardButtonContent` the buttons-layout card
+     * tile, and wallet, PayPal, processing, and retry wording is unchanged.
+     */
+    submitLabel?: string | null;
     /** Additional CSS class for the wrapper. */
     className?: string;
     /** Seed an initial checkout error message for the rendered payment form. */
@@ -390,7 +404,11 @@ interface FloPayCheckoutProps {
      * - `'auto'` — auto-submit with saved PM, falls back to `'full'` on failure
      */
     checkoutMode?: CheckoutMode;
-    /** Label for the confirm button in `confirm` mode. Default: `'Confirm Purchase'`. */
+    /**
+     * Label for the saved-payment confirm button in `confirm` mode. Default:
+     * `'Confirm Purchase'`. Full checkout's hosted card button uses
+     * {@link FloPayCheckoutProps.submitLabel} instead.
+     */
     confirmLabel?: string;
     /** Custom confirm button renderer for `confirm` mode. */
     renderConfirmButton?: (props: {
@@ -423,7 +441,7 @@ interface FloPayCheckoutProps {
  * />
  * ```
  */
-declare function FloPayCheckout({ sessionId: sessionIdProp, nonce: nonceProp, createSession: createSessionParams, billingApiUrl, telemetry, appearance: appearanceOverride, locale, loading: loadingNode, error: errorNode, onComplete, onError, onInstrument, onDecline, onCountryChange, onZipChange, showPayPal, showStripe, enabledPaymentMethods: enabledPaymentMethodsProp, showApplePay, showGooglePay, debug, layout, theme, buttonsTheme, buttonsStyles, cardButtonContent, cardBackButtonContent, cardTitleContent, showSecurityFooter: _showSecurityFooter, onButtonClick, onBeforeButtonClick, enableAVS, cardFieldOrder, cardPreFormSlot, avsLayout, className, initialErrorMessage, children, checkoutMode: checkoutModeProp, confirmLabel, renderConfirmButton, onSessionCompleted, }: FloPayCheckoutProps): React.ReactElement;
+declare function FloPayCheckout({ sessionId: sessionIdProp, nonce: nonceProp, createSession: createSessionParams, billingApiUrl, telemetry, appearance: appearanceOverride, locale, loading: loadingNode, error: errorNode, onComplete, onError, onInstrument, onDecline, onCountryChange, onZipChange, showPayPal, showStripe, enabledPaymentMethods: enabledPaymentMethodsProp, showApplePay, showGooglePay, debug, layout, theme, buttonsTheme, buttonsStyles, cardButtonContent, cardBackButtonContent, cardTitleContent, showSecurityFooter: _showSecurityFooter, onButtonClick, onBeforeButtonClick, enableAVS, cardFieldOrder, cardPreFormSlot, avsLayout, submitLabel, className, initialErrorMessage, children, checkoutMode: checkoutModeProp, confirmLabel, renderConfirmButton, onSessionCompleted, }: FloPayCheckoutProps): React.ReactElement;
 
 /**
  * Returns the current `FloPay` instance, or `null` if the provider
@@ -532,6 +550,21 @@ interface SplitCardFormProps {
     chv?: string;
     /** Additional CSS class for the form wrapper. */
     className?: string;
+    /**
+     * Final wording for the hosted card form's submit button — the control that
+     * starts the card payment — e.g. `'Pay $10'` (billing API v1.9.35+). Pass
+     * the final, already-localized plain text from your own order summary; the
+     * SDK does not format amounts or translate.
+     *
+     * Changes apply live without remounting the card form, so buyer-entered
+     * card details, focus, and caret are kept. Omitting it, passing `null`, or
+     * clearing it after a label was shown restores the hosted default
+     * (`CONFIRM PAYMENT`); blank, oversized, or invalid text also shows the
+     * default. It does not change wallet, PayPal, processing, or retry wording,
+     * the buttons-layout card tile (`cardButtonContent`), or the saved-payment
+     * confirm button (`FloPayCheckout`'s `confirmLabel`).
+     */
+    submitLabel?: string | null;
     /** External processing state. */
     isProcessing?: boolean;
     /** External error message. */
@@ -789,6 +822,15 @@ interface VaultCardFieldsProps {
      * `null` from the start) leaves the widget's own defaults untouched.
      */
     theme?: VaultCardThemeColors | null;
+    /**
+     * Final, already-localized wording for the hosted card form's submit button
+     * (e.g. `'Pay $10'`), billing API v1.9.35+. Applied live on change (no
+     * remount, buyer-entered card data kept). `null` is the same as omitting it:
+     * omitting or clearing it after a label was shown restores the session
+     * default (`CONFIRM PAYMENT`, or `ADD CARD` for card setup); blank text also
+     * shows the default.
+     */
+    submitLabel?: string | null;
     /**
      * Inline styles for the container the widget mounts into. Applied as a
      * whole declaration list in key order on every change (not diffed property
@@ -821,6 +863,6 @@ interface VaultCardFieldsProps {
  * {@link CardCaptureAdapter} and bridges its `ready` / `error` lifecycle events
  * back to the surrounding card form.
  */
-declare function VaultCardFields({ capture, html, messageToken, expectedOrigin, theme, containerStyle, onReady, onError, onValidation, }: VaultCardFieldsProps): React.ReactElement;
+declare function VaultCardFields({ capture, html, messageToken, expectedOrigin, theme, submitLabel, containerStyle, onReady, onError, onValidation, }: VaultCardFieldsProps): React.ReactElement;
 
 export { type CheckoutState, DirectPayPalButton, type DirectPayPalButtonProps, type DirectPayPalInitializationState, FloPayAutomaticPaymentButton, type FloPayAutomaticPaymentButtonProps, type FloPayAutomaticPaymentSuccessEvent, FloPayCheckout, type FloPayCheckoutProps, FloPayProvider, type FloPayProviderProps, SplitCardForm, type SplitCardFormProps, VaultCardFields, type VaultCardFieldsProps, useCheckout, useFloPay, usePayPalFloPay };

package/dist/index.d.ts

@@ -374,6 +374,20 @@ interface FloPayCheckoutProps {
     cardPreFormSlot?: React.ReactNode;
     /** Layout for AVS fields: 'row' (side-by-side, default) or 'column' (stacked). */
     avsLayout?: 'row' | 'column';
+    /**
+     * Final wording for the hosted card form's submit button in full checkout
+     * (billing API v1.9.35+), e.g. `'Pay $10'`. Pass final, already-localized
+     * plain text from your own order summary — the SDK does not format amounts
+     * or translate. Updates apply live without remounting the card form or
+     * clearing entered card details; omitting or clearing it (or passing `null`
+     * or blank text) shows the hosted default, `CONFIRM PAYMENT`. Direct
+     * custom-layout children receive it unless they set their own `submitLabel`.
+     *
+     * Only the hosted card submit button changes: `confirmLabel` still owns the
+     * saved-payment confirm button, `cardButtonContent` the buttons-layout card
+     * tile, and wallet, PayPal, processing, and retry wording is unchanged.
+     */
+    submitLabel?: string | null;
     /** Additional CSS class for the wrapper. */
     className?: string;
     /** Seed an initial checkout error message for the rendered payment form. */
@@ -390,7 +404,11 @@ interface FloPayCheckoutProps {
      * - `'auto'` — auto-submit with saved PM, falls back to `'full'` on failure
      */
     checkoutMode?: CheckoutMode;
-    /** Label for the confirm button in `confirm` mode. Default: `'Confirm Purchase'`. */
+    /**
+     * Label for the saved-payment confirm button in `confirm` mode. Default:
+     * `'Confirm Purchase'`. Full checkout's hosted card button uses
+     * {@link FloPayCheckoutProps.submitLabel} instead.
+     */
     confirmLabel?: string;
     /** Custom confirm button renderer for `confirm` mode. */
     renderConfirmButton?: (props: {
@@ -423,7 +441,7 @@ interface FloPayCheckoutProps {
  * />
  * ```
  */
-declare function FloPayCheckout({ sessionId: sessionIdProp, nonce: nonceProp, createSession: createSessionParams, billingApiUrl, telemetry, appearance: appearanceOverride, locale, loading: loadingNode, error: errorNode, onComplete, onError, onInstrument, onDecline, onCountryChange, onZipChange, showPayPal, showStripe, enabledPaymentMethods: enabledPaymentMethodsProp, showApplePay, showGooglePay, debug, layout, theme, buttonsTheme, buttonsStyles, cardButtonContent, cardBackButtonContent, cardTitleContent, showSecurityFooter: _showSecurityFooter, onButtonClick, onBeforeButtonClick, enableAVS, cardFieldOrder, cardPreFormSlot, avsLayout, className, initialErrorMessage, children, checkoutMode: checkoutModeProp, confirmLabel, renderConfirmButton, onSessionCompleted, }: FloPayCheckoutProps): React.ReactElement;
+declare function FloPayCheckout({ sessionId: sessionIdProp, nonce: nonceProp, createSession: createSessionParams, billingApiUrl, telemetry, appearance: appearanceOverride, locale, loading: loadingNode, error: errorNode, onComplete, onError, onInstrument, onDecline, onCountryChange, onZipChange, showPayPal, showStripe, enabledPaymentMethods: enabledPaymentMethodsProp, showApplePay, showGooglePay, debug, layout, theme, buttonsTheme, buttonsStyles, cardButtonContent, cardBackButtonContent, cardTitleContent, showSecurityFooter: _showSecurityFooter, onButtonClick, onBeforeButtonClick, enableAVS, cardFieldOrder, cardPreFormSlot, avsLayout, submitLabel, className, initialErrorMessage, children, checkoutMode: checkoutModeProp, confirmLabel, renderConfirmButton, onSessionCompleted, }: FloPayCheckoutProps): React.ReactElement;
 
 /**
  * Returns the current `FloPay` instance, or `null` if the provider
@@ -532,6 +550,21 @@ interface SplitCardFormProps {
     chv?: string;
     /** Additional CSS class for the form wrapper. */
     className?: string;
+    /**
+     * Final wording for the hosted card form's submit button — the control that
+     * starts the card payment — e.g. `'Pay $10'` (billing API v1.9.35+). Pass
+     * the final, already-localized plain text from your own order summary; the
+     * SDK does not format amounts or translate.
+     *
+     * Changes apply live without remounting the card form, so buyer-entered
+     * card details, focus, and caret are kept. Omitting it, passing `null`, or
+     * clearing it after a label was shown restores the hosted default
+     * (`CONFIRM PAYMENT`); blank, oversized, or invalid text also shows the
+     * default. It does not change wallet, PayPal, processing, or retry wording,
+     * the buttons-layout card tile (`cardButtonContent`), or the saved-payment
+     * confirm button (`FloPayCheckout`'s `confirmLabel`).
+     */
+    submitLabel?: string | null;
     /** External processing state. */
     isProcessing?: boolean;
     /** External error message. */
@@ -789,6 +822,15 @@ interface VaultCardFieldsProps {
      * `null` from the start) leaves the widget's own defaults untouched.
      */
     theme?: VaultCardThemeColors | null;
+    /**
+     * Final, already-localized wording for the hosted card form's submit button
+     * (e.g. `'Pay $10'`), billing API v1.9.35+. Applied live on change (no
+     * remount, buyer-entered card data kept). `null` is the same as omitting it:
+     * omitting or clearing it after a label was shown restores the session
+     * default (`CONFIRM PAYMENT`, or `ADD CARD` for card setup); blank text also
+     * shows the default.
+     */
+    submitLabel?: string | null;
     /**
      * Inline styles for the container the widget mounts into. Applied as a
      * whole declaration list in key order on every change (not diffed property
@@ -821,6 +863,6 @@ interface VaultCardFieldsProps {
  * {@link CardCaptureAdapter} and bridges its `ready` / `error` lifecycle events
  * back to the surrounding card form.
  */
-declare function VaultCardFields({ capture, html, messageToken, expectedOrigin, theme, containerStyle, onReady, onError, onValidation, }: VaultCardFieldsProps): React.ReactElement;
+declare function VaultCardFields({ capture, html, messageToken, expectedOrigin, theme, submitLabel, containerStyle, onReady, onError, onValidation, }: VaultCardFieldsProps): React.ReactElement;
 
 export { type CheckoutState, DirectPayPalButton, type DirectPayPalButtonProps, type DirectPayPalInitializationState, FloPayAutomaticPaymentButton, type FloPayAutomaticPaymentButtonProps, type FloPayAutomaticPaymentSuccessEvent, FloPayCheckout, type FloPayCheckoutProps, FloPayProvider, type FloPayProviderProps, SplitCardForm, type SplitCardFormProps, VaultCardFields, type VaultCardFieldsProps, useCheckout, useFloPay, usePayPalFloPay };