@whop/elements 1.0.0-beta.0 → 1.0.0-beta.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/ads.d.cts +9 -5
- package/ads.d.ts +9 -5
- package/checkout.d.cts +90 -3
- package/checkout.d.ts +90 -3
- package/index.d.cts +2 -2
- package/index.d.ts +2 -2
- package/package.json +2 -2
- package/payments.d.cts +90 -21
- package/payments.d.ts +90 -21
- package/tracking.d.cts +8 -0
- package/tracking.d.ts +8 -0
- package/wallet.d.cts +188 -15
- package/wallet.d.ts +188 -15
- package/websites.d.cts +8 -0
- package/websites.d.ts +8 -0
package/payments.d.ts
CHANGED
|
@@ -43,6 +43,10 @@ export type PaymentsOptions = (
|
|
|
43
43
|
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
44
44
|
*/
|
|
45
45
|
onLoadingChange?: ((loading: boolean) => void);
|
|
46
|
+
/**
|
|
47
|
+
* Set `false` to turn off Whop's built-in usage analytics for this handle and its elements. The analytics identity is never threaded to its frames. A reserved option, not element data.
|
|
48
|
+
*/
|
|
49
|
+
analytics?: false;
|
|
46
50
|
}
|
|
47
51
|
| {
|
|
48
52
|
/**
|
|
@@ -85,6 +89,10 @@ export type PaymentsOptions = (
|
|
|
85
89
|
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
86
90
|
*/
|
|
87
91
|
onLoadingChange?: ((loading: boolean) => void);
|
|
92
|
+
/**
|
|
93
|
+
* Set `false` to turn off Whop's built-in usage analytics for this handle and its elements. The analytics identity is never threaded to its frames. A reserved option, not element data.
|
|
94
|
+
*/
|
|
95
|
+
analytics?: false;
|
|
88
96
|
}
|
|
89
97
|
| {
|
|
90
98
|
/**
|
|
@@ -131,6 +139,10 @@ export type PaymentsOptions = (
|
|
|
131
139
|
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
132
140
|
*/
|
|
133
141
|
onLoadingChange?: ((loading: boolean) => void);
|
|
142
|
+
/**
|
|
143
|
+
* Set `false` to turn off Whop's built-in usage analytics for this handle and its elements. The analytics identity is never threaded to its frames. A reserved option, not element data.
|
|
144
|
+
*/
|
|
145
|
+
analytics?: false;
|
|
134
146
|
}
|
|
135
147
|
) & {
|
|
136
148
|
/**
|
|
@@ -148,6 +160,11 @@ export type PaymentsOptions = (
|
|
|
148
160
|
* @see https://docs.whop.com/elements/latest/payments/payment
|
|
149
161
|
*/
|
|
150
162
|
export interface PaymentElementProps {
|
|
163
|
+
/**
|
|
164
|
+
* Controls display order in either layout. Listed types appear first in order. Unlisted types retain their relative order. Does not affect availability.
|
|
165
|
+
* @default []
|
|
166
|
+
*/
|
|
167
|
+
order?: string[];
|
|
151
168
|
/**
|
|
152
169
|
* Controls billing-details collection. `billingDetails: 'minimal'` (default) follows each method's matrix. Methods collect name and the complete country format by default. An override may collect only the declared minimum or nothing. For cards, the minimum is name on card, country, and postal code. `'full'` requires name and the complete country format for every fresh method. `'never'` hides the block. Pass the address to `createConfirmationToken` instead. The country selector includes only countries supported by the method and payment currency. It locks when only one is available.
|
|
153
170
|
* @default {"billingDetails":"minimal"}
|
|
@@ -163,11 +180,6 @@ export interface PaymentElementProps {
|
|
|
163
180
|
* @default false
|
|
164
181
|
*/
|
|
165
182
|
separated?: boolean;
|
|
166
|
-
/**
|
|
167
|
-
* Controls display order in either layout. Listed types appear first in order. Unlisted types retain their relative order. Does not affect availability.
|
|
168
|
-
* @default []
|
|
169
|
-
*/
|
|
170
|
-
order?: string[];
|
|
171
183
|
/**
|
|
172
184
|
* Whether to select the first offered method after resolution. The default `true` respects `order` and emits `selected` and `change` like a buyer interaction. It runs once before buyer interaction and does nothing when no method is offered. Set `false` to mount unselected. Independently, if an update removes the selected method, selection falls back to the first offered method. An already unselected element stays unselected.
|
|
173
185
|
* @default true
|
|
@@ -208,6 +220,11 @@ export interface PaymentElementHandle {
|
|
|
208
220
|
* @see https://docs.whop.com/elements/latest/payments/payment
|
|
209
221
|
*/
|
|
210
222
|
export interface PaymentElementCreateOptions {
|
|
223
|
+
/**
|
|
224
|
+
* Controls display order in either layout. Listed types appear first in order. Unlisted types retain their relative order. Does not affect availability.
|
|
225
|
+
* @default []
|
|
226
|
+
*/
|
|
227
|
+
order?: string[];
|
|
211
228
|
/**
|
|
212
229
|
* Controls billing-details collection. `billingDetails: 'minimal'` (default) follows each method's matrix. Methods collect name and the complete country format by default. An override may collect only the declared minimum or nothing. For cards, the minimum is name on card, country, and postal code. `'full'` requires name and the complete country format for every fresh method. `'never'` hides the block. Pass the address to `createConfirmationToken` instead. The country selector includes only countries supported by the method and payment currency. It locks when only one is available.
|
|
213
230
|
* @default {"billingDetails":"minimal"}
|
|
@@ -223,18 +240,13 @@ export interface PaymentElementCreateOptions {
|
|
|
223
240
|
* @default false
|
|
224
241
|
*/
|
|
225
242
|
separated?: boolean;
|
|
226
|
-
/**
|
|
227
|
-
* Controls display order in either layout. Listed types appear first in order. Unlisted types retain their relative order. Does not affect availability.
|
|
228
|
-
* @default []
|
|
229
|
-
*/
|
|
230
|
-
order?: string[];
|
|
231
243
|
/**
|
|
232
244
|
* Whether to select the first offered method after resolution. The default `true` respects `order` and emits `selected` and `change` like a buyer interaction. It runs once before buyer interaction and does nothing when no method is offered. Set `false` to mount unselected. Independently, if an update removes the selected method, selection falls back to the first offered method. An already unselected element stays unselected.
|
|
233
245
|
* @default true
|
|
234
246
|
*/
|
|
235
247
|
autoSelect?: boolean;
|
|
236
248
|
/**
|
|
237
|
-
* Fires when selection changes. `complete: true` means the buyer selected a method and completed its card fields or required inputs. Use it to enable confirmation. `method` provides category, per-currency countries, and amount bounds for dependent UI such as country fields. `supportsBuyerFee` indicates whether to include Whop's buyer service fee in the displayed total.
|
|
249
|
+
* Fires when selection changes. `complete: true` means the buyer selected a method and completed its card fields or required inputs. Use it to enable confirmation. `method` provides category, per-currency countries, and amount bounds for dependent UI such as country fields; when the buyer picks a card installment plan, `countries` narrows to the countries that plan serves for the payment currency. `supportsBuyerFee` indicates whether to include Whop's buyer service fee in the displayed total.
|
|
238
250
|
*/
|
|
239
251
|
onChange?: ((payload: { complete: boolean; type?: string | undefined; supportsBuyerFee?: boolean | undefined; method?: { type: string; category: string; template: string; display_name: string; countries: ({ country: string; min_amount: number | null; max_amount: number | null; })[]; min_amount: number | null; max_amount: number | null; } | undefined; }) => void);
|
|
240
252
|
/**
|
|
@@ -478,9 +490,9 @@ export interface CardElementCreateOptions {
|
|
|
478
490
|
*/
|
|
479
491
|
layout?: "compact" | "stacked";
|
|
480
492
|
/**
|
|
481
|
-
* Fires when card fields change. `complete` becomes true after the buyer fills all three. Use it to enable confirmation. `brand` is the detected card network.
|
|
493
|
+
* Fires when card fields change. `complete` becomes true after the buyer fills all three. Use it to enable confirmation. `brand` is the detected card network. `funding` is the detected funding type (`credit`, `debit`, or `prepaid`), `null` until the number identifies one.
|
|
482
494
|
*/
|
|
483
|
-
onChange?: ((payload: { complete: boolean; brand: string; }) => void);
|
|
495
|
+
onChange?: ((payload: { complete: boolean; brand: string; funding: string | null; }) => void);
|
|
484
496
|
/**
|
|
485
497
|
* Runs after the loading skeleton first paints and before `onReady`.
|
|
486
498
|
*/
|
|
@@ -671,6 +683,55 @@ export interface TaxIdElementCreateOptions {
|
|
|
671
683
|
onError?: ((e: { message: string; code?: string | undefined; sourceKey?: string | undefined; }) => void);
|
|
672
684
|
}
|
|
673
685
|
|
|
686
|
+
/**
|
|
687
|
+
* Consumer props for the "branding" element. Set at create (or as `<BrandingElement />` JSX props), and updatable live via `update()`.
|
|
688
|
+
* @see https://docs.whop.com/elements/latest/payments/branding
|
|
689
|
+
*/
|
|
690
|
+
export interface BrandingElementProps {}
|
|
691
|
+
|
|
692
|
+
/**
|
|
693
|
+
* The live handle for a mounted "branding" element. Returned by `create("branding")`; in React, the component's `ref`.
|
|
694
|
+
* @see https://docs.whop.com/elements/latest/payments/branding
|
|
695
|
+
*/
|
|
696
|
+
export interface BrandingElementHandle {
|
|
697
|
+
/**
|
|
698
|
+
* Mounts the element in `target` and starts loading. React components mount themselves.
|
|
699
|
+
*/
|
|
700
|
+
mount: (target: string | HTMLElement) => void;
|
|
701
|
+
/**
|
|
702
|
+
* Removes the element and releases its frame and subscriptions. You can call it more than once. React removes the element automatically.
|
|
703
|
+
*/
|
|
704
|
+
destroy: () => void;
|
|
705
|
+
/**
|
|
706
|
+
* Merges new props into the mounted element. In React, change the component props instead.
|
|
707
|
+
*/
|
|
708
|
+
update: (options: Partial<BrandingElementProps>) => void;
|
|
709
|
+
}
|
|
710
|
+
|
|
711
|
+
/**
|
|
712
|
+
* Options for `create("branding")`: the consumer props plus event callbacks and lifecycle hooks.
|
|
713
|
+
* @example
|
|
714
|
+
* ```ts
|
|
715
|
+
* const branding = payments.create("branding", {}); // this interface: props + on<Event> callbacks
|
|
716
|
+
* branding.mount("#payments-branding");
|
|
717
|
+
* ```
|
|
718
|
+
* @see https://docs.whop.com/elements/latest/payments/branding
|
|
719
|
+
*/
|
|
720
|
+
export interface BrandingElementCreateOptions {
|
|
721
|
+
/**
|
|
722
|
+
* Runs after the loading skeleton first paints and before `onReady`.
|
|
723
|
+
*/
|
|
724
|
+
onLoaderStart?: (() => void);
|
|
725
|
+
/**
|
|
726
|
+
* Runs after the element's first complete paint.
|
|
727
|
+
*/
|
|
728
|
+
onReady?: (() => void);
|
|
729
|
+
/**
|
|
730
|
+
* Runs when the element fails to load or crashes. The fallback remains visible. Use `code` for programmatic handling. `sourceKey` identifies a failed host-state source.
|
|
731
|
+
*/
|
|
732
|
+
onError?: ((e: { message: string; code?: string | undefined; sourceKey?: string | undefined; }) => void);
|
|
733
|
+
}
|
|
734
|
+
|
|
674
735
|
/**
|
|
675
736
|
* Consumer props for the "cardFields" sub-controller: the `create("cardFields")` options and the minted sub handle's `update()` payload (React: `<CardFields>` props). Parent-injected props never appear here.
|
|
676
737
|
* @see https://docs.whop.com/elements/latest/payments/overview
|
|
@@ -690,13 +751,9 @@ export interface CardFieldsSubOptions {
|
|
|
690
751
|
*/
|
|
691
752
|
networks?: CardNetworkArt[];
|
|
692
753
|
/**
|
|
693
|
-
* Fires when completeness changes. `complete` becomes true after the buyer fills all three fields. Use it to enable confirmation. `brand` is the detected card network.
|
|
754
|
+
* Fires when completeness changes. `complete` becomes true after the buyer fills all three fields. Use it to enable confirmation. `brand` is the detected card network. `funding` is the detected funding type (`credit`, `debit`, or `prepaid`), `null` until the number identifies one.
|
|
694
755
|
*/
|
|
695
|
-
onChange?: ((payload: { complete: boolean; brand: string; }) => void);
|
|
696
|
-
/**
|
|
697
|
-
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
698
|
-
*/
|
|
699
|
-
onLoadingChange?: ((loading: boolean) => void);
|
|
756
|
+
onChange?: ((payload: { complete: boolean; brand: string; funding: string | null; }) => void);
|
|
700
757
|
}
|
|
701
758
|
|
|
702
759
|
/**
|
|
@@ -918,11 +975,11 @@ export interface PaymentRequestResourceOptions {
|
|
|
918
975
|
*/
|
|
919
976
|
export interface PaymentRequestResource {
|
|
920
977
|
/**
|
|
921
|
-
* Returns availability for each wallet when the account offers it
|
|
978
|
+
* Returns availability for each wallet when the account offers it, the device supports it, and this page's origin is approved for the account (first-party whop.com pages are pre-approved; a merchant page needs its domain registered as a payment method domain). Apple Pay on non-WebKit browsers is the desktop iPhone-handoff flow, so mobile devices there report it unavailable — native Apple Pay on iOS browsers is unaffected. `order` ranks the wallets by which sheet is native to the browser — Apple Pay first on Safari, Google Pay first elsewhere — so express buttons can stack best-first. This primes `show()`. Always await it first.
|
|
922
979
|
*/
|
|
923
980
|
canMakePayment: () => Promise<WalletAvailability>;
|
|
924
981
|
/**
|
|
925
|
-
* Open the selected wallet sheet after awaiting `canMakePayment()`. Apple requires session creation within the gesture stack.
|
|
982
|
+
* Open the selected wallet sheet after awaiting `canMakePayment()`. Apple requires session creation within the gesture stack. Pass `email` when your page already collected one — the sheet takes it and never asks for a second. With `requestPayerEmail: false`, passing one is required, and the sheet refuses to open without it because confirmation tokens require an email.
|
|
926
983
|
* Call synchronously during user activation. Await prerequisites first because browsers revoke activation across asynchronous steps.
|
|
927
984
|
*/
|
|
928
985
|
show: (type: "apple_pay" | "google_pay", provided?: { email?: string | undefined; } | undefined) => Promise<PaymentRequestResult>;
|
|
@@ -983,6 +1040,10 @@ export interface PaymentsHandle {
|
|
|
983
1040
|
* Collects a business tax registration accepted by the API. Labels use buyer-facing names. The placeholder matches the selected format. `country` preselects a type. `onChange` emits committed pairs. The host supplies API validation errors.
|
|
984
1041
|
*/
|
|
985
1042
|
create(name: "taxId", options?: TaxIdElementCreateOptions): TaxIdElementHandle;
|
|
1043
|
+
/**
|
|
1044
|
+
* Whop's merchant-of-record notice: the Whop wordmark with links to the buyer terms and privacy policy. Mount it alongside every payment collection surface.
|
|
1045
|
+
*/
|
|
1046
|
+
create(name: "branding", options?: BrandingElementCreateOptions): BrandingElementHandle;
|
|
986
1047
|
/**
|
|
987
1048
|
* Creates a confirmation token for the selected method from your pay button. Pass the checkout's billing details. They must include `email`. Cards also need `name` and an address containing `line1` and `country`. Wallet selections open their sheet during the pay-button interaction. Confirm the returned `confirmationToken` server-side, then call `WhopElements.payments.handleNextAction(…)`.
|
|
988
1049
|
* Runs on your page (host-side), not in the controller iframe.
|
|
@@ -997,6 +1058,10 @@ export interface PaymentsHandle {
|
|
|
997
1058
|
* Merges new handle options into every mounted element. In React, change the namespace props instead.
|
|
998
1059
|
*/
|
|
999
1060
|
update(options: Partial<PaymentsOptions>): void;
|
|
1061
|
+
/**
|
|
1062
|
+
* Destroys every element and sub-controller this handle created, removes the controller frame, and releases its subscriptions. You can call it more than once, but a destroyed handle refuses any other call — create a new handle to start over. React removes the group automatically when the provider unmounts.
|
|
1063
|
+
*/
|
|
1064
|
+
destroy(): void;
|
|
1000
1065
|
}
|
|
1001
1066
|
|
|
1002
1067
|
/**
|
|
@@ -1022,6 +1087,10 @@ export interface PaymentsStatics {
|
|
|
1022
1087
|
export interface WalletAvailability {
|
|
1023
1088
|
applePay: boolean;
|
|
1024
1089
|
googlePay: boolean;
|
|
1090
|
+
/**
|
|
1091
|
+
* The wallets ranked by which sheet is native to this browser — Apple Pay first on WebKit, Google Pay first everywhere else — so express buttons can stack best-first. Absent on consumer-stated availability (previews) and on wires that predate it. An inline union, not payment-request's WalletSheetType: that module already imports this one.
|
|
1092
|
+
*/
|
|
1093
|
+
order?: ("apple_pay" | "google_pay")[] | undefined;
|
|
1025
1094
|
}
|
|
1026
1095
|
|
|
1027
1096
|
/**
|
package/tracking.d.cts
CHANGED
|
@@ -48,6 +48,10 @@ export interface TrackingOptions {
|
|
|
48
48
|
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
49
49
|
*/
|
|
50
50
|
onLoadingChange?: ((loading: boolean) => void);
|
|
51
|
+
/**
|
|
52
|
+
* Set `false` to turn off Whop's built-in usage analytics for this handle and its elements. The analytics identity is never threaded to its frames. A reserved option, not element data.
|
|
53
|
+
*/
|
|
54
|
+
analytics?: false;
|
|
51
55
|
/**
|
|
52
56
|
* Visual customization for this group's elements. Overrides the global `WhopElements({ appearance })`. Change it live with `update({ appearance })`.
|
|
53
57
|
*/
|
|
@@ -461,6 +465,10 @@ export interface TrackingHandle {
|
|
|
461
465
|
* Merges new handle options into every mounted element. In React, change the namespace props instead.
|
|
462
466
|
*/
|
|
463
467
|
update(options: Partial<TrackingOptions>): void;
|
|
468
|
+
/**
|
|
469
|
+
* Destroys every element and sub-controller this handle created, removes the controller frame, and releases its subscriptions. You can call it more than once, but a destroyed handle refuses any other call — create a new handle to start over. React removes the group automatically when the provider unmounts.
|
|
470
|
+
*/
|
|
471
|
+
destroy(): void;
|
|
464
472
|
}
|
|
465
473
|
|
|
466
474
|
/**
|
package/tracking.d.ts
CHANGED
|
@@ -48,6 +48,10 @@ export interface TrackingOptions {
|
|
|
48
48
|
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
49
49
|
*/
|
|
50
50
|
onLoadingChange?: ((loading: boolean) => void);
|
|
51
|
+
/**
|
|
52
|
+
* Set `false` to turn off Whop's built-in usage analytics for this handle and its elements. The analytics identity is never threaded to its frames. A reserved option, not element data.
|
|
53
|
+
*/
|
|
54
|
+
analytics?: false;
|
|
51
55
|
/**
|
|
52
56
|
* Visual customization for this group's elements. Overrides the global `WhopElements({ appearance })`. Change it live with `update({ appearance })`.
|
|
53
57
|
*/
|
|
@@ -461,6 +465,10 @@ export interface TrackingHandle {
|
|
|
461
465
|
* Merges new handle options into every mounted element. In React, change the namespace props instead.
|
|
462
466
|
*/
|
|
463
467
|
update(options: Partial<TrackingOptions>): void;
|
|
468
|
+
/**
|
|
469
|
+
* Destroys every element and sub-controller this handle created, removes the controller frame, and releases its subscriptions. You can call it more than once, but a destroyed handle refuses any other call — create a new handle to start over. React removes the group automatically when the provider unmounts.
|
|
470
|
+
*/
|
|
471
|
+
destroy(): void;
|
|
464
472
|
}
|
|
465
473
|
|
|
466
474
|
/**
|
package/wallet.d.cts
CHANGED
|
@@ -23,6 +23,10 @@ export interface WalletOptions {
|
|
|
23
23
|
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
24
24
|
*/
|
|
25
25
|
onLoadingChange?: ((loading: boolean) => void);
|
|
26
|
+
/**
|
|
27
|
+
* Set `false` to turn off Whop's built-in usage analytics for this handle and its elements. The analytics identity is never threaded to its frames. A reserved option, not element data.
|
|
28
|
+
*/
|
|
29
|
+
analytics?: false;
|
|
26
30
|
/**
|
|
27
31
|
* Visual customization for this group's elements. Overrides the global `WhopElements({ appearance })`. Change it live with `update({ appearance })`.
|
|
28
32
|
*/
|
|
@@ -129,13 +133,135 @@ export interface ActivityElementCreateOptions {
|
|
|
129
133
|
onError?: ((e: { message: string; code?: string | undefined; sourceKey?: string | undefined; }) => void);
|
|
130
134
|
}
|
|
131
135
|
|
|
136
|
+
/**
|
|
137
|
+
* Consumer props for the "actions" element. Set at create (or as `<ActionsElement />` JSX props), and updatable live via `update()`.
|
|
138
|
+
* @see https://docs.whop.com/elements/latest/wallet/actions
|
|
139
|
+
*/
|
|
140
|
+
export interface ActionsElementProps {
|
|
141
|
+
/**
|
|
142
|
+
* Show the Deposit button.
|
|
143
|
+
* @default true
|
|
144
|
+
*/
|
|
145
|
+
showDeposit?: boolean;
|
|
146
|
+
/**
|
|
147
|
+
* Show the Accept button.
|
|
148
|
+
* @default true
|
|
149
|
+
*/
|
|
150
|
+
showAccept?: boolean;
|
|
151
|
+
/**
|
|
152
|
+
* Show the Send button.
|
|
153
|
+
* @default true
|
|
154
|
+
*/
|
|
155
|
+
showSend?: boolean;
|
|
156
|
+
/**
|
|
157
|
+
* Disable the Deposit button while keeping it visible.
|
|
158
|
+
* @default false
|
|
159
|
+
*/
|
|
160
|
+
depositDisabled?: boolean;
|
|
161
|
+
/**
|
|
162
|
+
* Disable the Accept button while keeping it visible.
|
|
163
|
+
* @default false
|
|
164
|
+
*/
|
|
165
|
+
acceptDisabled?: boolean;
|
|
166
|
+
/**
|
|
167
|
+
* Disable the Send button while keeping it visible.
|
|
168
|
+
* @default false
|
|
169
|
+
*/
|
|
170
|
+
sendDisabled?: boolean;
|
|
171
|
+
}
|
|
172
|
+
|
|
173
|
+
/**
|
|
174
|
+
* The live handle for a mounted "actions" element. Returned by `create("actions")`; in React, the component's `ref`.
|
|
175
|
+
* @see https://docs.whop.com/elements/latest/wallet/actions
|
|
176
|
+
*/
|
|
177
|
+
export interface ActionsElementHandle {
|
|
178
|
+
/**
|
|
179
|
+
* Mounts the element in `target` and starts loading. React components mount themselves.
|
|
180
|
+
*/
|
|
181
|
+
mount: (target: string | HTMLElement) => void;
|
|
182
|
+
/**
|
|
183
|
+
* Removes the element and releases its frame and subscriptions. You can call it more than once. React removes the element automatically.
|
|
184
|
+
*/
|
|
185
|
+
destroy: () => void;
|
|
186
|
+
/**
|
|
187
|
+
* Merges new props into the mounted element. In React, change the component props instead.
|
|
188
|
+
*/
|
|
189
|
+
update: (options: Partial<ActionsElementProps>) => void;
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
/**
|
|
193
|
+
* Options for `create("actions")`: the consumer props plus event callbacks and lifecycle hooks.
|
|
194
|
+
* @example
|
|
195
|
+
* ```ts
|
|
196
|
+
* const actions = wallet.create("actions", {}); // this interface: props + on<Event> callbacks
|
|
197
|
+
* actions.mount("#wallet-actions");
|
|
198
|
+
* ```
|
|
199
|
+
* @see https://docs.whop.com/elements/latest/wallet/actions
|
|
200
|
+
*/
|
|
201
|
+
export interface ActionsElementCreateOptions {
|
|
202
|
+
/**
|
|
203
|
+
* Show the Deposit button.
|
|
204
|
+
* @default true
|
|
205
|
+
*/
|
|
206
|
+
showDeposit?: boolean;
|
|
207
|
+
/**
|
|
208
|
+
* Show the Accept button.
|
|
209
|
+
* @default true
|
|
210
|
+
*/
|
|
211
|
+
showAccept?: boolean;
|
|
212
|
+
/**
|
|
213
|
+
* Show the Send button.
|
|
214
|
+
* @default true
|
|
215
|
+
*/
|
|
216
|
+
showSend?: boolean;
|
|
217
|
+
/**
|
|
218
|
+
* Disable the Deposit button while keeping it visible.
|
|
219
|
+
* @default false
|
|
220
|
+
*/
|
|
221
|
+
depositDisabled?: boolean;
|
|
222
|
+
/**
|
|
223
|
+
* Disable the Accept button while keeping it visible.
|
|
224
|
+
* @default false
|
|
225
|
+
*/
|
|
226
|
+
acceptDisabled?: boolean;
|
|
227
|
+
/**
|
|
228
|
+
* Disable the Send button while keeping it visible.
|
|
229
|
+
* @default false
|
|
230
|
+
*/
|
|
231
|
+
sendDisabled?: boolean;
|
|
232
|
+
/**
|
|
233
|
+
* The Deposit button was pressed and the Wallet controller opened its deposit overlay.
|
|
234
|
+
*/
|
|
235
|
+
onDepositRequested?: ((payload: Record<string, never>) => void);
|
|
236
|
+
/**
|
|
237
|
+
* The Accept button was pressed and the Wallet controller opened the corresponding Whop setup page.
|
|
238
|
+
*/
|
|
239
|
+
onAcceptRequested?: ((payload: Record<string, never>) => void);
|
|
240
|
+
/**
|
|
241
|
+
* The Send button was pressed and the Wallet controller opened its send overlay.
|
|
242
|
+
*/
|
|
243
|
+
onSendRequested?: ((payload: Record<string, never>) => void);
|
|
244
|
+
/**
|
|
245
|
+
* Runs after the loading skeleton first paints and before `onReady`.
|
|
246
|
+
*/
|
|
247
|
+
onLoaderStart?: (() => void);
|
|
248
|
+
/**
|
|
249
|
+
* Runs after the element's first complete paint.
|
|
250
|
+
*/
|
|
251
|
+
onReady?: (() => void);
|
|
252
|
+
/**
|
|
253
|
+
* Runs when the element fails to load or crashes. The fallback remains visible. Use `code` for programmatic handling. `sourceKey` identifies a failed host-state source.
|
|
254
|
+
*/
|
|
255
|
+
onError?: ((e: { message: string; code?: string | undefined; sourceKey?: string | undefined; }) => void);
|
|
256
|
+
}
|
|
257
|
+
|
|
132
258
|
/**
|
|
133
259
|
* Consumer props for the "deposit" element. Set at create (or as `<DepositElement />` JSX props), and updatable live via `update()`.
|
|
134
260
|
* @see https://docs.whop.com/elements/latest/wallet/deposit
|
|
135
261
|
*/
|
|
136
262
|
export interface DepositElementProps {
|
|
137
263
|
/**
|
|
138
|
-
* Prefill the amount and make it read-only — for flows that already know what is owed. An amount at or below zero,
|
|
264
|
+
* Prefill the amount and make it read-only — for flows that already know what is owed. An amount at or below zero is ignored, as is one longer than 12 whole digits; the rest is rounded to the currency’s decimal places.
|
|
139
265
|
* @default ""
|
|
140
266
|
*/
|
|
141
267
|
amount?: string;
|
|
@@ -229,7 +355,7 @@ export interface DepositElementHandle {
|
|
|
229
355
|
*/
|
|
230
356
|
export interface DepositElementCreateOptions {
|
|
231
357
|
/**
|
|
232
|
-
* Prefill the amount and make it read-only — for flows that already know what is owed. An amount at or below zero,
|
|
358
|
+
* Prefill the amount and make it read-only — for flows that already know what is owed. An amount at or below zero is ignored, as is one longer than 12 whole digits; the rest is rounded to the currency’s decimal places.
|
|
233
359
|
* @default ""
|
|
234
360
|
*/
|
|
235
361
|
amount?: string;
|
|
@@ -357,6 +483,11 @@ export interface DepositElementOverlayHandle {
|
|
|
357
483
|
* @see https://docs.whop.com/elements/latest/wallet/withdraw
|
|
358
484
|
*/
|
|
359
485
|
export interface WithdrawElementProps {
|
|
486
|
+
/**
|
|
487
|
+
* Whether the confirmed payout was created successfully.
|
|
488
|
+
* @default false
|
|
489
|
+
*/
|
|
490
|
+
succeeded?: boolean;
|
|
360
491
|
/**
|
|
361
492
|
* Saved payout methods with quotes for the current amount.
|
|
362
493
|
* @default []
|
|
@@ -468,6 +599,11 @@ export interface WithdrawElementHandle {
|
|
|
468
599
|
* @see https://docs.whop.com/elements/latest/wallet/withdraw
|
|
469
600
|
*/
|
|
470
601
|
export interface WithdrawElementCreateOptions {
|
|
602
|
+
/**
|
|
603
|
+
* Whether the confirmed payout was created successfully.
|
|
604
|
+
* @default false
|
|
605
|
+
*/
|
|
606
|
+
succeeded?: boolean;
|
|
471
607
|
/**
|
|
472
608
|
* Saved payout methods with quotes for the current amount.
|
|
473
609
|
* @default []
|
|
@@ -584,6 +720,10 @@ export interface WithdrawElementCreateOptions {
|
|
|
584
720
|
* The payer confirmed the final payout details. Create the payout on receipt.
|
|
585
721
|
*/
|
|
586
722
|
onWithdrawalRequested?: ((payload: WithdrawalRequest) => void);
|
|
723
|
+
/**
|
|
724
|
+
* The payer finished reviewing a successful payout.
|
|
725
|
+
*/
|
|
726
|
+
onDone?: ((payload: Record<string, never>) => void);
|
|
587
727
|
/**
|
|
588
728
|
* Runs after the loading skeleton first paints and before `onReady`.
|
|
589
729
|
*/
|
|
@@ -712,7 +852,7 @@ export interface SendElementCreateOptions {
|
|
|
712
852
|
/**
|
|
713
853
|
* The visible screen changed.
|
|
714
854
|
*/
|
|
715
|
-
onStepChanged?: ((payload: { step: "
|
|
855
|
+
onStepChanged?: ((payload: { step: "success" | "enter_amount" | "select_recipient" | "create_link" | "link_success"; }) => void);
|
|
716
856
|
/**
|
|
717
857
|
* A transfer succeeded. Refresh anything on your side reading the account's balance or activity.
|
|
718
858
|
*/
|
|
@@ -768,7 +908,7 @@ export interface SendElementOverlayHandle {
|
|
|
768
908
|
*/
|
|
769
909
|
export interface CardsElementProps {
|
|
770
910
|
/**
|
|
771
|
-
* A scoped token for the privileged read — needs `payout:account:read`. Mint it on your server with `POST /api/v1/access_tokens`. Omitted, the
|
|
911
|
+
* A scoped token for the privileged read and verification start — needs `payout:account:read` and `identity:write`. Mint it on your server with `POST /api/v1/access_tokens`. Omitted, the calls carry the viewer's own session, which only answers same-origin.
|
|
772
912
|
*/
|
|
773
913
|
accessToken?: string;
|
|
774
914
|
/**
|
|
@@ -827,7 +967,7 @@ export interface CardsElementHandle {
|
|
|
827
967
|
*/
|
|
828
968
|
export interface CardsElementCreateOptions {
|
|
829
969
|
/**
|
|
830
|
-
* A scoped token for the privileged read — needs `payout:account:read`. Mint it on your server with `POST /api/v1/access_tokens`. Omitted, the
|
|
970
|
+
* A scoped token for the privileged read and verification start — needs `payout:account:read` and `identity:write`. Mint it on your server with `POST /api/v1/access_tokens`. Omitted, the calls carry the viewer's own session, which only answers same-origin.
|
|
831
971
|
*/
|
|
832
972
|
accessToken?: string;
|
|
833
973
|
/**
|
|
@@ -862,6 +1002,10 @@ export interface CardsElementCreateOptions {
|
|
|
862
1002
|
* The "+" button was clicked. Only fires when `hideAddButton` is false.
|
|
863
1003
|
*/
|
|
864
1004
|
onAddCardRequested?: ((payload: Record<string, never>) => void);
|
|
1005
|
+
/**
|
|
1006
|
+
* The viewer pressed the verify button on an account with no card program. The element starts the hosted session and leaves for it itself — this fires alongside, so a host can record the trip or show its own state.
|
|
1007
|
+
*/
|
|
1008
|
+
onVerificationRequested?: ((payload: { accountId: string; }) => void);
|
|
865
1009
|
/**
|
|
866
1010
|
* Runs after the loading skeleton first paints and before `onReady`.
|
|
867
1011
|
*/
|
|
@@ -880,12 +1024,7 @@ export interface CardsElementCreateOptions {
|
|
|
880
1024
|
* Consumer props for the "balances" sub-controller: the `create("balances")` options and the minted sub handle's `update()` payload (React: `<Balances>` props). Parent-injected props never appear here.
|
|
881
1025
|
* @see https://docs.whop.com/elements/latest/wallet/overview
|
|
882
1026
|
*/
|
|
883
|
-
export interface BalancesSubOptions {
|
|
884
|
-
/**
|
|
885
|
-
* Runs when the grouped loading state changes. The value is `true` while any mounted element is still loading.
|
|
886
|
-
*/
|
|
887
|
-
onLoadingChange?: ((loading: boolean) => void);
|
|
888
|
-
}
|
|
1027
|
+
export interface BalancesSubOptions {}
|
|
889
1028
|
|
|
890
1029
|
/**
|
|
891
1030
|
* Consumer props for the "balances" sub-controller's "balance" element.
|
|
@@ -1120,9 +1259,9 @@ export interface ListElementCreateOptions {
|
|
|
1120
1259
|
*/
|
|
1121
1260
|
showPersonalAccount?: boolean;
|
|
1122
1261
|
/**
|
|
1123
|
-
* A holding row was clicked, with `includeOwnedAccounts` off. `
|
|
1262
|
+
* A holding row was clicked, with `includeOwnedAccounts` off. `holding` is `usd` for the combined dollar row, otherwise the holding symbol (`cbBTC`, `EUR`), and `kind` tells you which of the three it is so you can route without classifying symbols yourself. The element never navigates.
|
|
1124
1263
|
*/
|
|
1125
|
-
onBalanceSelected?: ((payload: {
|
|
1264
|
+
onBalanceSelected?: ((payload: { holding: string; kind: "usd" | "cash" | "asset"; }) => void);
|
|
1126
1265
|
/**
|
|
1127
1266
|
* An account row was clicked, with `includeOwnedAccounts` on. `accountId` is the personal `user_…` tag or an owned `biz_…` tag, and `kind` lets you route without inspecting it. The element never navigates.
|
|
1128
1267
|
*/
|
|
@@ -1173,6 +1312,10 @@ export interface WalletHandle {
|
|
|
1173
1312
|
* An account's ledger activity: every movement of money in or out, newest first. The list pages as the viewer scrolls, and rows report which one was tapped instead of navigating, so you can open your own detail screen.
|
|
1174
1313
|
*/
|
|
1175
1314
|
create(name: "activity", options?: ActivityElementCreateOptions): ActivityElementHandle;
|
|
1315
|
+
/**
|
|
1316
|
+
* The account action row from Whop's balance dashboard. Deposit and Send open the Wallet controller's built-in overlays. Accept opens Whop's checkout-link creator for a business account or company creation for a personal account. Each button also emits its requested event so the embedding page can observe the action.
|
|
1317
|
+
*/
|
|
1318
|
+
create(name: "actions", options?: ActionsElementCreateOptions): ActionsElementHandle;
|
|
1176
1319
|
/**
|
|
1177
1320
|
* Funds a Whop account. Renders an amount field and the account's live funding rails — crypto (a per-network deposit address with its QR) and bank transfer (the wire fields for each settlement currency) — resolved from the account ID with no credentials, so it works on any page. Cards and platform balance are opt-in: pass `savedCards`, `allowNewCard`, or `showPlatformBalance` and the element collects the amount and the choice, then emits `cardDepositRequested` / `addCardRequested` / `platformBalanceSelected` and waits for you to call `showStep({ step: 'amount' })` when your own screen is done.
|
|
1178
1321
|
*/
|
|
@@ -1209,6 +1352,10 @@ export interface WalletHandle {
|
|
|
1209
1352
|
* Merges new handle options into every mounted element. In React, change the namespace props instead.
|
|
1210
1353
|
*/
|
|
1211
1354
|
update(options: Partial<WalletOptions>): void;
|
|
1355
|
+
/**
|
|
1356
|
+
* Destroys every element and sub-controller this handle created, removes the controller frame, and releases its subscriptions. You can call it more than once, but a destroyed handle refuses any other call — create a new handle to start over. React removes the group automatically when the provider unmounts.
|
|
1357
|
+
*/
|
|
1358
|
+
destroy(): void;
|
|
1212
1359
|
}
|
|
1213
1360
|
|
|
1214
1361
|
/**
|
|
@@ -1230,6 +1377,28 @@ export interface ActivityDateRangeOverride {
|
|
|
1230
1377
|
displayPostedBefore?: string | undefined;
|
|
1231
1378
|
}
|
|
1232
1379
|
|
|
1380
|
+
/**
|
|
1381
|
+
* Declared from the app's `Money`, referenced by a host-capability surface.
|
|
1382
|
+
*/
|
|
1383
|
+
export interface Money {
|
|
1384
|
+
/**
|
|
1385
|
+
* Three-letter ISO 4217 currency code, lowercase.
|
|
1386
|
+
*/
|
|
1387
|
+
currency: string;
|
|
1388
|
+
/**
|
|
1389
|
+
* The amount in major units, as an exact decimal string — `"10.00"` is ten dollars. A string so no float rounds it in transit.
|
|
1390
|
+
*/
|
|
1391
|
+
amount: string;
|
|
1392
|
+
/**
|
|
1393
|
+
* How many decimal places the amount CARRIES — the precision the charge itself runs at.
|
|
1394
|
+
*/
|
|
1395
|
+
decimals: number;
|
|
1396
|
+
/**
|
|
1397
|
+
* How many decimal places to SHOW. Usually equal to `decimals`, and deliberately not always: COP is charged in centavos but written in whole pesos, so it is `2` and `0`. Format the number in your own locale using this.
|
|
1398
|
+
*/
|
|
1399
|
+
display_decimals: number;
|
|
1400
|
+
}
|
|
1401
|
+
|
|
1233
1402
|
/**
|
|
1234
1403
|
* Declared from the app's `LedgerActivity`, referenced by a host-capability surface.
|
|
1235
1404
|
*/
|
|
@@ -1242,7 +1411,7 @@ export interface LedgerActivity {
|
|
|
1242
1411
|
/**
|
|
1243
1412
|
* The ledger line category this activity was posted under.
|
|
1244
1413
|
*/
|
|
1245
|
-
line_type: "ad_budget_release" | "ad_campaign_budget" | "ad_publisher_payout" | "ad_publisher_payout_received" | "ad_spend_charge" | "affiliate_fee" | "airdrop" | "airdrop_link_created" | "airdrop_link_redeemed" | "airdrop_link_returned" | "airdrop_reversal" | "application_fee" | "application_fee_payout" | "bank_transfer" | "billing_percentage_fee" | "buyer_fee" | "card_spend_authorization" | "card_spend_authorization_void" | "card_spend_refund" | "company_referral" | "cross_border_percentage_fee" | "currency_conversion_incoming" | "currency_conversion_outgoing" | "dispute_alert_fee" | "dispute_hold_adjustment" | "dispute_representment_fee" | "fraud_prevention_fee" | "fx_percentage_fee" | "high_risk_merchant_fee" | "installment_default" | "internal_balance_transfer_incoming" | "internal_balance_transfer_outgoing" | "internal_withdrawal" | "internal_withdrawal_reversal" | "legacy_crypto_payment" | "legacy_payment" | "legacy_payment_refund" | "license_sale" | "license_sale_commission" | "license_sale_revenue" | "misc_purchase" | "misc_refund" | "misc_reversal" | "onchain_deposit" | "onchain_swap_target" | "onchain_wallet_transfer_incoming" | "onchain_wallet_transfer_outgoing" | "orchestration_percentage_fee" | "passthrough_gmv" | "payment_dispute" | "payment_dispute_adjustment" | "payment_dispute_fee" | "payment_dispute_reversal" | "payment_gross" | "payment_gross_reversal" | "payment_processing_fixed_fee" | "payment_processing_percentage_fee" | "payment_referral" | "payment_referral_reversal" | "payment_refund" | "payment_refund_reversal" | "payment_revshare" | "payment_revshare_payout" | "payment_revshare_refund" | "payment_revshare_reversal" | "payout_fee" | "platform_affiliate_payment" | "platform_affiliate_payment_reversal" | "platform_balance_payment" | "platform_balance_payment_refund" | "platform_balance_transfer_incoming" | "platform_balance_transfer_outgoing" | "platform_covered_dispute" | "promo_reversal" | "referral_bonus" | "resolution_center_refund" | "revshare_percentage_fee" | "sales_tax_fee" | "sales_tax_remittance" | "sales_tax_remittance_reversal" | "software_rental_revshare" | "software_rental_transaction" | "stripe_domestic_processing_fee" | "stripe_international_processing_fee" | "three_ds_fixed_fee" | "topup" | "topup_fee" | "topup_reversal" | "treasury_payin" | "whop_processing_fee" | "withdrawal" | "withdrawal_clawback" | "withdrawal_clawback_reversal" | "withdrawal_reclassification" | "withdrawal_reversal";
|
|
1414
|
+
line_type: "ad_budget_release" | "ad_campaign_budget" | "ad_publisher_payout" | "ad_publisher_payout_received" | "ad_spend_charge" | "affiliate_fee" | "airdrop" | "airdrop_link_created" | "airdrop_link_redeemed" | "airdrop_link_returned" | "airdrop_reversal" | "application_fee" | "application_fee_payout" | "balance_reservation" | "balance_reservation_reversal" | "bank_transfer" | "billing_percentage_fee" | "buyer_fee" | "card_spend_authorization" | "card_spend_authorization_void" | "card_spend_refund" | "company_referral" | "cross_border_percentage_fee" | "currency_conversion_incoming" | "currency_conversion_outgoing" | "dispute_alert_fee" | "dispute_hold_adjustment" | "dispute_representment_fee" | "fraud_prevention_fee" | "fx_percentage_fee" | "high_risk_merchant_fee" | "installment_default" | "internal_balance_transfer_incoming" | "internal_balance_transfer_outgoing" | "internal_withdrawal" | "internal_withdrawal_reversal" | "legacy_crypto_payment" | "legacy_payment" | "legacy_payment_refund" | "license_sale" | "license_sale_commission" | "license_sale_revenue" | "misc_purchase" | "misc_refund" | "misc_reversal" | "onchain_deposit" | "onchain_swap_target" | "onchain_wallet_transfer_incoming" | "onchain_wallet_transfer_outgoing" | "orchestration_percentage_fee" | "passthrough_gmv" | "payment_dispute" | "payment_dispute_adjustment" | "payment_dispute_fee" | "payment_dispute_reversal" | "payment_gross" | "payment_gross_reversal" | "payment_processing_fixed_fee" | "payment_processing_percentage_fee" | "payment_referral" | "payment_referral_reversal" | "payment_refund" | "payment_refund_reversal" | "payment_revshare" | "payment_revshare_payout" | "payment_revshare_refund" | "payment_revshare_reversal" | "payout_fee" | "platform_affiliate_payment" | "platform_affiliate_payment_reversal" | "platform_balance_payment" | "platform_balance_payment_refund" | "platform_balance_transfer_incoming" | "platform_balance_transfer_outgoing" | "platform_covered_dispute" | "promo_reversal" | "referral_bonus" | "resolution_center_refund" | "revshare_percentage_fee" | "sales_tax_fee" | "sales_tax_remittance" | "sales_tax_remittance_reversal" | "software_rental_revshare" | "software_rental_transaction" | "stripe_domestic_processing_fee" | "stripe_international_processing_fee" | "three_ds_fixed_fee" | "topup" | "topup_fee" | "topup_reversal" | "treasury_payin" | "whop_processing_fee" | "withdrawal" | "withdrawal_clawback" | "withdrawal_clawback_reversal" | "withdrawal_reclassification" | "withdrawal_reversal";
|
|
1246
1415
|
/**
|
|
1247
1416
|
* Signed amount in the currency's smallest precision units.
|
|
1248
1417
|
*/
|
|
@@ -1270,7 +1439,11 @@ export interface LedgerActivity {
|
|
|
1270
1439
|
/**
|
|
1271
1440
|
* Source of this ledger activity.
|
|
1272
1441
|
*/
|
|
1273
|
-
source: { object: string; id: string; status?: string | null | undefined; reason?: string | null | undefined; claim_url?: string | null | undefined; amount_float?: number | null | undefined; created_at?: string | null | undefined; estimated_arrival?: string | null | undefined; payer_name?: string | null | undefined; payout_token_nickname?: string | null | undefined; tx_hash?: string | null | undefined; sender_address?: string | null | undefined; chain?: string | null | undefined; from_amount?: string | null | undefined; from_currency?: string | null | undefined; to_amount?: string | null | undefined; to_currency?: string | null | undefined; payout_destination?: { payer_name?: string | null | undefined; icon_url?: string | null | undefined; } | null | undefined; [key: string]: unknown; } | null;
|
|
1442
|
+
source: { object: string; id: string; status?: string | null | undefined; payment_amount?: Money | null | undefined; payment_method_type?: string | null | undefined; payment_processor?: string | null | undefined; card_brand?: string | null | undefined; reason?: string | null | undefined; claim_url?: string | null | undefined; amount_float?: number | null | undefined; created_at?: string | null | undefined; estimated_arrival?: string | null | undefined; payer_name?: string | null | undefined; payout_token_nickname?: string | null | undefined; tx_hash?: string | null | undefined; sender_address?: string | null | undefined; chain?: string | null | undefined; from_amount?: string | null | undefined; from_currency?: string | null | undefined; to_amount?: string | null | undefined; to_currency?: string | null | undefined; payout_destination?: { payer_name?: string | null | undefined; icon_url?: string | null | undefined; } | null | undefined; [key: string]: unknown; } | null;
|
|
1443
|
+
/**
|
|
1444
|
+
* Payment related to this ledger activity. Included when rich resource hydration is enabled and the movement is tied to a payment.
|
|
1445
|
+
*/
|
|
1446
|
+
payment?: { object: "payment"; id: string; amount: Money | null; payment_method_type: string | null; payment_processor: string | null; card_brand: string | null; card_last4: string | null; created_at: string; } | null | undefined;
|
|
1274
1447
|
/**
|
|
1275
1448
|
* The viewer account that owns this row's ledger. Present only when the response aggregates owned accounts (include_owned_accounts=true); omitted otherwise.
|
|
1276
1449
|
*/
|