@kontextso/sdk-react-native 3.0.7-rc.2 → 3.0.7
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/dist/index.js +19 -170
- package/dist/index.mjs +19 -170
- package/package.json +2 -2
- package/src/formats/Format.tsx +14 -169
- package/src/frame-webview.tsx +3 -0
package/dist/index.js
CHANGED
|
@@ -79,6 +79,9 @@ var FrameWebView = (0, import_react.forwardRef)(
|
|
|
79
79
|
javaScriptEnabled: true,
|
|
80
80
|
domStorageEnabled: true,
|
|
81
81
|
allowsFullscreenVideo: false,
|
|
82
|
+
originWhitelist: ["*"],
|
|
83
|
+
sharedCookiesEnabled: true,
|
|
84
|
+
thirdPartyCookiesEnabled: true,
|
|
82
85
|
injectedJavaScript: `
|
|
83
86
|
window.addEventListener("message", function(event) {
|
|
84
87
|
if (window.ReactNativeWebView && event.data) {
|
|
@@ -147,21 +150,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
147
150
|
context?.captureError(new Error("Processing iframe error"));
|
|
148
151
|
};
|
|
149
152
|
const resetModal = () => {
|
|
150
|
-
debugModal("Format:resetModal", {
|
|
151
|
-
params: {
|
|
152
|
-
messageId,
|
|
153
|
-
code,
|
|
154
|
-
otherParams
|
|
155
|
-
}
|
|
156
|
-
});
|
|
157
153
|
if (modalInitTimeoutRef.current) {
|
|
158
|
-
debugModal("Format:resetModalTimeout", {
|
|
159
|
-
params: {
|
|
160
|
-
messageId,
|
|
161
|
-
code,
|
|
162
|
-
otherParams
|
|
163
|
-
}
|
|
164
|
-
});
|
|
165
154
|
clearTimeout(modalInitTimeoutRef.current);
|
|
166
155
|
modalInitTimeoutRef.current = null;
|
|
167
156
|
}
|
|
@@ -198,34 +187,19 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
198
187
|
...data
|
|
199
188
|
});
|
|
200
189
|
};
|
|
201
|
-
debug("
|
|
202
|
-
params: {
|
|
203
|
-
messageId,
|
|
204
|
-
code,
|
|
205
|
-
otherParams
|
|
206
|
-
}
|
|
207
|
-
});
|
|
190
|
+
debug("format-update-state");
|
|
208
191
|
const onMessage = (event) => {
|
|
209
192
|
try {
|
|
210
193
|
const data = JSON.parse(event.nativeEvent.data);
|
|
211
|
-
debug("
|
|
212
|
-
message: data
|
|
213
|
-
params: { data, messageId, code, otherParams }
|
|
194
|
+
debug("iframe-message", {
|
|
195
|
+
message: data
|
|
214
196
|
});
|
|
215
197
|
const messageHandler = handleIframeMessage(
|
|
216
198
|
(message) => {
|
|
217
199
|
switch (message.type) {
|
|
218
200
|
case "init-iframe":
|
|
219
201
|
setIframeLoaded(true);
|
|
220
|
-
debug("
|
|
221
|
-
params: {
|
|
222
|
-
code,
|
|
223
|
-
messages: context?.messages,
|
|
224
|
-
sdk: "sdk-react-native",
|
|
225
|
-
otherParams,
|
|
226
|
-
messageId
|
|
227
|
-
}
|
|
228
|
-
});
|
|
202
|
+
debug("iframe-post-message");
|
|
229
203
|
sendMessage(webViewRef, "update-iframe", code, {
|
|
230
204
|
messages: context?.messages,
|
|
231
205
|
sdk: "sdk-react-native",
|
|
@@ -285,8 +259,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
285
259
|
);
|
|
286
260
|
messageHandler({ data });
|
|
287
261
|
} catch (e) {
|
|
288
|
-
debug("
|
|
289
|
-
params: { error: e, messageId, code, otherParams },
|
|
262
|
+
debug("iframe-message-error", {
|
|
290
263
|
error: e
|
|
291
264
|
});
|
|
292
265
|
console.error("error parsing message from webview", e);
|
|
@@ -296,8 +269,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
296
269
|
const onModalMessage = (event) => {
|
|
297
270
|
try {
|
|
298
271
|
const data = JSON.parse(event.nativeEvent.data);
|
|
299
|
-
debugModal("
|
|
300
|
-
params: { data, messageId, code, otherParams },
|
|
272
|
+
debugModal("modal-iframe-message", {
|
|
301
273
|
message: data
|
|
302
274
|
});
|
|
303
275
|
const messageHandler = handleIframeMessage(
|
|
@@ -340,8 +312,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
340
312
|
);
|
|
341
313
|
messageHandler({ data });
|
|
342
314
|
} catch (e) {
|
|
343
|
-
debugModal("
|
|
344
|
-
params: { error: e, messageId, code, otherParams },
|
|
315
|
+
debugModal("modal-iframe-message-error", {
|
|
345
316
|
error: e
|
|
346
317
|
});
|
|
347
318
|
console.error("error parsing message from webview", e);
|
|
@@ -351,50 +322,16 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
351
322
|
const paramsString = (0, import_sdk_react.convertParamsToString)(otherParams);
|
|
352
323
|
(0, import_react2.useEffect)(() => {
|
|
353
324
|
if (!iframeLoaded || !context?.adServerUrl || !bid || !webViewRef.current) {
|
|
354
|
-
debug("Format:iframePostMessageNotLoaded", {
|
|
355
|
-
params: {
|
|
356
|
-
messageId,
|
|
357
|
-
iframeLoaded,
|
|
358
|
-
contextAdServerUrl: context?.adServerUrl,
|
|
359
|
-
bid,
|
|
360
|
-
code,
|
|
361
|
-
otherParams
|
|
362
|
-
}
|
|
363
|
-
});
|
|
364
325
|
return;
|
|
365
326
|
}
|
|
366
|
-
debug("
|
|
367
|
-
params: {
|
|
368
|
-
messageId,
|
|
369
|
-
otherParams,
|
|
370
|
-
code
|
|
371
|
-
}
|
|
372
|
-
});
|
|
327
|
+
debug("iframe-post-message");
|
|
373
328
|
sendMessage(webViewRef, "update-iframe", code, {
|
|
374
329
|
data: { otherParams },
|
|
375
330
|
code
|
|
376
331
|
});
|
|
377
332
|
}, [paramsString, iframeLoaded, context?.adServerUrl, bid, code]);
|
|
378
333
|
const checkIfInViewport = () => {
|
|
379
|
-
if (!containerRef.current)
|
|
380
|
-
debug("Format:checkIfInViewportNoContainer", {
|
|
381
|
-
params: {
|
|
382
|
-
messageId,
|
|
383
|
-
code,
|
|
384
|
-
otherParams
|
|
385
|
-
}
|
|
386
|
-
});
|
|
387
|
-
return;
|
|
388
|
-
}
|
|
389
|
-
debug("Format:checkIfInViewportMeasure", {
|
|
390
|
-
params: {
|
|
391
|
-
windowWidth,
|
|
392
|
-
windowHeight,
|
|
393
|
-
messageId,
|
|
394
|
-
code,
|
|
395
|
-
otherParams
|
|
396
|
-
}
|
|
397
|
-
});
|
|
334
|
+
if (!containerRef.current) return;
|
|
398
335
|
containerRef.current.measureInWindow((containerX, containerY, containerWidth, containerHeight) => {
|
|
399
336
|
sendMessage(webViewRef, "update-dimensions-iframe", code, {
|
|
400
337
|
windowWidth,
|
|
@@ -405,93 +342,29 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
405
342
|
containerY,
|
|
406
343
|
keyboardHeight: keyboardHeightRef.current
|
|
407
344
|
});
|
|
408
|
-
debug("Format:checkIfInViewportMeasureSend", {
|
|
409
|
-
params: {
|
|
410
|
-
messageId,
|
|
411
|
-
code,
|
|
412
|
-
otherParams,
|
|
413
|
-
windowWidth,
|
|
414
|
-
windowHeight,
|
|
415
|
-
containerWidth,
|
|
416
|
-
containerHeight,
|
|
417
|
-
containerX,
|
|
418
|
-
containerY,
|
|
419
|
-
keyboardHeight: keyboardHeightRef.current
|
|
420
|
-
}
|
|
421
|
-
});
|
|
422
345
|
});
|
|
423
346
|
};
|
|
424
347
|
(0, import_react2.useEffect)(() => {
|
|
425
|
-
if (!isAdViewVisible)
|
|
426
|
-
debug("Format:checkIfInViewportNotVisible", {
|
|
427
|
-
params: {
|
|
428
|
-
messageId,
|
|
429
|
-
code,
|
|
430
|
-
otherParams
|
|
431
|
-
}
|
|
432
|
-
});
|
|
433
|
-
return;
|
|
434
|
-
}
|
|
348
|
+
if (!isAdViewVisible) return;
|
|
435
349
|
const interval = setInterval(() => {
|
|
436
350
|
checkIfInViewport();
|
|
437
351
|
}, 250);
|
|
438
|
-
return () =>
|
|
439
|
-
clearInterval(interval);
|
|
440
|
-
debug("Format:checkIfInViewportCleanup", {
|
|
441
|
-
params: {
|
|
442
|
-
messageId,
|
|
443
|
-
code,
|
|
444
|
-
otherParams
|
|
445
|
-
}
|
|
446
|
-
});
|
|
447
|
-
};
|
|
352
|
+
return () => clearInterval(interval);
|
|
448
353
|
}, [isAdViewVisible]);
|
|
449
354
|
(0, import_react2.useEffect)(() => {
|
|
450
355
|
const showSubscription = import_react_native.Keyboard.addListener("keyboardDidShow", (e) => {
|
|
451
|
-
debug("Format:keyboardDidShow", {
|
|
452
|
-
params: {
|
|
453
|
-
keyboardHeight: e?.endCoordinates?.height ?? 0,
|
|
454
|
-
messageId,
|
|
455
|
-
code,
|
|
456
|
-
otherParams
|
|
457
|
-
}
|
|
458
|
-
});
|
|
459
356
|
keyboardHeightRef.current = e?.endCoordinates?.height ?? 0;
|
|
460
357
|
});
|
|
461
358
|
const hideSubscription = import_react_native.Keyboard.addListener("keyboardDidHide", () => {
|
|
462
|
-
debug("Format:keyboardDidHide", {
|
|
463
|
-
params: {
|
|
464
|
-
messageId,
|
|
465
|
-
code,
|
|
466
|
-
otherParams
|
|
467
|
-
}
|
|
468
|
-
});
|
|
469
359
|
keyboardHeightRef.current = 0;
|
|
470
360
|
});
|
|
471
361
|
return () => {
|
|
472
362
|
showSubscription.remove();
|
|
473
363
|
hideSubscription.remove();
|
|
474
364
|
keyboardHeightRef.current = 0;
|
|
475
|
-
debug("Format:keyboardEffectCleanup", {
|
|
476
|
-
params: {
|
|
477
|
-
messageId,
|
|
478
|
-
code,
|
|
479
|
-
otherParams
|
|
480
|
-
}
|
|
481
|
-
});
|
|
482
365
|
};
|
|
483
366
|
}, []);
|
|
484
367
|
if (!context || !bid || !iframeUrl) {
|
|
485
|
-
debug("Format:noContextOrBidOrIframeUrl", {
|
|
486
|
-
params: {
|
|
487
|
-
context,
|
|
488
|
-
bid,
|
|
489
|
-
iframeUrl,
|
|
490
|
-
messageId,
|
|
491
|
-
code,
|
|
492
|
-
otherParams
|
|
493
|
-
}
|
|
494
|
-
});
|
|
495
368
|
return null;
|
|
496
369
|
}
|
|
497
370
|
const inlineContent = /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
@@ -508,23 +381,11 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
508
381
|
...iframeStyles
|
|
509
382
|
},
|
|
510
383
|
onError: () => {
|
|
511
|
-
debug("
|
|
512
|
-
params: {
|
|
513
|
-
messageId,
|
|
514
|
-
code,
|
|
515
|
-
otherParams
|
|
516
|
-
}
|
|
517
|
-
});
|
|
384
|
+
debug("iframe-error");
|
|
518
385
|
reset();
|
|
519
386
|
},
|
|
520
387
|
onLoad: () => {
|
|
521
|
-
debug("
|
|
522
|
-
params: {
|
|
523
|
-
messageId,
|
|
524
|
-
code,
|
|
525
|
-
otherParams
|
|
526
|
-
}
|
|
527
|
-
});
|
|
388
|
+
debug("iframe-load");
|
|
528
389
|
}
|
|
529
390
|
}
|
|
530
391
|
);
|
|
@@ -557,23 +418,11 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
557
418
|
borderWidth: 0
|
|
558
419
|
},
|
|
559
420
|
onError: () => {
|
|
560
|
-
debug("
|
|
561
|
-
params: {
|
|
562
|
-
messageId,
|
|
563
|
-
code,
|
|
564
|
-
otherParams
|
|
565
|
-
}
|
|
566
|
-
});
|
|
421
|
+
debug("modal-error");
|
|
567
422
|
resetModal();
|
|
568
423
|
},
|
|
569
424
|
onLoad: () => {
|
|
570
|
-
debug("
|
|
571
|
-
params: {
|
|
572
|
-
messageId,
|
|
573
|
-
code,
|
|
574
|
-
otherParams
|
|
575
|
-
}
|
|
576
|
-
});
|
|
425
|
+
debug("modal-load");
|
|
577
426
|
setModalLoaded(true);
|
|
578
427
|
}
|
|
579
428
|
}
|
|
@@ -614,7 +463,7 @@ var import_react_native3 = require("react-native");
|
|
|
614
463
|
var import_react_native_device_info = __toESM(require("react-native-device-info"));
|
|
615
464
|
|
|
616
465
|
// package.json
|
|
617
|
-
var version = "3.0.7
|
|
466
|
+
var version = "3.0.7";
|
|
618
467
|
|
|
619
468
|
// src/NativeRNKontext.ts
|
|
620
469
|
var import_react_native2 = require("react-native");
|
package/dist/index.mjs
CHANGED
|
@@ -48,6 +48,9 @@ var FrameWebView = forwardRef(
|
|
|
48
48
|
javaScriptEnabled: true,
|
|
49
49
|
domStorageEnabled: true,
|
|
50
50
|
allowsFullscreenVideo: false,
|
|
51
|
+
originWhitelist: ["*"],
|
|
52
|
+
sharedCookiesEnabled: true,
|
|
53
|
+
thirdPartyCookiesEnabled: true,
|
|
51
54
|
injectedJavaScript: `
|
|
52
55
|
window.addEventListener("message", function(event) {
|
|
53
56
|
if (window.ReactNativeWebView && event.data) {
|
|
@@ -116,21 +119,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
116
119
|
context?.captureError(new Error("Processing iframe error"));
|
|
117
120
|
};
|
|
118
121
|
const resetModal = () => {
|
|
119
|
-
debugModal("Format:resetModal", {
|
|
120
|
-
params: {
|
|
121
|
-
messageId,
|
|
122
|
-
code,
|
|
123
|
-
otherParams
|
|
124
|
-
}
|
|
125
|
-
});
|
|
126
122
|
if (modalInitTimeoutRef.current) {
|
|
127
|
-
debugModal("Format:resetModalTimeout", {
|
|
128
|
-
params: {
|
|
129
|
-
messageId,
|
|
130
|
-
code,
|
|
131
|
-
otherParams
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
123
|
clearTimeout(modalInitTimeoutRef.current);
|
|
135
124
|
modalInitTimeoutRef.current = null;
|
|
136
125
|
}
|
|
@@ -167,34 +156,19 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
167
156
|
...data
|
|
168
157
|
});
|
|
169
158
|
};
|
|
170
|
-
debug("
|
|
171
|
-
params: {
|
|
172
|
-
messageId,
|
|
173
|
-
code,
|
|
174
|
-
otherParams
|
|
175
|
-
}
|
|
176
|
-
});
|
|
159
|
+
debug("format-update-state");
|
|
177
160
|
const onMessage = (event) => {
|
|
178
161
|
try {
|
|
179
162
|
const data = JSON.parse(event.nativeEvent.data);
|
|
180
|
-
debug("
|
|
181
|
-
message: data
|
|
182
|
-
params: { data, messageId, code, otherParams }
|
|
163
|
+
debug("iframe-message", {
|
|
164
|
+
message: data
|
|
183
165
|
});
|
|
184
166
|
const messageHandler = handleIframeMessage(
|
|
185
167
|
(message) => {
|
|
186
168
|
switch (message.type) {
|
|
187
169
|
case "init-iframe":
|
|
188
170
|
setIframeLoaded(true);
|
|
189
|
-
debug("
|
|
190
|
-
params: {
|
|
191
|
-
code,
|
|
192
|
-
messages: context?.messages,
|
|
193
|
-
sdk: "sdk-react-native",
|
|
194
|
-
otherParams,
|
|
195
|
-
messageId
|
|
196
|
-
}
|
|
197
|
-
});
|
|
171
|
+
debug("iframe-post-message");
|
|
198
172
|
sendMessage(webViewRef, "update-iframe", code, {
|
|
199
173
|
messages: context?.messages,
|
|
200
174
|
sdk: "sdk-react-native",
|
|
@@ -254,8 +228,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
254
228
|
);
|
|
255
229
|
messageHandler({ data });
|
|
256
230
|
} catch (e) {
|
|
257
|
-
debug("
|
|
258
|
-
params: { error: e, messageId, code, otherParams },
|
|
231
|
+
debug("iframe-message-error", {
|
|
259
232
|
error: e
|
|
260
233
|
});
|
|
261
234
|
console.error("error parsing message from webview", e);
|
|
@@ -265,8 +238,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
265
238
|
const onModalMessage = (event) => {
|
|
266
239
|
try {
|
|
267
240
|
const data = JSON.parse(event.nativeEvent.data);
|
|
268
|
-
debugModal("
|
|
269
|
-
params: { data, messageId, code, otherParams },
|
|
241
|
+
debugModal("modal-iframe-message", {
|
|
270
242
|
message: data
|
|
271
243
|
});
|
|
272
244
|
const messageHandler = handleIframeMessage(
|
|
@@ -309,8 +281,7 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
309
281
|
);
|
|
310
282
|
messageHandler({ data });
|
|
311
283
|
} catch (e) {
|
|
312
|
-
debugModal("
|
|
313
|
-
params: { error: e, messageId, code, otherParams },
|
|
284
|
+
debugModal("modal-iframe-message-error", {
|
|
314
285
|
error: e
|
|
315
286
|
});
|
|
316
287
|
console.error("error parsing message from webview", e);
|
|
@@ -320,50 +291,16 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
320
291
|
const paramsString = convertParamsToString(otherParams);
|
|
321
292
|
useEffect(() => {
|
|
322
293
|
if (!iframeLoaded || !context?.adServerUrl || !bid || !webViewRef.current) {
|
|
323
|
-
debug("Format:iframePostMessageNotLoaded", {
|
|
324
|
-
params: {
|
|
325
|
-
messageId,
|
|
326
|
-
iframeLoaded,
|
|
327
|
-
contextAdServerUrl: context?.adServerUrl,
|
|
328
|
-
bid,
|
|
329
|
-
code,
|
|
330
|
-
otherParams
|
|
331
|
-
}
|
|
332
|
-
});
|
|
333
294
|
return;
|
|
334
295
|
}
|
|
335
|
-
debug("
|
|
336
|
-
params: {
|
|
337
|
-
messageId,
|
|
338
|
-
otherParams,
|
|
339
|
-
code
|
|
340
|
-
}
|
|
341
|
-
});
|
|
296
|
+
debug("iframe-post-message");
|
|
342
297
|
sendMessage(webViewRef, "update-iframe", code, {
|
|
343
298
|
data: { otherParams },
|
|
344
299
|
code
|
|
345
300
|
});
|
|
346
301
|
}, [paramsString, iframeLoaded, context?.adServerUrl, bid, code]);
|
|
347
302
|
const checkIfInViewport = () => {
|
|
348
|
-
if (!containerRef.current)
|
|
349
|
-
debug("Format:checkIfInViewportNoContainer", {
|
|
350
|
-
params: {
|
|
351
|
-
messageId,
|
|
352
|
-
code,
|
|
353
|
-
otherParams
|
|
354
|
-
}
|
|
355
|
-
});
|
|
356
|
-
return;
|
|
357
|
-
}
|
|
358
|
-
debug("Format:checkIfInViewportMeasure", {
|
|
359
|
-
params: {
|
|
360
|
-
windowWidth,
|
|
361
|
-
windowHeight,
|
|
362
|
-
messageId,
|
|
363
|
-
code,
|
|
364
|
-
otherParams
|
|
365
|
-
}
|
|
366
|
-
});
|
|
303
|
+
if (!containerRef.current) return;
|
|
367
304
|
containerRef.current.measureInWindow((containerX, containerY, containerWidth, containerHeight) => {
|
|
368
305
|
sendMessage(webViewRef, "update-dimensions-iframe", code, {
|
|
369
306
|
windowWidth,
|
|
@@ -374,93 +311,29 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
374
311
|
containerY,
|
|
375
312
|
keyboardHeight: keyboardHeightRef.current
|
|
376
313
|
});
|
|
377
|
-
debug("Format:checkIfInViewportMeasureSend", {
|
|
378
|
-
params: {
|
|
379
|
-
messageId,
|
|
380
|
-
code,
|
|
381
|
-
otherParams,
|
|
382
|
-
windowWidth,
|
|
383
|
-
windowHeight,
|
|
384
|
-
containerWidth,
|
|
385
|
-
containerHeight,
|
|
386
|
-
containerX,
|
|
387
|
-
containerY,
|
|
388
|
-
keyboardHeight: keyboardHeightRef.current
|
|
389
|
-
}
|
|
390
|
-
});
|
|
391
314
|
});
|
|
392
315
|
};
|
|
393
316
|
useEffect(() => {
|
|
394
|
-
if (!isAdViewVisible)
|
|
395
|
-
debug("Format:checkIfInViewportNotVisible", {
|
|
396
|
-
params: {
|
|
397
|
-
messageId,
|
|
398
|
-
code,
|
|
399
|
-
otherParams
|
|
400
|
-
}
|
|
401
|
-
});
|
|
402
|
-
return;
|
|
403
|
-
}
|
|
317
|
+
if (!isAdViewVisible) return;
|
|
404
318
|
const interval = setInterval(() => {
|
|
405
319
|
checkIfInViewport();
|
|
406
320
|
}, 250);
|
|
407
|
-
return () =>
|
|
408
|
-
clearInterval(interval);
|
|
409
|
-
debug("Format:checkIfInViewportCleanup", {
|
|
410
|
-
params: {
|
|
411
|
-
messageId,
|
|
412
|
-
code,
|
|
413
|
-
otherParams
|
|
414
|
-
}
|
|
415
|
-
});
|
|
416
|
-
};
|
|
321
|
+
return () => clearInterval(interval);
|
|
417
322
|
}, [isAdViewVisible]);
|
|
418
323
|
useEffect(() => {
|
|
419
324
|
const showSubscription = Keyboard.addListener("keyboardDidShow", (e) => {
|
|
420
|
-
debug("Format:keyboardDidShow", {
|
|
421
|
-
params: {
|
|
422
|
-
keyboardHeight: e?.endCoordinates?.height ?? 0,
|
|
423
|
-
messageId,
|
|
424
|
-
code,
|
|
425
|
-
otherParams
|
|
426
|
-
}
|
|
427
|
-
});
|
|
428
325
|
keyboardHeightRef.current = e?.endCoordinates?.height ?? 0;
|
|
429
326
|
});
|
|
430
327
|
const hideSubscription = Keyboard.addListener("keyboardDidHide", () => {
|
|
431
|
-
debug("Format:keyboardDidHide", {
|
|
432
|
-
params: {
|
|
433
|
-
messageId,
|
|
434
|
-
code,
|
|
435
|
-
otherParams
|
|
436
|
-
}
|
|
437
|
-
});
|
|
438
328
|
keyboardHeightRef.current = 0;
|
|
439
329
|
});
|
|
440
330
|
return () => {
|
|
441
331
|
showSubscription.remove();
|
|
442
332
|
hideSubscription.remove();
|
|
443
333
|
keyboardHeightRef.current = 0;
|
|
444
|
-
debug("Format:keyboardEffectCleanup", {
|
|
445
|
-
params: {
|
|
446
|
-
messageId,
|
|
447
|
-
code,
|
|
448
|
-
otherParams
|
|
449
|
-
}
|
|
450
|
-
});
|
|
451
334
|
};
|
|
452
335
|
}, []);
|
|
453
336
|
if (!context || !bid || !iframeUrl) {
|
|
454
|
-
debug("Format:noContextOrBidOrIframeUrl", {
|
|
455
|
-
params: {
|
|
456
|
-
context,
|
|
457
|
-
bid,
|
|
458
|
-
iframeUrl,
|
|
459
|
-
messageId,
|
|
460
|
-
code,
|
|
461
|
-
otherParams
|
|
462
|
-
}
|
|
463
|
-
});
|
|
464
337
|
return null;
|
|
465
338
|
}
|
|
466
339
|
const inlineContent = /* @__PURE__ */ jsx2(
|
|
@@ -477,23 +350,11 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
477
350
|
...iframeStyles
|
|
478
351
|
},
|
|
479
352
|
onError: () => {
|
|
480
|
-
debug("
|
|
481
|
-
params: {
|
|
482
|
-
messageId,
|
|
483
|
-
code,
|
|
484
|
-
otherParams
|
|
485
|
-
}
|
|
486
|
-
});
|
|
353
|
+
debug("iframe-error");
|
|
487
354
|
reset();
|
|
488
355
|
},
|
|
489
356
|
onLoad: () => {
|
|
490
|
-
debug("
|
|
491
|
-
params: {
|
|
492
|
-
messageId,
|
|
493
|
-
code,
|
|
494
|
-
otherParams
|
|
495
|
-
}
|
|
496
|
-
});
|
|
357
|
+
debug("iframe-load");
|
|
497
358
|
}
|
|
498
359
|
}
|
|
499
360
|
);
|
|
@@ -526,23 +387,11 @@ var Format = ({ code, messageId, wrapper, onEvent, ...otherParams }) => {
|
|
|
526
387
|
borderWidth: 0
|
|
527
388
|
},
|
|
528
389
|
onError: () => {
|
|
529
|
-
debug("
|
|
530
|
-
params: {
|
|
531
|
-
messageId,
|
|
532
|
-
code,
|
|
533
|
-
otherParams
|
|
534
|
-
}
|
|
535
|
-
});
|
|
390
|
+
debug("modal-error");
|
|
536
391
|
resetModal();
|
|
537
392
|
},
|
|
538
393
|
onLoad: () => {
|
|
539
|
-
debug("
|
|
540
|
-
params: {
|
|
541
|
-
messageId,
|
|
542
|
-
code,
|
|
543
|
-
otherParams
|
|
544
|
-
}
|
|
545
|
-
});
|
|
394
|
+
debug("modal-load");
|
|
546
395
|
setModalLoaded(true);
|
|
547
396
|
}
|
|
548
397
|
}
|
|
@@ -586,7 +435,7 @@ import { Appearance, Dimensions, PixelRatio, Platform } from "react-native";
|
|
|
586
435
|
import DeviceInfo from "react-native-device-info";
|
|
587
436
|
|
|
588
437
|
// package.json
|
|
589
|
-
var version = "3.0.7
|
|
438
|
+
var version = "3.0.7";
|
|
590
439
|
|
|
591
440
|
// src/NativeRNKontext.ts
|
|
592
441
|
import { TurboModuleRegistry } from "react-native";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kontextso/sdk-react-native",
|
|
3
|
-
"version": "3.0.7
|
|
3
|
+
"version": "3.0.7",
|
|
4
4
|
"description": "Kontext SDK for React Native",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"react-native-webview": "^13.10.0"
|
|
55
55
|
},
|
|
56
56
|
"dependencies": {
|
|
57
|
-
"@kontextso/sdk-react": "^3.0.
|
|
57
|
+
"@kontextso/sdk-react": "^3.0.5"
|
|
58
58
|
},
|
|
59
59
|
"files": [
|
|
60
60
|
"dist/*",
|
package/src/formats/Format.tsx
CHANGED
|
@@ -89,21 +89,7 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
89
89
|
}
|
|
90
90
|
|
|
91
91
|
const resetModal = () => {
|
|
92
|
-
debugModal('Format:resetModal', {
|
|
93
|
-
params: {
|
|
94
|
-
messageId,
|
|
95
|
-
code,
|
|
96
|
-
otherParams,
|
|
97
|
-
}
|
|
98
|
-
})
|
|
99
92
|
if (modalInitTimeoutRef.current) {
|
|
100
|
-
debugModal('Format:resetModalTimeout', {
|
|
101
|
-
params: {
|
|
102
|
-
messageId,
|
|
103
|
-
code,
|
|
104
|
-
otherParams,
|
|
105
|
-
}
|
|
106
|
-
})
|
|
107
93
|
clearTimeout(modalInitTimeoutRef.current)
|
|
108
94
|
modalInitTimeoutRef.current = null
|
|
109
95
|
}
|
|
@@ -144,21 +130,14 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
144
130
|
})
|
|
145
131
|
}
|
|
146
132
|
|
|
147
|
-
debug('
|
|
148
|
-
params: {
|
|
149
|
-
messageId,
|
|
150
|
-
code,
|
|
151
|
-
otherParams
|
|
152
|
-
}
|
|
153
|
-
})
|
|
133
|
+
debug('format-update-state')
|
|
154
134
|
|
|
155
135
|
const onMessage = (event: WebViewMessageEvent) => {
|
|
156
136
|
try {
|
|
157
137
|
const data = JSON.parse(event.nativeEvent.data) as IframeMessage
|
|
158
138
|
|
|
159
|
-
debug('
|
|
139
|
+
debug('iframe-message', {
|
|
160
140
|
message: data,
|
|
161
|
-
params: { data, messageId, code, otherParams }
|
|
162
141
|
})
|
|
163
142
|
|
|
164
143
|
const messageHandler = handleIframeMessage(
|
|
@@ -166,15 +145,7 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
166
145
|
switch (message.type) {
|
|
167
146
|
case 'init-iframe':
|
|
168
147
|
setIframeLoaded(true)
|
|
169
|
-
debug('
|
|
170
|
-
params: {
|
|
171
|
-
code,
|
|
172
|
-
messages: context?.messages,
|
|
173
|
-
sdk: 'sdk-react-native',
|
|
174
|
-
otherParams,
|
|
175
|
-
messageId,
|
|
176
|
-
}
|
|
177
|
-
})
|
|
148
|
+
debug('iframe-post-message')
|
|
178
149
|
sendMessage(webViewRef, 'update-iframe', code, {
|
|
179
150
|
messages: context?.messages,
|
|
180
151
|
sdk: 'sdk-react-native',
|
|
@@ -245,8 +216,7 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
245
216
|
)
|
|
246
217
|
messageHandler({ data } as IframeMessageEvent)
|
|
247
218
|
} catch (e) {
|
|
248
|
-
debug('
|
|
249
|
-
params: { error: e, messageId, code, otherParams },
|
|
219
|
+
debug('iframe-message-error', {
|
|
250
220
|
error: e,
|
|
251
221
|
})
|
|
252
222
|
console.error('error parsing message from webview', e)
|
|
@@ -258,8 +228,7 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
258
228
|
try {
|
|
259
229
|
const data = JSON.parse(event.nativeEvent.data) as IframeMessage
|
|
260
230
|
|
|
261
|
-
debugModal('
|
|
262
|
-
params: { data, messageId, code, otherParams },
|
|
231
|
+
debugModal('modal-iframe-message', {
|
|
263
232
|
message: data,
|
|
264
233
|
})
|
|
265
234
|
|
|
@@ -310,8 +279,7 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
310
279
|
)
|
|
311
280
|
messageHandler({ data } as IframeMessageEvent)
|
|
312
281
|
} catch (e) {
|
|
313
|
-
debugModal('
|
|
314
|
-
params: { error: e, messageId, code, otherParams },
|
|
282
|
+
debugModal('modal-iframe-message-error', {
|
|
315
283
|
error: e,
|
|
316
284
|
})
|
|
317
285
|
console.error('error parsing message from webview', e)
|
|
@@ -323,25 +291,9 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
323
291
|
|
|
324
292
|
useEffect(() => {
|
|
325
293
|
if (!iframeLoaded || !context?.adServerUrl || !bid || !webViewRef.current) {
|
|
326
|
-
debug('Format:iframePostMessageNotLoaded', {
|
|
327
|
-
params: {
|
|
328
|
-
messageId,
|
|
329
|
-
iframeLoaded,
|
|
330
|
-
contextAdServerUrl: context?.adServerUrl,
|
|
331
|
-
bid,
|
|
332
|
-
code,
|
|
333
|
-
otherParams,
|
|
334
|
-
}
|
|
335
|
-
})
|
|
336
294
|
return
|
|
337
295
|
}
|
|
338
|
-
debug('
|
|
339
|
-
params: {
|
|
340
|
-
messageId,
|
|
341
|
-
otherParams,
|
|
342
|
-
code,
|
|
343
|
-
}
|
|
344
|
-
})
|
|
296
|
+
debug('iframe-post-message')
|
|
345
297
|
sendMessage(webViewRef, 'update-iframe', code, {
|
|
346
298
|
data: { otherParams },
|
|
347
299
|
code,
|
|
@@ -350,26 +302,7 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
350
302
|
}, [paramsString, iframeLoaded, context?.adServerUrl, bid, code])
|
|
351
303
|
|
|
352
304
|
const checkIfInViewport = () => {
|
|
353
|
-
if (!containerRef.current)
|
|
354
|
-
debug('Format:checkIfInViewportNoContainer', {
|
|
355
|
-
params: {
|
|
356
|
-
messageId,
|
|
357
|
-
code,
|
|
358
|
-
otherParams,
|
|
359
|
-
}
|
|
360
|
-
})
|
|
361
|
-
return
|
|
362
|
-
}
|
|
363
|
-
|
|
364
|
-
debug('Format:checkIfInViewportMeasure', {
|
|
365
|
-
params: {
|
|
366
|
-
windowWidth,
|
|
367
|
-
windowHeight,
|
|
368
|
-
messageId,
|
|
369
|
-
code,
|
|
370
|
-
otherParams,
|
|
371
|
-
}
|
|
372
|
-
})
|
|
305
|
+
if (!containerRef.current) return
|
|
373
306
|
|
|
374
307
|
containerRef.current.measureInWindow((containerX, containerY, containerWidth, containerHeight) => {
|
|
375
308
|
sendMessage(webViewRef, 'update-dimensions-iframe', code, {
|
|
@@ -381,71 +314,24 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
381
314
|
containerY,
|
|
382
315
|
keyboardHeight: keyboardHeightRef.current,
|
|
383
316
|
})
|
|
384
|
-
debug('Format:checkIfInViewportMeasureSend', {
|
|
385
|
-
params: {
|
|
386
|
-
messageId,
|
|
387
|
-
code,
|
|
388
|
-
otherParams,
|
|
389
|
-
windowWidth,
|
|
390
|
-
windowHeight,
|
|
391
|
-
containerWidth,
|
|
392
|
-
containerHeight,
|
|
393
|
-
containerX,
|
|
394
|
-
containerY,
|
|
395
|
-
keyboardHeight: keyboardHeightRef.current,
|
|
396
|
-
}
|
|
397
|
-
})
|
|
398
317
|
})
|
|
399
318
|
}
|
|
400
319
|
|
|
401
320
|
useEffect(() => {
|
|
402
|
-
if (!isAdViewVisible)
|
|
403
|
-
debug('Format:checkIfInViewportNotVisible', {
|
|
404
|
-
params: {
|
|
405
|
-
messageId,
|
|
406
|
-
code,
|
|
407
|
-
otherParams,
|
|
408
|
-
}
|
|
409
|
-
})
|
|
410
|
-
return
|
|
411
|
-
}
|
|
321
|
+
if (!isAdViewVisible) return
|
|
412
322
|
|
|
413
323
|
const interval = setInterval(() => {
|
|
414
324
|
checkIfInViewport()
|
|
415
325
|
}, 250)
|
|
416
326
|
|
|
417
|
-
return () =>
|
|
418
|
-
clearInterval(interval)
|
|
419
|
-
debug('Format:checkIfInViewportCleanup', {
|
|
420
|
-
params: {
|
|
421
|
-
messageId,
|
|
422
|
-
code,
|
|
423
|
-
otherParams,
|
|
424
|
-
}
|
|
425
|
-
})
|
|
426
|
-
}
|
|
327
|
+
return () => clearInterval(interval)
|
|
427
328
|
}, [isAdViewVisible])
|
|
428
329
|
|
|
429
330
|
useEffect(() => {
|
|
430
331
|
const showSubscription = Keyboard.addListener('keyboardDidShow', (e) => {
|
|
431
|
-
debug('Format:keyboardDidShow', {
|
|
432
|
-
params: {
|
|
433
|
-
keyboardHeight: e?.endCoordinates?.height ?? 0,
|
|
434
|
-
messageId,
|
|
435
|
-
code,
|
|
436
|
-
otherParams,
|
|
437
|
-
}
|
|
438
|
-
})
|
|
439
332
|
keyboardHeightRef.current = e?.endCoordinates?.height ?? 0
|
|
440
333
|
})
|
|
441
334
|
const hideSubscription = Keyboard.addListener('keyboardDidHide', () => {
|
|
442
|
-
debug('Format:keyboardDidHide', {
|
|
443
|
-
params: {
|
|
444
|
-
messageId,
|
|
445
|
-
code,
|
|
446
|
-
otherParams,
|
|
447
|
-
}
|
|
448
|
-
})
|
|
449
335
|
keyboardHeightRef.current = 0
|
|
450
336
|
})
|
|
451
337
|
|
|
@@ -453,27 +339,10 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
453
339
|
showSubscription.remove()
|
|
454
340
|
hideSubscription.remove()
|
|
455
341
|
keyboardHeightRef.current = 0
|
|
456
|
-
debug('Format:keyboardEffectCleanup', {
|
|
457
|
-
params: {
|
|
458
|
-
messageId,
|
|
459
|
-
code,
|
|
460
|
-
otherParams,
|
|
461
|
-
}
|
|
462
|
-
})
|
|
463
342
|
}
|
|
464
343
|
}, [])
|
|
465
344
|
|
|
466
345
|
if (!context || !bid || !iframeUrl) {
|
|
467
|
-
debug('Format:noContextOrBidOrIframeUrl', {
|
|
468
|
-
params: {
|
|
469
|
-
context,
|
|
470
|
-
bid,
|
|
471
|
-
iframeUrl,
|
|
472
|
-
messageId,
|
|
473
|
-
code,
|
|
474
|
-
otherParams,
|
|
475
|
-
}
|
|
476
|
-
})
|
|
477
346
|
return null
|
|
478
347
|
}
|
|
479
348
|
|
|
@@ -490,23 +359,11 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
490
359
|
...iframeStyles,
|
|
491
360
|
}}
|
|
492
361
|
onError={() => {
|
|
493
|
-
debug('
|
|
494
|
-
params: {
|
|
495
|
-
messageId,
|
|
496
|
-
code,
|
|
497
|
-
otherParams,
|
|
498
|
-
}
|
|
499
|
-
})
|
|
362
|
+
debug('iframe-error')
|
|
500
363
|
reset()
|
|
501
364
|
}}
|
|
502
365
|
onLoad={() => {
|
|
503
|
-
debug('
|
|
504
|
-
params: {
|
|
505
|
-
messageId,
|
|
506
|
-
code,
|
|
507
|
-
otherParams,
|
|
508
|
-
}
|
|
509
|
-
})
|
|
366
|
+
debug('iframe-load')
|
|
510
367
|
}}
|
|
511
368
|
/>
|
|
512
369
|
)
|
|
@@ -537,23 +394,11 @@ const Format = ({ code, messageId, wrapper, onEvent, ...otherParams }: FormatPro
|
|
|
537
394
|
borderWidth: 0,
|
|
538
395
|
}}
|
|
539
396
|
onError={() => {
|
|
540
|
-
debug('
|
|
541
|
-
params: {
|
|
542
|
-
messageId,
|
|
543
|
-
code,
|
|
544
|
-
otherParams,
|
|
545
|
-
}
|
|
546
|
-
})
|
|
397
|
+
debug('modal-error')
|
|
547
398
|
resetModal()
|
|
548
399
|
}}
|
|
549
400
|
onLoad={() => {
|
|
550
|
-
debug('
|
|
551
|
-
params: {
|
|
552
|
-
messageId,
|
|
553
|
-
code,
|
|
554
|
-
otherParams,
|
|
555
|
-
}
|
|
556
|
-
})
|
|
401
|
+
debug('modal-load')
|
|
557
402
|
setModalLoaded(true)
|
|
558
403
|
}}
|
|
559
404
|
/>
|
package/src/frame-webview.tsx
CHANGED
|
@@ -25,6 +25,9 @@ const FrameWebView = forwardRef<WebView, FrameWebViewProps>(
|
|
|
25
25
|
javaScriptEnabled={true}
|
|
26
26
|
domStorageEnabled={true}
|
|
27
27
|
allowsFullscreenVideo={false}
|
|
28
|
+
originWhitelist={['*']}
|
|
29
|
+
sharedCookiesEnabled={true}
|
|
30
|
+
thirdPartyCookiesEnabled={true}
|
|
28
31
|
injectedJavaScript={`
|
|
29
32
|
window.addEventListener("message", function(event) {
|
|
30
33
|
if (window.ReactNativeWebView && event.data) {
|