@methodfi/opal-react 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +20 -16
- package/dist/index.d.ts +1 -32
- package/dist/index.js +98 -507
- package/package.json +16 -30
- package/dist/components/OpalIframe.d.ts +0 -3
- package/dist/components/OpalIframe.d.ts.map +0 -1
- package/dist/components/OpalProvider.d.ts +0 -34
- package/dist/components/OpalProvider.d.ts.map +0 -1
- package/dist/constants/index.d.ts +0 -4
- package/dist/constants/index.d.ts.map +0 -1
- package/dist/hooks/useOpal.d.ts +0 -37
- package/dist/hooks/useOpal.d.ts.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/index.js.map +0 -1
- package/dist/index.mjs +0 -620
- package/dist/index.mjs.map +0 -1
- package/dist/types/index.d.ts +0 -145
- package/dist/types/index.d.ts.map +0 -1
package/dist/index.js
CHANGED
|
@@ -1,478 +1,20 @@
|
|
|
1
|
-
'use
|
|
1
|
+
'use client';
|
|
2
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
2
3
|
|
|
3
|
-
var
|
|
4
|
+
var React = require('react');
|
|
4
5
|
|
|
5
|
-
|
|
6
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
6
7
|
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* @license React
|
|
11
|
-
* react-jsx-runtime.production.js
|
|
12
|
-
*
|
|
13
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
14
|
-
*
|
|
15
|
-
* This source code is licensed under the MIT license found in the
|
|
16
|
-
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/
|
|
18
|
-
|
|
19
|
-
var hasRequiredReactJsxRuntime_production;
|
|
20
|
-
|
|
21
|
-
function requireReactJsxRuntime_production () {
|
|
22
|
-
if (hasRequiredReactJsxRuntime_production) return reactJsxRuntime_production;
|
|
23
|
-
hasRequiredReactJsxRuntime_production = 1;
|
|
24
|
-
var REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"),
|
|
25
|
-
REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
|
|
26
|
-
function jsxProd(type, config, maybeKey) {
|
|
27
|
-
var key = null;
|
|
28
|
-
void 0 !== maybeKey && (key = "" + maybeKey);
|
|
29
|
-
void 0 !== config.key && (key = "" + config.key);
|
|
30
|
-
if ("key" in config) {
|
|
31
|
-
maybeKey = {};
|
|
32
|
-
for (var propName in config)
|
|
33
|
-
"key" !== propName && (maybeKey[propName] = config[propName]);
|
|
34
|
-
} else maybeKey = config;
|
|
35
|
-
config = maybeKey.ref;
|
|
36
|
-
return {
|
|
37
|
-
$$typeof: REACT_ELEMENT_TYPE,
|
|
38
|
-
type: type,
|
|
39
|
-
key: key,
|
|
40
|
-
ref: void 0 !== config ? config : null,
|
|
41
|
-
props: maybeKey
|
|
42
|
-
};
|
|
43
|
-
}
|
|
44
|
-
reactJsxRuntime_production.Fragment = REACT_FRAGMENT_TYPE;
|
|
45
|
-
reactJsxRuntime_production.jsx = jsxProd;
|
|
46
|
-
reactJsxRuntime_production.jsxs = jsxProd;
|
|
47
|
-
return reactJsxRuntime_production;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
var reactJsxRuntime_development = {};
|
|
51
|
-
|
|
52
|
-
/**
|
|
53
|
-
* @license React
|
|
54
|
-
* react-jsx-runtime.development.js
|
|
55
|
-
*
|
|
56
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
57
|
-
*
|
|
58
|
-
* This source code is licensed under the MIT license found in the
|
|
59
|
-
* LICENSE file in the root directory of this source tree.
|
|
60
|
-
*/
|
|
61
|
-
|
|
62
|
-
var hasRequiredReactJsxRuntime_development;
|
|
63
|
-
|
|
64
|
-
function requireReactJsxRuntime_development () {
|
|
65
|
-
if (hasRequiredReactJsxRuntime_development) return reactJsxRuntime_development;
|
|
66
|
-
hasRequiredReactJsxRuntime_development = 1;
|
|
67
|
-
"production" !== process.env.NODE_ENV &&
|
|
68
|
-
(function () {
|
|
69
|
-
function getComponentNameFromType(type) {
|
|
70
|
-
if (null == type) return null;
|
|
71
|
-
if ("function" === typeof type)
|
|
72
|
-
return type.$$typeof === REACT_CLIENT_REFERENCE
|
|
73
|
-
? null
|
|
74
|
-
: type.displayName || type.name || null;
|
|
75
|
-
if ("string" === typeof type) return type;
|
|
76
|
-
switch (type) {
|
|
77
|
-
case REACT_FRAGMENT_TYPE:
|
|
78
|
-
return "Fragment";
|
|
79
|
-
case REACT_PROFILER_TYPE:
|
|
80
|
-
return "Profiler";
|
|
81
|
-
case REACT_STRICT_MODE_TYPE:
|
|
82
|
-
return "StrictMode";
|
|
83
|
-
case REACT_SUSPENSE_TYPE:
|
|
84
|
-
return "Suspense";
|
|
85
|
-
case REACT_SUSPENSE_LIST_TYPE:
|
|
86
|
-
return "SuspenseList";
|
|
87
|
-
case REACT_ACTIVITY_TYPE:
|
|
88
|
-
return "Activity";
|
|
89
|
-
}
|
|
90
|
-
if ("object" === typeof type)
|
|
91
|
-
switch (
|
|
92
|
-
("number" === typeof type.tag &&
|
|
93
|
-
console.error(
|
|
94
|
-
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
|
|
95
|
-
),
|
|
96
|
-
type.$$typeof)
|
|
97
|
-
) {
|
|
98
|
-
case REACT_PORTAL_TYPE:
|
|
99
|
-
return "Portal";
|
|
100
|
-
case REACT_CONTEXT_TYPE:
|
|
101
|
-
return (type.displayName || "Context") + ".Provider";
|
|
102
|
-
case REACT_CONSUMER_TYPE:
|
|
103
|
-
return (type._context.displayName || "Context") + ".Consumer";
|
|
104
|
-
case REACT_FORWARD_REF_TYPE:
|
|
105
|
-
var innerType = type.render;
|
|
106
|
-
type = type.displayName;
|
|
107
|
-
type ||
|
|
108
|
-
((type = innerType.displayName || innerType.name || ""),
|
|
109
|
-
(type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef"));
|
|
110
|
-
return type;
|
|
111
|
-
case REACT_MEMO_TYPE:
|
|
112
|
-
return (
|
|
113
|
-
(innerType = type.displayName || null),
|
|
114
|
-
null !== innerType
|
|
115
|
-
? innerType
|
|
116
|
-
: getComponentNameFromType(type.type) || "Memo"
|
|
117
|
-
);
|
|
118
|
-
case REACT_LAZY_TYPE:
|
|
119
|
-
innerType = type._payload;
|
|
120
|
-
type = type._init;
|
|
121
|
-
try {
|
|
122
|
-
return getComponentNameFromType(type(innerType));
|
|
123
|
-
} catch (x) {}
|
|
124
|
-
}
|
|
125
|
-
return null;
|
|
126
|
-
}
|
|
127
|
-
function testStringCoercion(value) {
|
|
128
|
-
return "" + value;
|
|
129
|
-
}
|
|
130
|
-
function checkKeyStringCoercion(value) {
|
|
131
|
-
try {
|
|
132
|
-
testStringCoercion(value);
|
|
133
|
-
var JSCompiler_inline_result = !1;
|
|
134
|
-
} catch (e) {
|
|
135
|
-
JSCompiler_inline_result = true;
|
|
136
|
-
}
|
|
137
|
-
if (JSCompiler_inline_result) {
|
|
138
|
-
JSCompiler_inline_result = console;
|
|
139
|
-
var JSCompiler_temp_const = JSCompiler_inline_result.error;
|
|
140
|
-
var JSCompiler_inline_result$jscomp$0 =
|
|
141
|
-
("function" === typeof Symbol &&
|
|
142
|
-
Symbol.toStringTag &&
|
|
143
|
-
value[Symbol.toStringTag]) ||
|
|
144
|
-
value.constructor.name ||
|
|
145
|
-
"Object";
|
|
146
|
-
JSCompiler_temp_const.call(
|
|
147
|
-
JSCompiler_inline_result,
|
|
148
|
-
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
|
|
149
|
-
JSCompiler_inline_result$jscomp$0
|
|
150
|
-
);
|
|
151
|
-
return testStringCoercion(value);
|
|
152
|
-
}
|
|
153
|
-
}
|
|
154
|
-
function getTaskName(type) {
|
|
155
|
-
if (type === REACT_FRAGMENT_TYPE) return "<>";
|
|
156
|
-
if (
|
|
157
|
-
"object" === typeof type &&
|
|
158
|
-
null !== type &&
|
|
159
|
-
type.$$typeof === REACT_LAZY_TYPE
|
|
160
|
-
)
|
|
161
|
-
return "<...>";
|
|
162
|
-
try {
|
|
163
|
-
var name = getComponentNameFromType(type);
|
|
164
|
-
return name ? "<" + name + ">" : "<...>";
|
|
165
|
-
} catch (x) {
|
|
166
|
-
return "<...>";
|
|
167
|
-
}
|
|
168
|
-
}
|
|
169
|
-
function getOwner() {
|
|
170
|
-
var dispatcher = ReactSharedInternals.A;
|
|
171
|
-
return null === dispatcher ? null : dispatcher.getOwner();
|
|
172
|
-
}
|
|
173
|
-
function UnknownOwner() {
|
|
174
|
-
return Error("react-stack-top-frame");
|
|
175
|
-
}
|
|
176
|
-
function hasValidKey(config) {
|
|
177
|
-
if (hasOwnProperty.call(config, "key")) {
|
|
178
|
-
var getter = Object.getOwnPropertyDescriptor(config, "key").get;
|
|
179
|
-
if (getter && getter.isReactWarning) return false;
|
|
180
|
-
}
|
|
181
|
-
return void 0 !== config.key;
|
|
182
|
-
}
|
|
183
|
-
function defineKeyPropWarningGetter(props, displayName) {
|
|
184
|
-
function warnAboutAccessingKey() {
|
|
185
|
-
specialPropKeyWarningShown ||
|
|
186
|
-
((specialPropKeyWarningShown = true),
|
|
187
|
-
console.error(
|
|
188
|
-
"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
|
|
189
|
-
displayName
|
|
190
|
-
));
|
|
191
|
-
}
|
|
192
|
-
warnAboutAccessingKey.isReactWarning = true;
|
|
193
|
-
Object.defineProperty(props, "key", {
|
|
194
|
-
get: warnAboutAccessingKey,
|
|
195
|
-
configurable: true
|
|
196
|
-
});
|
|
197
|
-
}
|
|
198
|
-
function elementRefGetterWithDeprecationWarning() {
|
|
199
|
-
var componentName = getComponentNameFromType(this.type);
|
|
200
|
-
didWarnAboutElementRef[componentName] ||
|
|
201
|
-
((didWarnAboutElementRef[componentName] = true),
|
|
202
|
-
console.error(
|
|
203
|
-
"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
|
|
204
|
-
));
|
|
205
|
-
componentName = this.props.ref;
|
|
206
|
-
return void 0 !== componentName ? componentName : null;
|
|
207
|
-
}
|
|
208
|
-
function ReactElement(
|
|
209
|
-
type,
|
|
210
|
-
key,
|
|
211
|
-
self,
|
|
212
|
-
source,
|
|
213
|
-
owner,
|
|
214
|
-
props,
|
|
215
|
-
debugStack,
|
|
216
|
-
debugTask
|
|
217
|
-
) {
|
|
218
|
-
self = props.ref;
|
|
219
|
-
type = {
|
|
220
|
-
$$typeof: REACT_ELEMENT_TYPE,
|
|
221
|
-
type: type,
|
|
222
|
-
key: key,
|
|
223
|
-
props: props,
|
|
224
|
-
_owner: owner
|
|
225
|
-
};
|
|
226
|
-
null !== (void 0 !== self ? self : null)
|
|
227
|
-
? Object.defineProperty(type, "ref", {
|
|
228
|
-
enumerable: false,
|
|
229
|
-
get: elementRefGetterWithDeprecationWarning
|
|
230
|
-
})
|
|
231
|
-
: Object.defineProperty(type, "ref", { enumerable: false, value: null });
|
|
232
|
-
type._store = {};
|
|
233
|
-
Object.defineProperty(type._store, "validated", {
|
|
234
|
-
configurable: false,
|
|
235
|
-
enumerable: false,
|
|
236
|
-
writable: true,
|
|
237
|
-
value: 0
|
|
238
|
-
});
|
|
239
|
-
Object.defineProperty(type, "_debugInfo", {
|
|
240
|
-
configurable: false,
|
|
241
|
-
enumerable: false,
|
|
242
|
-
writable: true,
|
|
243
|
-
value: null
|
|
244
|
-
});
|
|
245
|
-
Object.defineProperty(type, "_debugStack", {
|
|
246
|
-
configurable: false,
|
|
247
|
-
enumerable: false,
|
|
248
|
-
writable: true,
|
|
249
|
-
value: debugStack
|
|
250
|
-
});
|
|
251
|
-
Object.defineProperty(type, "_debugTask", {
|
|
252
|
-
configurable: false,
|
|
253
|
-
enumerable: false,
|
|
254
|
-
writable: true,
|
|
255
|
-
value: debugTask
|
|
256
|
-
});
|
|
257
|
-
Object.freeze && (Object.freeze(type.props), Object.freeze(type));
|
|
258
|
-
return type;
|
|
259
|
-
}
|
|
260
|
-
function jsxDEVImpl(
|
|
261
|
-
type,
|
|
262
|
-
config,
|
|
263
|
-
maybeKey,
|
|
264
|
-
isStaticChildren,
|
|
265
|
-
source,
|
|
266
|
-
self,
|
|
267
|
-
debugStack,
|
|
268
|
-
debugTask
|
|
269
|
-
) {
|
|
270
|
-
var children = config.children;
|
|
271
|
-
if (void 0 !== children)
|
|
272
|
-
if (isStaticChildren)
|
|
273
|
-
if (isArrayImpl(children)) {
|
|
274
|
-
for (
|
|
275
|
-
isStaticChildren = 0;
|
|
276
|
-
isStaticChildren < children.length;
|
|
277
|
-
isStaticChildren++
|
|
278
|
-
)
|
|
279
|
-
validateChildKeys(children[isStaticChildren]);
|
|
280
|
-
Object.freeze && Object.freeze(children);
|
|
281
|
-
} else
|
|
282
|
-
console.error(
|
|
283
|
-
"React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
|
|
284
|
-
);
|
|
285
|
-
else validateChildKeys(children);
|
|
286
|
-
if (hasOwnProperty.call(config, "key")) {
|
|
287
|
-
children = getComponentNameFromType(type);
|
|
288
|
-
var keys = Object.keys(config).filter(function (k) {
|
|
289
|
-
return "key" !== k;
|
|
290
|
-
});
|
|
291
|
-
isStaticChildren =
|
|
292
|
-
0 < keys.length
|
|
293
|
-
? "{key: someKey, " + keys.join(": ..., ") + ": ...}"
|
|
294
|
-
: "{key: someKey}";
|
|
295
|
-
didWarnAboutKeySpread[children + isStaticChildren] ||
|
|
296
|
-
((keys =
|
|
297
|
-
0 < keys.length ? "{" + keys.join(": ..., ") + ": ...}" : "{}"),
|
|
298
|
-
console.error(
|
|
299
|
-
'A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',
|
|
300
|
-
isStaticChildren,
|
|
301
|
-
children,
|
|
302
|
-
keys,
|
|
303
|
-
children
|
|
304
|
-
),
|
|
305
|
-
(didWarnAboutKeySpread[children + isStaticChildren] = true));
|
|
306
|
-
}
|
|
307
|
-
children = null;
|
|
308
|
-
void 0 !== maybeKey &&
|
|
309
|
-
(checkKeyStringCoercion(maybeKey), (children = "" + maybeKey));
|
|
310
|
-
hasValidKey(config) &&
|
|
311
|
-
(checkKeyStringCoercion(config.key), (children = "" + config.key));
|
|
312
|
-
if ("key" in config) {
|
|
313
|
-
maybeKey = {};
|
|
314
|
-
for (var propName in config)
|
|
315
|
-
"key" !== propName && (maybeKey[propName] = config[propName]);
|
|
316
|
-
} else maybeKey = config;
|
|
317
|
-
children &&
|
|
318
|
-
defineKeyPropWarningGetter(
|
|
319
|
-
maybeKey,
|
|
320
|
-
"function" === typeof type
|
|
321
|
-
? type.displayName || type.name || "Unknown"
|
|
322
|
-
: type
|
|
323
|
-
);
|
|
324
|
-
return ReactElement(
|
|
325
|
-
type,
|
|
326
|
-
children,
|
|
327
|
-
self,
|
|
328
|
-
source,
|
|
329
|
-
getOwner(),
|
|
330
|
-
maybeKey,
|
|
331
|
-
debugStack,
|
|
332
|
-
debugTask
|
|
333
|
-
);
|
|
334
|
-
}
|
|
335
|
-
function validateChildKeys(node) {
|
|
336
|
-
"object" === typeof node &&
|
|
337
|
-
null !== node &&
|
|
338
|
-
node.$$typeof === REACT_ELEMENT_TYPE &&
|
|
339
|
-
node._store &&
|
|
340
|
-
(node._store.validated = 1);
|
|
341
|
-
}
|
|
342
|
-
var React = require$$0,
|
|
343
|
-
REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"),
|
|
344
|
-
REACT_PORTAL_TYPE = Symbol.for("react.portal"),
|
|
345
|
-
REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
|
|
346
|
-
REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
|
|
347
|
-
REACT_PROFILER_TYPE = Symbol.for("react.profiler");
|
|
348
|
-
var REACT_CONSUMER_TYPE = Symbol.for("react.consumer"),
|
|
349
|
-
REACT_CONTEXT_TYPE = Symbol.for("react.context"),
|
|
350
|
-
REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref"),
|
|
351
|
-
REACT_SUSPENSE_TYPE = Symbol.for("react.suspense"),
|
|
352
|
-
REACT_SUSPENSE_LIST_TYPE = Symbol.for("react.suspense_list"),
|
|
353
|
-
REACT_MEMO_TYPE = Symbol.for("react.memo"),
|
|
354
|
-
REACT_LAZY_TYPE = Symbol.for("react.lazy"),
|
|
355
|
-
REACT_ACTIVITY_TYPE = Symbol.for("react.activity"),
|
|
356
|
-
REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference"),
|
|
357
|
-
ReactSharedInternals =
|
|
358
|
-
React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,
|
|
359
|
-
hasOwnProperty = Object.prototype.hasOwnProperty,
|
|
360
|
-
isArrayImpl = Array.isArray,
|
|
361
|
-
createTask = console.createTask
|
|
362
|
-
? console.createTask
|
|
363
|
-
: function () {
|
|
364
|
-
return null;
|
|
365
|
-
};
|
|
366
|
-
React = {
|
|
367
|
-
"react-stack-bottom-frame": function (callStackForError) {
|
|
368
|
-
return callStackForError();
|
|
369
|
-
}
|
|
370
|
-
};
|
|
371
|
-
var specialPropKeyWarningShown;
|
|
372
|
-
var didWarnAboutElementRef = {};
|
|
373
|
-
var unknownOwnerDebugStack = React["react-stack-bottom-frame"].bind(
|
|
374
|
-
React,
|
|
375
|
-
UnknownOwner
|
|
376
|
-
)();
|
|
377
|
-
var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
|
|
378
|
-
var didWarnAboutKeySpread = {};
|
|
379
|
-
reactJsxRuntime_development.Fragment = REACT_FRAGMENT_TYPE;
|
|
380
|
-
reactJsxRuntime_development.jsx = function (type, config, maybeKey, source, self) {
|
|
381
|
-
var trackActualOwner =
|
|
382
|
-
1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
|
|
383
|
-
return jsxDEVImpl(
|
|
384
|
-
type,
|
|
385
|
-
config,
|
|
386
|
-
maybeKey,
|
|
387
|
-
false,
|
|
388
|
-
source,
|
|
389
|
-
self,
|
|
390
|
-
trackActualOwner
|
|
391
|
-
? Error("react-stack-top-frame")
|
|
392
|
-
: unknownOwnerDebugStack,
|
|
393
|
-
trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
|
|
394
|
-
);
|
|
395
|
-
};
|
|
396
|
-
reactJsxRuntime_development.jsxs = function (type, config, maybeKey, source, self) {
|
|
397
|
-
var trackActualOwner =
|
|
398
|
-
1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
|
|
399
|
-
return jsxDEVImpl(
|
|
400
|
-
type,
|
|
401
|
-
config,
|
|
402
|
-
maybeKey,
|
|
403
|
-
true,
|
|
404
|
-
source,
|
|
405
|
-
self,
|
|
406
|
-
trackActualOwner
|
|
407
|
-
? Error("react-stack-top-frame")
|
|
408
|
-
: unknownOwnerDebugStack,
|
|
409
|
-
trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
|
|
410
|
-
);
|
|
411
|
-
};
|
|
412
|
-
})();
|
|
413
|
-
return reactJsxRuntime_development;
|
|
414
|
-
}
|
|
415
|
-
|
|
416
|
-
if (process.env.NODE_ENV === 'production') {
|
|
417
|
-
jsxRuntime.exports = requireReactJsxRuntime_production();
|
|
418
|
-
} else {
|
|
419
|
-
jsxRuntime.exports = requireReactJsxRuntime_development();
|
|
420
|
-
}
|
|
421
|
-
|
|
422
|
-
var jsxRuntimeExports = jsxRuntime.exports;
|
|
423
|
-
|
|
424
|
-
function OpalIframe({ token, opalUrl, onMessage, style, }) {
|
|
425
|
-
const iframeRef = require$$0.useRef(null);
|
|
426
|
-
const handleMessage = require$$0.useCallback((event) => {
|
|
427
|
-
var _a;
|
|
428
|
-
// Check if the event is from an allowed origin
|
|
429
|
-
const allowedOrigins = [
|
|
430
|
-
'https://opal.production.methodfi.com',
|
|
431
|
-
'https://opal.sandbox.methodfi.com',
|
|
432
|
-
'https://opal.dev.methodfi.com',
|
|
433
|
-
'http://localhost:3000'
|
|
434
|
-
];
|
|
435
|
-
if (!allowedOrigins.includes(event.origin)) {
|
|
436
|
-
return;
|
|
437
|
-
}
|
|
438
|
-
try {
|
|
439
|
-
// Forward the properly structured event
|
|
440
|
-
if ((_a = event.data) === null || _a === void 0 ? void 0 : _a.type) {
|
|
441
|
-
onMessage(event.data);
|
|
442
|
-
}
|
|
443
|
-
}
|
|
444
|
-
catch (error) {
|
|
445
|
-
onMessage({
|
|
446
|
-
type: 'opal.session.errored',
|
|
447
|
-
mode: 'opal',
|
|
448
|
-
object: 'session',
|
|
449
|
-
action: 'errored',
|
|
450
|
-
timestamp: new Date().toISOString(),
|
|
451
|
-
data: null,
|
|
452
|
-
});
|
|
453
|
-
}
|
|
454
|
-
}, [onMessage]);
|
|
455
|
-
require$$0.useEffect(() => {
|
|
456
|
-
// Add event listener for iframe messages
|
|
457
|
-
window.addEventListener('message', handleMessage);
|
|
458
|
-
return () => {
|
|
459
|
-
window.removeEventListener('message', handleMessage);
|
|
460
|
-
};
|
|
461
|
-
}, [handleMessage]);
|
|
462
|
-
if (!token || !opalUrl) {
|
|
463
|
-
return null;
|
|
464
|
-
}
|
|
465
|
-
return (jsxRuntimeExports.jsx("iframe", { ref: iframeRef, src: opalUrl, style: style, sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-top-navigation", title: "Opal" }));
|
|
466
|
-
}
|
|
8
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
467
9
|
|
|
468
10
|
const OPAL_URLS = {
|
|
469
11
|
local: 'http://localhost:3000',
|
|
470
12
|
dev: 'https://opal.dev.methodfi.com',
|
|
471
13
|
sandbox: 'https://opal.sandbox.methodfi.com',
|
|
472
|
-
production: 'https://opal.production.methodfi.com'
|
|
14
|
+
production: 'https://opal.production.methodfi.com'
|
|
473
15
|
};
|
|
474
16
|
|
|
475
|
-
const OpalContext =
|
|
17
|
+
const OpalContext = /*#__PURE__*/ React.createContext(null);
|
|
476
18
|
/**
|
|
477
19
|
* Provider component that wraps your app to enable Opal functionality.
|
|
478
20
|
* This component manages the Opal iframe state and provides context to child components.
|
|
@@ -489,29 +31,24 @@ const OpalContext = require$$0.createContext(null);
|
|
|
489
31
|
* );
|
|
490
32
|
* }
|
|
491
33
|
* ```
|
|
492
|
-
*/
|
|
493
|
-
|
|
494
|
-
const [
|
|
495
|
-
const [
|
|
496
|
-
const [
|
|
497
|
-
const [
|
|
498
|
-
const [currentConfig, setCurrentConfig] = require$$0.useState({});
|
|
34
|
+
*/ function OpalProvider({ children }) {
|
|
35
|
+
const [isOpen, setIsOpen] = React.useState(false);
|
|
36
|
+
const [isReady, setIsReady] = React.useState(false);
|
|
37
|
+
const [error, setError] = React.useState(null);
|
|
38
|
+
const [currentToken, setCurrentToken] = React.useState(null);
|
|
39
|
+
const [currentConfig, setCurrentConfig] = React.useState({});
|
|
499
40
|
const environment = currentConfig.env || 'production';
|
|
500
41
|
const baseUrl = OPAL_URLS[environment];
|
|
501
|
-
const opalUrl = currentToken
|
|
502
|
-
|
|
503
|
-
: '';
|
|
504
|
-
const handleMessage = (event) => {
|
|
505
|
-
var _a, _b;
|
|
42
|
+
const opalUrl = currentToken ? `${baseUrl}/?token=${currentToken}` : '';
|
|
43
|
+
const handleMessage = (event)=>{
|
|
506
44
|
// Always call onEvent if provided with properly typed event
|
|
507
|
-
|
|
45
|
+
currentConfig.onEvent == null ? void 0 : currentConfig.onEvent.call(currentConfig, event);
|
|
508
46
|
// Handle structured event format
|
|
509
47
|
const { action, data } = event;
|
|
510
48
|
// Legacy support for action-based handling
|
|
511
|
-
switch
|
|
49
|
+
switch(action){
|
|
512
50
|
case 'started':
|
|
513
|
-
if (!isReady)
|
|
514
|
-
setIsReady(true);
|
|
51
|
+
if (!isReady) setIsReady(true);
|
|
515
52
|
break;
|
|
516
53
|
case 'exited':
|
|
517
54
|
close();
|
|
@@ -519,29 +56,27 @@ function OpalProvider({ children }) {
|
|
|
519
56
|
case 'errored':
|
|
520
57
|
if (!error && data) {
|
|
521
58
|
setError(data);
|
|
522
|
-
|
|
59
|
+
currentConfig.onError == null ? void 0 : currentConfig.onError.call(currentConfig, data);
|
|
523
60
|
}
|
|
524
61
|
break;
|
|
525
62
|
}
|
|
526
63
|
};
|
|
527
|
-
const open = (options)
|
|
528
|
-
var _a;
|
|
64
|
+
const open = (options)=>{
|
|
529
65
|
setCurrentToken(options.token);
|
|
530
66
|
setIsOpen(true);
|
|
531
67
|
setError(null);
|
|
532
68
|
setIsReady(false);
|
|
533
|
-
|
|
69
|
+
currentConfig.onOpen == null ? void 0 : currentConfig.onOpen.call(currentConfig);
|
|
534
70
|
};
|
|
535
|
-
const close = ()
|
|
536
|
-
setTimeout(()
|
|
537
|
-
var _a;
|
|
71
|
+
const close = ()=>{
|
|
72
|
+
setTimeout(()=>{
|
|
538
73
|
setIsOpen(false);
|
|
539
74
|
setIsReady(false);
|
|
540
75
|
setCurrentToken(null);
|
|
541
|
-
|
|
76
|
+
currentConfig.onExit == null ? void 0 : currentConfig.onExit.call(currentConfig);
|
|
542
77
|
}, 500);
|
|
543
78
|
};
|
|
544
|
-
const updateConfig = (config)
|
|
79
|
+
const updateConfig = (config)=>{
|
|
545
80
|
setCurrentConfig(config);
|
|
546
81
|
};
|
|
547
82
|
const contextValue = {
|
|
@@ -550,25 +85,32 @@ function OpalProvider({ children }) {
|
|
|
550
85
|
error,
|
|
551
86
|
open,
|
|
552
87
|
close,
|
|
553
|
-
updateConfig
|
|
88
|
+
updateConfig
|
|
554
89
|
};
|
|
555
|
-
return
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
90
|
+
return /*#__PURE__*/ React__default.default.createElement(OpalContext.Provider, {
|
|
91
|
+
value: contextValue
|
|
92
|
+
}, children, isOpen && currentToken && /*#__PURE__*/ React__default.default.createElement(OpalIframe, {
|
|
93
|
+
token: currentToken,
|
|
94
|
+
opalUrl: opalUrl,
|
|
95
|
+
onMessage: handleMessage,
|
|
96
|
+
onClose: close,
|
|
97
|
+
style: {
|
|
98
|
+
position: 'fixed',
|
|
99
|
+
inset: 0,
|
|
100
|
+
width: '100%',
|
|
101
|
+
height: '100%',
|
|
102
|
+
border: 'none',
|
|
103
|
+
zIndex: 1000
|
|
104
|
+
}
|
|
105
|
+
}));
|
|
563
106
|
}
|
|
564
107
|
function useOpalContext() {
|
|
565
|
-
const context =
|
|
108
|
+
const context = React.useContext(OpalContext);
|
|
566
109
|
if (!context) {
|
|
567
110
|
throw new Error('useOpalContext must be used within an OpalProvider');
|
|
568
111
|
}
|
|
569
112
|
return context;
|
|
570
113
|
}
|
|
571
|
-
|
|
572
114
|
/**
|
|
573
115
|
* Hook for interacting with Opal within an OpalProvider context.
|
|
574
116
|
* This hook allows you to configure event handlers and open/close Opal sessions.
|
|
@@ -602,11 +144,10 @@ function useOpalContext() {
|
|
|
602
144
|
*
|
|
603
145
|
* @param config Configuration object with event handlers and environment settings
|
|
604
146
|
* @returns Object with open function and current state
|
|
605
|
-
*/
|
|
606
|
-
function useOpal(config = {}) {
|
|
147
|
+
*/ function useOpal(config = {}) {
|
|
607
148
|
const context = useOpalContext();
|
|
608
149
|
// Update the provider's config when this hook's config changes
|
|
609
|
-
|
|
150
|
+
React.useEffect(()=>{
|
|
610
151
|
context.updateConfig(config);
|
|
611
152
|
}, []);
|
|
612
153
|
return {
|
|
@@ -614,11 +155,61 @@ function useOpal(config = {}) {
|
|
|
614
155
|
close: context.close,
|
|
615
156
|
isReady: context.isReady,
|
|
616
157
|
isOpen: context.isOpen,
|
|
617
|
-
error: context.error
|
|
158
|
+
error: context.error
|
|
618
159
|
};
|
|
619
160
|
}
|
|
161
|
+
function OpalIframe({ token, opalUrl, onMessage, style }) {
|
|
162
|
+
const iframeRef = React.useRef(null);
|
|
163
|
+
const handleMessage = React.useCallback((event)=>{
|
|
164
|
+
// Check if the event is from an allowed origin
|
|
165
|
+
const allowedOrigins = [
|
|
166
|
+
'https://opal.production.methodfi.com',
|
|
167
|
+
'https://opal.sandbox.methodfi.com',
|
|
168
|
+
'https://opal.dev.methodfi.com',
|
|
169
|
+
'http://localhost:3000'
|
|
170
|
+
];
|
|
171
|
+
if (!allowedOrigins.includes(event.origin)) {
|
|
172
|
+
return;
|
|
173
|
+
}
|
|
174
|
+
try {
|
|
175
|
+
var _event_data;
|
|
176
|
+
// Forward the properly structured event
|
|
177
|
+
if ((_event_data = event.data) == null ? void 0 : _event_data.type) {
|
|
178
|
+
onMessage(event.data);
|
|
179
|
+
}
|
|
180
|
+
} catch (error) {
|
|
181
|
+
onMessage({
|
|
182
|
+
type: 'opal.session.errored',
|
|
183
|
+
mode: 'opal',
|
|
184
|
+
object: 'session',
|
|
185
|
+
action: 'errored',
|
|
186
|
+
timestamp: new Date().toISOString(),
|
|
187
|
+
data: null
|
|
188
|
+
});
|
|
189
|
+
}
|
|
190
|
+
}, [
|
|
191
|
+
onMessage
|
|
192
|
+
]);
|
|
193
|
+
React.useEffect(()=>{
|
|
194
|
+
// Add event listener for iframe messages
|
|
195
|
+
window.addEventListener('message', handleMessage);
|
|
196
|
+
return ()=>{
|
|
197
|
+
window.removeEventListener('message', handleMessage);
|
|
198
|
+
};
|
|
199
|
+
}, [
|
|
200
|
+
handleMessage
|
|
201
|
+
]);
|
|
202
|
+
if (!token || !opalUrl) {
|
|
203
|
+
return null;
|
|
204
|
+
}
|
|
205
|
+
return /*#__PURE__*/ React__default.default.createElement("iframe", {
|
|
206
|
+
ref: iframeRef,
|
|
207
|
+
src: opalUrl,
|
|
208
|
+
style: style,
|
|
209
|
+
sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-top-navigation",
|
|
210
|
+
title: "Opal"
|
|
211
|
+
});
|
|
212
|
+
}
|
|
620
213
|
|
|
621
|
-
exports.OpalIframe = OpalIframe;
|
|
622
214
|
exports.OpalProvider = OpalProvider;
|
|
623
215
|
exports.useOpal = useOpal;
|
|
624
|
-
//# sourceMappingURL=index.js.map
|