@flopay/vue 0.0.0-stage → 1.13.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +102 -2
- package/dist/card-setup-entry.cjs +614 -0
- package/dist/card-setup-entry.d.cts +160 -0
- package/dist/card-setup-entry.d.ts +160 -0
- package/dist/card-setup-entry.mjs +10 -0
- package/dist/chunk-2PLBNCM6.mjs +332 -0
- package/dist/chunk-DUU6SMKP.mjs +97 -0
- package/dist/chunk-VXYNYMHI.mjs +833 -0
- package/dist/chunk-W52CQTJI.mjs +527 -0
- package/dist/hosted-setup-jpaaXDFA.d.cts +33 -0
- package/dist/hosted-setup-jpaaXDFA.d.ts +33 -0
- package/dist/index.cjs +4987 -0
- package/dist/index.d.cts +1940 -0
- package/dist/index.d.ts +1940 -0
- package/dist/index.mjs +3196 -0
- package/dist/payment-method-setup-entry.cjs +1809 -0
- package/dist/payment-method-setup-entry.d.cts +156 -0
- package/dist/payment-method-setup-entry.d.ts +156 -0
- package/dist/payment-method-setup-entry.mjs +7 -0
- package/dist/payment-method-setup-paypal-XPSU4CHA.mjs +148 -0
- package/dist/stripe-elements-QGT45VIE.mjs +6 -0
- package/package.json +60 -3
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,1940 @@
|
|
|
1
|
+
import * as _flopay_shared from '@flopay/shared';
|
|
2
|
+
import { InlineSessionDraft, CheckoutButtonMethod, CheckoutProduct, CheckoutItem, CheckoutSubscription, ThemeId, FloPayAppearance, ButtonsLayoutTheme, ButtonsLayoutStyles, PaymentResult, CheckoutSession, FloPayError, DeclineEvent, PayPalBuyerIdentity, GatewayEnvironment, PayPalProviderObjectType, PayPalApprovalPresentation, InlineSessionPatch, TokenizedBody, TelemetryTerminalReason, BeforeButtonClickEvent, WalletPresentation, AVSFieldConfig, VaultCardFieldKey, CheckoutMode, FloInstrumentEvent, CardCaptureAdapter, VaultCardThemeColors } from '@flopay/shared';
|
|
3
|
+
export { BeforeButtonClickEvent, CheckoutButtonMethod, DeclineEvent, FloInstrumentEvent, InlineSessionDraft, InlineSessionPatch, SentryEventLike, SentryStackFrameLike, WalletPresentation, dropThirdPartyOnlyError } from '@flopay/shared';
|
|
4
|
+
import * as vue from 'vue';
|
|
5
|
+
import { PropType, VNode, ShallowRef, CSSProperties } from 'vue';
|
|
6
|
+
export { FloPayCardSetup, FloPayCardSetupProps } from './card-setup-entry.cjs';
|
|
7
|
+
export { FloPayPaymentMethodSetup, FloPayPaymentMethodSetupCancelEvent, FloPayPaymentMethodSetupCompleteEvent, FloPayPaymentMethodSetupDeclineEvent, FloPayPaymentMethodSetupProps } from './payment-method-setup-entry.cjs';
|
|
8
|
+
import { FloPay } from '@flopay/js';
|
|
9
|
+
export { F as FloPayCardSetupCancelEvent, a as FloPayCardSetupCompleteEvent, b as FloPayCardSetupDeclineEvent, c as FloPayCardSetupError } from './hosted-setup-jpaaXDFA.cjs';
|
|
10
|
+
|
|
11
|
+
/** Payload of the `success` event — identical to React's `onSuccess` argument. */
|
|
12
|
+
interface FloPayAutomaticPaymentSuccessEvent {
|
|
13
|
+
result: PaymentResult;
|
|
14
|
+
session: CheckoutSession | null;
|
|
15
|
+
sessionId: string | null;
|
|
16
|
+
autoCompleted: boolean;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Props for {@link FloPayAutomaticPaymentButton} (React's props; callbacks are
|
|
20
|
+
* emits). React's props also extend the native `<button>` attributes (minus
|
|
21
|
+
* `children` and `onError`) and spread them onto the button; in Vue those
|
|
22
|
+
* arrive as fallthrough attributes (`id`, `class`, `style`, `aria-*`,
|
|
23
|
+
* `data-*`, `type`, `@click`, …) and land on the same `<button>`.
|
|
24
|
+
*/
|
|
25
|
+
interface FloPayAutomaticPaymentButtonProps {
|
|
26
|
+
sessionId?: string;
|
|
27
|
+
/** Session-bound checkout token for a supplied {@link sessionId}. */
|
|
28
|
+
nonce?: string;
|
|
29
|
+
createSession?: InlineSessionDraft;
|
|
30
|
+
/**
|
|
31
|
+
* @deprecated Ignored, as in React: the backend picks the customer's most
|
|
32
|
+
* recent vaulted method. Accepted only so existing integrations keep working.
|
|
33
|
+
*/
|
|
34
|
+
paymentMethodId?: string;
|
|
35
|
+
/**
|
|
36
|
+
* @deprecated Ignored, as in React: the backend orchestrates gateway
|
|
37
|
+
* routing. Accepted only so existing integrations keep working.
|
|
38
|
+
*/
|
|
39
|
+
checkoutMethod?: CheckoutButtonMethod;
|
|
40
|
+
clientId?: string;
|
|
41
|
+
products?: CheckoutProduct[];
|
|
42
|
+
items?: CheckoutItem[];
|
|
43
|
+
subscriptions?: CheckoutSubscription[];
|
|
44
|
+
account?: InlineSessionDraft['account'];
|
|
45
|
+
successUrl?: string;
|
|
46
|
+
cancelUrl?: string;
|
|
47
|
+
couponCodes?: string[];
|
|
48
|
+
tagsData?: InlineSessionDraft['tagsData'];
|
|
49
|
+
utmMetadata?: InlineSessionDraft['utmMetadata'];
|
|
50
|
+
billingApiUrl?: string;
|
|
51
|
+
locale?: string;
|
|
52
|
+
disabled?: boolean;
|
|
53
|
+
/** Theme bundle that styles the button and the fallback checkout. */
|
|
54
|
+
theme?: ThemeId;
|
|
55
|
+
/**
|
|
56
|
+
* Appearance overrides layered on top of the chosen `theme` (variables merge
|
|
57
|
+
* per key). Its `colorPrimary` / `colorPrimaryHover` re-skin the button.
|
|
58
|
+
*/
|
|
59
|
+
appearance?: FloPayAppearance;
|
|
60
|
+
/** @deprecated Use `theme`. Legacy buttons-layout preset, used only without `theme`. */
|
|
61
|
+
buttonsTheme?: ButtonsLayoutTheme;
|
|
62
|
+
/** Style overrides merged on top of the resolved theme bundle / `buttonsTheme` preset. */
|
|
63
|
+
buttonsStyles?: ButtonsLayoutStyles;
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* The one-click button: charges the buyer's saved payment method through the
|
|
67
|
+
* session-scoped `/process` with no client-built `tokenizedData`. The backend
|
|
68
|
+
* picks the vaulted method and its gateway. A session the backend already
|
|
69
|
+
* auto-completed emits `success` with `autoCompleted: true`.
|
|
70
|
+
*/
|
|
71
|
+
declare const FloPayAutomaticPaymentButton: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
72
|
+
sessionId: {
|
|
73
|
+
type: StringConstructor;
|
|
74
|
+
default: undefined;
|
|
75
|
+
};
|
|
76
|
+
nonce: {
|
|
77
|
+
type: StringConstructor;
|
|
78
|
+
default: undefined;
|
|
79
|
+
};
|
|
80
|
+
createSession: {
|
|
81
|
+
type: PropType<InlineSessionDraft>;
|
|
82
|
+
default: undefined;
|
|
83
|
+
};
|
|
84
|
+
paymentMethodId: {
|
|
85
|
+
type: StringConstructor;
|
|
86
|
+
default: undefined;
|
|
87
|
+
};
|
|
88
|
+
checkoutMethod: {
|
|
89
|
+
type: PropType<CheckoutButtonMethod>;
|
|
90
|
+
default: undefined;
|
|
91
|
+
};
|
|
92
|
+
clientId: {
|
|
93
|
+
type: StringConstructor;
|
|
94
|
+
default: undefined;
|
|
95
|
+
};
|
|
96
|
+
products: {
|
|
97
|
+
type: PropType<CheckoutProduct[]>;
|
|
98
|
+
default: undefined;
|
|
99
|
+
};
|
|
100
|
+
items: {
|
|
101
|
+
type: PropType<CheckoutItem[]>;
|
|
102
|
+
default: undefined;
|
|
103
|
+
};
|
|
104
|
+
subscriptions: {
|
|
105
|
+
type: PropType<CheckoutSubscription[]>;
|
|
106
|
+
default: undefined;
|
|
107
|
+
};
|
|
108
|
+
account: {
|
|
109
|
+
type: PropType<InlineSessionDraft["account"]>;
|
|
110
|
+
default: undefined;
|
|
111
|
+
};
|
|
112
|
+
successUrl: {
|
|
113
|
+
type: StringConstructor;
|
|
114
|
+
default: undefined;
|
|
115
|
+
};
|
|
116
|
+
cancelUrl: {
|
|
117
|
+
type: StringConstructor;
|
|
118
|
+
default: undefined;
|
|
119
|
+
};
|
|
120
|
+
couponCodes: {
|
|
121
|
+
type: PropType<string[]>;
|
|
122
|
+
default: undefined;
|
|
123
|
+
};
|
|
124
|
+
tagsData: {
|
|
125
|
+
type: PropType<InlineSessionDraft["tagsData"]>;
|
|
126
|
+
default: undefined;
|
|
127
|
+
};
|
|
128
|
+
utmMetadata: {
|
|
129
|
+
type: PropType<InlineSessionDraft["utmMetadata"]>;
|
|
130
|
+
default: undefined;
|
|
131
|
+
};
|
|
132
|
+
billingApiUrl: {
|
|
133
|
+
type: StringConstructor;
|
|
134
|
+
default: undefined;
|
|
135
|
+
};
|
|
136
|
+
locale: {
|
|
137
|
+
type: StringConstructor;
|
|
138
|
+
default: undefined;
|
|
139
|
+
};
|
|
140
|
+
disabled: {
|
|
141
|
+
type: BooleanConstructor;
|
|
142
|
+
default: boolean;
|
|
143
|
+
};
|
|
144
|
+
theme: {
|
|
145
|
+
type: PropType<ThemeId>;
|
|
146
|
+
default: undefined;
|
|
147
|
+
};
|
|
148
|
+
appearance: {
|
|
149
|
+
type: PropType<FloPayAppearance>;
|
|
150
|
+
default: undefined;
|
|
151
|
+
};
|
|
152
|
+
buttonsTheme: {
|
|
153
|
+
type: PropType<ButtonsLayoutTheme>;
|
|
154
|
+
default: undefined;
|
|
155
|
+
};
|
|
156
|
+
buttonsStyles: {
|
|
157
|
+
type: PropType<ButtonsLayoutStyles>;
|
|
158
|
+
default: undefined;
|
|
159
|
+
};
|
|
160
|
+
}>, () => (vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
161
|
+
[key: string]: any;
|
|
162
|
+
}> | null)[], {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
163
|
+
success: (_event: FloPayAutomaticPaymentSuccessEvent) => true;
|
|
164
|
+
error: (_error: FloPayError) => true;
|
|
165
|
+
decline: (_decline: DeclineEvent) => true;
|
|
166
|
+
}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
167
|
+
sessionId: {
|
|
168
|
+
type: StringConstructor;
|
|
169
|
+
default: undefined;
|
|
170
|
+
};
|
|
171
|
+
nonce: {
|
|
172
|
+
type: StringConstructor;
|
|
173
|
+
default: undefined;
|
|
174
|
+
};
|
|
175
|
+
createSession: {
|
|
176
|
+
type: PropType<InlineSessionDraft>;
|
|
177
|
+
default: undefined;
|
|
178
|
+
};
|
|
179
|
+
paymentMethodId: {
|
|
180
|
+
type: StringConstructor;
|
|
181
|
+
default: undefined;
|
|
182
|
+
};
|
|
183
|
+
checkoutMethod: {
|
|
184
|
+
type: PropType<CheckoutButtonMethod>;
|
|
185
|
+
default: undefined;
|
|
186
|
+
};
|
|
187
|
+
clientId: {
|
|
188
|
+
type: StringConstructor;
|
|
189
|
+
default: undefined;
|
|
190
|
+
};
|
|
191
|
+
products: {
|
|
192
|
+
type: PropType<CheckoutProduct[]>;
|
|
193
|
+
default: undefined;
|
|
194
|
+
};
|
|
195
|
+
items: {
|
|
196
|
+
type: PropType<CheckoutItem[]>;
|
|
197
|
+
default: undefined;
|
|
198
|
+
};
|
|
199
|
+
subscriptions: {
|
|
200
|
+
type: PropType<CheckoutSubscription[]>;
|
|
201
|
+
default: undefined;
|
|
202
|
+
};
|
|
203
|
+
account: {
|
|
204
|
+
type: PropType<InlineSessionDraft["account"]>;
|
|
205
|
+
default: undefined;
|
|
206
|
+
};
|
|
207
|
+
successUrl: {
|
|
208
|
+
type: StringConstructor;
|
|
209
|
+
default: undefined;
|
|
210
|
+
};
|
|
211
|
+
cancelUrl: {
|
|
212
|
+
type: StringConstructor;
|
|
213
|
+
default: undefined;
|
|
214
|
+
};
|
|
215
|
+
couponCodes: {
|
|
216
|
+
type: PropType<string[]>;
|
|
217
|
+
default: undefined;
|
|
218
|
+
};
|
|
219
|
+
tagsData: {
|
|
220
|
+
type: PropType<InlineSessionDraft["tagsData"]>;
|
|
221
|
+
default: undefined;
|
|
222
|
+
};
|
|
223
|
+
utmMetadata: {
|
|
224
|
+
type: PropType<InlineSessionDraft["utmMetadata"]>;
|
|
225
|
+
default: undefined;
|
|
226
|
+
};
|
|
227
|
+
billingApiUrl: {
|
|
228
|
+
type: StringConstructor;
|
|
229
|
+
default: undefined;
|
|
230
|
+
};
|
|
231
|
+
locale: {
|
|
232
|
+
type: StringConstructor;
|
|
233
|
+
default: undefined;
|
|
234
|
+
};
|
|
235
|
+
disabled: {
|
|
236
|
+
type: BooleanConstructor;
|
|
237
|
+
default: boolean;
|
|
238
|
+
};
|
|
239
|
+
theme: {
|
|
240
|
+
type: PropType<ThemeId>;
|
|
241
|
+
default: undefined;
|
|
242
|
+
};
|
|
243
|
+
appearance: {
|
|
244
|
+
type: PropType<FloPayAppearance>;
|
|
245
|
+
default: undefined;
|
|
246
|
+
};
|
|
247
|
+
buttonsTheme: {
|
|
248
|
+
type: PropType<ButtonsLayoutTheme>;
|
|
249
|
+
default: undefined;
|
|
250
|
+
};
|
|
251
|
+
buttonsStyles: {
|
|
252
|
+
type: PropType<ButtonsLayoutStyles>;
|
|
253
|
+
default: undefined;
|
|
254
|
+
};
|
|
255
|
+
}>> & Readonly<{
|
|
256
|
+
onError?: ((_error: FloPayError) => any) | undefined;
|
|
257
|
+
onDecline?: ((_decline: DeclineEvent) => any) | undefined;
|
|
258
|
+
onSuccess?: ((_event: FloPayAutomaticPaymentSuccessEvent) => any) | undefined;
|
|
259
|
+
}>, {
|
|
260
|
+
nonce: string;
|
|
261
|
+
account: Omit<_flopay_shared.CheckoutAccount, "email"> & {
|
|
262
|
+
email?: string;
|
|
263
|
+
};
|
|
264
|
+
disabled: boolean;
|
|
265
|
+
sessionId: string;
|
|
266
|
+
billingApiUrl: string;
|
|
267
|
+
clientId: string;
|
|
268
|
+
appearance: FloPayAppearance;
|
|
269
|
+
theme: ThemeId;
|
|
270
|
+
buttonsTheme: ButtonsLayoutTheme;
|
|
271
|
+
buttonsStyles: ButtonsLayoutStyles;
|
|
272
|
+
products: CheckoutProduct[];
|
|
273
|
+
successUrl: string;
|
|
274
|
+
cancelUrl: string;
|
|
275
|
+
tagsData: _flopay_shared.TagsData | undefined;
|
|
276
|
+
items: CheckoutItem[];
|
|
277
|
+
subscriptions: CheckoutSubscription[];
|
|
278
|
+
couponCodes: string[];
|
|
279
|
+
utmMetadata: Record<string, string | null | undefined>[] | undefined;
|
|
280
|
+
createSession: InlineSessionDraft;
|
|
281
|
+
locale: string;
|
|
282
|
+
paymentMethodId: string;
|
|
283
|
+
checkoutMethod: CheckoutButtonMethod;
|
|
284
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
285
|
+
|
|
286
|
+
/** Lifecycle of the PayPal JS SDK button, reported through `@initialization-state-change`. */
|
|
287
|
+
type DirectPayPalInitializationState = 'loading' | 'retrying' | 'ready' | 'exhausted';
|
|
288
|
+
/** React's click-time `runBeforeButtonClick` result. */
|
|
289
|
+
interface DirectPayPalBeforeButtonClickResult {
|
|
290
|
+
proceed: boolean;
|
|
291
|
+
accountPatch?: InlineSessionPatch['account'];
|
|
292
|
+
sessionId?: string;
|
|
293
|
+
nonce?: string;
|
|
294
|
+
}
|
|
295
|
+
/**
|
|
296
|
+
* React's click-time gate: runs before PayPal creates the order, can patch the
|
|
297
|
+
* session, nonce and account for this attempt, or stop it with `proceed: false`.
|
|
298
|
+
*/
|
|
299
|
+
type DirectPayPalRunBeforeButtonClick = (method: CheckoutButtonMethod) => Promise<DirectPayPalBeforeButtonClickResult>;
|
|
300
|
+
/** The click-time patch React passes with the tokenized body. */
|
|
301
|
+
interface DirectPayPalTokenizedOverrides {
|
|
302
|
+
accountPatch?: InlineSessionPatch['account'];
|
|
303
|
+
sessionId?: string;
|
|
304
|
+
nonce?: string;
|
|
305
|
+
}
|
|
306
|
+
/** React's `onTokenizedBody`: when set, the host continues the payment from PayPal's approval. */
|
|
307
|
+
type DirectPayPalTokenizedHandler = (body: TokenizedBody, overrides?: DirectPayPalTokenizedOverrides) => void | Promise<void>;
|
|
308
|
+
interface DirectPayPalTechnicalFailureOptions {
|
|
309
|
+
code?: string;
|
|
310
|
+
popupBlocked?: boolean;
|
|
311
|
+
provider?: 'paypal';
|
|
312
|
+
paymentMethodCategory?: 'paypal';
|
|
313
|
+
terminalReason?: TelemetryTerminalReason;
|
|
314
|
+
}
|
|
315
|
+
/**
|
|
316
|
+
* React's `onBuyerIdentityReady`: attaches the buyer identity collected on
|
|
317
|
+
* approval before the payment continues. React awaits it and its presence
|
|
318
|
+
* turns on the email fallback, so it stays a function prop (CTO decision 2).
|
|
319
|
+
*/
|
|
320
|
+
type DirectPayPalBuyerIdentityReadyHandler = (identity: PayPalBuyerIdentity) => void | Promise<void>;
|
|
321
|
+
/** React's `onTechnicalFailure`: when set, it receives post-click failures instead of `errorChange`. */
|
|
322
|
+
type DirectPayPalTechnicalFailureHandler = (method: 'paypal', err: unknown, options?: DirectPayPalTechnicalFailureOptions) => void;
|
|
323
|
+
/** Props for {@link DirectPayPalButton} (React's `DirectPayPalButtonProps`; notifying callbacks are emits). */
|
|
324
|
+
interface DirectPayPalButtonProps {
|
|
325
|
+
sessionId: string;
|
|
326
|
+
/** Session-bound checkout token, sent as `x-checkout-session-token`. */
|
|
327
|
+
nonce?: string;
|
|
328
|
+
billingApiUrl?: string;
|
|
329
|
+
email?: string;
|
|
330
|
+
/** Buyer name already attached to the checkout, when available. */
|
|
331
|
+
billingName?: string;
|
|
332
|
+
/** Attaches the buyer identity collected on PayPal approval before checkout continues. */
|
|
333
|
+
onBuyerIdentityReady?: DirectPayPalBuyerIdentityReadyHandler;
|
|
334
|
+
/** PayPal client id the session advertises in `gateways.paypal`. */
|
|
335
|
+
clientId: string;
|
|
336
|
+
/**
|
|
337
|
+
* React's `GatewayEnvironment`. FloPay's `stage` / `production` aliases are
|
|
338
|
+
* collapsed to PayPal's `sandbox` / `production` before the SDK loads.
|
|
339
|
+
*/
|
|
340
|
+
environment?: GatewayEnvironment;
|
|
341
|
+
currency?: string;
|
|
342
|
+
isSubscription?: boolean;
|
|
343
|
+
/**
|
|
344
|
+
* @deprecated The session's `gateways.paypal.providerObjectType` is
|
|
345
|
+
* authoritative; this is the fallback when the session advertises none.
|
|
346
|
+
*/
|
|
347
|
+
providerObjectType?: PayPalProviderObjectType;
|
|
348
|
+
/**
|
|
349
|
+
* Backend-advertised approval presentation. The session's
|
|
350
|
+
* `gateways.paypal.approvalPresentation` wins when both are supplied.
|
|
351
|
+
*/
|
|
352
|
+
approvalPresentation?: PayPalApprovalPresentation;
|
|
353
|
+
/** The session, whose `gateways.paypal.providerObjectType` selects the channel. */
|
|
354
|
+
session?: CheckoutSession | null;
|
|
355
|
+
/** A PayPal order (or subscription) id to bind the button to; changing it remounts PayPal. */
|
|
356
|
+
existingOrderId?: string;
|
|
357
|
+
/** External processing state: marks the PayPal container busy. */
|
|
358
|
+
isProcessing?: boolean;
|
|
359
|
+
/** `false` turns off the one automatic startup retry. Defaults to `true`. */
|
|
360
|
+
allowAutomaticRetry?: boolean;
|
|
361
|
+
/** Click-time gate that runs before PayPal creates the order. */
|
|
362
|
+
runBeforeButtonClick?: DirectPayPalRunBeforeButtonClick;
|
|
363
|
+
/** When set, PayPal's approval is handed to the host instead of completing here. */
|
|
364
|
+
onTokenizedBody?: DirectPayPalTokenizedHandler;
|
|
365
|
+
/** When set, post-click technical failures go here instead of `errorChange`. */
|
|
366
|
+
onTechnicalFailure?: DirectPayPalTechnicalFailureHandler;
|
|
367
|
+
telemetry?: boolean;
|
|
368
|
+
/** Renders React's on-screen lifecycle tracer above the button. Off by default. */
|
|
369
|
+
debug?: boolean;
|
|
370
|
+
}
|
|
371
|
+
/**
|
|
372
|
+
* Renders PayPal's own JS SDK button for a session that advertises
|
|
373
|
+
* `gateways.paypal` — the path that works inside in-app browsers. The PayPal
|
|
374
|
+
* object (order or subscription) is created by the billing API's
|
|
375
|
+
* session-scoped `/intents` endpoint, unless `existingOrderId` binds the
|
|
376
|
+
* button to one the backend already created; the SDK only relays the buyer's
|
|
377
|
+
* approval.
|
|
378
|
+
*
|
|
379
|
+
* Like React's button, a load or render failure is retried once automatically
|
|
380
|
+
* (`retrying`, unless `allowAutomaticRetry` is false) before the button reports
|
|
381
|
+
* `exhausted`, and every PayPal error is classified with the shared
|
|
382
|
+
* external-method classifier: only a provider decline is reported to
|
|
383
|
+
* `/intents/decline` and emitted as `decline`. A blocked pop-up or PayPal's
|
|
384
|
+
* dead window in an in-app browser is emitted as `error` carrying the shared
|
|
385
|
+
* recovery copy, and that copy also goes to `errorChange` (or to
|
|
386
|
+
* `onTechnicalFailure` when the host passes one).
|
|
387
|
+
*
|
|
388
|
+
* Each click starts an attempt with a fresh `/intents` idempotency key. The
|
|
389
|
+
* buyer's approval goes to the host's `onTokenizedBody` when it passes one;
|
|
390
|
+
* otherwise the button posts it to `/process` itself, as React does. A failed
|
|
391
|
+
* approval is forwarded as a message only, never reported as a decline.
|
|
392
|
+
*/
|
|
393
|
+
declare const DirectPayPalButton: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
394
|
+
sessionId: {
|
|
395
|
+
type: StringConstructor;
|
|
396
|
+
default: undefined;
|
|
397
|
+
};
|
|
398
|
+
nonce: {
|
|
399
|
+
type: StringConstructor;
|
|
400
|
+
default: undefined;
|
|
401
|
+
};
|
|
402
|
+
billingApiUrl: {
|
|
403
|
+
type: StringConstructor;
|
|
404
|
+
default: undefined;
|
|
405
|
+
};
|
|
406
|
+
email: {
|
|
407
|
+
type: StringConstructor;
|
|
408
|
+
default: undefined;
|
|
409
|
+
};
|
|
410
|
+
billingName: {
|
|
411
|
+
type: StringConstructor;
|
|
412
|
+
default: undefined;
|
|
413
|
+
};
|
|
414
|
+
onBuyerIdentityReady: {
|
|
415
|
+
type: PropType<DirectPayPalBuyerIdentityReadyHandler>;
|
|
416
|
+
default: undefined;
|
|
417
|
+
};
|
|
418
|
+
clientId: {
|
|
419
|
+
type: StringConstructor;
|
|
420
|
+
default: undefined;
|
|
421
|
+
};
|
|
422
|
+
environment: {
|
|
423
|
+
type: PropType<GatewayEnvironment>;
|
|
424
|
+
default: undefined;
|
|
425
|
+
};
|
|
426
|
+
currency: {
|
|
427
|
+
type: StringConstructor;
|
|
428
|
+
default: undefined;
|
|
429
|
+
};
|
|
430
|
+
isSubscription: {
|
|
431
|
+
type: BooleanConstructor;
|
|
432
|
+
default: undefined;
|
|
433
|
+
};
|
|
434
|
+
providerObjectType: {
|
|
435
|
+
type: PropType<PayPalProviderObjectType>;
|
|
436
|
+
default: undefined;
|
|
437
|
+
};
|
|
438
|
+
approvalPresentation: {
|
|
439
|
+
type: PropType<PayPalApprovalPresentation>;
|
|
440
|
+
default: undefined;
|
|
441
|
+
};
|
|
442
|
+
session: {
|
|
443
|
+
type: PropType<CheckoutSession | null>;
|
|
444
|
+
default: null;
|
|
445
|
+
};
|
|
446
|
+
existingOrderId: {
|
|
447
|
+
type: StringConstructor;
|
|
448
|
+
default: undefined;
|
|
449
|
+
};
|
|
450
|
+
isProcessing: {
|
|
451
|
+
type: BooleanConstructor;
|
|
452
|
+
default: boolean;
|
|
453
|
+
};
|
|
454
|
+
allowAutomaticRetry: {
|
|
455
|
+
type: BooleanConstructor;
|
|
456
|
+
default: boolean;
|
|
457
|
+
};
|
|
458
|
+
runBeforeButtonClick: {
|
|
459
|
+
type: PropType<DirectPayPalRunBeforeButtonClick>;
|
|
460
|
+
default: undefined;
|
|
461
|
+
};
|
|
462
|
+
onTokenizedBody: {
|
|
463
|
+
type: PropType<DirectPayPalTokenizedHandler>;
|
|
464
|
+
default: undefined;
|
|
465
|
+
};
|
|
466
|
+
onTechnicalFailure: {
|
|
467
|
+
type: PropType<DirectPayPalTechnicalFailureHandler>;
|
|
468
|
+
default: undefined;
|
|
469
|
+
};
|
|
470
|
+
telemetry: {
|
|
471
|
+
type: BooleanConstructor;
|
|
472
|
+
default: undefined;
|
|
473
|
+
};
|
|
474
|
+
debug: {
|
|
475
|
+
type: BooleanConstructor;
|
|
476
|
+
default: boolean;
|
|
477
|
+
};
|
|
478
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
479
|
+
[key: string]: any;
|
|
480
|
+
}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
481
|
+
complete: (_result: PaymentResult) => true;
|
|
482
|
+
decline: (_decline: DeclineEvent) => true;
|
|
483
|
+
error: (_error: FloPayError) => true;
|
|
484
|
+
errorChange: (_message: string | null) => true;
|
|
485
|
+
buttonClick: (_method: CheckoutButtonMethod) => true;
|
|
486
|
+
loadStateChange: (_ready: boolean) => true;
|
|
487
|
+
initializationStateChange: (_state: DirectPayPalInitializationState) => true;
|
|
488
|
+
}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
489
|
+
sessionId: {
|
|
490
|
+
type: StringConstructor;
|
|
491
|
+
default: undefined;
|
|
492
|
+
};
|
|
493
|
+
nonce: {
|
|
494
|
+
type: StringConstructor;
|
|
495
|
+
default: undefined;
|
|
496
|
+
};
|
|
497
|
+
billingApiUrl: {
|
|
498
|
+
type: StringConstructor;
|
|
499
|
+
default: undefined;
|
|
500
|
+
};
|
|
501
|
+
email: {
|
|
502
|
+
type: StringConstructor;
|
|
503
|
+
default: undefined;
|
|
504
|
+
};
|
|
505
|
+
billingName: {
|
|
506
|
+
type: StringConstructor;
|
|
507
|
+
default: undefined;
|
|
508
|
+
};
|
|
509
|
+
onBuyerIdentityReady: {
|
|
510
|
+
type: PropType<DirectPayPalBuyerIdentityReadyHandler>;
|
|
511
|
+
default: undefined;
|
|
512
|
+
};
|
|
513
|
+
clientId: {
|
|
514
|
+
type: StringConstructor;
|
|
515
|
+
default: undefined;
|
|
516
|
+
};
|
|
517
|
+
environment: {
|
|
518
|
+
type: PropType<GatewayEnvironment>;
|
|
519
|
+
default: undefined;
|
|
520
|
+
};
|
|
521
|
+
currency: {
|
|
522
|
+
type: StringConstructor;
|
|
523
|
+
default: undefined;
|
|
524
|
+
};
|
|
525
|
+
isSubscription: {
|
|
526
|
+
type: BooleanConstructor;
|
|
527
|
+
default: undefined;
|
|
528
|
+
};
|
|
529
|
+
providerObjectType: {
|
|
530
|
+
type: PropType<PayPalProviderObjectType>;
|
|
531
|
+
default: undefined;
|
|
532
|
+
};
|
|
533
|
+
approvalPresentation: {
|
|
534
|
+
type: PropType<PayPalApprovalPresentation>;
|
|
535
|
+
default: undefined;
|
|
536
|
+
};
|
|
537
|
+
session: {
|
|
538
|
+
type: PropType<CheckoutSession | null>;
|
|
539
|
+
default: null;
|
|
540
|
+
};
|
|
541
|
+
existingOrderId: {
|
|
542
|
+
type: StringConstructor;
|
|
543
|
+
default: undefined;
|
|
544
|
+
};
|
|
545
|
+
isProcessing: {
|
|
546
|
+
type: BooleanConstructor;
|
|
547
|
+
default: boolean;
|
|
548
|
+
};
|
|
549
|
+
allowAutomaticRetry: {
|
|
550
|
+
type: BooleanConstructor;
|
|
551
|
+
default: boolean;
|
|
552
|
+
};
|
|
553
|
+
runBeforeButtonClick: {
|
|
554
|
+
type: PropType<DirectPayPalRunBeforeButtonClick>;
|
|
555
|
+
default: undefined;
|
|
556
|
+
};
|
|
557
|
+
onTokenizedBody: {
|
|
558
|
+
type: PropType<DirectPayPalTokenizedHandler>;
|
|
559
|
+
default: undefined;
|
|
560
|
+
};
|
|
561
|
+
onTechnicalFailure: {
|
|
562
|
+
type: PropType<DirectPayPalTechnicalFailureHandler>;
|
|
563
|
+
default: undefined;
|
|
564
|
+
};
|
|
565
|
+
telemetry: {
|
|
566
|
+
type: BooleanConstructor;
|
|
567
|
+
default: undefined;
|
|
568
|
+
};
|
|
569
|
+
debug: {
|
|
570
|
+
type: BooleanConstructor;
|
|
571
|
+
default: boolean;
|
|
572
|
+
};
|
|
573
|
+
}>> & Readonly<{
|
|
574
|
+
onComplete?: ((_result: PaymentResult) => any) | undefined;
|
|
575
|
+
onError?: ((_error: FloPayError) => any) | undefined;
|
|
576
|
+
onDecline?: ((_decline: DeclineEvent) => any) | undefined;
|
|
577
|
+
onErrorChange?: ((_message: string | null) => any) | undefined;
|
|
578
|
+
onButtonClick?: ((_method: CheckoutButtonMethod) => any) | undefined;
|
|
579
|
+
onLoadStateChange?: ((_ready: boolean) => any) | undefined;
|
|
580
|
+
onInitializationStateChange?: ((_state: DirectPayPalInitializationState) => any) | undefined;
|
|
581
|
+
}>, {
|
|
582
|
+
session: CheckoutSession | null;
|
|
583
|
+
nonce: string;
|
|
584
|
+
email: string;
|
|
585
|
+
sessionId: string;
|
|
586
|
+
billingApiUrl: string;
|
|
587
|
+
billingName: string;
|
|
588
|
+
onBuyerIdentityReady: DirectPayPalBuyerIdentityReadyHandler;
|
|
589
|
+
clientId: string;
|
|
590
|
+
environment: GatewayEnvironment;
|
|
591
|
+
currency: string;
|
|
592
|
+
isSubscription: boolean;
|
|
593
|
+
providerObjectType: PayPalProviderObjectType;
|
|
594
|
+
approvalPresentation: PayPalApprovalPresentation;
|
|
595
|
+
existingOrderId: string;
|
|
596
|
+
isProcessing: boolean;
|
|
597
|
+
allowAutomaticRetry: boolean;
|
|
598
|
+
runBeforeButtonClick: DirectPayPalRunBeforeButtonClick;
|
|
599
|
+
onTokenizedBody: DirectPayPalTokenizedHandler;
|
|
600
|
+
onTechnicalFailure: DirectPayPalTechnicalFailureHandler;
|
|
601
|
+
telemetry: boolean;
|
|
602
|
+
debug: boolean;
|
|
603
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
604
|
+
|
|
605
|
+
/**
|
|
606
|
+
* React's `onBeforeButtonClick`: runs before a payment button continues.
|
|
607
|
+
* `false` stops the click; a patch's `account` goes with this attempt.
|
|
608
|
+
*/
|
|
609
|
+
type SplitCardFormBeforeButtonClick = (event: BeforeButtonClickEvent) => undefined | false | InlineSessionPatch | Promise<undefined | false | InlineSessionPatch>;
|
|
610
|
+
/** React's `onBuyerIdentityReady`: awaited after PayPal's approval collects a missing identity. */
|
|
611
|
+
type SplitCardFormBuyerIdentityReady = (identity: NonNullable<InlineSessionPatch['account']>) => void | Promise<void>;
|
|
612
|
+
/**
|
|
613
|
+
* React's `directPaypal`: the direct PayPal gateway. When set it wins over the
|
|
614
|
+
* session's `gateways.paypal`, and PayPal renders through the PayPal JS SDK.
|
|
615
|
+
*/
|
|
616
|
+
interface SplitCardFormDirectPayPal {
|
|
617
|
+
clientId: string;
|
|
618
|
+
/** React's `GatewayEnvironment`: `stage` and `production` are FloPay's aliases. */
|
|
619
|
+
environment?: _flopay_shared.GatewayEnvironment;
|
|
620
|
+
/**
|
|
621
|
+
* @deprecated The session's `gateways.paypal.providerObjectType` wins.
|
|
622
|
+
* Kept as a fallback for integrations that pass no session.
|
|
623
|
+
*/
|
|
624
|
+
providerObjectType?: _flopay_shared.PayPalProviderObjectType;
|
|
625
|
+
/** Backend-advertised non-popup presentation for a one-time PayPal order. */
|
|
626
|
+
approvalPresentation?: _flopay_shared.PayPalApprovalPresentation;
|
|
627
|
+
/** Backend-created PayPal order to resume instead of creating a new one. */
|
|
628
|
+
existingOrderId?: string;
|
|
629
|
+
}
|
|
630
|
+
/** React's `onTokenizedBody` on the form: the host continues the payment from the body. */
|
|
631
|
+
type SplitCardFormTokenizedBodyHandler = (tokenizedBody: TokenizedBody) => void;
|
|
632
|
+
/** Props for {@link SplitCardForm} (React's `SplitCardFormProps`; callbacks are emits). */
|
|
633
|
+
interface SplitCardFormProps {
|
|
634
|
+
session?: CheckoutSession | null;
|
|
635
|
+
sessionId?: string;
|
|
636
|
+
nonce?: string;
|
|
637
|
+
billingApiUrl?: string;
|
|
638
|
+
telemetry?: boolean;
|
|
639
|
+
email?: string;
|
|
640
|
+
firstName?: string;
|
|
641
|
+
lastName?: string;
|
|
642
|
+
layout?: 'default' | 'buttons';
|
|
643
|
+
initialCardOpen?: boolean;
|
|
644
|
+
showPayPal?: boolean;
|
|
645
|
+
/**
|
|
646
|
+
* React's `walletPresentation`: the preferred approval presentation for
|
|
647
|
+
* Stripe-routed PayPal. Defaults to `'auto'` (or the value `FloPayCheckout`
|
|
648
|
+
* hands a custom-layout form). `prefer_redirect` renders PayPal as a
|
|
649
|
+
* full-page redirect tile; an in-app browser or a blocked pop-up does the
|
|
650
|
+
* same whatever the preference, as safety signals stay authoritative.
|
|
651
|
+
*/
|
|
652
|
+
walletPresentation?: WalletPresentation;
|
|
653
|
+
showStripe?: boolean;
|
|
654
|
+
/** @deprecated Session-driven visibility (`enabledPaymentMethods`) decides. */
|
|
655
|
+
showApplePay?: boolean;
|
|
656
|
+
/** @deprecated Session-driven visibility (`enabledPaymentMethods`) decides. */
|
|
657
|
+
showGooglePay?: boolean;
|
|
658
|
+
/** Explicit Stripe method list; `[]` asks for card only. Defaults to the session's. */
|
|
659
|
+
enabledPaymentMethods?: string[];
|
|
660
|
+
/** True while a detached session's catalog is still being attached: payment is gated. */
|
|
661
|
+
dataAttachmentPending?: boolean;
|
|
662
|
+
/**
|
|
663
|
+
* React's `dataAttachmentRequiresIdentity`: the pending claim waits for this
|
|
664
|
+
* form to collect the buyer's identity. The wallets and APMs then stay
|
|
665
|
+
* available so they can collect it, and a non-card click does not wait for
|
|
666
|
+
* the claim first. Card submit stays gated while the claim is pending. A
|
|
667
|
+
* form inside `FloPayCheckout` also reads the checkout's `claimRequiresIdentity`.
|
|
668
|
+
*/
|
|
669
|
+
dataAttachmentRequiresIdentity?: boolean;
|
|
670
|
+
/** Final, localized wording for the hosted card form's submit button. */
|
|
671
|
+
submitLabel?: string | null;
|
|
672
|
+
/** Address verification: `true` (country + postcode) or per-field {@link AVSFieldConfig}. */
|
|
673
|
+
enableAVS?: boolean | AVSFieldConfig;
|
|
674
|
+
/** Layout for AVS fields: `row` (side by side, default) or `column` (stacked). */
|
|
675
|
+
avsLayout?: 'row' | 'column';
|
|
676
|
+
/** Initial AVS country (ISO 3166-1 alpha-2). Defaults to the session customer's. */
|
|
677
|
+
country?: string;
|
|
678
|
+
/** Initial AVS postal code. Defaults to the session customer's. */
|
|
679
|
+
zip?: string;
|
|
680
|
+
/** Initial AVS street address (line 1), e.g. from a GeoIP or profile lookup. */
|
|
681
|
+
addressLine1?: string;
|
|
682
|
+
/** Initial AVS apt / suite / unit (line 2). */
|
|
683
|
+
addressLine2?: string;
|
|
684
|
+
/** Initial AVS city. */
|
|
685
|
+
city?: string;
|
|
686
|
+
/** Initial AVS state / province. */
|
|
687
|
+
state?: string;
|
|
688
|
+
/**
|
|
689
|
+
* External processing state, as React's `isProcessing`: while `true` the
|
|
690
|
+
* AVS fields and the buttons-layout card tile are disabled.
|
|
691
|
+
*/
|
|
692
|
+
isProcessing?: boolean;
|
|
693
|
+
/** External error message. It is shown in place of the form's own (React's `error`). */
|
|
694
|
+
error?: string | null;
|
|
695
|
+
/**
|
|
696
|
+
* Theme bundle for the card tile, the card container, the hosted vault
|
|
697
|
+
* widget and the Stripe methods. `'classic'` (or none) applies no bundle.
|
|
698
|
+
*/
|
|
699
|
+
theme?: ThemeId;
|
|
700
|
+
/** @deprecated Use `theme`. Legacy buttons-layout preset, used only without `theme`. */
|
|
701
|
+
buttonsTheme?: ButtonsLayoutTheme;
|
|
702
|
+
/** Style overrides merged on top of the resolved theme bundle / `buttonsTheme` preset. */
|
|
703
|
+
buttonsStyles?: ButtonsLayoutStyles;
|
|
704
|
+
/** Appearance override; wins over the theme bundle's appearance. */
|
|
705
|
+
appearance?: FloPayAppearance;
|
|
706
|
+
/** Additional CSS class for the form wrapper. */
|
|
707
|
+
className?: string;
|
|
708
|
+
/**
|
|
709
|
+
* Order of the hosted vault card rows, a permutation of
|
|
710
|
+
* `['name', 'number', 'expiry']`. It sets both the visual and the tab order.
|
|
711
|
+
* Omit it for the default order. Vault card path only.
|
|
712
|
+
*/
|
|
713
|
+
cardFieldOrder?: VaultCardFieldKey[];
|
|
714
|
+
/**
|
|
715
|
+
* React's `onBeforeButtonClick` (a function prop: its result is read). It
|
|
716
|
+
* runs before the buttons-layout card tile opens and before PayPal creates
|
|
717
|
+
* its order, with `{ method, sessionId, createSession }`. `false` stops the
|
|
718
|
+
* click, a returned `account` goes with the attempt, and a throw is shown
|
|
719
|
+
* and emitted as a `validation_error`.
|
|
720
|
+
*/
|
|
721
|
+
onBeforeButtonClick?: SplitCardFormBeforeButtonClick;
|
|
722
|
+
/** React's `onBuyerIdentityReady`, passed to the PayPal button (awaited on approval). */
|
|
723
|
+
onBuyerIdentityReady?: SplitCardFormBuyerIdentityReady;
|
|
724
|
+
/**
|
|
725
|
+
* The buyer's user id, sent as `accountData.userId` in the `/account`
|
|
726
|
+
* snapshot (React's `userId`). A before-click `account.userId` wins over it.
|
|
727
|
+
* Without either, `''` is sent, as in React. `FloPayCheckout` passes the
|
|
728
|
+
* session customer's id.
|
|
729
|
+
*/
|
|
730
|
+
userId?: string;
|
|
731
|
+
/**
|
|
732
|
+
* Whether AVS was enabled, sent as `avsCheck` in the `/account` snapshot for
|
|
733
|
+
* analytics (React's `avsCheck`). Omitted from the snapshot when not set.
|
|
734
|
+
* `FloPayCheckout` passes `!!enableAVS`.
|
|
735
|
+
*/
|
|
736
|
+
avsCheck?: boolean;
|
|
737
|
+
/**
|
|
738
|
+
* @deprecated No longer rendered, as in React: the default-layout security
|
|
739
|
+
* footer was removed with the theme bundles. Kept so integrations that pass
|
|
740
|
+
* it still type-check.
|
|
741
|
+
*/
|
|
742
|
+
showSecurityFooter?: boolean;
|
|
743
|
+
/**
|
|
744
|
+
* React's `directPaypal`. When set it wins over the session's
|
|
745
|
+
* `gateways.paypal`. A backend-created `existingOrderId` given at mount is
|
|
746
|
+
* resumed, with React's notice asking the buyer to confirm the payment.
|
|
747
|
+
*/
|
|
748
|
+
directPaypal?: SplitCardFormDirectPayPal;
|
|
749
|
+
/**
|
|
750
|
+
* Currency for PayPal and the Stripe methods (React's `currency`). Default
|
|
751
|
+
* `'usd'`, as in React: the session's currency is not read here, and
|
|
752
|
+
* `FloPayCheckout` passes it for its built-in form.
|
|
753
|
+
*/
|
|
754
|
+
currency?: string;
|
|
755
|
+
/**
|
|
756
|
+
* Whether this is a subscription, for direct PayPal (React's
|
|
757
|
+
* `isSubscription`). Default `false`; `FloPayCheckout` passes the session's mode.
|
|
758
|
+
*/
|
|
759
|
+
isSubscription?: boolean;
|
|
760
|
+
/**
|
|
761
|
+
* React's per-method buyer-country gate
|
|
762
|
+
* (`gateways.stripe.enabledPaymentMethodCountries`): method → allowed
|
|
763
|
+
* ISO 3166-1 alpha-2 countries. Methods other than the wallet row are
|
|
764
|
+
* filtered by the buyer's live country. Without it, the SDK's built-in
|
|
765
|
+
* country table decides.
|
|
766
|
+
*/
|
|
767
|
+
enabledPaymentMethodCountries?: Record<string, string[]>;
|
|
768
|
+
/**
|
|
769
|
+
* React's `debug`: on-screen panels for the PayPal and Stripe gating
|
|
770
|
+
* decisions, and the PayPal button's lifecycle tracer. Off by default.
|
|
771
|
+
*/
|
|
772
|
+
debug?: boolean;
|
|
773
|
+
/**
|
|
774
|
+
* React's `onTokenizedBody` (a function prop: it replaces the SDK's own
|
|
775
|
+
* `/process`). PayPal's approval body goes to the host instead. Without it
|
|
776
|
+
* the form posts `/process` itself, as React's `dispatchTokenizedBody` does.
|
|
777
|
+
*/
|
|
778
|
+
onTokenizedBody?: SplitCardFormTokenizedBodyHandler;
|
|
779
|
+
/** React's `chv`: forwarded as is on the form's own `/process` request. */
|
|
780
|
+
chv?: string;
|
|
781
|
+
/**
|
|
782
|
+
* React's `checkoutType` (`standard_checkout` / `embedded_checkout`), sent
|
|
783
|
+
* as analytics metadata on the form's own `/process` request.
|
|
784
|
+
* `FloPayCheckout` passes it for its built-in form.
|
|
785
|
+
*/
|
|
786
|
+
checkoutType?: string;
|
|
787
|
+
/**
|
|
788
|
+
* React's `checkoutLayout` (`default_layout` / `buttons_layout` /
|
|
789
|
+
* `custom_layout`), sent as analytics metadata on the form's own
|
|
790
|
+
* `/process` request. `FloPayCheckout` passes it for its built-in form.
|
|
791
|
+
*/
|
|
792
|
+
checkoutLayout?: string;
|
|
793
|
+
}
|
|
794
|
+
/**
|
|
795
|
+
* The checkout form: the hosted vault card widget (through the SDK's
|
|
796
|
+
* `cardCapture` adapter — card data never touches Stripe.js here), plus the
|
|
797
|
+
* wallets, APMs and PayPal the session advertises. It renders exactly what
|
|
798
|
+
* the session advertises; with no vault block and nothing else usable it
|
|
799
|
+
* raises `UnsupportedBackendVaultCapability` rather than falling back.
|
|
800
|
+
*
|
|
801
|
+
* Inside a `FloPayCheckout` custom layout it reads the session, nonce and
|
|
802
|
+
* `submitLabel` from the checkout unless it sets them itself.
|
|
803
|
+
*/
|
|
804
|
+
declare const SplitCardForm: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
805
|
+
session: {
|
|
806
|
+
type: PropType<CheckoutSession | null>;
|
|
807
|
+
default: undefined;
|
|
808
|
+
};
|
|
809
|
+
sessionId: {
|
|
810
|
+
type: StringConstructor;
|
|
811
|
+
default: undefined;
|
|
812
|
+
};
|
|
813
|
+
nonce: {
|
|
814
|
+
type: StringConstructor;
|
|
815
|
+
default: undefined;
|
|
816
|
+
};
|
|
817
|
+
billingApiUrl: {
|
|
818
|
+
type: StringConstructor;
|
|
819
|
+
default: undefined;
|
|
820
|
+
};
|
|
821
|
+
telemetry: {
|
|
822
|
+
type: BooleanConstructor;
|
|
823
|
+
default: undefined;
|
|
824
|
+
};
|
|
825
|
+
email: {
|
|
826
|
+
type: StringConstructor;
|
|
827
|
+
default: undefined;
|
|
828
|
+
};
|
|
829
|
+
firstName: {
|
|
830
|
+
type: StringConstructor;
|
|
831
|
+
default: undefined;
|
|
832
|
+
};
|
|
833
|
+
lastName: {
|
|
834
|
+
type: StringConstructor;
|
|
835
|
+
default: undefined;
|
|
836
|
+
};
|
|
837
|
+
layout: {
|
|
838
|
+
type: PropType<"default" | "buttons">;
|
|
839
|
+
default: string;
|
|
840
|
+
};
|
|
841
|
+
initialCardOpen: {
|
|
842
|
+
type: BooleanConstructor;
|
|
843
|
+
default: boolean;
|
|
844
|
+
};
|
|
845
|
+
showPayPal: {
|
|
846
|
+
type: BooleanConstructor;
|
|
847
|
+
default: boolean;
|
|
848
|
+
};
|
|
849
|
+
walletPresentation: {
|
|
850
|
+
type: PropType<WalletPresentation>;
|
|
851
|
+
default: undefined;
|
|
852
|
+
};
|
|
853
|
+
showStripe: {
|
|
854
|
+
type: BooleanConstructor;
|
|
855
|
+
default: boolean;
|
|
856
|
+
};
|
|
857
|
+
showApplePay: {
|
|
858
|
+
type: BooleanConstructor;
|
|
859
|
+
default: boolean;
|
|
860
|
+
};
|
|
861
|
+
showGooglePay: {
|
|
862
|
+
type: BooleanConstructor;
|
|
863
|
+
default: boolean;
|
|
864
|
+
};
|
|
865
|
+
enabledPaymentMethods: {
|
|
866
|
+
type: PropType<string[]>;
|
|
867
|
+
default: undefined;
|
|
868
|
+
};
|
|
869
|
+
dataAttachmentPending: {
|
|
870
|
+
type: BooleanConstructor;
|
|
871
|
+
default: undefined;
|
|
872
|
+
};
|
|
873
|
+
dataAttachmentRequiresIdentity: {
|
|
874
|
+
type: BooleanConstructor;
|
|
875
|
+
default: undefined;
|
|
876
|
+
};
|
|
877
|
+
submitLabel: {
|
|
878
|
+
type: PropType<string | null>;
|
|
879
|
+
default: undefined;
|
|
880
|
+
};
|
|
881
|
+
enableAVS: {
|
|
882
|
+
type: PropType<boolean | AVSFieldConfig>;
|
|
883
|
+
default: undefined;
|
|
884
|
+
};
|
|
885
|
+
avsLayout: {
|
|
886
|
+
type: PropType<"row" | "column">;
|
|
887
|
+
default: string;
|
|
888
|
+
};
|
|
889
|
+
country: {
|
|
890
|
+
type: StringConstructor;
|
|
891
|
+
default: undefined;
|
|
892
|
+
};
|
|
893
|
+
zip: {
|
|
894
|
+
type: StringConstructor;
|
|
895
|
+
default: undefined;
|
|
896
|
+
};
|
|
897
|
+
addressLine1: {
|
|
898
|
+
type: StringConstructor;
|
|
899
|
+
default: undefined;
|
|
900
|
+
};
|
|
901
|
+
addressLine2: {
|
|
902
|
+
type: StringConstructor;
|
|
903
|
+
default: undefined;
|
|
904
|
+
};
|
|
905
|
+
city: {
|
|
906
|
+
type: StringConstructor;
|
|
907
|
+
default: undefined;
|
|
908
|
+
};
|
|
909
|
+
state: {
|
|
910
|
+
type: StringConstructor;
|
|
911
|
+
default: undefined;
|
|
912
|
+
};
|
|
913
|
+
isProcessing: {
|
|
914
|
+
type: BooleanConstructor;
|
|
915
|
+
default: undefined;
|
|
916
|
+
};
|
|
917
|
+
error: {
|
|
918
|
+
type: PropType<string | null>;
|
|
919
|
+
default: undefined;
|
|
920
|
+
};
|
|
921
|
+
theme: {
|
|
922
|
+
type: PropType<ThemeId>;
|
|
923
|
+
default: undefined;
|
|
924
|
+
};
|
|
925
|
+
buttonsTheme: {
|
|
926
|
+
type: PropType<ButtonsLayoutTheme>;
|
|
927
|
+
default: undefined;
|
|
928
|
+
};
|
|
929
|
+
buttonsStyles: {
|
|
930
|
+
type: PropType<ButtonsLayoutStyles>;
|
|
931
|
+
default: undefined;
|
|
932
|
+
};
|
|
933
|
+
appearance: {
|
|
934
|
+
type: PropType<FloPayAppearance>;
|
|
935
|
+
default: undefined;
|
|
936
|
+
};
|
|
937
|
+
className: {
|
|
938
|
+
type: StringConstructor;
|
|
939
|
+
default: undefined;
|
|
940
|
+
};
|
|
941
|
+
cardFieldOrder: {
|
|
942
|
+
type: PropType<VaultCardFieldKey[]>;
|
|
943
|
+
default: undefined;
|
|
944
|
+
};
|
|
945
|
+
onBeforeButtonClick: {
|
|
946
|
+
type: PropType<SplitCardFormBeforeButtonClick>;
|
|
947
|
+
default: undefined;
|
|
948
|
+
};
|
|
949
|
+
onBuyerIdentityReady: {
|
|
950
|
+
type: PropType<SplitCardFormBuyerIdentityReady>;
|
|
951
|
+
default: undefined;
|
|
952
|
+
};
|
|
953
|
+
userId: {
|
|
954
|
+
type: StringConstructor;
|
|
955
|
+
default: undefined;
|
|
956
|
+
};
|
|
957
|
+
avsCheck: {
|
|
958
|
+
type: BooleanConstructor;
|
|
959
|
+
default: undefined;
|
|
960
|
+
};
|
|
961
|
+
/** @deprecated Not rendered (React's deprecated `showSecurityFooter`). */
|
|
962
|
+
showSecurityFooter: {
|
|
963
|
+
type: BooleanConstructor;
|
|
964
|
+
default: undefined;
|
|
965
|
+
};
|
|
966
|
+
directPaypal: {
|
|
967
|
+
type: PropType<SplitCardFormDirectPayPal>;
|
|
968
|
+
default: undefined;
|
|
969
|
+
};
|
|
970
|
+
currency: {
|
|
971
|
+
type: StringConstructor;
|
|
972
|
+
default: undefined;
|
|
973
|
+
};
|
|
974
|
+
isSubscription: {
|
|
975
|
+
type: BooleanConstructor;
|
|
976
|
+
default: undefined;
|
|
977
|
+
};
|
|
978
|
+
/**
|
|
979
|
+
* React's `totalAmount`: the cart total due today, in minor units
|
|
980
|
+
* (`FloPayCheckout` passes it). Payment-mode Stripe Elements use
|
|
981
|
+
* `totalAmount || 100` (React's `amountInCents` placeholder for a $0 cart),
|
|
982
|
+
* and the wallet row runs in setup mode for $0. Default `0`, as React's.
|
|
983
|
+
*/
|
|
984
|
+
totalAmount: {
|
|
985
|
+
type: NumberConstructor;
|
|
986
|
+
default: number;
|
|
987
|
+
};
|
|
988
|
+
onTokenizedBody: {
|
|
989
|
+
type: PropType<SplitCardFormTokenizedBodyHandler>;
|
|
990
|
+
default: undefined;
|
|
991
|
+
};
|
|
992
|
+
chv: {
|
|
993
|
+
type: StringConstructor;
|
|
994
|
+
default: undefined;
|
|
995
|
+
};
|
|
996
|
+
checkoutType: {
|
|
997
|
+
type: StringConstructor;
|
|
998
|
+
default: undefined;
|
|
999
|
+
};
|
|
1000
|
+
checkoutLayout: {
|
|
1001
|
+
type: StringConstructor;
|
|
1002
|
+
default: undefined;
|
|
1003
|
+
};
|
|
1004
|
+
enabledPaymentMethodCountries: {
|
|
1005
|
+
type: PropType<Record<string, string[]>>;
|
|
1006
|
+
default: undefined;
|
|
1007
|
+
};
|
|
1008
|
+
debug: {
|
|
1009
|
+
type: BooleanConstructor;
|
|
1010
|
+
default: boolean;
|
|
1011
|
+
};
|
|
1012
|
+
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
1013
|
+
[key: string]: any;
|
|
1014
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
1015
|
+
complete: (_result: PaymentResult) => true;
|
|
1016
|
+
error: (_error: FloPayError) => true;
|
|
1017
|
+
decline: (_decline: DeclineEvent) => true;
|
|
1018
|
+
buttonClick: (_method: CheckoutButtonMethod) => true;
|
|
1019
|
+
countryChange: (_country: string) => true;
|
|
1020
|
+
zipChange: (_zip: string) => true;
|
|
1021
|
+
errorChange: (_error: string | null) => true;
|
|
1022
|
+
}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1023
|
+
session: {
|
|
1024
|
+
type: PropType<CheckoutSession | null>;
|
|
1025
|
+
default: undefined;
|
|
1026
|
+
};
|
|
1027
|
+
sessionId: {
|
|
1028
|
+
type: StringConstructor;
|
|
1029
|
+
default: undefined;
|
|
1030
|
+
};
|
|
1031
|
+
nonce: {
|
|
1032
|
+
type: StringConstructor;
|
|
1033
|
+
default: undefined;
|
|
1034
|
+
};
|
|
1035
|
+
billingApiUrl: {
|
|
1036
|
+
type: StringConstructor;
|
|
1037
|
+
default: undefined;
|
|
1038
|
+
};
|
|
1039
|
+
telemetry: {
|
|
1040
|
+
type: BooleanConstructor;
|
|
1041
|
+
default: undefined;
|
|
1042
|
+
};
|
|
1043
|
+
email: {
|
|
1044
|
+
type: StringConstructor;
|
|
1045
|
+
default: undefined;
|
|
1046
|
+
};
|
|
1047
|
+
firstName: {
|
|
1048
|
+
type: StringConstructor;
|
|
1049
|
+
default: undefined;
|
|
1050
|
+
};
|
|
1051
|
+
lastName: {
|
|
1052
|
+
type: StringConstructor;
|
|
1053
|
+
default: undefined;
|
|
1054
|
+
};
|
|
1055
|
+
layout: {
|
|
1056
|
+
type: PropType<"default" | "buttons">;
|
|
1057
|
+
default: string;
|
|
1058
|
+
};
|
|
1059
|
+
initialCardOpen: {
|
|
1060
|
+
type: BooleanConstructor;
|
|
1061
|
+
default: boolean;
|
|
1062
|
+
};
|
|
1063
|
+
showPayPal: {
|
|
1064
|
+
type: BooleanConstructor;
|
|
1065
|
+
default: boolean;
|
|
1066
|
+
};
|
|
1067
|
+
walletPresentation: {
|
|
1068
|
+
type: PropType<WalletPresentation>;
|
|
1069
|
+
default: undefined;
|
|
1070
|
+
};
|
|
1071
|
+
showStripe: {
|
|
1072
|
+
type: BooleanConstructor;
|
|
1073
|
+
default: boolean;
|
|
1074
|
+
};
|
|
1075
|
+
showApplePay: {
|
|
1076
|
+
type: BooleanConstructor;
|
|
1077
|
+
default: boolean;
|
|
1078
|
+
};
|
|
1079
|
+
showGooglePay: {
|
|
1080
|
+
type: BooleanConstructor;
|
|
1081
|
+
default: boolean;
|
|
1082
|
+
};
|
|
1083
|
+
enabledPaymentMethods: {
|
|
1084
|
+
type: PropType<string[]>;
|
|
1085
|
+
default: undefined;
|
|
1086
|
+
};
|
|
1087
|
+
dataAttachmentPending: {
|
|
1088
|
+
type: BooleanConstructor;
|
|
1089
|
+
default: undefined;
|
|
1090
|
+
};
|
|
1091
|
+
dataAttachmentRequiresIdentity: {
|
|
1092
|
+
type: BooleanConstructor;
|
|
1093
|
+
default: undefined;
|
|
1094
|
+
};
|
|
1095
|
+
submitLabel: {
|
|
1096
|
+
type: PropType<string | null>;
|
|
1097
|
+
default: undefined;
|
|
1098
|
+
};
|
|
1099
|
+
enableAVS: {
|
|
1100
|
+
type: PropType<boolean | AVSFieldConfig>;
|
|
1101
|
+
default: undefined;
|
|
1102
|
+
};
|
|
1103
|
+
avsLayout: {
|
|
1104
|
+
type: PropType<"row" | "column">;
|
|
1105
|
+
default: string;
|
|
1106
|
+
};
|
|
1107
|
+
country: {
|
|
1108
|
+
type: StringConstructor;
|
|
1109
|
+
default: undefined;
|
|
1110
|
+
};
|
|
1111
|
+
zip: {
|
|
1112
|
+
type: StringConstructor;
|
|
1113
|
+
default: undefined;
|
|
1114
|
+
};
|
|
1115
|
+
addressLine1: {
|
|
1116
|
+
type: StringConstructor;
|
|
1117
|
+
default: undefined;
|
|
1118
|
+
};
|
|
1119
|
+
addressLine2: {
|
|
1120
|
+
type: StringConstructor;
|
|
1121
|
+
default: undefined;
|
|
1122
|
+
};
|
|
1123
|
+
city: {
|
|
1124
|
+
type: StringConstructor;
|
|
1125
|
+
default: undefined;
|
|
1126
|
+
};
|
|
1127
|
+
state: {
|
|
1128
|
+
type: StringConstructor;
|
|
1129
|
+
default: undefined;
|
|
1130
|
+
};
|
|
1131
|
+
isProcessing: {
|
|
1132
|
+
type: BooleanConstructor;
|
|
1133
|
+
default: undefined;
|
|
1134
|
+
};
|
|
1135
|
+
error: {
|
|
1136
|
+
type: PropType<string | null>;
|
|
1137
|
+
default: undefined;
|
|
1138
|
+
};
|
|
1139
|
+
theme: {
|
|
1140
|
+
type: PropType<ThemeId>;
|
|
1141
|
+
default: undefined;
|
|
1142
|
+
};
|
|
1143
|
+
buttonsTheme: {
|
|
1144
|
+
type: PropType<ButtonsLayoutTheme>;
|
|
1145
|
+
default: undefined;
|
|
1146
|
+
};
|
|
1147
|
+
buttonsStyles: {
|
|
1148
|
+
type: PropType<ButtonsLayoutStyles>;
|
|
1149
|
+
default: undefined;
|
|
1150
|
+
};
|
|
1151
|
+
appearance: {
|
|
1152
|
+
type: PropType<FloPayAppearance>;
|
|
1153
|
+
default: undefined;
|
|
1154
|
+
};
|
|
1155
|
+
className: {
|
|
1156
|
+
type: StringConstructor;
|
|
1157
|
+
default: undefined;
|
|
1158
|
+
};
|
|
1159
|
+
cardFieldOrder: {
|
|
1160
|
+
type: PropType<VaultCardFieldKey[]>;
|
|
1161
|
+
default: undefined;
|
|
1162
|
+
};
|
|
1163
|
+
onBeforeButtonClick: {
|
|
1164
|
+
type: PropType<SplitCardFormBeforeButtonClick>;
|
|
1165
|
+
default: undefined;
|
|
1166
|
+
};
|
|
1167
|
+
onBuyerIdentityReady: {
|
|
1168
|
+
type: PropType<SplitCardFormBuyerIdentityReady>;
|
|
1169
|
+
default: undefined;
|
|
1170
|
+
};
|
|
1171
|
+
userId: {
|
|
1172
|
+
type: StringConstructor;
|
|
1173
|
+
default: undefined;
|
|
1174
|
+
};
|
|
1175
|
+
avsCheck: {
|
|
1176
|
+
type: BooleanConstructor;
|
|
1177
|
+
default: undefined;
|
|
1178
|
+
};
|
|
1179
|
+
/** @deprecated Not rendered (React's deprecated `showSecurityFooter`). */
|
|
1180
|
+
showSecurityFooter: {
|
|
1181
|
+
type: BooleanConstructor;
|
|
1182
|
+
default: undefined;
|
|
1183
|
+
};
|
|
1184
|
+
directPaypal: {
|
|
1185
|
+
type: PropType<SplitCardFormDirectPayPal>;
|
|
1186
|
+
default: undefined;
|
|
1187
|
+
};
|
|
1188
|
+
currency: {
|
|
1189
|
+
type: StringConstructor;
|
|
1190
|
+
default: undefined;
|
|
1191
|
+
};
|
|
1192
|
+
isSubscription: {
|
|
1193
|
+
type: BooleanConstructor;
|
|
1194
|
+
default: undefined;
|
|
1195
|
+
};
|
|
1196
|
+
/**
|
|
1197
|
+
* React's `totalAmount`: the cart total due today, in minor units
|
|
1198
|
+
* (`FloPayCheckout` passes it). Payment-mode Stripe Elements use
|
|
1199
|
+
* `totalAmount || 100` (React's `amountInCents` placeholder for a $0 cart),
|
|
1200
|
+
* and the wallet row runs in setup mode for $0. Default `0`, as React's.
|
|
1201
|
+
*/
|
|
1202
|
+
totalAmount: {
|
|
1203
|
+
type: NumberConstructor;
|
|
1204
|
+
default: number;
|
|
1205
|
+
};
|
|
1206
|
+
onTokenizedBody: {
|
|
1207
|
+
type: PropType<SplitCardFormTokenizedBodyHandler>;
|
|
1208
|
+
default: undefined;
|
|
1209
|
+
};
|
|
1210
|
+
chv: {
|
|
1211
|
+
type: StringConstructor;
|
|
1212
|
+
default: undefined;
|
|
1213
|
+
};
|
|
1214
|
+
checkoutType: {
|
|
1215
|
+
type: StringConstructor;
|
|
1216
|
+
default: undefined;
|
|
1217
|
+
};
|
|
1218
|
+
checkoutLayout: {
|
|
1219
|
+
type: StringConstructor;
|
|
1220
|
+
default: undefined;
|
|
1221
|
+
};
|
|
1222
|
+
enabledPaymentMethodCountries: {
|
|
1223
|
+
type: PropType<Record<string, string[]>>;
|
|
1224
|
+
default: undefined;
|
|
1225
|
+
};
|
|
1226
|
+
debug: {
|
|
1227
|
+
type: BooleanConstructor;
|
|
1228
|
+
default: boolean;
|
|
1229
|
+
};
|
|
1230
|
+
}>> & Readonly<{
|
|
1231
|
+
onComplete?: ((_result: PaymentResult) => any) | undefined;
|
|
1232
|
+
onError?: ((_error: FloPayError) => any) | undefined;
|
|
1233
|
+
onDecline?: ((_decline: DeclineEvent) => any) | undefined;
|
|
1234
|
+
onErrorChange?: ((_error: string | null) => any) | undefined;
|
|
1235
|
+
onButtonClick?: ((_method: CheckoutButtonMethod) => any) | undefined;
|
|
1236
|
+
onCountryChange?: ((_country: string) => any) | undefined;
|
|
1237
|
+
onZipChange?: ((_zip: string) => any) | undefined;
|
|
1238
|
+
}>, {
|
|
1239
|
+
layout: "default" | "buttons";
|
|
1240
|
+
session: CheckoutSession | null;
|
|
1241
|
+
nonce: string;
|
|
1242
|
+
email: string;
|
|
1243
|
+
firstName: string;
|
|
1244
|
+
lastName: string;
|
|
1245
|
+
city: string;
|
|
1246
|
+
state: string;
|
|
1247
|
+
country: string;
|
|
1248
|
+
zip: string;
|
|
1249
|
+
userId: string;
|
|
1250
|
+
addressLine1: string;
|
|
1251
|
+
addressLine2: string;
|
|
1252
|
+
error: string | null;
|
|
1253
|
+
sessionId: string;
|
|
1254
|
+
billingApiUrl: string;
|
|
1255
|
+
onBuyerIdentityReady: SplitCardFormBuyerIdentityReady;
|
|
1256
|
+
currency: string;
|
|
1257
|
+
isSubscription: boolean;
|
|
1258
|
+
isProcessing: boolean;
|
|
1259
|
+
onTokenizedBody: SplitCardFormTokenizedBodyHandler;
|
|
1260
|
+
telemetry: boolean;
|
|
1261
|
+
debug: boolean;
|
|
1262
|
+
totalAmount: number;
|
|
1263
|
+
appearance: FloPayAppearance;
|
|
1264
|
+
theme: ThemeId;
|
|
1265
|
+
submitLabel: string | null;
|
|
1266
|
+
initialCardOpen: boolean;
|
|
1267
|
+
showPayPal: boolean;
|
|
1268
|
+
walletPresentation: WalletPresentation;
|
|
1269
|
+
showStripe: boolean;
|
|
1270
|
+
showApplePay: boolean;
|
|
1271
|
+
showGooglePay: boolean;
|
|
1272
|
+
enabledPaymentMethods: string[];
|
|
1273
|
+
dataAttachmentPending: boolean;
|
|
1274
|
+
dataAttachmentRequiresIdentity: boolean;
|
|
1275
|
+
enableAVS: boolean | AVSFieldConfig;
|
|
1276
|
+
avsLayout: "column" | "row";
|
|
1277
|
+
buttonsTheme: ButtonsLayoutTheme;
|
|
1278
|
+
buttonsStyles: ButtonsLayoutStyles;
|
|
1279
|
+
className: string;
|
|
1280
|
+
cardFieldOrder: VaultCardFieldKey[];
|
|
1281
|
+
onBeforeButtonClick: SplitCardFormBeforeButtonClick;
|
|
1282
|
+
avsCheck: boolean;
|
|
1283
|
+
showSecurityFooter: boolean;
|
|
1284
|
+
directPaypal: SplitCardFormDirectPayPal;
|
|
1285
|
+
chv: string;
|
|
1286
|
+
checkoutType: string;
|
|
1287
|
+
checkoutLayout: string;
|
|
1288
|
+
enabledPaymentMethodCountries: Record<string, string[]>;
|
|
1289
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1290
|
+
|
|
1291
|
+
/** Props for {@link FloPayCheckout} (React's `FloPayCheckoutProps`; callbacks are emits). */
|
|
1292
|
+
interface FloPayCheckoutProps {
|
|
1293
|
+
/** An existing checkout session id (with its `nonce`). */
|
|
1294
|
+
sessionId?: string;
|
|
1295
|
+
/** Session-bound checkout token returned with {@link FloPayCheckoutProps.sessionId}. */
|
|
1296
|
+
nonce?: string;
|
|
1297
|
+
/** Inline session draft: the checkout creates the session itself. */
|
|
1298
|
+
createSession?: InlineSessionDraft;
|
|
1299
|
+
billingApiUrl?: string;
|
|
1300
|
+
telemetry?: boolean;
|
|
1301
|
+
locale?: string;
|
|
1302
|
+
layout?: 'default' | 'buttons';
|
|
1303
|
+
showPayPal?: boolean;
|
|
1304
|
+
showStripe?: boolean;
|
|
1305
|
+
/** Explicit Stripe method list (`[]` = card only); defaults to the session's. */
|
|
1306
|
+
enabledPaymentMethods?: string[];
|
|
1307
|
+
/** @deprecated Session-driven visibility (`enabledPaymentMethods`) decides. */
|
|
1308
|
+
showApplePay?: boolean;
|
|
1309
|
+
/** @deprecated Session-driven visibility (`enabledPaymentMethods`) decides. */
|
|
1310
|
+
showGooglePay?: boolean;
|
|
1311
|
+
/**
|
|
1312
|
+
* Theme bundle (`'classic'`, `'modern-light'`, `'modern-dark'`, `'bold-light'`,
|
|
1313
|
+
* `'bold-dark'`, `'glass-light'`, `'glass-dark'`) for the card form, the
|
|
1314
|
+
* hosted vault widget and the Stripe methods. Explicit `appearance` /
|
|
1315
|
+
* `buttonsStyles` still override their halves.
|
|
1316
|
+
*/
|
|
1317
|
+
theme?: ThemeId;
|
|
1318
|
+
/** Visual appearance for the payment elements; wins over the theme bundle's. */
|
|
1319
|
+
appearance?: FloPayAppearance;
|
|
1320
|
+
/** @deprecated Use `theme`. Legacy buttons-layout preset, used only without `theme`. */
|
|
1321
|
+
buttonsTheme?: ButtonsLayoutTheme;
|
|
1322
|
+
/** Style overrides merged on top of the resolved theme bundle / `buttonsTheme` preset. */
|
|
1323
|
+
buttonsStyles?: ButtonsLayoutStyles;
|
|
1324
|
+
/** Additional CSS class for the form wrapper. */
|
|
1325
|
+
className?: string;
|
|
1326
|
+
/** Final, localized wording for the hosted card form's submit button. */
|
|
1327
|
+
submitLabel?: string | null;
|
|
1328
|
+
/** Address verification: `true` (country + postcode) or per-field {@link AVSFieldConfig}. */
|
|
1329
|
+
enableAVS?: boolean | AVSFieldConfig;
|
|
1330
|
+
/** Layout for AVS fields: `row` (side by side, default) or `column` (stacked). */
|
|
1331
|
+
avsLayout?: 'row' | 'column';
|
|
1332
|
+
/**
|
|
1333
|
+
* Order of the hosted vault card rows, a permutation of
|
|
1334
|
+
* `['name', 'number', 'expiry']` (visual and tab order). Vault card path only.
|
|
1335
|
+
*/
|
|
1336
|
+
cardFieldOrder?: VaultCardFieldKey[];
|
|
1337
|
+
/**
|
|
1338
|
+
* @deprecated Not rendered, as in React: the default-layout security footer
|
|
1339
|
+
* was removed. Accepted so integrations ported from React keep compiling.
|
|
1340
|
+
*/
|
|
1341
|
+
showSecurityFooter?: boolean;
|
|
1342
|
+
/**
|
|
1343
|
+
* @deprecated Ignored, as in React: the Stripe publishable key comes only
|
|
1344
|
+
* from the session's `gateways.stripe.publishableKey`.
|
|
1345
|
+
*/
|
|
1346
|
+
fallbackPublishableKey?: string;
|
|
1347
|
+
/**
|
|
1348
|
+
* Override the session's `checkoutMode`: `'full'` shows the payment form
|
|
1349
|
+
* (default), `'confirm'` a confirm button that charges the saved payment
|
|
1350
|
+
* method, `'auto'` charges it on mount and falls back to `'full'` on failure.
|
|
1351
|
+
*/
|
|
1352
|
+
checkoutMode?: CheckoutMode;
|
|
1353
|
+
/**
|
|
1354
|
+
* Label for the saved-payment confirm button in `confirm` mode. Default:
|
|
1355
|
+
* `'Confirm Purchase'`. The hosted card button uses `submitLabel` instead.
|
|
1356
|
+
* React's `renderConfirmButton` is the `renderConfirmButton` slot, which
|
|
1357
|
+
* receives `{ onConfirm, isProcessing }`.
|
|
1358
|
+
*/
|
|
1359
|
+
confirmLabel?: string;
|
|
1360
|
+
/**
|
|
1361
|
+
* Seed a checkout error message: shown above the confirm button or the
|
|
1362
|
+
* payment form until the buyer's next attempt.
|
|
1363
|
+
*/
|
|
1364
|
+
initialErrorMessage?: string | null;
|
|
1365
|
+
/**
|
|
1366
|
+
* React's `initialPayPalOrderId`: a backend-created PayPal order to resume
|
|
1367
|
+
* instead of creating a new one. It goes to the built-in form's
|
|
1368
|
+
* `directPaypal.existingOrderId`.
|
|
1369
|
+
*/
|
|
1370
|
+
initialPayPalOrderId?: string;
|
|
1371
|
+
/** React's `debug`: the built-in form's gating panels and PayPal tracer. Off by default. */
|
|
1372
|
+
debug?: boolean;
|
|
1373
|
+
}
|
|
1374
|
+
/**
|
|
1375
|
+
* The all-in-one checkout. Given `createSession`, an inline full-mode session
|
|
1376
|
+
* is created detached (`deferDataAttachment: true`): the hosted card form
|
|
1377
|
+
* mounts from the shell while the catalog is attached by a background claim,
|
|
1378
|
+
* and payment is gated only until that claim settles. `deferDataAttachment:
|
|
1379
|
+
* false` keeps the one-shot create. It renders exactly the methods the
|
|
1380
|
+
* session advertises and sends no gateway hint or provider selection.
|
|
1381
|
+
*
|
|
1382
|
+
* Slots: `default` renders inside the checkout context (alongside the form);
|
|
1383
|
+
* `layout` replaces the built-in `SplitCardForm` with a custom layout, whose
|
|
1384
|
+
* `SplitCardForm` receives the session, nonce and `submitLabel` unless it
|
|
1385
|
+
* sets them itself. `cardButtonContent`, `cardBackButtonContent`,
|
|
1386
|
+
* `cardTitleContent` and `cardPreFormSlot` (React's content props) pass to
|
|
1387
|
+
* the built-in `SplitCardForm`. `renderConfirmButton` (React's render prop)
|
|
1388
|
+
* replaces the `confirm`-mode button and receives `{ onConfirm, isProcessing }`.
|
|
1389
|
+
*
|
|
1390
|
+
* Modes (React's): `full` renders the payment form; `confirm` renders a
|
|
1391
|
+
* confirm button that charges the buyer's saved payment method; `auto`
|
|
1392
|
+
* charges it on mount. A failed saved payment shows its error and falls back
|
|
1393
|
+
* to `full`. A session that is already paid emits `sessionCompleted` with its
|
|
1394
|
+
* success URL (an authorized one also `complete`) and renders no form.
|
|
1395
|
+
*/
|
|
1396
|
+
declare const FloPayCheckout: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
1397
|
+
sessionId: {
|
|
1398
|
+
type: StringConstructor;
|
|
1399
|
+
default: undefined;
|
|
1400
|
+
};
|
|
1401
|
+
nonce: {
|
|
1402
|
+
type: StringConstructor;
|
|
1403
|
+
default: undefined;
|
|
1404
|
+
};
|
|
1405
|
+
createSession: {
|
|
1406
|
+
type: PropType<InlineSessionDraft>;
|
|
1407
|
+
default: undefined;
|
|
1408
|
+
};
|
|
1409
|
+
checkoutMode: {
|
|
1410
|
+
type: PropType<CheckoutMode>;
|
|
1411
|
+
default: undefined;
|
|
1412
|
+
};
|
|
1413
|
+
billingApiUrl: {
|
|
1414
|
+
type: StringConstructor;
|
|
1415
|
+
default: undefined;
|
|
1416
|
+
};
|
|
1417
|
+
telemetry: {
|
|
1418
|
+
type: BooleanConstructor;
|
|
1419
|
+
default: undefined;
|
|
1420
|
+
};
|
|
1421
|
+
locale: {
|
|
1422
|
+
type: StringConstructor;
|
|
1423
|
+
default: undefined;
|
|
1424
|
+
};
|
|
1425
|
+
layout: {
|
|
1426
|
+
type: PropType<"default" | "buttons">;
|
|
1427
|
+
default: string;
|
|
1428
|
+
};
|
|
1429
|
+
/**
|
|
1430
|
+
* React's `walletPresentation` (default `'auto'`): the preferred approval
|
|
1431
|
+
* presentation for Stripe-routed PayPal, passed to the built-in form and
|
|
1432
|
+
* to a custom-layout form that leaves its own unset.
|
|
1433
|
+
*/
|
|
1434
|
+
walletPresentation: {
|
|
1435
|
+
type: PropType<WalletPresentation>;
|
|
1436
|
+
default: string;
|
|
1437
|
+
};
|
|
1438
|
+
showPayPal: {
|
|
1439
|
+
type: BooleanConstructor;
|
|
1440
|
+
default: boolean;
|
|
1441
|
+
};
|
|
1442
|
+
showStripe: {
|
|
1443
|
+
type: BooleanConstructor;
|
|
1444
|
+
default: boolean;
|
|
1445
|
+
};
|
|
1446
|
+
enabledPaymentMethods: {
|
|
1447
|
+
type: PropType<string[]>;
|
|
1448
|
+
default: undefined;
|
|
1449
|
+
};
|
|
1450
|
+
/** @deprecated Session-driven visibility decides (React parity). */
|
|
1451
|
+
showApplePay: {
|
|
1452
|
+
type: BooleanConstructor;
|
|
1453
|
+
default: boolean;
|
|
1454
|
+
};
|
|
1455
|
+
/** @deprecated Session-driven visibility decides (React parity). */
|
|
1456
|
+
showGooglePay: {
|
|
1457
|
+
type: BooleanConstructor;
|
|
1458
|
+
default: boolean;
|
|
1459
|
+
};
|
|
1460
|
+
theme: {
|
|
1461
|
+
type: PropType<ThemeId>;
|
|
1462
|
+
default: undefined;
|
|
1463
|
+
};
|
|
1464
|
+
appearance: {
|
|
1465
|
+
type: PropType<FloPayAppearance>;
|
|
1466
|
+
default: undefined;
|
|
1467
|
+
};
|
|
1468
|
+
buttonsTheme: {
|
|
1469
|
+
type: PropType<ButtonsLayoutTheme>;
|
|
1470
|
+
default: undefined;
|
|
1471
|
+
};
|
|
1472
|
+
buttonsStyles: {
|
|
1473
|
+
type: PropType<ButtonsLayoutStyles>;
|
|
1474
|
+
default: undefined;
|
|
1475
|
+
};
|
|
1476
|
+
className: {
|
|
1477
|
+
type: StringConstructor;
|
|
1478
|
+
default: undefined;
|
|
1479
|
+
};
|
|
1480
|
+
submitLabel: {
|
|
1481
|
+
type: PropType<string | null>;
|
|
1482
|
+
default: undefined;
|
|
1483
|
+
};
|
|
1484
|
+
enableAVS: {
|
|
1485
|
+
type: PropType<boolean | AVSFieldConfig>;
|
|
1486
|
+
default: undefined;
|
|
1487
|
+
};
|
|
1488
|
+
avsLayout: {
|
|
1489
|
+
type: PropType<"row" | "column">;
|
|
1490
|
+
default: undefined;
|
|
1491
|
+
};
|
|
1492
|
+
cardFieldOrder: {
|
|
1493
|
+
type: PropType<VaultCardFieldKey[]>;
|
|
1494
|
+
default: undefined;
|
|
1495
|
+
};
|
|
1496
|
+
/** @deprecated Not rendered (React parity); see {@link FloPayCheckoutProps.showSecurityFooter}. */
|
|
1497
|
+
showSecurityFooter: {
|
|
1498
|
+
type: BooleanConstructor;
|
|
1499
|
+
default: undefined;
|
|
1500
|
+
};
|
|
1501
|
+
/** @deprecated Ignored (React parity); see {@link FloPayCheckoutProps.fallbackPublishableKey}. */
|
|
1502
|
+
fallbackPublishableKey: {
|
|
1503
|
+
type: StringConstructor;
|
|
1504
|
+
default: undefined;
|
|
1505
|
+
};
|
|
1506
|
+
confirmLabel: {
|
|
1507
|
+
type: StringConstructor;
|
|
1508
|
+
default: undefined;
|
|
1509
|
+
};
|
|
1510
|
+
initialErrorMessage: {
|
|
1511
|
+
type: PropType<string | null>;
|
|
1512
|
+
default: null;
|
|
1513
|
+
};
|
|
1514
|
+
/**
|
|
1515
|
+
* React's `onBeforeButtonClick` (a function prop: its result is read),
|
|
1516
|
+
* passed to the built-in `SplitCardForm`. It runs before the buttons-layout
|
|
1517
|
+
* card tile opens and before PayPal creates its order.
|
|
1518
|
+
*/
|
|
1519
|
+
onBeforeButtonClick: {
|
|
1520
|
+
type: PropType<SplitCardFormBeforeButtonClick>;
|
|
1521
|
+
default: undefined;
|
|
1522
|
+
};
|
|
1523
|
+
initialPayPalOrderId: {
|
|
1524
|
+
type: StringConstructor;
|
|
1525
|
+
default: undefined;
|
|
1526
|
+
};
|
|
1527
|
+
debug: {
|
|
1528
|
+
type: BooleanConstructor;
|
|
1529
|
+
default: boolean;
|
|
1530
|
+
};
|
|
1531
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1532
|
+
[key: string]: any;
|
|
1533
|
+
}> | vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1534
|
+
[key: string]: any;
|
|
1535
|
+
}>[] | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
1536
|
+
complete: (_result: PaymentResult) => true;
|
|
1537
|
+
error: (_error: FloPayError) => true;
|
|
1538
|
+
instrument: (_event: FloInstrumentEvent) => true;
|
|
1539
|
+
decline: (_decline: DeclineEvent) => true;
|
|
1540
|
+
buttonClick: (_method: CheckoutButtonMethod) => true;
|
|
1541
|
+
countryChange: (_country: string) => true;
|
|
1542
|
+
zipChange: (_zip: string) => true;
|
|
1543
|
+
sessionCompleted: (_successUrl: string) => true;
|
|
1544
|
+
}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1545
|
+
sessionId: {
|
|
1546
|
+
type: StringConstructor;
|
|
1547
|
+
default: undefined;
|
|
1548
|
+
};
|
|
1549
|
+
nonce: {
|
|
1550
|
+
type: StringConstructor;
|
|
1551
|
+
default: undefined;
|
|
1552
|
+
};
|
|
1553
|
+
createSession: {
|
|
1554
|
+
type: PropType<InlineSessionDraft>;
|
|
1555
|
+
default: undefined;
|
|
1556
|
+
};
|
|
1557
|
+
checkoutMode: {
|
|
1558
|
+
type: PropType<CheckoutMode>;
|
|
1559
|
+
default: undefined;
|
|
1560
|
+
};
|
|
1561
|
+
billingApiUrl: {
|
|
1562
|
+
type: StringConstructor;
|
|
1563
|
+
default: undefined;
|
|
1564
|
+
};
|
|
1565
|
+
telemetry: {
|
|
1566
|
+
type: BooleanConstructor;
|
|
1567
|
+
default: undefined;
|
|
1568
|
+
};
|
|
1569
|
+
locale: {
|
|
1570
|
+
type: StringConstructor;
|
|
1571
|
+
default: undefined;
|
|
1572
|
+
};
|
|
1573
|
+
layout: {
|
|
1574
|
+
type: PropType<"default" | "buttons">;
|
|
1575
|
+
default: string;
|
|
1576
|
+
};
|
|
1577
|
+
/**
|
|
1578
|
+
* React's `walletPresentation` (default `'auto'`): the preferred approval
|
|
1579
|
+
* presentation for Stripe-routed PayPal, passed to the built-in form and
|
|
1580
|
+
* to a custom-layout form that leaves its own unset.
|
|
1581
|
+
*/
|
|
1582
|
+
walletPresentation: {
|
|
1583
|
+
type: PropType<WalletPresentation>;
|
|
1584
|
+
default: string;
|
|
1585
|
+
};
|
|
1586
|
+
showPayPal: {
|
|
1587
|
+
type: BooleanConstructor;
|
|
1588
|
+
default: boolean;
|
|
1589
|
+
};
|
|
1590
|
+
showStripe: {
|
|
1591
|
+
type: BooleanConstructor;
|
|
1592
|
+
default: boolean;
|
|
1593
|
+
};
|
|
1594
|
+
enabledPaymentMethods: {
|
|
1595
|
+
type: PropType<string[]>;
|
|
1596
|
+
default: undefined;
|
|
1597
|
+
};
|
|
1598
|
+
/** @deprecated Session-driven visibility decides (React parity). */
|
|
1599
|
+
showApplePay: {
|
|
1600
|
+
type: BooleanConstructor;
|
|
1601
|
+
default: boolean;
|
|
1602
|
+
};
|
|
1603
|
+
/** @deprecated Session-driven visibility decides (React parity). */
|
|
1604
|
+
showGooglePay: {
|
|
1605
|
+
type: BooleanConstructor;
|
|
1606
|
+
default: boolean;
|
|
1607
|
+
};
|
|
1608
|
+
theme: {
|
|
1609
|
+
type: PropType<ThemeId>;
|
|
1610
|
+
default: undefined;
|
|
1611
|
+
};
|
|
1612
|
+
appearance: {
|
|
1613
|
+
type: PropType<FloPayAppearance>;
|
|
1614
|
+
default: undefined;
|
|
1615
|
+
};
|
|
1616
|
+
buttonsTheme: {
|
|
1617
|
+
type: PropType<ButtonsLayoutTheme>;
|
|
1618
|
+
default: undefined;
|
|
1619
|
+
};
|
|
1620
|
+
buttonsStyles: {
|
|
1621
|
+
type: PropType<ButtonsLayoutStyles>;
|
|
1622
|
+
default: undefined;
|
|
1623
|
+
};
|
|
1624
|
+
className: {
|
|
1625
|
+
type: StringConstructor;
|
|
1626
|
+
default: undefined;
|
|
1627
|
+
};
|
|
1628
|
+
submitLabel: {
|
|
1629
|
+
type: PropType<string | null>;
|
|
1630
|
+
default: undefined;
|
|
1631
|
+
};
|
|
1632
|
+
enableAVS: {
|
|
1633
|
+
type: PropType<boolean | AVSFieldConfig>;
|
|
1634
|
+
default: undefined;
|
|
1635
|
+
};
|
|
1636
|
+
avsLayout: {
|
|
1637
|
+
type: PropType<"row" | "column">;
|
|
1638
|
+
default: undefined;
|
|
1639
|
+
};
|
|
1640
|
+
cardFieldOrder: {
|
|
1641
|
+
type: PropType<VaultCardFieldKey[]>;
|
|
1642
|
+
default: undefined;
|
|
1643
|
+
};
|
|
1644
|
+
/** @deprecated Not rendered (React parity); see {@link FloPayCheckoutProps.showSecurityFooter}. */
|
|
1645
|
+
showSecurityFooter: {
|
|
1646
|
+
type: BooleanConstructor;
|
|
1647
|
+
default: undefined;
|
|
1648
|
+
};
|
|
1649
|
+
/** @deprecated Ignored (React parity); see {@link FloPayCheckoutProps.fallbackPublishableKey}. */
|
|
1650
|
+
fallbackPublishableKey: {
|
|
1651
|
+
type: StringConstructor;
|
|
1652
|
+
default: undefined;
|
|
1653
|
+
};
|
|
1654
|
+
confirmLabel: {
|
|
1655
|
+
type: StringConstructor;
|
|
1656
|
+
default: undefined;
|
|
1657
|
+
};
|
|
1658
|
+
initialErrorMessage: {
|
|
1659
|
+
type: PropType<string | null>;
|
|
1660
|
+
default: null;
|
|
1661
|
+
};
|
|
1662
|
+
/**
|
|
1663
|
+
* React's `onBeforeButtonClick` (a function prop: its result is read),
|
|
1664
|
+
* passed to the built-in `SplitCardForm`. It runs before the buttons-layout
|
|
1665
|
+
* card tile opens and before PayPal creates its order.
|
|
1666
|
+
*/
|
|
1667
|
+
onBeforeButtonClick: {
|
|
1668
|
+
type: PropType<SplitCardFormBeforeButtonClick>;
|
|
1669
|
+
default: undefined;
|
|
1670
|
+
};
|
|
1671
|
+
initialPayPalOrderId: {
|
|
1672
|
+
type: StringConstructor;
|
|
1673
|
+
default: undefined;
|
|
1674
|
+
};
|
|
1675
|
+
debug: {
|
|
1676
|
+
type: BooleanConstructor;
|
|
1677
|
+
default: boolean;
|
|
1678
|
+
};
|
|
1679
|
+
}>> & Readonly<{
|
|
1680
|
+
onInstrument?: ((_event: FloInstrumentEvent) => any) | undefined;
|
|
1681
|
+
onComplete?: ((_result: PaymentResult) => any) | undefined;
|
|
1682
|
+
onError?: ((_error: FloPayError) => any) | undefined;
|
|
1683
|
+
onDecline?: ((_decline: DeclineEvent) => any) | undefined;
|
|
1684
|
+
onButtonClick?: ((_method: CheckoutButtonMethod) => any) | undefined;
|
|
1685
|
+
onCountryChange?: ((_country: string) => any) | undefined;
|
|
1686
|
+
onZipChange?: ((_zip: string) => any) | undefined;
|
|
1687
|
+
onSessionCompleted?: ((_successUrl: string) => any) | undefined;
|
|
1688
|
+
}>, {
|
|
1689
|
+
checkoutMode: CheckoutMode;
|
|
1690
|
+
layout: "default" | "buttons";
|
|
1691
|
+
nonce: string;
|
|
1692
|
+
sessionId: string;
|
|
1693
|
+
billingApiUrl: string;
|
|
1694
|
+
telemetry: boolean;
|
|
1695
|
+
debug: boolean;
|
|
1696
|
+
appearance: FloPayAppearance;
|
|
1697
|
+
theme: ThemeId;
|
|
1698
|
+
submitLabel: string | null;
|
|
1699
|
+
showPayPal: boolean;
|
|
1700
|
+
walletPresentation: WalletPresentation;
|
|
1701
|
+
showStripe: boolean;
|
|
1702
|
+
showApplePay: boolean;
|
|
1703
|
+
showGooglePay: boolean;
|
|
1704
|
+
enabledPaymentMethods: string[];
|
|
1705
|
+
enableAVS: boolean | AVSFieldConfig;
|
|
1706
|
+
avsLayout: "column" | "row";
|
|
1707
|
+
buttonsTheme: ButtonsLayoutTheme;
|
|
1708
|
+
buttonsStyles: ButtonsLayoutStyles;
|
|
1709
|
+
className: string;
|
|
1710
|
+
cardFieldOrder: VaultCardFieldKey[];
|
|
1711
|
+
onBeforeButtonClick: SplitCardFormBeforeButtonClick;
|
|
1712
|
+
showSecurityFooter: boolean;
|
|
1713
|
+
createSession: InlineSessionDraft;
|
|
1714
|
+
locale: string;
|
|
1715
|
+
fallbackPublishableKey: string;
|
|
1716
|
+
confirmLabel: string;
|
|
1717
|
+
initialErrorMessage: string | null;
|
|
1718
|
+
initialPayPalOrderId: string;
|
|
1719
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1720
|
+
|
|
1721
|
+
/** Checkout state exposed by `useCheckout()`. */
|
|
1722
|
+
interface CheckoutState {
|
|
1723
|
+
session: CheckoutSession | null;
|
|
1724
|
+
loading: boolean;
|
|
1725
|
+
error: FloPayError | null;
|
|
1726
|
+
/** True while a detached session shell is not yet safe to charge. */
|
|
1727
|
+
claimPending?: boolean;
|
|
1728
|
+
/**
|
|
1729
|
+
* True when the pending claim waits for a `SplitCardForm` to collect the
|
|
1730
|
+
* buyer's identity (React's `claimRequiresIdentity`). A form below the
|
|
1731
|
+
* checkout reads it even when its own `dataAttachmentRequiresIdentity` is
|
|
1732
|
+
* unset, as React's form reads `CheckoutContext`.
|
|
1733
|
+
*/
|
|
1734
|
+
claimRequiresIdentity?: boolean;
|
|
1735
|
+
/**
|
|
1736
|
+
* The inline `createSession` draft (React's `inlineSessionDraft`). A
|
|
1737
|
+
* `SplitCardForm` passes it to `onBeforeButtonClick` as `createSession`.
|
|
1738
|
+
*/
|
|
1739
|
+
inlineSessionDraft?: InlineSessionDraft;
|
|
1740
|
+
}
|
|
1741
|
+
|
|
1742
|
+
/**
|
|
1743
|
+
* The current `FloPay` instance as a ref: `null` while the provider's
|
|
1744
|
+
* `loadFloPay()` promise is pending (or outside a `FloPayProvider`), then the
|
|
1745
|
+
* instance. Read it as `useFloPay().value`.
|
|
1746
|
+
*/
|
|
1747
|
+
declare function useFloPay(): Readonly<ShallowRef<FloPay | null>>;
|
|
1748
|
+
/**
|
|
1749
|
+
* The Stripe `FloPay` instance dedicated to the Stripe-rendered PayPal
|
|
1750
|
+
* fallback, or `null` when PayPal is disabled. Direct PayPal
|
|
1751
|
+
* (`gateways.paypal`) does not use this instance.
|
|
1752
|
+
*/
|
|
1753
|
+
declare function usePayPalFloPay(): Readonly<ShallowRef<FloPay | null>>;
|
|
1754
|
+
/**
|
|
1755
|
+
* Reactive checkout state from the enclosing `FloPayCheckout`
|
|
1756
|
+
* (`session`, `loading`, `error`, `claimPending`). Outside a checkout it is
|
|
1757
|
+
* the same idle default the React hook returns.
|
|
1758
|
+
*/
|
|
1759
|
+
declare function useCheckout(): CheckoutState;
|
|
1760
|
+
|
|
1761
|
+
/** Props for the `FloPayProvider` component (React's `FloPayProviderProps`, minus `children`). */
|
|
1762
|
+
interface FloPayProviderProps {
|
|
1763
|
+
/** A `FloPay` instance or a promise that resolves to one (from `loadFloPay()`). */
|
|
1764
|
+
flopay: Promise<FloPay> | FloPay | null;
|
|
1765
|
+
/** Stripe `FloPay` instance for the Stripe-rendered PayPal fallback. */
|
|
1766
|
+
paypalFlopay?: Promise<FloPay> | FloPay | null;
|
|
1767
|
+
/** Optional provider configuration. */
|
|
1768
|
+
options?: {
|
|
1769
|
+
billingApiUrl?: string;
|
|
1770
|
+
};
|
|
1771
|
+
/** Receives the versioned, privacy-safe checkout instrument feed (`@instrument`). */
|
|
1772
|
+
onInstrument?: (event: FloInstrumentEvent) => void;
|
|
1773
|
+
}
|
|
1774
|
+
/**
|
|
1775
|
+
* Provides FloPay SDK state to the component tree (provide/inject). Browser
|
|
1776
|
+
* work — resolving the SDK promise, telemetry, instruments — starts in
|
|
1777
|
+
* `onMounted`, so server rendering renders the pending state and nothing else.
|
|
1778
|
+
*/
|
|
1779
|
+
declare const FloPayProvider: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
1780
|
+
flopay: {
|
|
1781
|
+
type: PropType<Promise<FloPay> | FloPay | null>;
|
|
1782
|
+
default: null;
|
|
1783
|
+
};
|
|
1784
|
+
paypalFlopay: {
|
|
1785
|
+
type: PropType<Promise<FloPay> | FloPay | null>;
|
|
1786
|
+
default: null;
|
|
1787
|
+
};
|
|
1788
|
+
options: {
|
|
1789
|
+
type: PropType<{
|
|
1790
|
+
billingApiUrl?: string;
|
|
1791
|
+
}>;
|
|
1792
|
+
default: undefined;
|
|
1793
|
+
};
|
|
1794
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1795
|
+
[key: string]: any;
|
|
1796
|
+
}>[] | undefined, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
1797
|
+
instrument: (_event: FloInstrumentEvent) => true;
|
|
1798
|
+
}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1799
|
+
flopay: {
|
|
1800
|
+
type: PropType<Promise<FloPay> | FloPay | null>;
|
|
1801
|
+
default: null;
|
|
1802
|
+
};
|
|
1803
|
+
paypalFlopay: {
|
|
1804
|
+
type: PropType<Promise<FloPay> | FloPay | null>;
|
|
1805
|
+
default: null;
|
|
1806
|
+
};
|
|
1807
|
+
options: {
|
|
1808
|
+
type: PropType<{
|
|
1809
|
+
billingApiUrl?: string;
|
|
1810
|
+
}>;
|
|
1811
|
+
default: undefined;
|
|
1812
|
+
};
|
|
1813
|
+
}>> & Readonly<{
|
|
1814
|
+
onInstrument?: ((_event: FloInstrumentEvent) => any) | undefined;
|
|
1815
|
+
}>, {
|
|
1816
|
+
flopay: FloPay | Promise<FloPay> | null;
|
|
1817
|
+
paypalFlopay: FloPay | Promise<FloPay> | null;
|
|
1818
|
+
options: {
|
|
1819
|
+
billingApiUrl?: string;
|
|
1820
|
+
};
|
|
1821
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1822
|
+
|
|
1823
|
+
/** Props for {@link VaultCardFields} (React's `VaultCardFieldsProps`; callbacks are emits). */
|
|
1824
|
+
interface VaultCardFieldsProps {
|
|
1825
|
+
/** The card-capture adapter (typically `useFloPay().value.cardCapture()`). */
|
|
1826
|
+
capture: CardCaptureAdapter;
|
|
1827
|
+
/** Server-rendered hosted vault widget HTML (the session's `vault.html`). */
|
|
1828
|
+
html: string;
|
|
1829
|
+
/** Per-session integrity token (the vault block's `messageToken`). */
|
|
1830
|
+
messageToken?: string;
|
|
1831
|
+
/** Exact origin expected for the widget's terminal `postMessage` outcomes. */
|
|
1832
|
+
expectedOrigin?: string;
|
|
1833
|
+
/**
|
|
1834
|
+
* The form sits behind the backend's production human check (the vault
|
|
1835
|
+
* block's `verification.required`, sdk#414). Forwarded to the adapter so a
|
|
1836
|
+
* pre-submit frame `error` (check failed, expired or unavailable) is not
|
|
1837
|
+
* reported as a vault load failure; it is still emitted as `error`.
|
|
1838
|
+
*/
|
|
1839
|
+
verificationRequired?: boolean;
|
|
1840
|
+
/** Theme colors pushed into the hosted widget live; `null` is the classic reset. */
|
|
1841
|
+
theme?: VaultCardThemeColors | null;
|
|
1842
|
+
/** Final, localized submit wording, applied live without a remount. */
|
|
1843
|
+
submitLabel?: string | null;
|
|
1844
|
+
/** Inline styles for the container the widget mounts into. */
|
|
1845
|
+
containerStyle?: CSSProperties;
|
|
1846
|
+
}
|
|
1847
|
+
/**
|
|
1848
|
+
* Renders the backend-served hosted vault card widget. The widget owns the
|
|
1849
|
+
* card fields, the submit button, the charge and 3DS; this component only
|
|
1850
|
+
* injects it through the {@link CardCaptureAdapter} (the SDK's `cardCapture`)
|
|
1851
|
+
* and relays its `ready` / `error` / `validation` lifecycle as Vue events.
|
|
1852
|
+
*/
|
|
1853
|
+
declare const VaultCardFields: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
1854
|
+
capture: {
|
|
1855
|
+
type: PropType<CardCaptureAdapter>;
|
|
1856
|
+
default: undefined;
|
|
1857
|
+
};
|
|
1858
|
+
html: {
|
|
1859
|
+
type: StringConstructor;
|
|
1860
|
+
default: undefined;
|
|
1861
|
+
};
|
|
1862
|
+
messageToken: {
|
|
1863
|
+
type: StringConstructor;
|
|
1864
|
+
default: undefined;
|
|
1865
|
+
};
|
|
1866
|
+
expectedOrigin: {
|
|
1867
|
+
type: StringConstructor;
|
|
1868
|
+
default: undefined;
|
|
1869
|
+
};
|
|
1870
|
+
verificationRequired: {
|
|
1871
|
+
type: BooleanConstructor;
|
|
1872
|
+
default: undefined;
|
|
1873
|
+
};
|
|
1874
|
+
theme: {
|
|
1875
|
+
type: PropType<VaultCardThemeColors | null>;
|
|
1876
|
+
default: undefined;
|
|
1877
|
+
};
|
|
1878
|
+
submitLabel: {
|
|
1879
|
+
type: PropType<string | null>;
|
|
1880
|
+
default: undefined;
|
|
1881
|
+
};
|
|
1882
|
+
containerStyle: {
|
|
1883
|
+
type: PropType<CSSProperties>;
|
|
1884
|
+
default: undefined;
|
|
1885
|
+
};
|
|
1886
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1887
|
+
[key: string]: any;
|
|
1888
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
1889
|
+
ready: () => true;
|
|
1890
|
+
error: (_message: string | null) => true;
|
|
1891
|
+
validation: (_message: string | null) => true;
|
|
1892
|
+
}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1893
|
+
capture: {
|
|
1894
|
+
type: PropType<CardCaptureAdapter>;
|
|
1895
|
+
default: undefined;
|
|
1896
|
+
};
|
|
1897
|
+
html: {
|
|
1898
|
+
type: StringConstructor;
|
|
1899
|
+
default: undefined;
|
|
1900
|
+
};
|
|
1901
|
+
messageToken: {
|
|
1902
|
+
type: StringConstructor;
|
|
1903
|
+
default: undefined;
|
|
1904
|
+
};
|
|
1905
|
+
expectedOrigin: {
|
|
1906
|
+
type: StringConstructor;
|
|
1907
|
+
default: undefined;
|
|
1908
|
+
};
|
|
1909
|
+
verificationRequired: {
|
|
1910
|
+
type: BooleanConstructor;
|
|
1911
|
+
default: undefined;
|
|
1912
|
+
};
|
|
1913
|
+
theme: {
|
|
1914
|
+
type: PropType<VaultCardThemeColors | null>;
|
|
1915
|
+
default: undefined;
|
|
1916
|
+
};
|
|
1917
|
+
submitLabel: {
|
|
1918
|
+
type: PropType<string | null>;
|
|
1919
|
+
default: undefined;
|
|
1920
|
+
};
|
|
1921
|
+
containerStyle: {
|
|
1922
|
+
type: PropType<CSSProperties>;
|
|
1923
|
+
default: undefined;
|
|
1924
|
+
};
|
|
1925
|
+
}>> & Readonly<{
|
|
1926
|
+
onError?: ((_message: string | null) => any) | undefined;
|
|
1927
|
+
onReady?: (() => any) | undefined;
|
|
1928
|
+
onValidation?: ((_message: string | null) => any) | undefined;
|
|
1929
|
+
}>, {
|
|
1930
|
+
html: string;
|
|
1931
|
+
theme: VaultCardThemeColors | null;
|
|
1932
|
+
capture: CardCaptureAdapter;
|
|
1933
|
+
messageToken: string;
|
|
1934
|
+
expectedOrigin: string;
|
|
1935
|
+
verificationRequired: boolean;
|
|
1936
|
+
submitLabel: string | null;
|
|
1937
|
+
containerStyle: CSSProperties;
|
|
1938
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1939
|
+
|
|
1940
|
+
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 };
|