@whop/embedded-components-react-js 1.0.0 → 1.2.0
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/CHANGELOG.md +30 -0
- package/dist/chat/elements/chat.d.ts +1 -1
- package/dist/chat/elements/dms-list.d.ts +1 -1
- package/dist/chat/elements/index.d.ts +2 -2
- package/dist/chat/elements/search-element.d.ts +1 -1
- package/dist/chat/index.d.ts +2 -2
- package/dist/chat/with-fallback.d.ts +6 -47
- package/dist/chat/with-fallback.js +2 -59
- package/dist/chat/with-fallback.js.map +1 -1
- package/dist/chat/with-fallback.mjs +2 -54
- package/dist/chat/with-fallback.mjs.map +1 -1
- package/dist/index.d.ts +4 -2
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -0
- package/dist/index.mjs.map +1 -1
- package/dist/lib/create-with-fallback.d.ts +51 -0
- package/dist/lib/create-with-fallback.js +89 -0
- package/dist/lib/create-with-fallback.js.map +1 -0
- package/dist/lib/create-with-fallback.mjs +59 -0
- package/dist/lib/create-with-fallback.mjs.map +1 -0
- package/dist/payouts/elements/add-payout-method.d.ts +1 -1
- package/dist/payouts/elements/automatic-withdraw.d.ts +1 -1
- package/dist/payouts/elements/available-cash-breakdown.d.ts +1 -1
- package/dist/payouts/elements/balance.d.ts +1 -1
- package/dist/payouts/elements/balances.d.ts +1 -1
- package/dist/payouts/elements/change-account-country.d.ts +1 -1
- package/dist/payouts/elements/generate-withdrawal-receipt.d.ts +1 -1
- package/dist/payouts/elements/index.d.ts +2 -2
- package/dist/payouts/elements/pending-breakdown.d.ts +1 -1
- package/dist/payouts/elements/reserve-breakdown.d.ts +1 -1
- package/dist/payouts/elements/reset-account.d.ts +1 -1
- package/dist/payouts/elements/treasury-breakdown.d.ts +1 -1
- package/dist/payouts/elements/verify.d.ts +1 -1
- package/dist/payouts/elements/withdraw-button.d.ts +1 -1
- package/dist/payouts/elements/withdraw.d.ts +1 -1
- package/dist/payouts/elements/withdrawal-breakdown.d.ts +1 -1
- package/dist/payouts/elements/withdrawals.d.ts +1 -1
- package/dist/payouts/index.d.ts +1 -1
- package/dist/payouts/with-fallback.d.ts +6 -47
- package/dist/payouts/with-fallback.js +2 -59
- package/dist/payouts/with-fallback.js.map +1 -1
- package/dist/payouts/with-fallback.mjs +2 -54
- package/dist/payouts/with-fallback.mjs.map +1 -1
- package/dist/wallet/elements/deposit.d.ts +11 -0
- package/dist/wallet/elements/deposit.js +30 -0
- package/dist/wallet/elements/deposit.js.map +1 -0
- package/dist/wallet/elements/deposit.mjs +8 -0
- package/dist/wallet/elements/deposit.mjs.map +1 -0
- package/dist/wallet/elements/index.d.ts +4 -0
- package/dist/wallet/elements/index.js +25 -0
- package/dist/wallet/elements/index.js.map +1 -0
- package/dist/wallet/elements/index.mjs +3 -0
- package/dist/wallet/elements/index.mjs.map +1 -0
- package/dist/wallet/index.d.ts +5 -0
- package/dist/wallet/index.js +20 -0
- package/dist/wallet/index.js.map +1 -0
- package/dist/wallet/index.mjs +2 -0
- package/dist/wallet/index.mjs.map +1 -0
- package/dist/wallet/session.d.ts +11 -0
- package/dist/wallet/session.js +73 -0
- package/dist/wallet/session.js.map +1 -0
- package/dist/wallet/session.mjs +52 -0
- package/dist/wallet/session.mjs.map +1 -0
- package/dist/wallet/use-session-ref.d.ts +8 -0
- package/dist/wallet/use-session-ref.js +29 -0
- package/dist/wallet/use-session-ref.js.map +1 -0
- package/dist/wallet/use-session-ref.mjs +7 -0
- package/dist/wallet/use-session-ref.mjs.map +1 -0
- package/dist/wallet/with-fallback.d.ts +14 -0
- package/dist/wallet/with-fallback.js +28 -0
- package/dist/wallet/with-fallback.js.map +1 -0
- package/dist/wallet/with-fallback.mjs +6 -0
- package/dist/wallet/with-fallback.mjs.map +1 -0
- package/package.json +2 -2
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsRequired } from '
|
|
1
|
+
import { WithFallbackPropsRequired } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -15,6 +15,6 @@ export { WithdrawElement } from './withdraw.js';
|
|
|
15
15
|
export { WithdrawButtonElement } from './withdraw-button.js';
|
|
16
16
|
export { WithdrawalBreakdownElement } from './withdrawal-breakdown.js';
|
|
17
17
|
export { WithdrawalsElement } from './withdrawals.js';
|
|
18
|
-
import '
|
|
19
|
-
import '@whop/embedded-components-vanilla-js/types';
|
|
18
|
+
import '../../lib/create-with-fallback.js';
|
|
20
19
|
import 'react';
|
|
20
|
+
import '@whop/embedded-components-vanilla-js/types';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsRequired } from '
|
|
1
|
+
import { WithFallbackPropsRequired } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithFallbackPropsOptional } from '
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
2
|
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
package/dist/payouts/index.d.ts
CHANGED
|
@@ -18,4 +18,4 @@ export { WithdrawalBreakdownElement } from './elements/withdrawal-breakdown.js';
|
|
|
18
18
|
export { WithdrawalsElement } from './elements/withdrawals.js';
|
|
19
19
|
import '@whop/embedded-components-vanilla-js/types';
|
|
20
20
|
import 'react';
|
|
21
|
-
import '
|
|
21
|
+
import '../lib/create-with-fallback.js';
|
|
@@ -1,55 +1,14 @@
|
|
|
1
|
+
import { WithFallbackPropsRequired, WithFallbackPropsOptional } from '../lib/create-with-fallback.js';
|
|
1
2
|
import { PayoutsSessionElements } from '@whop/embedded-components-vanilla-js/types';
|
|
2
|
-
import
|
|
3
|
+
import 'react';
|
|
3
4
|
|
|
4
|
-
|
|
5
|
-
* Valid element type strings that can be passed to createElement.
|
|
6
|
-
*/
|
|
7
|
-
type ElementType = keyof PayoutsSessionElements;
|
|
8
|
-
/**
|
|
9
|
-
* Extract the options type for a given element type using indexed access.
|
|
10
|
-
* PayoutsSessionElements maps element types to [Options, Element] tuples.
|
|
11
|
-
*/
|
|
12
|
-
type ElementOptionsFor<T extends ElementType> = PayoutsSessionElements[T][0];
|
|
13
|
-
/**
|
|
14
|
-
* Component definition with a constrained element type.
|
|
15
|
-
* The type must be a valid element type from the SDK.
|
|
16
|
-
*/
|
|
17
|
-
interface ElementComponentDefinition<T extends ElementType = ElementType> {
|
|
5
|
+
declare const withFallback: <const T extends "add-payout-method-element" | "available-cash-breakdown-element" | "balance-element" | "withdraw-button-element" | "withdraw-element" | "automatic-withdraw-element" | "verify-element" | "withdrawals-element" | "withdrawal-breakdown-element" | "change-account-country-element" | "reset-account-element" | "generate-withdrawal-receipt-element" | "status-banner-element" | "balances-element" | "pending-breakdown-element" | "reserve-breakdown-element" | "treasury-breakdown-element", TRequired extends boolean = false>(Component: {
|
|
18
6
|
displayName: string;
|
|
19
7
|
type: T;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
className?: string;
|
|
23
|
-
style?: React__default.CSSProperties;
|
|
24
|
-
onReady?: () => void;
|
|
25
|
-
fallback?: React__default.ReactNode;
|
|
26
|
-
}
|
|
27
|
-
interface WithFallbackPropsRequired<TOptions> extends WithFallbackPropsBase {
|
|
28
|
-
options: TOptions;
|
|
29
|
-
}
|
|
30
|
-
interface WithFallbackPropsOptional<TOptions> extends WithFallbackPropsBase {
|
|
31
|
-
options?: TOptions;
|
|
32
|
-
}
|
|
33
|
-
type WithFallbackComponent<TOptions, TRequired extends boolean> = {
|
|
34
|
-
(props: TRequired extends true ? WithFallbackPropsRequired<TOptions> : WithFallbackPropsOptional<TOptions>): React__default.ReactNode;
|
|
8
|
+
}) => {
|
|
9
|
+
(props: TRequired extends true ? WithFallbackPropsRequired<PayoutsSessionElements[T][0]> : WithFallbackPropsOptional<PayoutsSessionElements[T][0]>): React.ReactNode;
|
|
35
10
|
displayName: string;
|
|
36
11
|
type: string;
|
|
37
12
|
};
|
|
38
|
-
/**
|
|
39
|
-
* Creates a React component that wraps an embedded element with fallback support.
|
|
40
|
-
*
|
|
41
|
-
* @example
|
|
42
|
-
* ```tsx
|
|
43
|
-
* // Type-safe: options type is inferred from the element type
|
|
44
|
-
* export const BalanceElement = withFallback({
|
|
45
|
-
* displayName: "BalanceElement",
|
|
46
|
-
* type: "balance-element",
|
|
47
|
-
* } as const);
|
|
48
|
-
*
|
|
49
|
-
* // Usage - TypeScript knows the correct options type
|
|
50
|
-
* <BalanceElement options={{ hidePendingBalance: true }} />
|
|
51
|
-
* ```
|
|
52
|
-
*/
|
|
53
|
-
declare function withFallback<const T extends ElementType, TRequired extends boolean = false>(Component: ElementComponentDefinition<T>): WithFallbackComponent<ElementOptionsFor<T>, TRequired>;
|
|
54
13
|
|
|
55
|
-
export {
|
|
14
|
+
export { WithFallbackPropsOptional, WithFallbackPropsRequired, withFallback };
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
"use client";
|
|
3
|
-
var __create = Object.create;
|
|
4
3
|
var __defProp = Object.defineProperty;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
8
6
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
7
|
var __export = (target, all) => {
|
|
10
8
|
for (var name in all)
|
|
@@ -18,68 +16,13 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
16
|
}
|
|
19
17
|
return to;
|
|
20
18
|
};
|
|
21
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
26
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
27
|
-
mod
|
|
28
|
-
));
|
|
29
19
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
30
20
|
var with_fallback_exports = {};
|
|
31
21
|
__export(with_fallback_exports, {
|
|
32
22
|
withFallback: () => withFallback
|
|
33
23
|
});
|
|
34
24
|
module.exports = __toCommonJS(with_fallback_exports);
|
|
35
|
-
var
|
|
36
|
-
var import_use_element_snapshot = require("../lib/use-element-snapshot");
|
|
25
|
+
var import_create_with_fallback = require("../lib/create-with-fallback");
|
|
37
26
|
var import_session = require("./session");
|
|
38
|
-
|
|
39
|
-
function WrappedElement({
|
|
40
|
-
options,
|
|
41
|
-
className,
|
|
42
|
-
style,
|
|
43
|
-
onReady,
|
|
44
|
-
fallback
|
|
45
|
-
}) {
|
|
46
|
-
const payoutsSession = (0, import_session.usePayoutsSession)();
|
|
47
|
-
const ref = (0, import_react.useRef)(null);
|
|
48
|
-
const element = (0, import_react.useMemo)(() => {
|
|
49
|
-
if (!payoutsSession) return null;
|
|
50
|
-
return payoutsSession.createElement(Component, options ?? {});
|
|
51
|
-
}, [payoutsSession]);
|
|
52
|
-
const elementSnapshot = (0, import_use_element_snapshot.useElementSnapshot)(element);
|
|
53
|
-
const isReady = elementSnapshot?.state === "ready";
|
|
54
|
-
(0, import_react.useEffect)(() => {
|
|
55
|
-
if (!element) return;
|
|
56
|
-
element.updateOptions(options ?? {});
|
|
57
|
-
}, [options, element]);
|
|
58
|
-
(0, import_react.useEffect)(() => {
|
|
59
|
-
if (!element || !onReady) return;
|
|
60
|
-
element.on("ready", onReady);
|
|
61
|
-
return () => {
|
|
62
|
-
element.off("ready", onReady);
|
|
63
|
-
};
|
|
64
|
-
}, [element, onReady]);
|
|
65
|
-
(0, import_react.useLayoutEffect)(() => {
|
|
66
|
-
if (!element || !ref.current) return;
|
|
67
|
-
element.mount(ref.current);
|
|
68
|
-
return () => {
|
|
69
|
-
element.unmount();
|
|
70
|
-
};
|
|
71
|
-
}, [element, ref.current]);
|
|
72
|
-
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
|
|
73
|
-
"div",
|
|
74
|
-
{
|
|
75
|
-
style: { ...style, visibility: isReady ? void 0 : "hidden" },
|
|
76
|
-
className,
|
|
77
|
-
ref
|
|
78
|
-
}
|
|
79
|
-
), !isReady && (fallback ?? null));
|
|
80
|
-
}
|
|
81
|
-
WrappedElement.displayName = Component.displayName;
|
|
82
|
-
WrappedElement.type = Component.type;
|
|
83
|
-
return WrappedElement;
|
|
84
|
-
}
|
|
27
|
+
const withFallback = (0, import_create_with_fallback.createWithFallback)(import_session.usePayoutsSession);
|
|
85
28
|
//# sourceMappingURL=with-fallback.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/payouts/with-fallback.tsx"],"sourcesContent":["\"use client\";\n\nimport type {
|
|
1
|
+
{"version":3,"sources":["../../src/payouts/with-fallback.tsx"],"sourcesContent":["\"use client\";\n\nimport type { PayoutsSessionElements } from \"@whop/embedded-components-vanilla-js/types\";\n\nimport { createWithFallback } from \"../lib/create-with-fallback\";\nimport { usePayoutsSession } from \"./session\";\n\nexport type {\n\tWithFallbackPropsOptional,\n\tWithFallbackPropsRequired,\n} from \"../lib/create-with-fallback\";\n\nexport const withFallback =\n\tcreateWithFallback<PayoutsSessionElements>(usePayoutsSession);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,kCAAmC;AACnC,qBAAkC;AAO3B,MAAM,mBACZ,gDAA2C,gCAAiB;","names":[]}
|
|
@@ -1,58 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import "../chunk-NSSMTXJJ.mjs";
|
|
3
|
-
import
|
|
4
|
-
import { useElementSnapshot } from "../lib/use-element-snapshot.mjs";
|
|
3
|
+
import { createWithFallback } from "../lib/create-with-fallback.mjs";
|
|
5
4
|
import { usePayoutsSession } from "./session.mjs";
|
|
6
|
-
|
|
7
|
-
function WrappedElement({ options, className, style, onReady, fallback }) {
|
|
8
|
-
const payoutsSession = usePayoutsSession();
|
|
9
|
-
const ref = useRef(null);
|
|
10
|
-
const element = useMemo(()=>{
|
|
11
|
-
if (!payoutsSession) return null;
|
|
12
|
-
return payoutsSession.createElement(Component, options ?? {});
|
|
13
|
-
}, [
|
|
14
|
-
payoutsSession
|
|
15
|
-
]);
|
|
16
|
-
const elementSnapshot = useElementSnapshot(element);
|
|
17
|
-
const isReady = elementSnapshot?.state === "ready";
|
|
18
|
-
useEffect(()=>{
|
|
19
|
-
if (!element) return;
|
|
20
|
-
element.updateOptions(options ?? {});
|
|
21
|
-
}, [
|
|
22
|
-
options,
|
|
23
|
-
element
|
|
24
|
-
]);
|
|
25
|
-
useEffect(()=>{
|
|
26
|
-
if (!element || !onReady) return;
|
|
27
|
-
element.on("ready", onReady);
|
|
28
|
-
return ()=>{
|
|
29
|
-
element.off("ready", onReady);
|
|
30
|
-
};
|
|
31
|
-
}, [
|
|
32
|
-
element,
|
|
33
|
-
onReady
|
|
34
|
-
]);
|
|
35
|
-
useLayoutEffect(()=>{
|
|
36
|
-
if (!element || !ref.current) return;
|
|
37
|
-
element.mount(ref.current);
|
|
38
|
-
return ()=>{
|
|
39
|
-
element.unmount();
|
|
40
|
-
};
|
|
41
|
-
}, [
|
|
42
|
-
element,
|
|
43
|
-
ref.current
|
|
44
|
-
]);
|
|
45
|
-
return React.createElement(React.Fragment, null, React.createElement("div", {
|
|
46
|
-
style: {
|
|
47
|
-
...style,
|
|
48
|
-
visibility: isReady ? void 0 : "hidden"
|
|
49
|
-
},
|
|
50
|
-
className,
|
|
51
|
-
ref
|
|
52
|
-
}), !isReady && (fallback ?? null));
|
|
53
|
-
}
|
|
54
|
-
WrappedElement.displayName = Component.displayName;
|
|
55
|
-
WrappedElement.type = Component.type;
|
|
56
|
-
return WrappedElement;
|
|
57
|
-
}
|
|
5
|
+
const withFallback = createWithFallback(usePayoutsSession);
|
|
58
6
|
export { withFallback };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/payouts/with-fallback.tsx"],"sourcesContent":["\"use client\";\n\nimport type {
|
|
1
|
+
{"version":3,"sources":["../../src/payouts/with-fallback.tsx"],"sourcesContent":["\"use client\";\n\nimport type { PayoutsSessionElements } from \"@whop/embedded-components-vanilla-js/types\";\n\nimport { createWithFallback } from \"../lib/create-with-fallback\";\nimport { usePayoutsSession } from \"./session\";\n\nexport type {\n\tWithFallbackPropsOptional,\n\tWithFallbackPropsRequired,\n} from \"../lib/create-with-fallback\";\n\nexport const withFallback =\n\tcreateWithFallback<PayoutsSessionElements>(usePayoutsSession);\n"],"mappings":";;AAIA,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAO3B,MAAM,eACZ,mBAA2C,iBAAiB;","names":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { WithFallbackPropsOptional } from '../../lib/create-with-fallback.js';
|
|
2
|
+
import * as _whop_embedded_components_vanilla_js_types from '@whop/embedded-components-vanilla-js/types';
|
|
3
|
+
import 'react';
|
|
4
|
+
|
|
5
|
+
declare const DepositElement: {
|
|
6
|
+
(props: WithFallbackPropsOptional<_whop_embedded_components_vanilla_js_types.DepositElementOptions>): React.ReactNode;
|
|
7
|
+
displayName: string;
|
|
8
|
+
type: string;
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
export { DepositElement };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
var deposit_exports = {};
|
|
21
|
+
__export(deposit_exports, {
|
|
22
|
+
DepositElement: () => DepositElement
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(deposit_exports);
|
|
25
|
+
var import_with_fallback = require("../with-fallback");
|
|
26
|
+
const DepositElement = (0, import_with_fallback.withFallback)({
|
|
27
|
+
displayName: "DepositElement",
|
|
28
|
+
type: "deposit-element"
|
|
29
|
+
});
|
|
30
|
+
//# sourceMappingURL=deposit.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/wallet/elements/deposit.tsx"],"sourcesContent":["\"use client\";\n\nimport { withFallback } from \"../with-fallback\";\n\nexport const DepositElement = withFallback({\n\tdisplayName: \"DepositElement\",\n\ttype: \"deposit-element\",\n} as const);\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,2BAA6B;AAEtB,MAAM,qBAAiB,mCAAa;AAAA,EAC1C,aAAa;AAAA,EACb,MAAM;AACP,CAAU;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/wallet/elements/deposit.tsx"],"sourcesContent":["\"use client\";\n\nimport { withFallback } from \"../with-fallback\";\n\nexport const DepositElement = withFallback({\n\tdisplayName: \"DepositElement\",\n\ttype: \"deposit-element\",\n} as const);\n"],"mappings":";;AAEA,SAAS,oBAAoB;AAEtB,MAAM,iBAAiB,aAAa;AAAA,EAC1C,aAAa;AAAA,EACb,MAAM;AACP,CAAU;","names":[]}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
var elements_exports = {};
|
|
20
|
+
__export(elements_exports, {
|
|
21
|
+
DepositElement: () => import_deposit.DepositElement
|
|
22
|
+
});
|
|
23
|
+
module.exports = __toCommonJS(elements_exports);
|
|
24
|
+
var import_deposit = require("./deposit");
|
|
25
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/wallet/elements/index.tsx"],"sourcesContent":["export { DepositElement } from \"./deposit\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA+B;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/wallet/elements/index.tsx"],"sourcesContent":["export { DepositElement } from \"./deposit\";\n"],"mappings":";AAAA,SAAS,sBAAsB;","names":[]}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __copyProps = (to, from, except, desc) => {
|
|
7
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
8
|
+
for (let key of __getOwnPropNames(from))
|
|
9
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
10
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
11
|
+
}
|
|
12
|
+
return to;
|
|
13
|
+
};
|
|
14
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
15
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
16
|
+
var wallet_exports = {};
|
|
17
|
+
module.exports = __toCommonJS(wallet_exports);
|
|
18
|
+
__reExport(wallet_exports, require("./elements"), module.exports);
|
|
19
|
+
__reExport(wallet_exports, require("./session"), module.exports);
|
|
20
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/wallet/index.tsx"],"sourcesContent":["export * from \"./elements\";\nexport * from \"./session\";\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,2BAAc,uBAAd;AACA,2BAAc,sBADd;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/wallet/index.tsx"],"sourcesContent":["export * from \"./elements\";\nexport * from \"./session\";\n"],"mappings":"AAAA,cAAc;AACd,cAAc;","names":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { WalletSessionOptions, WalletSession as WalletSession$1 } from '@whop/embedded-components-vanilla-js/types';
|
|
2
|
+
import React__default, { PropsWithChildren } from 'react';
|
|
3
|
+
|
|
4
|
+
declare function WalletSession({ children, token, companyId, currency, ref, }: PropsWithChildren<WalletSessionOptions & {
|
|
5
|
+
ref?: React__default.RefObject<{
|
|
6
|
+
walletSession: WalletSession$1 | null;
|
|
7
|
+
} | null>;
|
|
8
|
+
}>): React__default.JSX.Element;
|
|
9
|
+
declare function useWalletSession(): WalletSession$1 | null;
|
|
10
|
+
|
|
11
|
+
export { WalletSession, useWalletSession };
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __create = Object.create;
|
|
4
|
+
var __defProp = Object.defineProperty;
|
|
5
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
8
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
+
var __export = (target, all) => {
|
|
10
|
+
for (var name in all)
|
|
11
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
|
+
};
|
|
13
|
+
var __copyProps = (to, from, except, desc) => {
|
|
14
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
15
|
+
for (let key of __getOwnPropNames(from))
|
|
16
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
17
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
|
+
}
|
|
19
|
+
return to;
|
|
20
|
+
};
|
|
21
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
26
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
27
|
+
mod
|
|
28
|
+
));
|
|
29
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
30
|
+
var session_exports = {};
|
|
31
|
+
__export(session_exports, {
|
|
32
|
+
WalletSession: () => WalletSession,
|
|
33
|
+
useWalletSession: () => useWalletSession
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(session_exports);
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
37
|
+
var import_provider = require("../provider");
|
|
38
|
+
const WalletSessionContext = (0, import_react.createContext)(null);
|
|
39
|
+
function WalletSession({
|
|
40
|
+
children,
|
|
41
|
+
token,
|
|
42
|
+
companyId,
|
|
43
|
+
currency,
|
|
44
|
+
ref
|
|
45
|
+
}) {
|
|
46
|
+
const elements = (0, import_provider.useElements)();
|
|
47
|
+
const walletSession = (0, import_react.useMemo)(() => {
|
|
48
|
+
if (!elements) return null;
|
|
49
|
+
return elements.createWalletSession({ token, companyId, currency });
|
|
50
|
+
}, [elements]);
|
|
51
|
+
(0, import_react.useEffect)(() => {
|
|
52
|
+
if (!walletSession) return;
|
|
53
|
+
walletSession.updateOptions({ token, companyId, currency });
|
|
54
|
+
}, [walletSession, token, companyId, currency]);
|
|
55
|
+
const value = (0, import_react.useMemo)(
|
|
56
|
+
() => ({
|
|
57
|
+
walletSession
|
|
58
|
+
}),
|
|
59
|
+
[walletSession]
|
|
60
|
+
);
|
|
61
|
+
(0, import_react.useImperativeHandle)(ref, () => ({ walletSession }), [walletSession]);
|
|
62
|
+
return /* @__PURE__ */ import_react.default.createElement(WalletSessionContext.Provider, { value }, children);
|
|
63
|
+
}
|
|
64
|
+
function useWalletSession() {
|
|
65
|
+
const ctx = (0, import_react.useContext)(WalletSessionContext);
|
|
66
|
+
if (!ctx) {
|
|
67
|
+
throw new Error(
|
|
68
|
+
"useWalletSession must be used within a WalletSessionProvider"
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
return ctx.walletSession;
|
|
72
|
+
}
|
|
73
|
+
//# sourceMappingURL=session.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/wallet/session.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n\tWalletSessionOptions,\n\tWalletSession as WalletSessionType,\n} from \"@whop/embedded-components-vanilla-js/types\";\nimport type { PropsWithChildren } from \"react\";\n\nimport React, {\n\tcreateContext,\n\tuseContext,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseMemo,\n} from \"react\";\nimport { useElements } from \"../provider\";\n\ninterface ContextState {\n\twalletSession: WalletSessionType | null;\n}\n\nconst WalletSessionContext = createContext<ContextState | null>(null);\n\nexport function WalletSession({\n\tchildren,\n\ttoken,\n\tcompanyId,\n\tcurrency,\n\tref,\n}: PropsWithChildren<\n\tWalletSessionOptions & {\n\t\tref?: React.RefObject<{\n\t\t\twalletSession: WalletSessionType | null;\n\t\t} | null>;\n\t}\n>) {\n\tconst elements = useElements();\n\n\tconst walletSession = useMemo(() => {\n\t\tif (!elements) return null;\n\t\treturn elements.createWalletSession({ token, companyId, currency });\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps -- session created once per elements instance\n\t}, [elements]);\n\n\tuseEffect(() => {\n\t\tif (!walletSession) return;\n\t\twalletSession.updateOptions({ token, companyId, currency });\n\t}, [walletSession, token, companyId, currency]);\n\n\tconst value: ContextState = useMemo(\n\t\t() => ({\n\t\t\twalletSession,\n\t\t}),\n\t\t[walletSession],\n\t);\n\n\tuseImperativeHandle(ref, () => ({ walletSession }), [walletSession]);\n\n\treturn (\n\t\t<WalletSessionContext.Provider value={value}>\n\t\t\t{children}\n\t\t</WalletSessionContext.Provider>\n\t);\n}\n\nexport function useWalletSession() {\n\tconst ctx = useContext(WalletSessionContext);\n\tif (!ctx) {\n\t\tthrow new Error(\n\t\t\t\"useWalletSession must be used within a WalletSessionProvider\",\n\t\t);\n\t}\n\treturn ctx.walletSession;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,mBAMO;AACP,sBAA4B;AAM5B,MAAM,2BAAuB,4BAAmC,IAAI;AAE7D,SAAS,cAAc;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAMG;AACF,QAAM,eAAW,6BAAY;AAE7B,QAAM,oBAAgB,sBAAQ,MAAM;AACnC,QAAI,CAAC,SAAU,QAAO;AACtB,WAAO,SAAS,oBAAoB,EAAE,OAAO,WAAW,SAAS,CAAC;AAAA,EAEnE,GAAG,CAAC,QAAQ,CAAC;AAEb,8BAAU,MAAM;AACf,QAAI,CAAC,cAAe;AACpB,kBAAc,cAAc,EAAE,OAAO,WAAW,SAAS,CAAC;AAAA,EAC3D,GAAG,CAAC,eAAe,OAAO,WAAW,QAAQ,CAAC;AAE9C,QAAM,YAAsB;AAAA,IAC3B,OAAO;AAAA,MACN;AAAA,IACD;AAAA,IACA,CAAC,aAAa;AAAA,EACf;AAEA,wCAAoB,KAAK,OAAO,EAAE,cAAc,IAAI,CAAC,aAAa,CAAC;AAEnE,SACC,6BAAAA,QAAA,cAAC,qBAAqB,UAArB,EAA8B,SAC7B,QACF;AAEF;AAEO,SAAS,mBAAmB;AAClC,QAAM,UAAM,yBAAW,oBAAoB;AAC3C,MAAI,CAAC,KAAK;AACT,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD;AACA,SAAO,IAAI;AACZ;","names":["React"]}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import "../chunk-NSSMTXJJ.mjs";
|
|
3
|
+
import React, { createContext, useContext, useEffect, useImperativeHandle, useMemo } from "react";
|
|
4
|
+
import { useElements } from "../provider.mjs";
|
|
5
|
+
const WalletSessionContext = createContext(null);
|
|
6
|
+
function WalletSession({ children, token, companyId, currency, ref }) {
|
|
7
|
+
const elements = useElements();
|
|
8
|
+
const walletSession = useMemo(()=>{
|
|
9
|
+
if (!elements) return null;
|
|
10
|
+
return elements.createWalletSession({
|
|
11
|
+
token,
|
|
12
|
+
companyId,
|
|
13
|
+
currency
|
|
14
|
+
});
|
|
15
|
+
}, [
|
|
16
|
+
elements
|
|
17
|
+
]);
|
|
18
|
+
useEffect(()=>{
|
|
19
|
+
if (!walletSession) return;
|
|
20
|
+
walletSession.updateOptions({
|
|
21
|
+
token,
|
|
22
|
+
companyId,
|
|
23
|
+
currency
|
|
24
|
+
});
|
|
25
|
+
}, [
|
|
26
|
+
walletSession,
|
|
27
|
+
token,
|
|
28
|
+
companyId,
|
|
29
|
+
currency
|
|
30
|
+
]);
|
|
31
|
+
const value = useMemo(()=>({
|
|
32
|
+
walletSession
|
|
33
|
+
}), [
|
|
34
|
+
walletSession
|
|
35
|
+
]);
|
|
36
|
+
useImperativeHandle(ref, ()=>({
|
|
37
|
+
walletSession
|
|
38
|
+
}), [
|
|
39
|
+
walletSession
|
|
40
|
+
]);
|
|
41
|
+
return React.createElement(WalletSessionContext.Provider, {
|
|
42
|
+
value
|
|
43
|
+
}, children);
|
|
44
|
+
}
|
|
45
|
+
function useWalletSession() {
|
|
46
|
+
const ctx = useContext(WalletSessionContext);
|
|
47
|
+
if (!ctx) {
|
|
48
|
+
throw new Error("useWalletSession must be used within a WalletSessionProvider");
|
|
49
|
+
}
|
|
50
|
+
return ctx.walletSession;
|
|
51
|
+
}
|
|
52
|
+
export { WalletSession, useWalletSession };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/wallet/session.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n\tWalletSessionOptions,\n\tWalletSession as WalletSessionType,\n} from \"@whop/embedded-components-vanilla-js/types\";\nimport type { PropsWithChildren } from \"react\";\n\nimport React, {\n\tcreateContext,\n\tuseContext,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseMemo,\n} from \"react\";\nimport { useElements } from \"../provider\";\n\ninterface ContextState {\n\twalletSession: WalletSessionType | null;\n}\n\nconst WalletSessionContext = createContext<ContextState | null>(null);\n\nexport function WalletSession({\n\tchildren,\n\ttoken,\n\tcompanyId,\n\tcurrency,\n\tref,\n}: PropsWithChildren<\n\tWalletSessionOptions & {\n\t\tref?: React.RefObject<{\n\t\t\twalletSession: WalletSessionType | null;\n\t\t} | null>;\n\t}\n>) {\n\tconst elements = useElements();\n\n\tconst walletSession = useMemo(() => {\n\t\tif (!elements) return null;\n\t\treturn elements.createWalletSession({ token, companyId, currency });\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps -- session created once per elements instance\n\t}, [elements]);\n\n\tuseEffect(() => {\n\t\tif (!walletSession) return;\n\t\twalletSession.updateOptions({ token, companyId, currency });\n\t}, [walletSession, token, companyId, currency]);\n\n\tconst value: ContextState = useMemo(\n\t\t() => ({\n\t\t\twalletSession,\n\t\t}),\n\t\t[walletSession],\n\t);\n\n\tuseImperativeHandle(ref, () => ({ walletSession }), [walletSession]);\n\n\treturn (\n\t\t<WalletSessionContext.Provider value={value}>\n\t\t\t{children}\n\t\t</WalletSessionContext.Provider>\n\t);\n}\n\nexport function useWalletSession() {\n\tconst ctx = useContext(WalletSessionContext);\n\tif (!ctx) {\n\t\tthrow new Error(\n\t\t\t\"useWalletSession must be used within a WalletSessionProvider\",\n\t\t);\n\t}\n\treturn ctx.walletSession;\n}\n"],"mappings":";;AAQA,OAAO;AAAA,EACN;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,mBAAmB;AAM5B,MAAM,uBAAuB,cAAmC,IAAI;AAE7D,SAAS,cAAc;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAMG;AACF,QAAM,WAAW,YAAY;AAE7B,QAAM,gBAAgB,QAAQ,MAAM;AACnC,QAAI,CAAC,SAAU,QAAO;AACtB,WAAO,SAAS,oBAAoB,EAAE,OAAO,WAAW,SAAS,CAAC;AAAA,EAEnE,GAAG,CAAC,QAAQ,CAAC;AAEb,YAAU,MAAM;AACf,QAAI,CAAC,cAAe;AACpB,kBAAc,cAAc,EAAE,OAAO,WAAW,SAAS,CAAC;AAAA,EAC3D,GAAG,CAAC,eAAe,OAAO,WAAW,QAAQ,CAAC;AAE9C,QAAM,QAAsB;AAAA,IAC3B,OAAO;AAAA,MACN;AAAA,IACD;AAAA,IACA,CAAC,aAAa;AAAA,EACf;AAEA,sBAAoB,KAAK,OAAO,EAAE,cAAc,IAAI,CAAC,aAAa,CAAC;AAEnE,SACC,oCAAC,qBAAqB,UAArB,EAA8B,SAC7B,QACF;AAEF;AAEO,SAAS,mBAAmB;AAClC,QAAM,MAAM,WAAW,oBAAoB;AAC3C,MAAI,CAAC,KAAK;AACT,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD;AACA,SAAO,IAAI;AACZ;","names":[]}
|