@stripe/connect-js 3.3.30-preview-1 → 3.3.32-preview-1
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 +3 -3
- package/dist/connect.esm.js +10 -5
- package/dist/connect.js +10 -5
- package/dist/pure.esm.js +10 -5
- package/dist/pure.js +10 -5
- package/dist/src/index.d.ts +1 -1
- package/dist/src/pure.d.ts +1 -1
- package/dist/src/shared.d.ts +2 -1
- package/dist/types/config.d.ts +2 -4
- package/package.json +13 -9
- package/src/index.ts +3 -6
- package/src/pure.test.ts +2 -2
- package/src/pure.ts +3 -6
- package/src/shared.ts +33 -23
- package/types/checks.ts +2 -2
- package/types/config.ts +28 -26
- package/types/index.d.ts +1 -1
- package/types/shared.d.ts +2 -2
package/README.md
CHANGED
|
@@ -36,7 +36,7 @@ const fetchClientSecret = async () => {
|
|
|
36
36
|
|
|
37
37
|
const instance = loadConnectAndInitialize({
|
|
38
38
|
publishableKey: "{{pk test123}}",
|
|
39
|
-
fetchClientSecret: fetchClientSecret
|
|
39
|
+
fetchClientSecret: fetchClientSecret,
|
|
40
40
|
});
|
|
41
41
|
```
|
|
42
42
|
|
|
@@ -47,7 +47,7 @@ test this code through your Connect account.
|
|
|
47
47
|
If you have deployed a
|
|
48
48
|
[Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/Security/CSP),
|
|
49
49
|
make sure to
|
|
50
|
-
[include Connect.js in your directives](https://stripe.com/docs/
|
|
50
|
+
[include Connect.js in your directives](https://stripe.com/docs/connect/get-started-connect-embedded-components?platform=web#csp-and-http-header-requirements).
|
|
51
51
|
|
|
52
52
|
### Import as a side effect
|
|
53
53
|
|
|
@@ -71,6 +71,6 @@ import { loadConnectAndInitialize } from "@stripe/connect-js/pure";
|
|
|
71
71
|
// Connect.js will not be loaded until `loadConnect` is called
|
|
72
72
|
const instance = loadConnectAndInitialize({
|
|
73
73
|
publishableKey: "{{pk test123}}",
|
|
74
|
-
fetchClientSecret: fetchClientSecret
|
|
74
|
+
fetchClientSecret: fetchClientSecret,
|
|
75
75
|
});
|
|
76
76
|
```
|
package/dist/connect.esm.js
CHANGED
|
@@ -159,6 +159,13 @@ const injectScript = () => {
|
|
|
159
159
|
return script;
|
|
160
160
|
};
|
|
161
161
|
let stripePromise = null;
|
|
162
|
+
const isWindowStripeConnectDefined = stripeConnect => {
|
|
163
|
+
// We only consider `StripeConnect` defined if `init` is a function
|
|
164
|
+
// Why? HTML markup like:
|
|
165
|
+
// <a id="StripeConnect"><a id="StripeConnect" name="init" href="stripe"></a></a> in the <head> of the page
|
|
166
|
+
// can end up "contaminating" the window.StripeConnect object and cause issues in connect.js initialization
|
|
167
|
+
return !!(stripeConnect && typeof stripeConnect === "object" && "init" in stripeConnect && typeof stripeConnect.init === "function");
|
|
168
|
+
};
|
|
162
169
|
const loadScript = () => {
|
|
163
170
|
// Ensure that we only attempt to load Connect.js at most once
|
|
164
171
|
if (stripePromise !== null) {
|
|
@@ -169,10 +176,8 @@ const loadScript = () => {
|
|
|
169
176
|
reject("ConnectJS won't load when rendering code in the server - it can only be loaded on a browser. This error is expected when loading ConnectJS in SSR environments, like NextJS. It will have no impact in the UI, however if you wish to avoid it, you can switch to the `pure` version of the connect.js loader: https://github.com/stripe/connect-js#importing-loadconnect-without-side-effects.");
|
|
170
177
|
return;
|
|
171
178
|
}
|
|
172
|
-
if (window.StripeConnect) {
|
|
179
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
173
180
|
console.warn(EXISTING_SCRIPT_MESSAGE);
|
|
174
|
-
}
|
|
175
|
-
if (window.StripeConnect) {
|
|
176
181
|
const wrapper = createWrapper(window.StripeConnect);
|
|
177
182
|
resolve(wrapper);
|
|
178
183
|
return;
|
|
@@ -185,7 +190,7 @@ const loadScript = () => {
|
|
|
185
190
|
script = injectScript();
|
|
186
191
|
}
|
|
187
192
|
script.addEventListener("load", () => {
|
|
188
|
-
if (window.StripeConnect) {
|
|
193
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
189
194
|
const wrapper = createWrapper(window.StripeConnect);
|
|
190
195
|
resolve(wrapper);
|
|
191
196
|
} else {
|
|
@@ -283,7 +288,7 @@ const createWrapper = stripeConnect => {
|
|
|
283
288
|
sdk: true,
|
|
284
289
|
sdkOptions: {
|
|
285
290
|
// This will be replaced by the npm package version when bundling
|
|
286
|
-
sdkVersion: "3.3.
|
|
291
|
+
sdkVersion: "3.3.32-preview-1"
|
|
287
292
|
}
|
|
288
293
|
})
|
|
289
294
|
}));
|
package/dist/connect.js
CHANGED
|
@@ -163,6 +163,13 @@ const injectScript = () => {
|
|
|
163
163
|
return script;
|
|
164
164
|
};
|
|
165
165
|
let stripePromise = null;
|
|
166
|
+
const isWindowStripeConnectDefined = stripeConnect => {
|
|
167
|
+
// We only consider `StripeConnect` defined if `init` is a function
|
|
168
|
+
// Why? HTML markup like:
|
|
169
|
+
// <a id="StripeConnect"><a id="StripeConnect" name="init" href="stripe"></a></a> in the <head> of the page
|
|
170
|
+
// can end up "contaminating" the window.StripeConnect object and cause issues in connect.js initialization
|
|
171
|
+
return !!(stripeConnect && typeof stripeConnect === "object" && "init" in stripeConnect && typeof stripeConnect.init === "function");
|
|
172
|
+
};
|
|
166
173
|
const loadScript = () => {
|
|
167
174
|
// Ensure that we only attempt to load Connect.js at most once
|
|
168
175
|
if (stripePromise !== null) {
|
|
@@ -173,10 +180,8 @@ const loadScript = () => {
|
|
|
173
180
|
reject("ConnectJS won't load when rendering code in the server - it can only be loaded on a browser. This error is expected when loading ConnectJS in SSR environments, like NextJS. It will have no impact in the UI, however if you wish to avoid it, you can switch to the `pure` version of the connect.js loader: https://github.com/stripe/connect-js#importing-loadconnect-without-side-effects.");
|
|
174
181
|
return;
|
|
175
182
|
}
|
|
176
|
-
if (window.StripeConnect) {
|
|
183
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
177
184
|
console.warn(EXISTING_SCRIPT_MESSAGE);
|
|
178
|
-
}
|
|
179
|
-
if (window.StripeConnect) {
|
|
180
185
|
const wrapper = createWrapper(window.StripeConnect);
|
|
181
186
|
resolve(wrapper);
|
|
182
187
|
return;
|
|
@@ -189,7 +194,7 @@ const loadScript = () => {
|
|
|
189
194
|
script = injectScript();
|
|
190
195
|
}
|
|
191
196
|
script.addEventListener("load", () => {
|
|
192
|
-
if (window.StripeConnect) {
|
|
197
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
193
198
|
const wrapper = createWrapper(window.StripeConnect);
|
|
194
199
|
resolve(wrapper);
|
|
195
200
|
} else {
|
|
@@ -287,7 +292,7 @@ const createWrapper = stripeConnect => {
|
|
|
287
292
|
sdk: true,
|
|
288
293
|
sdkOptions: {
|
|
289
294
|
// This will be replaced by the npm package version when bundling
|
|
290
|
-
sdkVersion: "3.3.
|
|
295
|
+
sdkVersion: "3.3.32-preview-1"
|
|
291
296
|
}
|
|
292
297
|
})
|
|
293
298
|
}));
|
package/dist/pure.esm.js
CHANGED
|
@@ -159,6 +159,13 @@ const injectScript = () => {
|
|
|
159
159
|
return script;
|
|
160
160
|
};
|
|
161
161
|
let stripePromise = null;
|
|
162
|
+
const isWindowStripeConnectDefined = stripeConnect => {
|
|
163
|
+
// We only consider `StripeConnect` defined if `init` is a function
|
|
164
|
+
// Why? HTML markup like:
|
|
165
|
+
// <a id="StripeConnect"><a id="StripeConnect" name="init" href="stripe"></a></a> in the <head> of the page
|
|
166
|
+
// can end up "contaminating" the window.StripeConnect object and cause issues in connect.js initialization
|
|
167
|
+
return !!(stripeConnect && typeof stripeConnect === "object" && "init" in stripeConnect && typeof stripeConnect.init === "function");
|
|
168
|
+
};
|
|
162
169
|
const loadScript = () => {
|
|
163
170
|
// Ensure that we only attempt to load Connect.js at most once
|
|
164
171
|
if (stripePromise !== null) {
|
|
@@ -169,10 +176,8 @@ const loadScript = () => {
|
|
|
169
176
|
reject("ConnectJS won't load when rendering code in the server - it can only be loaded on a browser. This error is expected when loading ConnectJS in SSR environments, like NextJS. It will have no impact in the UI, however if you wish to avoid it, you can switch to the `pure` version of the connect.js loader: https://github.com/stripe/connect-js#importing-loadconnect-without-side-effects.");
|
|
170
177
|
return;
|
|
171
178
|
}
|
|
172
|
-
if (window.StripeConnect) {
|
|
179
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
173
180
|
console.warn(EXISTING_SCRIPT_MESSAGE);
|
|
174
|
-
}
|
|
175
|
-
if (window.StripeConnect) {
|
|
176
181
|
const wrapper = createWrapper(window.StripeConnect);
|
|
177
182
|
resolve(wrapper);
|
|
178
183
|
return;
|
|
@@ -185,7 +190,7 @@ const loadScript = () => {
|
|
|
185
190
|
script = injectScript();
|
|
186
191
|
}
|
|
187
192
|
script.addEventListener("load", () => {
|
|
188
|
-
if (window.StripeConnect) {
|
|
193
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
189
194
|
const wrapper = createWrapper(window.StripeConnect);
|
|
190
195
|
resolve(wrapper);
|
|
191
196
|
} else {
|
|
@@ -283,7 +288,7 @@ const createWrapper = stripeConnect => {
|
|
|
283
288
|
sdk: true,
|
|
284
289
|
sdkOptions: {
|
|
285
290
|
// This will be replaced by the npm package version when bundling
|
|
286
|
-
sdkVersion: "3.3.
|
|
291
|
+
sdkVersion: "3.3.32-preview-1"
|
|
287
292
|
}
|
|
288
293
|
})
|
|
289
294
|
}));
|
package/dist/pure.js
CHANGED
|
@@ -163,6 +163,13 @@ const injectScript = () => {
|
|
|
163
163
|
return script;
|
|
164
164
|
};
|
|
165
165
|
let stripePromise = null;
|
|
166
|
+
const isWindowStripeConnectDefined = stripeConnect => {
|
|
167
|
+
// We only consider `StripeConnect` defined if `init` is a function
|
|
168
|
+
// Why? HTML markup like:
|
|
169
|
+
// <a id="StripeConnect"><a id="StripeConnect" name="init" href="stripe"></a></a> in the <head> of the page
|
|
170
|
+
// can end up "contaminating" the window.StripeConnect object and cause issues in connect.js initialization
|
|
171
|
+
return !!(stripeConnect && typeof stripeConnect === "object" && "init" in stripeConnect && typeof stripeConnect.init === "function");
|
|
172
|
+
};
|
|
166
173
|
const loadScript = () => {
|
|
167
174
|
// Ensure that we only attempt to load Connect.js at most once
|
|
168
175
|
if (stripePromise !== null) {
|
|
@@ -173,10 +180,8 @@ const loadScript = () => {
|
|
|
173
180
|
reject("ConnectJS won't load when rendering code in the server - it can only be loaded on a browser. This error is expected when loading ConnectJS in SSR environments, like NextJS. It will have no impact in the UI, however if you wish to avoid it, you can switch to the `pure` version of the connect.js loader: https://github.com/stripe/connect-js#importing-loadconnect-without-side-effects.");
|
|
174
181
|
return;
|
|
175
182
|
}
|
|
176
|
-
if (window.StripeConnect) {
|
|
183
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
177
184
|
console.warn(EXISTING_SCRIPT_MESSAGE);
|
|
178
|
-
}
|
|
179
|
-
if (window.StripeConnect) {
|
|
180
185
|
const wrapper = createWrapper(window.StripeConnect);
|
|
181
186
|
resolve(wrapper);
|
|
182
187
|
return;
|
|
@@ -189,7 +194,7 @@ const loadScript = () => {
|
|
|
189
194
|
script = injectScript();
|
|
190
195
|
}
|
|
191
196
|
script.addEventListener("load", () => {
|
|
192
|
-
if (window.StripeConnect) {
|
|
197
|
+
if (isWindowStripeConnectDefined(window.StripeConnect)) {
|
|
193
198
|
const wrapper = createWrapper(window.StripeConnect);
|
|
194
199
|
resolve(wrapper);
|
|
195
200
|
} else {
|
|
@@ -287,7 +292,7 @@ const createWrapper = stripeConnect => {
|
|
|
287
292
|
sdk: true,
|
|
288
293
|
sdkOptions: {
|
|
289
294
|
// This will be replaced by the npm package version when bundling
|
|
290
|
-
sdkVersion: "3.3.
|
|
295
|
+
sdkVersion: "3.3.32-preview-1"
|
|
291
296
|
}
|
|
292
297
|
})
|
|
293
298
|
}));
|
package/dist/src/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { LoadConnectAndInitialize } from "./shared";
|
|
1
|
+
import type { LoadConnectAndInitialize } from "./shared";
|
|
2
2
|
export declare const loadConnectAndInitialize: LoadConnectAndInitialize;
|
package/dist/src/pure.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { LoadConnectAndInitialize } from "./shared";
|
|
1
|
+
import type { LoadConnectAndInitialize } from "./shared";
|
|
2
2
|
export declare const loadConnectAndInitialize: LoadConnectAndInitialize;
|
package/dist/src/shared.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { IStripeConnectInitParams, StripeConnectInstance, ConnectElementTagName } from "../types";
|
|
1
|
+
import type { IStripeConnectInitParams, StripeConnectInstance, ConnectElementTagName } from "../types";
|
|
2
2
|
export type LoadConnectAndInitialize = (initParams: IStripeConnectInitParams) => StripeConnectInstance;
|
|
3
3
|
export type ConnectElementHTMLName = "stripe-connect-payments" | "stripe-connect-payouts" | "stripe-connect-payment-details" | "stripe-connect-payment-disputes" | "stripe-connect-account-onboarding" | "stripe-connect-payment-method-settings" | "stripe-connect-account-management" | "stripe-connect-notification-banner" | "stripe-connect-instant-payouts" | "stripe-connect-issuing-card" | "stripe-connect-issuing-cards-list" | "stripe-connect-financial-account" | "stripe-connect-financial-account-transactions" | "stripe-connect-recipients" | "stripe-connect-capital-financing" | "stripe-connect-capital-financing-application" | "stripe-connect-capital-financing-promotion" | "stripe-connect-capital-overview" | "stripe-connect-documents" | "stripe-connect-product-tax-code-selector" | "stripe-connect-export-tax-transactions" | "stripe-connect-tax-registrations" | "stripe-connect-tax-settings" | "stripe-connect-tax-threshold-monitoring" | "stripe-connect-balances" | "stripe-connect-payouts-list" | "stripe-connect-app-install" | "stripe-connect-app-viewport" | "stripe-connect-reporting-chart";
|
|
4
4
|
export declare const componentNameMapping: Record<ConnectElementTagName, ConnectElementHTMLName>;
|
|
@@ -9,6 +9,7 @@ interface StripeConnectWrapper {
|
|
|
9
9
|
initialize: (params: IStripeConnectInitParams) => StripeConnectInstance;
|
|
10
10
|
}
|
|
11
11
|
export declare const findScript: () => HTMLScriptElement | null;
|
|
12
|
+
export declare const isWindowStripeConnectDefined: (stripeConnect: unknown) => boolean;
|
|
12
13
|
export declare const loadScript: () => Promise<StripeConnectWrapper>;
|
|
13
14
|
export declare const initStripeConnect: (stripePromise: Promise<StripeConnectWrapper>, initParams: IStripeConnectInitParams) => StripeConnectInstanceExtended;
|
|
14
15
|
export {};
|
package/dist/types/config.d.ts
CHANGED
|
@@ -176,7 +176,7 @@ export declare const ConnectElementCustomMethodConfig: {
|
|
|
176
176
|
"capital-financing-promotion": {
|
|
177
177
|
setLayout: (_layout: FinancingPromotionLayoutType | undefined) => void;
|
|
178
178
|
setOnApplicationSubmitted: (_listener: (() => void) | undefined) => void;
|
|
179
|
-
setOnEligibleFinancingOfferLoaded: (_listener: (({ productType, activeFinancingCount }: FinancingProductType) => void) | undefined) => void;
|
|
179
|
+
setOnEligibleFinancingOfferLoaded: (_listener: (({ productType, activeFinancingCount, }: FinancingProductType) => void) | undefined) => void;
|
|
180
180
|
setPrivacyPolicyUrl: (_privacyPolicyUrl: string | undefined) => void;
|
|
181
181
|
setHowCapitalWorksUrl: (_howCapitalWorksUrl: string | undefined) => void;
|
|
182
182
|
setEligibilityCriteriaUrl: (_eligibilityCriteriaUrl: string | undefined) => void;
|
|
@@ -204,9 +204,7 @@ export declare const ConnectElementCustomMethodConfig: {
|
|
|
204
204
|
setDisplayCountries: (_countries: string[] | undefined) => void;
|
|
205
205
|
};
|
|
206
206
|
"product-tax-code-selector": {
|
|
207
|
-
setOnTaxCodeSelect: (_listener: ((
|
|
208
|
-
taxCode: string;
|
|
209
|
-
}) => void) | undefined) => void;
|
|
207
|
+
setOnTaxCodeSelect: (_listener: ((taxCode: string) => void) | undefined) => void;
|
|
210
208
|
setHideDescription: (_hideDescription: boolean | undefined) => void;
|
|
211
209
|
setDisabled: (_disabled: boolean | undefined) => void;
|
|
212
210
|
setInitialTaxCode: (_initialTaxCode: string | undefined) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stripe/connect-js",
|
|
3
|
-
"version": "3.3.
|
|
3
|
+
"version": "3.3.32-preview-1",
|
|
4
4
|
"description": "Connect.js loading utility package",
|
|
5
5
|
"main": "dist/connect.js",
|
|
6
6
|
"module": "dist/connect.esm.js",
|
|
@@ -11,6 +11,7 @@
|
|
|
11
11
|
"test:unit": "jest",
|
|
12
12
|
"test:types": "zx ./tests/types/scripts/test.mjs",
|
|
13
13
|
"lint": "eslint '{src,types}/**/*.{ts,js}' && yarn prettier-check",
|
|
14
|
+
"lint-fix": "eslint '{src,types}/**/*.{ts,js}' --fix && yarn prettier-check",
|
|
14
15
|
"typecheck": "tsc --noEmit",
|
|
15
16
|
"build": "yarn clean && rollup -c",
|
|
16
17
|
"validate-change": "yarn run test",
|
|
@@ -45,19 +46,22 @@
|
|
|
45
46
|
"@rollup/plugin-json": "^6.0.0",
|
|
46
47
|
"@rollup/plugin-replace": "^2.3.1",
|
|
47
48
|
"@types/jest": "^24.0.25",
|
|
48
|
-
"@typescript-eslint/eslint-plugin": "^
|
|
49
|
-
"@typescript-eslint/parser": "^
|
|
49
|
+
"@typescript-eslint/eslint-plugin": "^7",
|
|
50
|
+
"@typescript-eslint/parser": "^7",
|
|
51
|
+
"@typescript-eslint/rule-tester": "^7",
|
|
52
|
+
"@typescript-eslint/scope-manager": "^7",
|
|
53
|
+
"@typescript-eslint/utils": "^7",
|
|
50
54
|
"babel-eslint": "^10.0.3",
|
|
51
55
|
"babel-jest": "^24.9.0",
|
|
52
56
|
"conditional-type-checks": "^1.0.5",
|
|
53
|
-
"eslint": "
|
|
54
|
-
"eslint-config-prettier": "^
|
|
55
|
-
"eslint-plugin-import": "^2.
|
|
56
|
-
"eslint-plugin-jest": "^
|
|
57
|
-
"eslint-plugin-prettier": "^
|
|
57
|
+
"eslint": "8.56.0",
|
|
58
|
+
"eslint-config-prettier": "^8.3.0",
|
|
59
|
+
"eslint-plugin-import": "^2.20.1",
|
|
60
|
+
"eslint-plugin-jest": "^26.6.0",
|
|
61
|
+
"eslint-plugin-prettier": "^4.2.1",
|
|
58
62
|
"jest": "^29.5.0",
|
|
59
63
|
"jest-environment-jsdom": "^29.5.0",
|
|
60
|
-
"prettier": "
|
|
64
|
+
"prettier": "2.8.8",
|
|
61
65
|
"rimraf": "^2.6.2",
|
|
62
66
|
"rollup": "^1.29.0",
|
|
63
67
|
"rollup-plugin-babel": "^4.4.0",
|
package/src/index.ts
CHANGED
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
import { IStripeConnectInitParams, StripeConnectInstance } from "../types";
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
initStripeConnect,
|
|
5
|
-
LoadConnectAndInitialize
|
|
6
|
-
} from "./shared";
|
|
1
|
+
import type { IStripeConnectInitParams, StripeConnectInstance } from "../types";
|
|
2
|
+
import type { LoadConnectAndInitialize } from "./shared";
|
|
3
|
+
import { loadScript, initStripeConnect } from "./shared";
|
|
7
4
|
|
|
8
5
|
// Execute our own script injection after a tick to give users time to do their
|
|
9
6
|
// own script injection.
|
package/src/pure.test.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* eslint-disable @typescript-eslint/no-var-requires */
|
|
2
2
|
|
|
3
|
-
import { IStripeConnectInitParams } from "../types";
|
|
3
|
+
import type { IStripeConnectInitParams } from "../types";
|
|
4
4
|
import { SCRIPT_SELECTOR } from "./utils/jestHelpers";
|
|
5
5
|
|
|
6
6
|
describe("pure module", () => {
|
|
@@ -16,7 +16,7 @@ describe("pure module", () => {
|
|
|
16
16
|
publishableKey: "pk_123",
|
|
17
17
|
fetchClientSecret: async () => {
|
|
18
18
|
return "secret_123";
|
|
19
|
-
}
|
|
19
|
+
},
|
|
20
20
|
};
|
|
21
21
|
loadConnectAndInitialize(mockInitParams);
|
|
22
22
|
|
package/src/pure.ts
CHANGED
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
import { IStripeConnectInitParams, StripeConnectInstance } from "../types";
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
initStripeConnect,
|
|
5
|
-
LoadConnectAndInitialize
|
|
6
|
-
} from "./shared";
|
|
1
|
+
import type { IStripeConnectInitParams, StripeConnectInstance } from "../types";
|
|
2
|
+
import type { LoadConnectAndInitialize } from "./shared";
|
|
3
|
+
import { loadScript, initStripeConnect } from "./shared";
|
|
7
4
|
|
|
8
5
|
export const loadConnectAndInitialize: LoadConnectAndInitialize = (
|
|
9
6
|
initParams: IStripeConnectInitParams
|
package/src/shared.ts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import type {
|
|
2
2
|
IStripeConnectInitParams,
|
|
3
3
|
StripeConnectInstance,
|
|
4
4
|
ConnectElementTagName,
|
|
5
|
-
ConnectHTMLElementRecord
|
|
5
|
+
ConnectHTMLElementRecord,
|
|
6
6
|
} from "../types";
|
|
7
7
|
import {
|
|
8
8
|
ConnectElementCommonMethodConfig,
|
|
9
|
-
ConnectElementCustomMethodConfig
|
|
9
|
+
ConnectElementCustomMethodConfig,
|
|
10
10
|
} from "../types/config";
|
|
11
11
|
|
|
12
12
|
export type LoadConnectAndInitialize = (
|
|
@@ -78,7 +78,7 @@ export const componentNameMapping: Record<
|
|
|
78
78
|
"payouts-list": "stripe-connect-payouts-list",
|
|
79
79
|
"app-install": "stripe-connect-app-install",
|
|
80
80
|
"app-viewport": "stripe-connect-app-viewport",
|
|
81
|
-
"reporting-chart": "stripe-connect-reporting-chart"
|
|
81
|
+
"reporting-chart": "stripe-connect-reporting-chart",
|
|
82
82
|
};
|
|
83
83
|
|
|
84
84
|
type StripeConnectInstanceExtended = StripeConnectInstance & {
|
|
@@ -125,6 +125,19 @@ const injectScript = (): HTMLScriptElement => {
|
|
|
125
125
|
|
|
126
126
|
let stripePromise: Promise<StripeConnectWrapper> | null = null;
|
|
127
127
|
|
|
128
|
+
export const isWindowStripeConnectDefined = (stripeConnect: unknown) => {
|
|
129
|
+
// We only consider `StripeConnect` defined if `init` is a function
|
|
130
|
+
// Why? HTML markup like:
|
|
131
|
+
// <a id="StripeConnect"><a id="StripeConnect" name="init" href="stripe"></a></a> in the <head> of the page
|
|
132
|
+
// can end up "contaminating" the window.StripeConnect object and cause issues in connect.js initialization
|
|
133
|
+
return !!(
|
|
134
|
+
stripeConnect &&
|
|
135
|
+
typeof stripeConnect === "object" &&
|
|
136
|
+
"init" in stripeConnect &&
|
|
137
|
+
typeof stripeConnect.init === "function"
|
|
138
|
+
);
|
|
139
|
+
};
|
|
140
|
+
|
|
128
141
|
export const loadScript = (): Promise<StripeConnectWrapper> => {
|
|
129
142
|
// Ensure that we only attempt to load Connect.js at most once
|
|
130
143
|
if (stripePromise !== null) {
|
|
@@ -139,11 +152,8 @@ export const loadScript = (): Promise<StripeConnectWrapper> => {
|
|
|
139
152
|
return;
|
|
140
153
|
}
|
|
141
154
|
|
|
142
|
-
if ((window as any).StripeConnect) {
|
|
155
|
+
if (isWindowStripeConnectDefined((window as any).StripeConnect)) {
|
|
143
156
|
console.warn(EXISTING_SCRIPT_MESSAGE);
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
if ((window as any).StripeConnect) {
|
|
147
157
|
const wrapper = createWrapper((window as any).StripeConnect);
|
|
148
158
|
resolve(wrapper);
|
|
149
159
|
return;
|
|
@@ -159,7 +169,7 @@ export const loadScript = (): Promise<StripeConnectWrapper> => {
|
|
|
159
169
|
}
|
|
160
170
|
|
|
161
171
|
script.addEventListener("load", () => {
|
|
162
|
-
if ((window as any).StripeConnect) {
|
|
172
|
+
if (isWindowStripeConnectDefined((window as any).StripeConnect)) {
|
|
163
173
|
const wrapper = createWrapper((window as any).StripeConnect);
|
|
164
174
|
resolve(wrapper);
|
|
165
175
|
} else {
|
|
@@ -196,18 +206,18 @@ export const initStripeConnect = (
|
|
|
196
206
|
}
|
|
197
207
|
})();
|
|
198
208
|
const metaOptions = (initParams as any).metaOptions ?? {};
|
|
199
|
-
const stripeConnectInstance = stripePromise.then(wrapper =>
|
|
209
|
+
const stripeConnectInstance = stripePromise.then((wrapper) =>
|
|
200
210
|
wrapper.initialize({
|
|
201
211
|
...initParams,
|
|
202
|
-
metaOptions: { ...metaOptions, eagerClientSecretPromise }
|
|
212
|
+
metaOptions: { ...metaOptions, eagerClientSecretPromise },
|
|
203
213
|
} as any)
|
|
204
214
|
);
|
|
205
215
|
|
|
206
216
|
return {
|
|
207
|
-
create: tagName => {
|
|
217
|
+
create: (tagName) => {
|
|
208
218
|
let htmlName = componentNameMapping[tagName];
|
|
209
219
|
if (!htmlName) {
|
|
210
|
-
htmlName =
|
|
220
|
+
htmlName = tagName as unknown as ConnectElementHTMLName;
|
|
211
221
|
}
|
|
212
222
|
const element = document.createElement(htmlName);
|
|
213
223
|
|
|
@@ -216,14 +226,14 @@ export const initStripeConnect = (
|
|
|
216
226
|
: {};
|
|
217
227
|
const methods = { ...customMethods, ...ConnectElementCommonMethodConfig };
|
|
218
228
|
for (const method in methods) {
|
|
219
|
-
(element as any)[method] = function(value: any) {
|
|
229
|
+
(element as any)[method] = function (value: any) {
|
|
220
230
|
stripeConnectInstance.then(() => {
|
|
221
231
|
this[`${method}InternalOnly`](value);
|
|
222
232
|
});
|
|
223
233
|
};
|
|
224
234
|
}
|
|
225
235
|
|
|
226
|
-
stripeConnectInstance.then(instance => {
|
|
236
|
+
stripeConnectInstance.then((instance) => {
|
|
227
237
|
if (!element.isConnected && !(element as any).setConnector) {
|
|
228
238
|
// If the element is not connected to the DOM and the `setConnector` method is not
|
|
229
239
|
// defined, this indicates the element was created before connect.js was loaded, and has
|
|
@@ -251,8 +261,8 @@ export const initStripeConnect = (
|
|
|
251
261
|
|
|
252
262
|
return element as ConnectHTMLElementRecord[typeof tagName];
|
|
253
263
|
},
|
|
254
|
-
update: updateOptions => {
|
|
255
|
-
stripeConnectInstance.then(instance => {
|
|
264
|
+
update: (updateOptions) => {
|
|
265
|
+
stripeConnectInstance.then((instance) => {
|
|
256
266
|
instance.update(updateOptions);
|
|
257
267
|
});
|
|
258
268
|
},
|
|
@@ -260,10 +270,10 @@ export const initStripeConnect = (
|
|
|
260
270
|
return stripeConnectInstance;
|
|
261
271
|
},
|
|
262
272
|
logout: () => {
|
|
263
|
-
return stripeConnectInstance.then(instance => {
|
|
273
|
+
return stripeConnectInstance.then((instance) => {
|
|
264
274
|
return instance.logout();
|
|
265
275
|
});
|
|
266
|
-
}
|
|
276
|
+
},
|
|
267
277
|
};
|
|
268
278
|
};
|
|
269
279
|
|
|
@@ -280,12 +290,12 @@ const createWrapper = (stripeConnect: any) => {
|
|
|
280
290
|
sdk: true,
|
|
281
291
|
sdkOptions: {
|
|
282
292
|
// This will be replaced by the npm package version when bundling
|
|
283
|
-
sdkVersion: "_NPM_PACKAGE_VERSION_"
|
|
284
|
-
}
|
|
285
|
-
}
|
|
293
|
+
sdkVersion: "_NPM_PACKAGE_VERSION_",
|
|
294
|
+
},
|
|
295
|
+
},
|
|
286
296
|
});
|
|
287
297
|
return stripeConnectInstance;
|
|
288
|
-
}
|
|
298
|
+
},
|
|
289
299
|
};
|
|
290
300
|
return wrapper;
|
|
291
301
|
};
|
package/types/checks.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ConnectElementCustomMethodConfig } from "./config";
|
|
2
|
-
import { ConnectElementTagName } from "./shared.d";
|
|
1
|
+
import type { ConnectElementCustomMethodConfig } from "./config";
|
|
2
|
+
import type { ConnectElementTagName } from "./shared.d";
|
|
3
3
|
|
|
4
4
|
// ensure that keys of ConnectElementCustomMethodConfig are from ConnectElementTagName
|
|
5
5
|
export type HasType<T, Q extends T> = Q;
|
package/types/config.ts
CHANGED
|
@@ -202,24 +202,24 @@ export const ConnectElementCommonMethodConfig = {
|
|
|
202
202
|
): void => {},
|
|
203
203
|
setOnLoaderStart: (
|
|
204
204
|
_listener: (({ elementTagName }: LoaderStart) => void) | undefined
|
|
205
|
-
): void => {}
|
|
205
|
+
): void => {},
|
|
206
206
|
};
|
|
207
207
|
|
|
208
208
|
export const ConnectElementCustomMethodConfig = {
|
|
209
209
|
payments: {
|
|
210
210
|
setDefaultFilters: (
|
|
211
211
|
_filters: PaymentsListDefaultFilters | undefined
|
|
212
|
-
): void => {}
|
|
212
|
+
): void => {},
|
|
213
213
|
},
|
|
214
214
|
"payment-details": {
|
|
215
215
|
setPayment: (_payment: string | undefined): void => {},
|
|
216
|
-
setOnClose: (_listener: (() => void) | undefined): void => {}
|
|
216
|
+
setOnClose: (_listener: (() => void) | undefined): void => {},
|
|
217
217
|
},
|
|
218
218
|
"payment-disputes": {
|
|
219
219
|
setPayment: (_payment: string | undefined): void => {},
|
|
220
220
|
setOnDisputesLoaded: (
|
|
221
221
|
_listener: (({ total }: { total: number }) => void) | undefined
|
|
222
|
-
): void => {}
|
|
222
|
+
): void => {},
|
|
223
223
|
},
|
|
224
224
|
"account-onboarding": {
|
|
225
225
|
setFullTermsOfServiceUrl: (
|
|
@@ -238,12 +238,12 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
238
238
|
setOnExit: (_listener: (() => void) | undefined): void => {},
|
|
239
239
|
setOnStepChange: (
|
|
240
240
|
_listener: (({ step }: StepChange) => void) | undefined
|
|
241
|
-
): void => {}
|
|
241
|
+
): void => {},
|
|
242
242
|
},
|
|
243
243
|
"account-management": {
|
|
244
244
|
setCollectionOptions: (
|
|
245
245
|
_collectionOptions: CollectionOptions | undefined
|
|
246
|
-
): void => {}
|
|
246
|
+
): void => {},
|
|
247
247
|
},
|
|
248
248
|
"notification-banner": {
|
|
249
249
|
setCollectionOptions: (
|
|
@@ -253,7 +253,7 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
253
253
|
_listener:
|
|
254
254
|
| (({ total, actionRequired }: NotificationCount) => void)
|
|
255
255
|
| undefined
|
|
256
|
-
): void => {}
|
|
256
|
+
): void => {},
|
|
257
257
|
},
|
|
258
258
|
"issuing-card": {
|
|
259
259
|
setDefaultCard: (_defaultCard: string | undefined): void => {},
|
|
@@ -261,23 +261,23 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
261
261
|
setFetchEphemeralKey: (
|
|
262
262
|
_fetchEphemeralKey: FetchEphemeralKeyFunction | undefined
|
|
263
263
|
): void => {},
|
|
264
|
-
setShowSpendControls: (_showSpendControls: boolean | undefined): void => {}
|
|
264
|
+
setShowSpendControls: (_showSpendControls: boolean | undefined): void => {},
|
|
265
265
|
},
|
|
266
266
|
"issuing-cards-list": {
|
|
267
267
|
setFetchEphemeralKey: (
|
|
268
268
|
_fetchEphemeralKey: FetchEphemeralKeyFunction | undefined
|
|
269
269
|
): void => {},
|
|
270
270
|
setShowSpendControls: (_showSpendControls: boolean | undefined): void => {},
|
|
271
|
-
setIssuingProgram: (_issuingProgram: string | undefined): void => {}
|
|
271
|
+
setIssuingProgram: (_issuingProgram: string | undefined): void => {},
|
|
272
272
|
},
|
|
273
273
|
"financial-account": {
|
|
274
|
-
setFinancialAccount: (_financialAccount: string): void => {}
|
|
274
|
+
setFinancialAccount: (_financialAccount: string): void => {},
|
|
275
275
|
},
|
|
276
276
|
"financial-account-transactions": {
|
|
277
|
-
setFinancialAccount: (_financialAccount: string): void => {}
|
|
277
|
+
setFinancialAccount: (_financialAccount: string): void => {},
|
|
278
278
|
},
|
|
279
279
|
recipients: {
|
|
280
|
-
setDataSource: (_dataSource: RecipientDataSource): void => {}
|
|
280
|
+
setDataSource: (_dataSource: RecipientDataSource): void => {},
|
|
281
281
|
},
|
|
282
282
|
"app-install": {
|
|
283
283
|
setApp: (_app: string | undefined): void => {},
|
|
@@ -286,16 +286,16 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
286
286
|
): void => {},
|
|
287
287
|
setOnAppInstallStateChanged: (
|
|
288
288
|
_listener: (({ appId, state }: InstallState) => void) | undefined
|
|
289
|
-
): void => {}
|
|
289
|
+
): void => {},
|
|
290
290
|
},
|
|
291
291
|
"app-viewport": {
|
|
292
292
|
setApp: (_app: string | undefined): void => {},
|
|
293
|
-
setAppData: (_appData: Record<string, string> | undefined): void => {}
|
|
293
|
+
setAppData: (_appData: Record<string, string> | undefined): void => {},
|
|
294
294
|
},
|
|
295
295
|
"payment-method-settings": {
|
|
296
296
|
setPaymentMethodConfiguration: (
|
|
297
297
|
_paymentMethodConfiguration: string | undefined
|
|
298
|
-
): void => {}
|
|
298
|
+
): void => {},
|
|
299
299
|
},
|
|
300
300
|
"capital-financing": {
|
|
301
301
|
setDefaultFinancingOffer: (
|
|
@@ -310,14 +310,16 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
310
310
|
setSupportUrl: (_supportUrl: string | undefined): void => {},
|
|
311
311
|
setOnFinancingsLoaded: (
|
|
312
312
|
_listener: (({ total }: { total: number }) => void) | undefined
|
|
313
|
-
): void => {}
|
|
313
|
+
): void => {},
|
|
314
314
|
},
|
|
315
315
|
"capital-financing-application": {
|
|
316
316
|
setOnApplicationSubmitted: (
|
|
317
317
|
_listener: (() => void) | undefined
|
|
318
318
|
): void => {},
|
|
319
319
|
setPrivacyPolicyUrl: (_privacyPolicyUrl: string | undefined): void => {},
|
|
320
|
-
setHowCapitalWorksUrl: (
|
|
320
|
+
setHowCapitalWorksUrl: (
|
|
321
|
+
_howCapitalWorksUrl: string | undefined
|
|
322
|
+
): void => {},
|
|
321
323
|
},
|
|
322
324
|
"capital-financing-promotion": {
|
|
323
325
|
setLayout: (_layout: FinancingPromotionLayoutType | undefined): void => {},
|
|
@@ -328,7 +330,7 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
328
330
|
_listener:
|
|
329
331
|
| (({
|
|
330
332
|
productType,
|
|
331
|
-
activeFinancingCount
|
|
333
|
+
activeFinancingCount,
|
|
332
334
|
}: FinancingProductType) => void)
|
|
333
335
|
| undefined
|
|
334
336
|
): void => {},
|
|
@@ -338,13 +340,13 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
338
340
|
): void => {},
|
|
339
341
|
setEligibilityCriteriaUrl: (
|
|
340
342
|
_eligibilityCriteriaUrl: string | undefined
|
|
341
|
-
): void => {}
|
|
343
|
+
): void => {},
|
|
342
344
|
},
|
|
343
345
|
"reporting-chart": {
|
|
344
346
|
setReportName: (_reportName: ReportName): void => {},
|
|
345
347
|
setIntervalStart: (_intervalStart: Date | undefined): void => {},
|
|
346
348
|
setIntervalEnd: (_intervalEnd: Date | undefined): void => {},
|
|
347
|
-
setIntervalType: (_intervalType: IntervalType | undefined): void => {}
|
|
349
|
+
setIntervalType: (_intervalType: IntervalType | undefined): void => {},
|
|
348
350
|
},
|
|
349
351
|
"tax-settings": {
|
|
350
352
|
setHideProductTaxCodeSelector: (_hidden: boolean | undefined): void => {},
|
|
@@ -353,24 +355,24 @@ export const ConnectElementCustomMethodConfig = {
|
|
|
353
355
|
): void => {},
|
|
354
356
|
setOnTaxSettingsUpdated: (
|
|
355
357
|
_listener: (({ id }: { id: string }) => void) | undefined
|
|
356
|
-
): void => {}
|
|
358
|
+
): void => {},
|
|
357
359
|
},
|
|
358
360
|
"tax-registrations": {
|
|
359
361
|
setOnAfterTaxRegistrationAdded: (
|
|
360
362
|
_listener: (({ id }: { id: string }) => void) | undefined
|
|
361
363
|
): void => {},
|
|
362
|
-
setDisplayCountries: (_countries: string[] | undefined): void => {}
|
|
364
|
+
setDisplayCountries: (_countries: string[] | undefined): void => {},
|
|
363
365
|
},
|
|
364
366
|
"tax-threshold-monitoring": {
|
|
365
|
-
setDisplayCountries: (_countries: string[] | undefined): void => {}
|
|
367
|
+
setDisplayCountries: (_countries: string[] | undefined): void => {},
|
|
366
368
|
},
|
|
367
369
|
"product-tax-code-selector": {
|
|
368
370
|
setOnTaxCodeSelect: (
|
|
369
|
-
_listener: ((
|
|
371
|
+
_listener: ((taxCode: string) => void) | undefined
|
|
370
372
|
): void => {},
|
|
371
373
|
setHideDescription: (_hideDescription: boolean | undefined): void => {},
|
|
372
374
|
setDisabled: (_disabled: boolean | undefined): void => {},
|
|
373
|
-
setInitialTaxCode: (_initialTaxCode: string | undefined): void => {}
|
|
375
|
+
setInitialTaxCode: (_initialTaxCode: string | undefined): void => {},
|
|
374
376
|
},
|
|
375
|
-
"export-tax-transactions": {}
|
|
377
|
+
"export-tax-transactions": {},
|
|
376
378
|
};
|
package/types/index.d.ts
CHANGED
package/types/shared.d.ts
CHANGED