@c15t/dev-tools 2.0.0-rc.3 → 2.0.0-rc.4
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 +9 -0
- package/dist/components/panel.d.ts.map +1 -1
- package/dist/components/tabs.d.ts.map +1 -1
- package/dist/components/ui.d.ts +8 -0
- package/dist/components/ui.d.ts.map +1 -1
- package/dist/core/debug-bundle.d.ts +14 -0
- package/dist/core/debug-bundle.d.ts.map +1 -0
- package/dist/core/devtools.d.ts.map +1 -1
- package/dist/core/panel-renderer.d.ts +5 -0
- package/dist/core/panel-renderer.d.ts.map +1 -1
- package/dist/core/state-manager.d.ts.map +1 -1
- package/dist/core/store-connector.d.ts +16 -0
- package/dist/core/store-connector.d.ts.map +1 -1
- package/dist/core/store-instrumentation.d.ts +13 -0
- package/dist/core/store-instrumentation.d.ts.map +1 -0
- package/dist/index.cjs +1681 -905
- package/dist/index.js +1680 -904
- package/dist/panels/actions.d.ts +1 -0
- package/dist/panels/actions.d.ts.map +1 -1
- package/dist/panels/consents.d.ts.map +1 -1
- package/dist/panels/events.d.ts.map +1 -1
- package/dist/panels/iab.d.ts.map +1 -1
- package/dist/panels/location.d.ts.map +1 -1
- package/dist/panels/scripts.d.ts.map +1 -1
- package/dist/react.cjs +1610 -748
- package/dist/react.js +1610 -748
- package/dist/tanstack.cjs +1565 -532
- package/dist/tanstack.js +1565 -532
- package/dist/utils/preference-trigger.d.ts.map +1 -1
- package/dist/version.d.ts +1 -1
- package/package.json +9 -9
- package/tsconfig.json +9 -1
- package/dist/__tests__/components/ui.test.d.ts +0 -2
- package/dist/__tests__/components/ui.test.d.ts.map +0 -1
- package/dist/__tests__/core/override-storage.test.d.ts +0 -2
- package/dist/__tests__/core/override-storage.test.d.ts.map +0 -1
- package/dist/__tests__/core/renderer.test.d.ts +0 -2
- package/dist/__tests__/core/renderer.test.d.ts.map +0 -1
- package/dist/__tests__/core/reset-consents.test.d.ts +0 -2
- package/dist/__tests__/core/reset-consents.test.d.ts.map +0 -1
- package/dist/__tests__/core/state-manager.test.d.ts +0 -2
- package/dist/__tests__/core/state-manager.test.d.ts.map +0 -1
- package/dist/__tests__/core/store-connector.test.d.ts +0 -2
- package/dist/__tests__/core/store-connector.test.d.ts.map +0 -1
- package/dist/__tests__/panels/dom-scanner.test.d.ts +0 -2
- package/dist/__tests__/panels/dom-scanner.test.d.ts.map +0 -1
- package/dist/__tests__/panels/events.test.d.ts +0 -2
- package/dist/__tests__/panels/events.test.d.ts.map +0 -1
- package/dist/__tests__/panels/iab.test.d.ts +0 -2
- package/dist/__tests__/panels/iab.test.d.ts.map +0 -1
- package/dist/__tests__/panels/scripts.test.d.ts +0 -2
- package/dist/__tests__/panels/scripts.test.d.ts.map +0 -1
- package/dist/__tests__/utils/preference-trigger.test.d.ts +0 -2
- package/dist/__tests__/utils/preference-trigger.test.d.ts.map +0 -1
package/dist/index.js
CHANGED
|
@@ -259,21 +259,21 @@ var __webpack_modules__ = {
|
|
|
259
259
|
module.id,
|
|
260
260
|
`.toggle-bPZtik {
|
|
261
261
|
border-radius: var(--c15t-radius-full, 9999px);
|
|
262
|
-
background-color: var(--c15t-switch-track, #
|
|
262
|
+
background-color: var(--c15t-switch-track, #d9d9d9);
|
|
263
263
|
cursor: pointer;
|
|
264
|
-
width:
|
|
265
|
-
height:
|
|
266
|
-
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
264
|
+
width: 2rem;
|
|
265
|
+
height: 1.25rem;
|
|
266
|
+
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), box-shadow var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
267
267
|
border: none;
|
|
268
268
|
align-items: center;
|
|
269
|
-
padding:
|
|
269
|
+
padding: .125rem;
|
|
270
270
|
display: inline-flex;
|
|
271
271
|
position: relative;
|
|
272
272
|
}
|
|
273
273
|
|
|
274
274
|
.toggle-bPZtik:focus-visible {
|
|
275
|
-
|
|
276
|
-
outline
|
|
275
|
+
box-shadow: 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
276
|
+
outline: none;
|
|
277
277
|
}
|
|
278
278
|
|
|
279
279
|
.toggleActive-Ldlasg {
|
|
@@ -283,16 +283,16 @@ var __webpack_modules__ = {
|
|
|
283
283
|
.toggleThumb-hjGfoX {
|
|
284
284
|
border-radius: var(--c15t-radius-full, 9999px);
|
|
285
285
|
background-color: var(--c15t-switch-thumb, #fff);
|
|
286
|
-
width:
|
|
287
|
-
height:
|
|
288
|
-
|
|
286
|
+
width: .75rem;
|
|
287
|
+
height: .75rem;
|
|
288
|
+
box-shadow: 0 0 0 1px var(--c15t-border, #e3e3e3);
|
|
289
|
+
transition: transform var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
289
290
|
position: absolute;
|
|
290
291
|
left: 2px;
|
|
291
|
-
box-shadow: 0 1px 2px #0003;
|
|
292
292
|
}
|
|
293
293
|
|
|
294
294
|
.toggleActive-Ldlasg .toggleThumb-hjGfoX {
|
|
295
|
-
transform: translateX(
|
|
295
|
+
transform: translateX(1rem);
|
|
296
296
|
}
|
|
297
297
|
|
|
298
298
|
.toggle-bPZtik:disabled, .toggleDisabled-ZcD8nZ {
|
|
@@ -305,13 +305,14 @@ var __webpack_modules__ = {
|
|
|
305
305
|
}
|
|
306
306
|
|
|
307
307
|
.badge-yA0giZ {
|
|
308
|
-
border-radius: var(--c15t-radius-
|
|
308
|
+
border-radius: var(--c15t-radius-full, 9999px);
|
|
309
309
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
310
310
|
font-weight: var(--c15t-font-weight-medium, 500);
|
|
311
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
311
312
|
white-space: nowrap;
|
|
313
|
+
justify-content: center;
|
|
312
314
|
align-items: center;
|
|
313
|
-
padding:
|
|
314
|
-
line-height: 1;
|
|
315
|
+
padding: .1875rem .4375rem;
|
|
315
316
|
display: inline-flex;
|
|
316
317
|
}
|
|
317
318
|
|
|
@@ -344,35 +345,36 @@ var __webpack_modules__ = {
|
|
|
344
345
|
justify-content: center;
|
|
345
346
|
align-items: center;
|
|
346
347
|
gap: var(--c15t-space-xs, .25rem);
|
|
347
|
-
border: 1px solid var(--c15t-border, #e3e3e3);
|
|
348
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
348
349
|
border-radius: var(--c15t-radius-md, .5rem);
|
|
349
|
-
background-color: var(--c15t-surface, #fff);
|
|
350
|
-
min-height:
|
|
350
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
351
|
+
min-height: 2rem;
|
|
351
352
|
color: var(--c15t-text, #171717);
|
|
352
|
-
font-family:
|
|
353
|
-
font-size:
|
|
353
|
+
font-family: var(--c15t-font-family, system-ui, -apple-system, sans-serif);
|
|
354
|
+
font-size: var(--c15t-font-size-sm, .875rem);
|
|
354
355
|
font-weight: var(--c15t-font-weight-medium, 500);
|
|
356
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
357
|
+
box-shadow: var(--c15t-shadow-sm, 0 1px 2px #0000000d);
|
|
355
358
|
cursor: pointer;
|
|
356
359
|
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), box-shadow var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
357
|
-
padding:
|
|
358
|
-
line-height: 1;
|
|
360
|
+
padding: .375rem .625rem;
|
|
359
361
|
display: inline-flex;
|
|
360
|
-
box-shadow: 0 1px 1px #0000000a;
|
|
361
362
|
}
|
|
362
363
|
|
|
363
364
|
.btn-evRVlh:hover {
|
|
364
|
-
background-color: var(--c15t-surface-
|
|
365
|
+
background-color: var(--c15t-devtools-surface-subtle, #f7f7f7);
|
|
365
366
|
border-color: var(--c15t-border-hover, #c9c9c9);
|
|
366
|
-
box-shadow: 0
|
|
367
|
+
box-shadow: var(--c15t-shadow-md, 0 4px 12px #00000014);
|
|
367
368
|
}
|
|
368
369
|
|
|
369
370
|
.btn-evRVlh:focus-visible {
|
|
370
|
-
|
|
371
|
-
outline
|
|
371
|
+
box-shadow: var(--c15t-shadow-sm, 0 1px 2px #0000000d), 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
372
|
+
outline: none;
|
|
372
373
|
}
|
|
373
374
|
|
|
374
375
|
.btn-evRVlh:active {
|
|
375
|
-
box-shadow: 0 1px 2px #
|
|
376
|
+
box-shadow: var(--c15t-shadow-sm, 0 1px 2px #0000000d);
|
|
377
|
+
transform: scale(.98);
|
|
376
378
|
}
|
|
377
379
|
|
|
378
380
|
.btn-evRVlh:disabled {
|
|
@@ -385,6 +387,7 @@ var __webpack_modules__ = {
|
|
|
385
387
|
background-color: var(--c15t-primary, #335cff);
|
|
386
388
|
border-color: var(--c15t-primary, #335cff);
|
|
387
389
|
color: var(--c15t-text-on-primary, #fff);
|
|
390
|
+
box-shadow: none;
|
|
388
391
|
}
|
|
389
392
|
|
|
390
393
|
.btnPrimary-dA6nqY:hover {
|
|
@@ -396,6 +399,7 @@ var __webpack_modules__ = {
|
|
|
396
399
|
background-color: var(--c15t-devtools-badge-error, #ef4343);
|
|
397
400
|
border-color: var(--c15t-devtools-badge-error, #ef4343);
|
|
398
401
|
color: var(--c15t-text-on-primary, #fff);
|
|
402
|
+
box-shadow: none;
|
|
399
403
|
}
|
|
400
404
|
|
|
401
405
|
.btnDanger-eDnqOX:hover {
|
|
@@ -404,10 +408,10 @@ var __webpack_modules__ = {
|
|
|
404
408
|
}
|
|
405
409
|
|
|
406
410
|
.btnSmall-TjXoqZ {
|
|
411
|
+
min-height: 1.75rem;
|
|
412
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
407
413
|
border-radius: var(--c15t-radius-sm, .375rem);
|
|
408
|
-
|
|
409
|
-
padding: 3px 8px;
|
|
410
|
-
font-size: 11px;
|
|
414
|
+
padding: .25rem .5rem;
|
|
411
415
|
}
|
|
412
416
|
|
|
413
417
|
.btnIcon-fiYQAh {
|
|
@@ -417,19 +421,22 @@ var __webpack_modules__ = {
|
|
|
417
421
|
}
|
|
418
422
|
|
|
419
423
|
.input-IeTcCs {
|
|
420
|
-
|
|
421
|
-
padding: var(--c15t-space-xs, .25rem) var(--c15t-space-sm, .5rem);
|
|
422
|
-
border: 1px solid var(--c15t-border, #e3e3e3);
|
|
424
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
423
425
|
border-radius: var(--c15t-radius-md, .5rem);
|
|
424
|
-
background-color: var(--c15t-surface, #fff);
|
|
426
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
427
|
+
width: 100%;
|
|
428
|
+
min-height: 2rem;
|
|
425
429
|
color: var(--c15t-text, #171717);
|
|
426
|
-
font-family:
|
|
427
|
-
font-size: var(--c15t-font-size-
|
|
428
|
-
|
|
430
|
+
font-family: var(--c15t-font-family, system-ui, -apple-system, sans-serif);
|
|
431
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
432
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
433
|
+
transition: border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), box-shadow var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
434
|
+
padding: .375rem .625rem;
|
|
429
435
|
}
|
|
430
436
|
|
|
431
437
|
.input-IeTcCs:focus {
|
|
432
|
-
border-color: var(--c15t-
|
|
438
|
+
border-color: var(--c15t-devtools-focus-ring, #335cff);
|
|
439
|
+
box-shadow: 0 0 0 2px color-mix(in srgb, var(--c15t-devtools-focus-ring, #335cff) 25%, transparent);
|
|
433
440
|
outline: none;
|
|
434
441
|
}
|
|
435
442
|
|
|
@@ -438,30 +445,35 @@ var __webpack_modules__ = {
|
|
|
438
445
|
}
|
|
439
446
|
|
|
440
447
|
.inputSmall-pJyXcL {
|
|
441
|
-
|
|
448
|
+
min-height: 1.625rem;
|
|
442
449
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
450
|
+
padding: .25rem .4375rem;
|
|
443
451
|
}
|
|
444
452
|
|
|
445
453
|
.select-byJ1WM {
|
|
446
|
-
|
|
447
|
-
padding: var(--c15t-space-xs, .25rem) var(--c15t-space-sm, .5rem);
|
|
448
|
-
border: 1px solid var(--c15t-border, #e3e3e3);
|
|
454
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
449
455
|
border-radius: var(--c15t-radius-md, .5rem);
|
|
450
|
-
background-color: var(--c15t-surface, #fff);
|
|
456
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
457
|
+
width: 100%;
|
|
458
|
+
min-height: 2rem;
|
|
451
459
|
color: var(--c15t-text, #171717);
|
|
452
|
-
font-family:
|
|
460
|
+
font-family: var(--c15t-font-family, system-ui, -apple-system, sans-serif);
|
|
453
461
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
462
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
454
463
|
cursor: pointer;
|
|
464
|
+
transition: border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), box-shadow var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
465
|
+
padding: .375rem .625rem;
|
|
455
466
|
}
|
|
456
467
|
|
|
457
468
|
.select-byJ1WM:focus {
|
|
458
|
-
border-color: var(--c15t-
|
|
469
|
+
border-color: var(--c15t-devtools-focus-ring, #335cff);
|
|
470
|
+
box-shadow: 0 0 0 2px color-mix(in srgb, var(--c15t-devtools-focus-ring, #335cff) 25%, transparent);
|
|
459
471
|
outline: none;
|
|
460
472
|
}
|
|
461
473
|
|
|
462
474
|
.grid-LlrmEz {
|
|
463
475
|
gap: var(--c15t-space-sm, .5rem);
|
|
464
|
-
padding: var(--c15t-space-
|
|
476
|
+
padding: var(--c15t-space-md, 1rem);
|
|
465
477
|
display: grid;
|
|
466
478
|
}
|
|
467
479
|
|
|
@@ -474,42 +486,51 @@ var __webpack_modules__ = {
|
|
|
474
486
|
}
|
|
475
487
|
|
|
476
488
|
.gridCard-Qm5xxI {
|
|
477
|
-
padding: var(--c15t-space-sm, .5rem) var(--c15t-space-md, .75rem);
|
|
478
|
-
border: 1px solid var(--c15t-border, #e3e3e3);
|
|
479
|
-
border-radius: var(--c15t-radius-md, .5rem);
|
|
480
|
-
background-color: var(--c15t-surface, #fff);
|
|
481
|
-
transition: border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
482
489
|
justify-content: space-between;
|
|
483
490
|
align-items: center;
|
|
491
|
+
gap: var(--c15t-space-sm, .5rem);
|
|
492
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
493
|
+
border-radius: var(--c15t-radius-md, .5rem);
|
|
494
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
495
|
+
min-height: 2.75rem;
|
|
496
|
+
box-shadow: var(--c15t-shadow-sm, 0 1px 2px #0000000d);
|
|
497
|
+
transition: border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
498
|
+
padding: .5625rem .75rem;
|
|
484
499
|
display: flex;
|
|
485
500
|
}
|
|
486
501
|
|
|
487
502
|
.gridCard-Qm5xxI:hover {
|
|
488
503
|
border-color: var(--c15t-border-hover, #c9c9c9);
|
|
504
|
+
background-color: var(--c15t-devtools-surface-subtle, #fafafa);
|
|
489
505
|
}
|
|
490
506
|
|
|
491
507
|
.gridCardTitle-HjXETp {
|
|
492
508
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
493
509
|
font-weight: var(--c15t-font-weight-medium, 500);
|
|
494
510
|
color: var(--c15t-text, #171717);
|
|
511
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
495
512
|
}
|
|
496
513
|
|
|
497
514
|
.listItem-XUKGIo {
|
|
498
|
-
padding: var(--c15t-space-xs, .25rem) var(--c15t-space-md, 1rem);
|
|
499
|
-
border-bottom: 1px solid var(--c15t-border, #e3e3e3);
|
|
500
515
|
justify-content: space-between;
|
|
501
516
|
align-items: center;
|
|
517
|
+
gap: var(--c15t-space-sm, .5rem);
|
|
518
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
519
|
+
border-radius: var(--c15t-radius-md, .5rem);
|
|
520
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
521
|
+
margin-bottom: .375rem;
|
|
522
|
+
padding: .625rem .75rem;
|
|
502
523
|
display: flex;
|
|
503
524
|
}
|
|
504
525
|
|
|
505
526
|
.listItem-XUKGIo:last-child {
|
|
506
|
-
|
|
527
|
+
margin-bottom: 0;
|
|
507
528
|
}
|
|
508
529
|
|
|
509
530
|
.listItemContent-WDBF1N {
|
|
510
531
|
flex-direction: column;
|
|
511
532
|
flex: 1;
|
|
512
|
-
gap:
|
|
533
|
+
gap: .1875rem;
|
|
513
534
|
min-width: 0;
|
|
514
535
|
display: flex;
|
|
515
536
|
}
|
|
@@ -523,6 +544,7 @@ var __webpack_modules__ = {
|
|
|
523
544
|
.listItemDescription-E6JHyZ {
|
|
524
545
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
525
546
|
color: var(--c15t-text-muted, #737373);
|
|
547
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
526
548
|
text-overflow: ellipsis;
|
|
527
549
|
white-space: nowrap;
|
|
528
550
|
overflow: hidden;
|
|
@@ -536,8 +558,8 @@ var __webpack_modules__ = {
|
|
|
536
558
|
}
|
|
537
559
|
|
|
538
560
|
.section-a197cB {
|
|
539
|
-
|
|
540
|
-
|
|
561
|
+
border-bottom: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
562
|
+
padding: .75rem 1rem;
|
|
541
563
|
}
|
|
542
564
|
|
|
543
565
|
.section-a197cB:last-child {
|
|
@@ -545,9 +567,10 @@ var __webpack_modules__ = {
|
|
|
545
567
|
}
|
|
546
568
|
|
|
547
569
|
.sectionHeader-Xcljcw {
|
|
548
|
-
margin-bottom: var(--c15t-space-sm, .5rem);
|
|
549
570
|
justify-content: space-between;
|
|
550
571
|
align-items: center;
|
|
572
|
+
gap: .5rem;
|
|
573
|
+
margin-bottom: .625rem;
|
|
551
574
|
display: flex;
|
|
552
575
|
}
|
|
553
576
|
|
|
@@ -556,47 +579,49 @@ var __webpack_modules__ = {
|
|
|
556
579
|
font-weight: var(--c15t-font-weight-semibold, 600);
|
|
557
580
|
color: var(--c15t-text-muted, #737373);
|
|
558
581
|
text-transform: uppercase;
|
|
559
|
-
letter-spacing: .
|
|
582
|
+
letter-spacing: .04em;
|
|
560
583
|
}
|
|
561
584
|
|
|
562
585
|
.overrideField-keNdpJ {
|
|
563
586
|
flex-direction: column;
|
|
564
|
-
gap:
|
|
587
|
+
gap: .3125rem;
|
|
565
588
|
margin-bottom: 0;
|
|
566
589
|
display: flex;
|
|
567
590
|
}
|
|
568
591
|
|
|
569
592
|
.overrideLabel-ApMoTw {
|
|
593
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
594
|
+
font-weight: var(--c15t-font-weight-semibold, 600);
|
|
570
595
|
color: var(--c15t-text-muted, #737373);
|
|
571
|
-
|
|
572
|
-
font-weight: 600;
|
|
596
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
573
597
|
}
|
|
574
598
|
|
|
575
599
|
.overrideHint-yCfwGt {
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
600
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
601
|
+
color: var(--c15t-text-muted, #737373);
|
|
602
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
603
|
+
margin-top: .5rem;
|
|
579
604
|
}
|
|
580
605
|
|
|
581
606
|
.overrideActions-imdcn7 {
|
|
582
|
-
border-top: 1px dashed var(--c15t-border, #e3e3e3);
|
|
607
|
+
border-top: 1px dashed var(--c15t-devtools-border-strong, #e3e3e3);
|
|
583
608
|
justify-content: space-between;
|
|
584
609
|
align-items: center;
|
|
585
|
-
gap:
|
|
586
|
-
margin-top:
|
|
587
|
-
padding-top:
|
|
610
|
+
gap: .5rem;
|
|
611
|
+
margin-top: .625rem;
|
|
612
|
+
padding-top: .625rem;
|
|
588
613
|
display: flex;
|
|
589
614
|
}
|
|
590
615
|
|
|
591
616
|
.overrideActionButtons-gYOx1e {
|
|
592
617
|
flex-wrap: wrap;
|
|
593
|
-
gap:
|
|
618
|
+
gap: .375rem;
|
|
594
619
|
display: flex;
|
|
595
620
|
}
|
|
596
621
|
|
|
597
622
|
.overrideStatus-sty_qS {
|
|
623
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
598
624
|
color: var(--c15t-text-muted, #737373);
|
|
599
|
-
font-size: 11px;
|
|
600
625
|
}
|
|
601
626
|
|
|
602
627
|
.overrideStatusDirty-OUdDMw {
|
|
@@ -604,9 +629,10 @@ var __webpack_modules__ = {
|
|
|
604
629
|
}
|
|
605
630
|
|
|
606
631
|
.infoRow-RlB_0h {
|
|
607
|
-
padding: var(--c15t-space-xs, .25rem) 0;
|
|
608
632
|
justify-content: space-between;
|
|
609
633
|
align-items: center;
|
|
634
|
+
gap: .5rem;
|
|
635
|
+
padding: .25rem 0;
|
|
610
636
|
display: flex;
|
|
611
637
|
}
|
|
612
638
|
|
|
@@ -619,6 +645,7 @@ var __webpack_modules__ = {
|
|
|
619
645
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
620
646
|
font-weight: var(--c15t-font-weight-medium, 500);
|
|
621
647
|
color: var(--c15t-text, #171717);
|
|
648
|
+
font-variant-numeric: tabular-nums;
|
|
622
649
|
font-family: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;
|
|
623
650
|
}
|
|
624
651
|
|
|
@@ -629,18 +656,27 @@ var __webpack_modules__ = {
|
|
|
629
656
|
flex-direction: column;
|
|
630
657
|
justify-content: center;
|
|
631
658
|
align-items: center;
|
|
659
|
+
gap: .375rem;
|
|
632
660
|
display: flex;
|
|
633
661
|
}
|
|
634
662
|
|
|
635
663
|
.emptyStateIcon-WHFkX8 {
|
|
664
|
+
opacity: .55;
|
|
636
665
|
width: 32px;
|
|
637
666
|
height: 32px;
|
|
638
|
-
margin-bottom: var(--c15t-space-sm, .5rem);
|
|
639
|
-
opacity: .5;
|
|
640
667
|
}
|
|
641
668
|
|
|
642
669
|
.emptyStateText-TaLvAJ {
|
|
643
670
|
font-size: var(--c15t-font-size-sm, .875rem);
|
|
671
|
+
line-height: var(--c15t-line-height-normal, 1.5);
|
|
672
|
+
}
|
|
673
|
+
|
|
674
|
+
.disconnectedState-dOtZBG {
|
|
675
|
+
padding: var(--c15t-space-xl, 2rem);
|
|
676
|
+
text-align: center;
|
|
677
|
+
font-size: var(--c15t-font-size-sm, .875rem);
|
|
678
|
+
color: var(--c15t-text-muted, #737373);
|
|
679
|
+
line-height: var(--c15t-line-height-normal, 1.5);
|
|
644
680
|
}
|
|
645
681
|
|
|
646
682
|
@media (prefers-reduced-motion: reduce) {
|
|
@@ -707,7 +743,8 @@ var __webpack_modules__ = {
|
|
|
707
743
|
infoValue: "infoValue-flMl_e",
|
|
708
744
|
emptyState: "emptyState-QcmzTQ",
|
|
709
745
|
emptyStateIcon: "emptyStateIcon-WHFkX8",
|
|
710
|
-
emptyStateText: "emptyStateText-TaLvAJ"
|
|
746
|
+
emptyStateText: "emptyStateText-TaLvAJ",
|
|
747
|
+
disconnectedState: "disconnectedState-dOtZBG"
|
|
711
748
|
};
|
|
712
749
|
const __rspack_default_export = ___CSS_LOADER_EXPORT___;
|
|
713
750
|
},
|
|
@@ -736,9 +773,9 @@ var __webpack_modules__ = {
|
|
|
736
773
|
.floatingButton-Gw8MtJ {
|
|
737
774
|
width: var(--c15t-devtools-button-size, 40px);
|
|
738
775
|
height: var(--c15t-devtools-button-size, 40px);
|
|
739
|
-
border: 1px solid var(--c15t-border, #e3e3e3);
|
|
776
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
740
777
|
border-radius: var(--c15t-radius-full, 9999px);
|
|
741
|
-
background-color: var(--c15t-surface, #fff);
|
|
778
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
742
779
|
box-shadow: var(--c15t-shadow-lg, 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a);
|
|
743
780
|
cursor: grab;
|
|
744
781
|
z-index: var(--c15t-devtools-z-index, 99999);
|
|
@@ -766,13 +803,13 @@ var __webpack_modules__ = {
|
|
|
766
803
|
}
|
|
767
804
|
|
|
768
805
|
.floatingButton-Gw8MtJ:focus-visible {
|
|
769
|
-
|
|
770
|
-
outline
|
|
806
|
+
box-shadow: var(--c15t-shadow-lg, 0 8px 24px #0000001f), 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
807
|
+
outline: none;
|
|
771
808
|
}
|
|
772
809
|
|
|
773
810
|
.floatingButton-Gw8MtJ:active {
|
|
774
811
|
cursor: grabbing;
|
|
775
|
-
transform: scale(
|
|
812
|
+
transform: scale(.98);
|
|
776
813
|
}
|
|
777
814
|
|
|
778
815
|
.floatingButtonIcon-cHWefk {
|
|
@@ -813,6 +850,7 @@ var __webpack_modules__ = {
|
|
|
813
850
|
|
|
814
851
|
.backdrop-LhVMB5 {
|
|
815
852
|
background-color: var(--c15t-overlay, #00000080);
|
|
853
|
+
backdrop-filter: blur(1px);
|
|
816
854
|
z-index: calc(var(--c15t-devtools-z-index, 99999) + 1);
|
|
817
855
|
position: fixed;
|
|
818
856
|
inset: 0;
|
|
@@ -821,10 +859,10 @@ var __webpack_modules__ = {
|
|
|
821
859
|
.panel-jtWove {
|
|
822
860
|
width: var(--c15t-devtools-panel-width, 480px);
|
|
823
861
|
max-height: var(--c15t-devtools-panel-max-height, 560px);
|
|
824
|
-
background-color: var(--c15t-surface, #fff);
|
|
825
|
-
border: 1px solid var(--c15t-border, #e3e3e3);
|
|
862
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
863
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
826
864
|
border-radius: var(--c15t-radius-lg, .75rem);
|
|
827
|
-
box-shadow: var(--c15t-shadow-lg, 0
|
|
865
|
+
box-shadow: var(--c15t-shadow-lg, 0 10px 28px #00000029);
|
|
828
866
|
z-index: calc(var(--c15t-devtools-z-index, 99999) + 2);
|
|
829
867
|
flex-direction: column;
|
|
830
868
|
display: flex;
|
|
@@ -857,11 +895,11 @@ var __webpack_modules__ = {
|
|
|
857
895
|
}
|
|
858
896
|
|
|
859
897
|
.header-xluoTr {
|
|
860
|
-
|
|
861
|
-
border-bottom: 1px solid var(--c15t-border, #e3e3e3);
|
|
898
|
+
border-bottom: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
862
899
|
background-color: var(--c15t-devtools-surface-muted, #f5f5f5);
|
|
863
900
|
justify-content: space-between;
|
|
864
901
|
align-items: center;
|
|
902
|
+
padding: .6875rem .875rem;
|
|
865
903
|
display: flex;
|
|
866
904
|
}
|
|
867
905
|
|
|
@@ -870,6 +908,7 @@ var __webpack_modules__ = {
|
|
|
870
908
|
gap: var(--c15t-space-sm, .5rem);
|
|
871
909
|
font-size: var(--c15t-font-size-sm, .875rem);
|
|
872
910
|
font-weight: var(--c15t-font-weight-semibold, 600);
|
|
911
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
873
912
|
color: var(--c15t-text, #171717);
|
|
874
913
|
display: flex;
|
|
875
914
|
}
|
|
@@ -881,9 +920,9 @@ var __webpack_modules__ = {
|
|
|
881
920
|
}
|
|
882
921
|
|
|
883
922
|
.closeButton-Yto0Nb {
|
|
884
|
-
border-radius: var(--c15t-radius-
|
|
885
|
-
width:
|
|
886
|
-
height:
|
|
923
|
+
border-radius: var(--c15t-radius-md, .5rem);
|
|
924
|
+
width: 2rem;
|
|
925
|
+
height: 2rem;
|
|
887
926
|
color: var(--c15t-text-muted, #737373);
|
|
888
927
|
cursor: pointer;
|
|
889
928
|
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
@@ -896,13 +935,13 @@ var __webpack_modules__ = {
|
|
|
896
935
|
}
|
|
897
936
|
|
|
898
937
|
.closeButton-Yto0Nb:hover {
|
|
899
|
-
background-color: var(--c15t-surface-
|
|
938
|
+
background-color: var(--c15t-devtools-surface-subtle, #f7f7f7);
|
|
900
939
|
color: var(--c15t-text, #171717);
|
|
901
940
|
}
|
|
902
941
|
|
|
903
942
|
.closeButton-Yto0Nb:focus-visible {
|
|
904
|
-
|
|
905
|
-
outline
|
|
943
|
+
box-shadow: 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
944
|
+
outline: none;
|
|
906
945
|
}
|
|
907
946
|
|
|
908
947
|
.closeButtonIcon-fVlR1I {
|
|
@@ -910,33 +949,71 @@ var __webpack_modules__ = {
|
|
|
910
949
|
height: 16px;
|
|
911
950
|
}
|
|
912
951
|
|
|
952
|
+
.inlineActionButton-Ky8BmN {
|
|
953
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
954
|
+
border-radius: var(--c15t-radius-sm, .375rem);
|
|
955
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
956
|
+
min-height: 1.625rem;
|
|
957
|
+
color: var(--c15t-text, #171717);
|
|
958
|
+
font-family: var(--c15t-font-family, system-ui, -apple-system, sans-serif);
|
|
959
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
960
|
+
font-weight: var(--c15t-font-weight-medium, 500);
|
|
961
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
962
|
+
cursor: pointer;
|
|
963
|
+
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
964
|
+
justify-content: center;
|
|
965
|
+
align-items: center;
|
|
966
|
+
padding: .25rem .5rem;
|
|
967
|
+
display: inline-flex;
|
|
968
|
+
}
|
|
969
|
+
|
|
970
|
+
.inlineActionButton-Ky8BmN:hover {
|
|
971
|
+
background-color: var(--c15t-devtools-surface-subtle, #f7f7f7);
|
|
972
|
+
border-color: var(--c15t-border-hover, #c9c9c9);
|
|
973
|
+
}
|
|
974
|
+
|
|
975
|
+
.inlineActionButton-Ky8BmN:focus-visible {
|
|
976
|
+
box-shadow: 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
977
|
+
outline: none;
|
|
978
|
+
}
|
|
979
|
+
|
|
913
980
|
.content-yDMYfG {
|
|
981
|
+
scrollbar-gutter: stable;
|
|
914
982
|
overscroll-behavior: contain;
|
|
915
983
|
-webkit-overflow-scrolling: touch;
|
|
984
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
916
985
|
flex: auto;
|
|
917
986
|
min-height: 200px;
|
|
918
|
-
overflow: hidden
|
|
987
|
+
overflow: hidden scroll;
|
|
919
988
|
}
|
|
920
989
|
|
|
921
990
|
.footer-ESbmwQ {
|
|
922
|
-
|
|
923
|
-
border-top: 1px solid var(--c15t-border, #e3e3e3);
|
|
991
|
+
border-top: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
924
992
|
background-color: var(--c15t-devtools-surface-muted, #f5f5f5);
|
|
925
993
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
926
994
|
color: var(--c15t-text-muted, #737373);
|
|
927
995
|
justify-content: space-between;
|
|
928
996
|
align-items: center;
|
|
997
|
+
gap: .5rem;
|
|
998
|
+
padding: .5rem .75rem;
|
|
929
999
|
display: flex;
|
|
930
1000
|
}
|
|
931
1001
|
|
|
932
1002
|
.footerStatus-rlb99A {
|
|
933
1003
|
align-items: center;
|
|
934
|
-
gap:
|
|
1004
|
+
gap: .375rem;
|
|
1005
|
+
min-width: 0;
|
|
935
1006
|
display: flex;
|
|
936
1007
|
}
|
|
937
1008
|
|
|
1009
|
+
.footerMeta-Vdtxdk {
|
|
1010
|
+
opacity: .75;
|
|
1011
|
+
white-space: nowrap;
|
|
1012
|
+
}
|
|
1013
|
+
|
|
938
1014
|
.statusDot-hYJoej {
|
|
939
1015
|
border-radius: var(--c15t-radius-full, 9999px);
|
|
1016
|
+
flex-shrink: 0;
|
|
940
1017
|
width: 6px;
|
|
941
1018
|
height: 6px;
|
|
942
1019
|
}
|
|
@@ -975,6 +1052,7 @@ var __webpack_modules__ = {
|
|
|
975
1052
|
font-size: var(--c15t-font-size-sm, .875rem);
|
|
976
1053
|
color: var(--c15t-text-muted, #737373);
|
|
977
1054
|
max-width: 280px;
|
|
1055
|
+
line-height: var(--c15t-line-height-normal, 1.5);
|
|
978
1056
|
}
|
|
979
1057
|
|
|
980
1058
|
@media (prefers-reduced-motion: reduce) {
|
|
@@ -991,17 +1069,17 @@ var __webpack_modules__ = {
|
|
|
991
1069
|
}
|
|
992
1070
|
|
|
993
1071
|
.dropdownMenu-aKK18l {
|
|
994
|
-
|
|
995
|
-
padding: var(--c15t-space-xs, .25rem);
|
|
996
|
-
border: 1px solid var(--c15t-border, #e3e3e3);
|
|
1072
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
997
1073
|
border-radius: var(--c15t-radius-lg, .75rem);
|
|
998
|
-
background-color: var(--c15t-surface, #fff);
|
|
1074
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
1075
|
+
min-width: 200px;
|
|
999
1076
|
box-shadow: var(--c15t-shadow-lg, 0 8px 24px #0000001f);
|
|
1000
1077
|
z-index: calc(var(--c15t-devtools-z-index, 99999) + 1);
|
|
1001
1078
|
opacity: 0;
|
|
1002
1079
|
transform-origin: 0 100%;
|
|
1003
1080
|
pointer-events: none;
|
|
1004
1081
|
transition: opacity var(--c15t-duration-fast, .1s) var(--c15t-easing-out, cubic-bezier(.215, .61, .355, 1)), transform var(--c15t-duration-fast, .1s) var(--c15t-easing-out, cubic-bezier(.215, .61, .355, 1));
|
|
1082
|
+
padding: .375rem;
|
|
1005
1083
|
position: fixed;
|
|
1006
1084
|
transform: scale(.95)translateY(8px);
|
|
1007
1085
|
}
|
|
@@ -1029,34 +1107,35 @@ var __webpack_modules__ = {
|
|
|
1029
1107
|
}
|
|
1030
1108
|
|
|
1031
1109
|
.menuItem-kBbHRP {
|
|
1032
|
-
align-items: center;
|
|
1033
|
-
gap: var(--c15t-space-sm, .5rem);
|
|
1034
|
-
width: 100%;
|
|
1035
|
-
padding: var(--c15t-space-sm, .5rem) var(--c15t-space-md, .75rem);
|
|
1036
1110
|
border-radius: var(--c15t-radius-md, .5rem);
|
|
1111
|
+
width: 100%;
|
|
1037
1112
|
color: var(--c15t-text, #171717);
|
|
1038
|
-
font-size: var(--c15t-font-size-
|
|
1113
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
1039
1114
|
font-weight: var(--c15t-font-weight-medium, 500);
|
|
1115
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
1040
1116
|
text-align: left;
|
|
1041
1117
|
cursor: pointer;
|
|
1042
1118
|
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
1043
1119
|
background: none;
|
|
1044
1120
|
border: none;
|
|
1121
|
+
align-items: center;
|
|
1122
|
+
gap: .625rem;
|
|
1123
|
+
padding: .5rem .625rem;
|
|
1045
1124
|
display: flex;
|
|
1046
1125
|
}
|
|
1047
1126
|
|
|
1048
1127
|
.menuItem-kBbHRP:hover {
|
|
1049
|
-
background-color: var(--c15t-surface-
|
|
1128
|
+
background-color: var(--c15t-devtools-surface-subtle, #f2f2f2);
|
|
1050
1129
|
}
|
|
1051
1130
|
|
|
1052
1131
|
.menuItem-kBbHRP:focus-visible {
|
|
1053
|
-
|
|
1054
|
-
outline
|
|
1132
|
+
box-shadow: 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
1133
|
+
outline: none;
|
|
1055
1134
|
}
|
|
1056
1135
|
|
|
1057
1136
|
.menuItemIcon-P3pP5K {
|
|
1058
|
-
width:
|
|
1059
|
-
height:
|
|
1137
|
+
width: 1rem;
|
|
1138
|
+
height: 1rem;
|
|
1060
1139
|
color: var(--c15t-text-muted, #737373);
|
|
1061
1140
|
flex-shrink: 0;
|
|
1062
1141
|
}
|
|
@@ -1069,6 +1148,7 @@ var __webpack_modules__ = {
|
|
|
1069
1148
|
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
1070
1149
|
color: var(--c15t-text-muted, #737373);
|
|
1071
1150
|
font-weight: var(--c15t-font-weight-normal, 400);
|
|
1151
|
+
margin-top: .125rem;
|
|
1072
1152
|
}
|
|
1073
1153
|
|
|
1074
1154
|
.menuItemContent-hBlruV {
|
|
@@ -1084,8 +1164,8 @@ var __webpack_modules__ = {
|
|
|
1084
1164
|
.menuItemToggleTrack-gDp_f3 {
|
|
1085
1165
|
background-color: var(--c15t-switch-track, #d9d9d9);
|
|
1086
1166
|
border-radius: var(--c15t-radius-full, 9999px);
|
|
1087
|
-
width:
|
|
1088
|
-
height:
|
|
1167
|
+
width: 2rem;
|
|
1168
|
+
height: 1.25rem;
|
|
1089
1169
|
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
1090
1170
|
position: relative;
|
|
1091
1171
|
}
|
|
@@ -1093,21 +1173,22 @@ var __webpack_modules__ = {
|
|
|
1093
1173
|
.menuItemToggleThumb-ioqqyc {
|
|
1094
1174
|
background-color: var(--c15t-switch-thumb, #fff);
|
|
1095
1175
|
border-radius: var(--c15t-radius-full, 9999px);
|
|
1096
|
-
width:
|
|
1097
|
-
height:
|
|
1098
|
-
box-shadow: var(--c15t-
|
|
1176
|
+
width: .75rem;
|
|
1177
|
+
height: .75rem;
|
|
1178
|
+
box-shadow: 0 0 0 1px var(--c15t-border, #e3e3e3);
|
|
1099
1179
|
transition: transform var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
1100
1180
|
position: absolute;
|
|
1101
|
-
top:
|
|
1181
|
+
top: 50%;
|
|
1102
1182
|
left: 2px;
|
|
1183
|
+
transform: translateY(-50%);
|
|
1103
1184
|
}
|
|
1104
1185
|
|
|
1105
1186
|
.menuItemToggleChecked-K3BPtk .menuItemToggleTrack-gDp_f3 {
|
|
1106
|
-
background-color: var(--c15t-switch-track-
|
|
1187
|
+
background-color: var(--c15t-switch-track-active, #335cff);
|
|
1107
1188
|
}
|
|
1108
1189
|
|
|
1109
1190
|
.menuItemToggleChecked-K3BPtk .menuItemToggleThumb-ioqqyc {
|
|
1110
|
-
transform:
|
|
1191
|
+
transform: translate(1rem, -50%);
|
|
1111
1192
|
}
|
|
1112
1193
|
|
|
1113
1194
|
.menuDivider-JIBdhU {
|
|
@@ -1143,9 +1224,11 @@ var __webpack_modules__ = {
|
|
|
1143
1224
|
headerLogo: "headerLogo-PxJ_w1",
|
|
1144
1225
|
closeButton: "closeButton-Yto0Nb",
|
|
1145
1226
|
closeButtonIcon: "closeButtonIcon-fVlR1I",
|
|
1227
|
+
inlineActionButton: "inlineActionButton-Ky8BmN",
|
|
1146
1228
|
content: "content-yDMYfG",
|
|
1147
1229
|
footer: "footer-ESbmwQ",
|
|
1148
1230
|
footerStatus: "footerStatus-rlb99A",
|
|
1231
|
+
footerMeta: "footerMeta-Vdtxdk",
|
|
1149
1232
|
statusDot: "statusDot-hYJoej",
|
|
1150
1233
|
statusConnected: "statusConnected-hPSUgS",
|
|
1151
1234
|
statusDisconnected: "statusDisconnected-HIpcee",
|
|
@@ -1184,62 +1267,63 @@ var __webpack_modules__ = {
|
|
|
1184
1267
|
___CSS_LOADER_EXPORT___.push([
|
|
1185
1268
|
module.id,
|
|
1186
1269
|
`.tabList-IyuiBE {
|
|
1270
|
+
border-bottom: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
1271
|
+
background-color: var(--c15t-devtools-surface-subtle, #fafafa);
|
|
1187
1272
|
align-items: center;
|
|
1188
|
-
gap:
|
|
1189
|
-
padding:
|
|
1190
|
-
border-bottom: 1px solid var(--c15t-border, #e3e3e3);
|
|
1191
|
-
background-color: var(--c15t-surface, #fff);
|
|
1192
|
-
scrollbar-width: none;
|
|
1193
|
-
-ms-overflow-style: none;
|
|
1194
|
-
scroll-padding-inline-end: var(--c15t-space-sm, .5rem);
|
|
1273
|
+
gap: .375rem;
|
|
1274
|
+
padding: .75rem;
|
|
1195
1275
|
display: flex;
|
|
1196
|
-
overflow-x: auto;
|
|
1197
1276
|
}
|
|
1198
1277
|
|
|
1199
|
-
.
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1278
|
+
.tabStrip-_KrWe4 {
|
|
1279
|
+
align-items: center;
|
|
1280
|
+
gap: var(--c15t-space-xs, .25rem);
|
|
1281
|
+
flex: auto;
|
|
1282
|
+
min-width: 0;
|
|
1283
|
+
display: flex;
|
|
1284
|
+
overflow: hidden;
|
|
1206
1285
|
}
|
|
1207
1286
|
|
|
1208
1287
|
.tab-yfDEqg {
|
|
1209
|
-
align-items: center;
|
|
1210
|
-
gap: var(--c15t-space-xs, .25rem);
|
|
1211
1288
|
border-radius: var(--c15t-radius-md, .5rem);
|
|
1289
|
+
min-height: 1.875rem;
|
|
1212
1290
|
color: var(--c15t-text-muted, #737373);
|
|
1213
|
-
font-family:
|
|
1214
|
-
font-size:
|
|
1291
|
+
font-family: var(--c15t-font-family, system-ui, -apple-system, sans-serif);
|
|
1292
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
1215
1293
|
font-weight: var(--c15t-font-weight-medium, 500);
|
|
1294
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
1216
1295
|
cursor: pointer;
|
|
1217
1296
|
white-space: nowrap;
|
|
1218
|
-
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
1297
|
+
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), box-shadow var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
1219
1298
|
background-color: #0000;
|
|
1220
|
-
border:
|
|
1221
|
-
|
|
1299
|
+
border: 1px solid #0000;
|
|
1300
|
+
flex-shrink: 0;
|
|
1301
|
+
align-items: center;
|
|
1302
|
+
gap: .375rem;
|
|
1303
|
+
padding: .25rem .625rem;
|
|
1222
1304
|
display: flex;
|
|
1223
1305
|
}
|
|
1224
1306
|
|
|
1225
1307
|
.tab-yfDEqg:hover {
|
|
1226
|
-
background-color: var(--c15t-surface-
|
|
1308
|
+
background-color: var(--c15t-devtools-surface-muted, #f7f7f7);
|
|
1227
1309
|
color: var(--c15t-text, #171717);
|
|
1228
1310
|
}
|
|
1229
1311
|
|
|
1230
1312
|
.tab-yfDEqg:focus-visible {
|
|
1231
|
-
|
|
1232
|
-
outline
|
|
1313
|
+
box-shadow: 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
1314
|
+
outline: none;
|
|
1233
1315
|
}
|
|
1234
1316
|
|
|
1235
1317
|
.tabActive-r4hing {
|
|
1236
|
-
background-color: var(--c15t-
|
|
1237
|
-
color: var(--c15t-
|
|
1318
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
1319
|
+
border-color: var(--c15t-devtools-border-strong, #e3e3e3);
|
|
1320
|
+
color: var(--c15t-text, #171717);
|
|
1321
|
+
box-shadow: var(--c15t-shadow-sm, 0 1px 2px #0000000d);
|
|
1238
1322
|
}
|
|
1239
1323
|
|
|
1240
1324
|
.tabActive-r4hing:hover {
|
|
1241
|
-
background-color: var(--c15t-
|
|
1242
|
-
color: var(--c15t-text
|
|
1325
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
1326
|
+
color: var(--c15t-text, #171717);
|
|
1243
1327
|
}
|
|
1244
1328
|
|
|
1245
1329
|
.tabIcon-U9tnu0 {
|
|
@@ -1248,6 +1332,131 @@ var __webpack_modules__ = {
|
|
|
1248
1332
|
height: 14px;
|
|
1249
1333
|
}
|
|
1250
1334
|
|
|
1335
|
+
.tabHidden-HBXYSd {
|
|
1336
|
+
display: none;
|
|
1337
|
+
}
|
|
1338
|
+
|
|
1339
|
+
.overflowContainer-TTw9DO {
|
|
1340
|
+
flex-shrink: 0;
|
|
1341
|
+
position: relative;
|
|
1342
|
+
}
|
|
1343
|
+
|
|
1344
|
+
.overflowContainerHidden-sQa_XZ {
|
|
1345
|
+
display: none;
|
|
1346
|
+
}
|
|
1347
|
+
|
|
1348
|
+
.overflowButton-tKq4FF {
|
|
1349
|
+
border-radius: var(--c15t-radius-md, .5rem);
|
|
1350
|
+
width: 1.875rem;
|
|
1351
|
+
height: 1.875rem;
|
|
1352
|
+
color: var(--c15t-text-muted, #737373);
|
|
1353
|
+
cursor: pointer;
|
|
1354
|
+
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), border-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
1355
|
+
background-color: #0000;
|
|
1356
|
+
border: 1px solid #0000;
|
|
1357
|
+
justify-content: center;
|
|
1358
|
+
align-items: center;
|
|
1359
|
+
padding: 0;
|
|
1360
|
+
display: inline-flex;
|
|
1361
|
+
}
|
|
1362
|
+
|
|
1363
|
+
.overflowButton-tKq4FF:hover {
|
|
1364
|
+
background-color: var(--c15t-devtools-surface-muted, #f7f7f7);
|
|
1365
|
+
color: var(--c15t-text, #171717);
|
|
1366
|
+
}
|
|
1367
|
+
|
|
1368
|
+
.overflowButton-tKq4FF:focus-visible {
|
|
1369
|
+
box-shadow: 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
1370
|
+
outline: none;
|
|
1371
|
+
}
|
|
1372
|
+
|
|
1373
|
+
.overflowButtonIcon-FSurfC {
|
|
1374
|
+
justify-content: center;
|
|
1375
|
+
align-items: center;
|
|
1376
|
+
width: 14px;
|
|
1377
|
+
height: 14px;
|
|
1378
|
+
display: inline-flex;
|
|
1379
|
+
}
|
|
1380
|
+
|
|
1381
|
+
.overflowMenu-TST0eZ {
|
|
1382
|
+
border: 1px solid var(--c15t-devtools-border-strong, #e3e3e3);
|
|
1383
|
+
border-radius: var(--c15t-radius-md, .5rem);
|
|
1384
|
+
background-color: var(--c15t-devtools-surface-elevated, #fff);
|
|
1385
|
+
min-width: 10rem;
|
|
1386
|
+
box-shadow: var(--c15t-shadow-md, 0 4px 12px #00000014);
|
|
1387
|
+
opacity: 0;
|
|
1388
|
+
transform-origin: 100% 0;
|
|
1389
|
+
pointer-events: none;
|
|
1390
|
+
z-index: 10;
|
|
1391
|
+
transition: opacity var(--c15t-duration-fast, .1s) var(--c15t-easing-out, cubic-bezier(.215, .61, .355, 1)), transform var(--c15t-duration-fast, .1s) var(--c15t-easing-out, cubic-bezier(.215, .61, .355, 1));
|
|
1392
|
+
flex-direction: column;
|
|
1393
|
+
gap: .125rem;
|
|
1394
|
+
padding: .3125rem;
|
|
1395
|
+
display: flex;
|
|
1396
|
+
position: absolute;
|
|
1397
|
+
top: calc(100% + .375rem);
|
|
1398
|
+
right: 0;
|
|
1399
|
+
transform: translateY(-4px)scale(.98);
|
|
1400
|
+
}
|
|
1401
|
+
|
|
1402
|
+
.overflowMenu-TST0eZ[data-state="open"] {
|
|
1403
|
+
opacity: 1;
|
|
1404
|
+
pointer-events: auto;
|
|
1405
|
+
transform: translateY(0)scale(1);
|
|
1406
|
+
}
|
|
1407
|
+
|
|
1408
|
+
.overflowItem-y5Pz7k {
|
|
1409
|
+
border-radius: var(--c15t-radius-sm, .375rem);
|
|
1410
|
+
min-height: 1.75rem;
|
|
1411
|
+
color: var(--c15t-text, #171717);
|
|
1412
|
+
font-family: var(--c15t-font-family, system-ui, -apple-system, sans-serif);
|
|
1413
|
+
font-size: var(--c15t-devtools-font-size-xs, .75rem);
|
|
1414
|
+
font-weight: var(--c15t-font-weight-medium, 500);
|
|
1415
|
+
line-height: var(--c15t-line-height-tight, 1.25);
|
|
1416
|
+
text-align: left;
|
|
1417
|
+
cursor: pointer;
|
|
1418
|
+
white-space: nowrap;
|
|
1419
|
+
transition: background-color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1)), color var(--c15t-duration-fast, .1s) var(--c15t-easing, cubic-bezier(.4, 0, .2, 1));
|
|
1420
|
+
background-color: #0000;
|
|
1421
|
+
border: none;
|
|
1422
|
+
align-items: center;
|
|
1423
|
+
gap: .5rem;
|
|
1424
|
+
padding: .3125rem .5rem;
|
|
1425
|
+
display: inline-flex;
|
|
1426
|
+
}
|
|
1427
|
+
|
|
1428
|
+
.overflowItem-y5Pz7k:hover {
|
|
1429
|
+
background-color: var(--c15t-devtools-surface-subtle, #fafafa);
|
|
1430
|
+
}
|
|
1431
|
+
|
|
1432
|
+
.overflowItem-y5Pz7k:focus-visible {
|
|
1433
|
+
box-shadow: 0 0 0 2px var(--c15t-devtools-focus-ring, #335cff);
|
|
1434
|
+
outline: none;
|
|
1435
|
+
}
|
|
1436
|
+
|
|
1437
|
+
.overflowItemActive-mzVG1T {
|
|
1438
|
+
background-color: var(--c15t-devtools-accent-soft, #ebefff);
|
|
1439
|
+
color: var(--c15t-text, #171717);
|
|
1440
|
+
}
|
|
1441
|
+
|
|
1442
|
+
.overflowItemDisabled-dcHX3K {
|
|
1443
|
+
opacity: .5;
|
|
1444
|
+
cursor: not-allowed;
|
|
1445
|
+
}
|
|
1446
|
+
|
|
1447
|
+
.overflowItemIcon-fz291V {
|
|
1448
|
+
flex-shrink: 0;
|
|
1449
|
+
justify-content: center;
|
|
1450
|
+
align-items: center;
|
|
1451
|
+
width: 14px;
|
|
1452
|
+
height: 14px;
|
|
1453
|
+
display: inline-flex;
|
|
1454
|
+
}
|
|
1455
|
+
|
|
1456
|
+
.overflowItemHidden-k4aawi {
|
|
1457
|
+
display: none;
|
|
1458
|
+
}
|
|
1459
|
+
|
|
1251
1460
|
.tabDisabled-lDuv5l {
|
|
1252
1461
|
opacity: .5;
|
|
1253
1462
|
cursor: not-allowed;
|
|
@@ -1268,7 +1477,7 @@ var __webpack_modules__ = {
|
|
|
1268
1477
|
}
|
|
1269
1478
|
|
|
1270
1479
|
@media (prefers-reduced-motion: reduce) {
|
|
1271
|
-
.tab-yfDEqg {
|
|
1480
|
+
.tab-yfDEqg, .overflowButton-tKq4FF, .overflowMenu-TST0eZ, .overflowItem-y5Pz7k {
|
|
1272
1481
|
transition: none;
|
|
1273
1482
|
}
|
|
1274
1483
|
}
|
|
@@ -1284,9 +1493,21 @@ var __webpack_modules__ = {
|
|
|
1284
1493
|
]);
|
|
1285
1494
|
___CSS_LOADER_EXPORT___.locals = {
|
|
1286
1495
|
tabList: "tabList-IyuiBE",
|
|
1496
|
+
tabStrip: "tabStrip-_KrWe4",
|
|
1287
1497
|
tab: "tab-yfDEqg",
|
|
1288
1498
|
tabActive: "tabActive-r4hing",
|
|
1289
1499
|
tabIcon: "tabIcon-U9tnu0",
|
|
1500
|
+
tabHidden: "tabHidden-HBXYSd",
|
|
1501
|
+
overflowContainer: "overflowContainer-TTw9DO",
|
|
1502
|
+
overflowContainerHidden: "overflowContainerHidden-sQa_XZ",
|
|
1503
|
+
overflowButton: "overflowButton-tKq4FF",
|
|
1504
|
+
overflowButtonIcon: "overflowButtonIcon-FSurfC",
|
|
1505
|
+
overflowMenu: "overflowMenu-TST0eZ",
|
|
1506
|
+
overflowItem: "overflowItem-y5Pz7k",
|
|
1507
|
+
overflowItemActive: "overflowItemActive-mzVG1T",
|
|
1508
|
+
overflowItemDisabled: "overflowItemDisabled-dcHX3K",
|
|
1509
|
+
overflowItemIcon: "overflowItemIcon-fz291V",
|
|
1510
|
+
overflowItemHidden: "overflowItemHidden-k4aawi",
|
|
1290
1511
|
tabDisabled: "tabDisabled-lDuv5l",
|
|
1291
1512
|
tabPanel: "tabPanel-QKO8FX",
|
|
1292
1513
|
tabPanelActive: "tabPanelActive-mrNlGE"
|
|
@@ -1310,6 +1531,15 @@ var __webpack_modules__ = {
|
|
|
1310
1531
|
--c15t-devtools-button-size: 40px;
|
|
1311
1532
|
--c15t-devtools-z-index: 99999;
|
|
1312
1533
|
--c15t-devtools-surface-muted: var(--c15t-surface-hover, #f7f7f7);
|
|
1534
|
+
--c15t-devtools-surface-subtle: #fafafa;
|
|
1535
|
+
--c15t-devtools-surface-elevated: var(--c15t-surface, #fff);
|
|
1536
|
+
--c15t-devtools-border-strong: var(--c15t-border, #e3e3e3);
|
|
1537
|
+
--c15t-devtools-code-surface: #f7f7f7;
|
|
1538
|
+
--c15t-devtools-accent-soft: #ebefff;
|
|
1539
|
+
--c15t-devtools-focus-ring: var(--c15t-primary, #335cff);
|
|
1540
|
+
--c15t-devtools-text-muted: var(--c15t-text-muted, #737373);
|
|
1541
|
+
--c15t-devtools-font-size-sm: var(--c15t-font-size-sm, .875rem);
|
|
1542
|
+
--c15t-surface-muted: var(--c15t-devtools-surface-muted, #f7f7f7);
|
|
1313
1543
|
--c15t-devtools-font-size-xs: .75rem;
|
|
1314
1544
|
--c15t-devtools-badge-success: #21c45d;
|
|
1315
1545
|
--c15t-devtools-badge-success-bg: #e4fbed;
|
|
@@ -1323,8 +1553,37 @@ var __webpack_modules__ = {
|
|
|
1323
1553
|
--c15t-devtools-badge-neutral-bg: #f0f0f0;
|
|
1324
1554
|
}
|
|
1325
1555
|
|
|
1556
|
+
:is(:global(.c15t-light), :global(.light)) {
|
|
1557
|
+
--c15t-devtools-surface-muted: var(--c15t-surface-hover, #f7f7f7);
|
|
1558
|
+
--c15t-devtools-surface-subtle: #fafafa;
|
|
1559
|
+
--c15t-devtools-surface-elevated: var(--c15t-surface, #fff);
|
|
1560
|
+
--c15t-devtools-border-strong: var(--c15t-border, #e3e3e3);
|
|
1561
|
+
--c15t-devtools-code-surface: #f7f7f7;
|
|
1562
|
+
--c15t-devtools-accent-soft: #ebefff;
|
|
1563
|
+
--c15t-devtools-badge-success-bg: #e4fbed;
|
|
1564
|
+
--c15t-devtools-badge-error-bg: #fde7e7;
|
|
1565
|
+
--c15t-devtools-badge-warning-bg: #fef7dc;
|
|
1566
|
+
--c15t-devtools-badge-info-bg: #dcebfe;
|
|
1567
|
+
--c15t-devtools-badge-neutral-bg: #f0f0f0;
|
|
1568
|
+
}
|
|
1569
|
+
|
|
1570
|
+
@supports (color: color-mix(in srgb, white, black)) {
|
|
1571
|
+
:root {
|
|
1572
|
+
--c15t-devtools-surface-muted: color-mix(in srgb, var(--c15t-surface-hover, #f7f7f7) 85%, var(--c15t-surface, #fff));
|
|
1573
|
+
--c15t-devtools-surface-subtle: color-mix(in srgb, var(--c15t-surface-hover, #f7f7f7) 55%, var(--c15t-surface, #fff));
|
|
1574
|
+
--c15t-devtools-border-strong: color-mix(in srgb, var(--c15t-border, #e3e3e3) 80%, var(--c15t-text-muted, #737373));
|
|
1575
|
+
--c15t-devtools-code-surface: color-mix(in srgb, var(--c15t-surface-hover, #f7f7f7) 70%, var(--c15t-surface, #fff));
|
|
1576
|
+
--c15t-devtools-accent-soft: color-mix(in srgb, var(--c15t-primary, #335cff) 12%, transparent);
|
|
1577
|
+
}
|
|
1578
|
+
}
|
|
1579
|
+
|
|
1326
1580
|
:is(:global(.c15t-dark), :global(.dark)) {
|
|
1327
1581
|
--c15t-devtools-surface-muted: var(--c15t-surface-hover, #292929);
|
|
1582
|
+
--c15t-devtools-surface-subtle: #242424;
|
|
1583
|
+
--c15t-devtools-surface-elevated: var(--c15t-surface, #1a1a1a);
|
|
1584
|
+
--c15t-devtools-border-strong: var(--c15t-border, #3d3d3d);
|
|
1585
|
+
--c15t-devtools-code-surface: #212121;
|
|
1586
|
+
--c15t-devtools-accent-soft: #335cff33;
|
|
1328
1587
|
--c15t-devtools-badge-success-bg: #21c45d33;
|
|
1329
1588
|
--c15t-devtools-badge-error-bg: #ef434333;
|
|
1330
1589
|
--c15t-devtools-badge-warning-bg: #f59f0a33;
|
|
@@ -1333,8 +1592,13 @@ var __webpack_modules__ = {
|
|
|
1333
1592
|
}
|
|
1334
1593
|
|
|
1335
1594
|
@media (prefers-color-scheme: dark) {
|
|
1336
|
-
:root {
|
|
1595
|
+
:global(:root:not(.light):not(.c15t-light)) {
|
|
1337
1596
|
--c15t-devtools-surface-muted: var(--c15t-surface-hover, #292929);
|
|
1597
|
+
--c15t-devtools-surface-subtle: #242424;
|
|
1598
|
+
--c15t-devtools-surface-elevated: var(--c15t-surface, #1a1a1a);
|
|
1599
|
+
--c15t-devtools-border-strong: var(--c15t-border, #3d3d3d);
|
|
1600
|
+
--c15t-devtools-code-surface: #212121;
|
|
1601
|
+
--c15t-devtools-accent-soft: #335cff33;
|
|
1338
1602
|
--c15t-devtools-badge-success-bg: #21c45d33;
|
|
1339
1603
|
--c15t-devtools-badge-error-bg: #ef434333;
|
|
1340
1604
|
--c15t-devtools-badge-warning-bg: #f59f0a33;
|
|
@@ -1842,7 +2106,7 @@ function renderer_button(options = {}) {
|
|
|
1842
2106
|
type: options.type ?? 'button'
|
|
1843
2107
|
});
|
|
1844
2108
|
}
|
|
1845
|
-
function
|
|
2109
|
+
function renderer_span(options = {}) {
|
|
1846
2110
|
return createElement({
|
|
1847
2111
|
...options,
|
|
1848
2112
|
tag: 'span'
|
|
@@ -1921,7 +2185,8 @@ panel_module_options.domAPI = styleDomAPI_default();
|
|
|
1921
2185
|
panel_module_options.insertStyleElement = insertStyleElement_default();
|
|
1922
2186
|
injectStylesIntoStyleTag_default()(panel_module.A, panel_module_options);
|
|
1923
2187
|
const styles_panel_module = panel_module.A && panel_module.A.locals ? panel_module.A.locals : void 0;
|
|
1924
|
-
const PREFERENCE_TRIGGER_SELECTORS = '[data-c15t-trigger], [aria-label*="privacy settings"], [aria-label*="preference"]';
|
|
2188
|
+
const PREFERENCE_TRIGGER_SELECTORS = '[data-c15t-trigger], [aria-label*="privacy settings" i], [aria-label*="preference" i]';
|
|
2189
|
+
const PREVIOUS_DISPLAY_ATTR = 'data-c15t-devtools-prev-display';
|
|
1925
2190
|
function detectPreferenceTrigger() {
|
|
1926
2191
|
const triggers = document.querySelectorAll(PREFERENCE_TRIGGER_SELECTORS);
|
|
1927
2192
|
return triggers.length > 0;
|
|
@@ -1931,7 +2196,19 @@ function getPreferenceTriggerElements() {
|
|
|
1931
2196
|
}
|
|
1932
2197
|
function setPreferenceTriggerVisibility(visible) {
|
|
1933
2198
|
const elements = getPreferenceTriggerElements();
|
|
1934
|
-
for (const el of elements)
|
|
2199
|
+
for (const el of elements){
|
|
2200
|
+
if (visible) {
|
|
2201
|
+
const previousDisplay = el.getAttribute(PREVIOUS_DISPLAY_ATTR);
|
|
2202
|
+
if (null === previousDisplay) el.style.removeProperty('display');
|
|
2203
|
+
else {
|
|
2204
|
+
el.style.display = previousDisplay;
|
|
2205
|
+
el.removeAttribute(PREVIOUS_DISPLAY_ATTR);
|
|
2206
|
+
}
|
|
2207
|
+
continue;
|
|
2208
|
+
}
|
|
2209
|
+
if (!el.hasAttribute(PREVIOUS_DISPLAY_ATTR)) el.setAttribute(PREVIOUS_DISPLAY_ATTR, el.style.display);
|
|
2210
|
+
el.style.display = 'none';
|
|
2211
|
+
}
|
|
1935
2212
|
}
|
|
1936
2213
|
function getPreferenceCenterOpener(namespace = 'c15tStore') {
|
|
1937
2214
|
const win = window;
|
|
@@ -1944,7 +2221,7 @@ function getPreferenceCenterOpener(namespace = 'c15tStore') {
|
|
|
1944
2221
|
}
|
|
1945
2222
|
return null;
|
|
1946
2223
|
}
|
|
1947
|
-
const version = '2.0.0-rc.
|
|
2224
|
+
const version = '2.0.0-rc.4';
|
|
1948
2225
|
const DEVTOOLS_ICON = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 446 445" aria-label="c15t">
|
|
1949
2226
|
<path fill="currentColor" d="M223.178.313c39.064 0 70.732 31.668 70.732 70.732-.001 39.064-31.668 70.731-70.732 70.731-12.181 0-23.642-3.079-33.649-8.502l-55.689 55.689a70.267 70.267 0 0 1 5.574 13.441h167.531c8.695-29.217 35.762-50.523 67.804-50.523 39.064 0 70.731 31.668 70.731 70.732s-31.668 70.732-70.731 70.732c-32.042 0-59.108-21.306-67.803-50.523H139.413a70.417 70.417 0 0 1-7.888 17.396l54.046 54.046c10.893-6.851 23.786-10.815 37.605-10.815 39.064 0 70.732 31.669 70.732 70.733 0 39.064-31.668 70.731-70.732 70.731s-70.732-31.667-70.732-70.731c0-10.518 2.296-20.499 6.414-29.471l-57.78-57.78c-8.972 4.117-18.952 6.414-29.47 6.414-39.063 0-70.731-31.668-70.732-70.732 0-39.064 31.669-70.732 70.733-70.732 12.18 0 23.642 3.079 33.649 8.502l55.688-55.688c-5.423-10.007-8.502-21.469-8.502-33.65 0-39.064 31.668-70.733 70.732-70.733Zm0 343.555c-16.742 0-30.314 13.572-30.314 30.314 0 16.741 13.572 30.313 30.314 30.313s30.314-13.572 30.314-30.313c0-16.742-13.572-30.314-30.314-30.314ZM71.611 192.299c-16.742 0-30.315 13.572-30.315 30.314s13.573 30.314 30.315 30.314c16.741 0 30.313-13.572 30.313-30.314 0-16.741-13.572-30.314-30.313-30.314Zm303.138 0c-16.729 0-30.294 13.551-30.315 30.275l.001.039-.001.038c.021 16.725 13.586 30.276 30.315 30.276 16.741 0 30.313-13.572 30.313-30.314 0-16.741-13.572-30.314-30.313-30.314ZM223.178 40.73c-16.742 0-30.314 13.573-30.314 30.315s13.573 30.313 30.314 30.313c16.742 0 30.313-13.572 30.314-30.313 0-16.742-13.572-30.314-30.314-30.315Z"/>
|
|
1950
2227
|
</svg>`;
|
|
@@ -2025,7 +2302,7 @@ function createDropdownMenu(options) {
|
|
|
2025
2302
|
const labelContainer = renderer_div({
|
|
2026
2303
|
className: styles_panel_module.menuItemContent ?? ''
|
|
2027
2304
|
});
|
|
2028
|
-
const label =
|
|
2305
|
+
const label = renderer_span({
|
|
2029
2306
|
className: styles_panel_module.menuItemLabel ?? '',
|
|
2030
2307
|
text: item.label
|
|
2031
2308
|
});
|
|
@@ -2147,6 +2424,11 @@ function getPositionClass(position) {
|
|
|
2147
2424
|
return styles_panel_module.positionTopLeft ?? '';
|
|
2148
2425
|
}
|
|
2149
2426
|
}
|
|
2427
|
+
function formatRetryDelay(delayMs) {
|
|
2428
|
+
if (null === delayMs) return 'n/a';
|
|
2429
|
+
if (delayMs < 1000) return `${delayMs}ms`;
|
|
2430
|
+
return `${(delayMs / 1000).toFixed(1)}s`;
|
|
2431
|
+
}
|
|
2150
2432
|
function createPanel(options) {
|
|
2151
2433
|
const { stateManager, storeConnector, onRenderContent, namespace = 'c15tStore', enableUnifiedMode = true } = options;
|
|
2152
2434
|
let removePortal = null;
|
|
@@ -2278,7 +2560,7 @@ function createPanel(options) {
|
|
|
2278
2560
|
}));
|
|
2279
2561
|
return logoWrapper;
|
|
2280
2562
|
})(),
|
|
2281
|
-
|
|
2563
|
+
renderer_span({
|
|
2282
2564
|
text: 'c15t DevTools'
|
|
2283
2565
|
})
|
|
2284
2566
|
]
|
|
@@ -2322,38 +2604,41 @@ function createPanel(options) {
|
|
|
2322
2604
|
const isConnected = storeConnector.isConnected();
|
|
2323
2605
|
const storeState = storeConnector.getState();
|
|
2324
2606
|
const isLoading = storeState?.isLoadingConsentInfo ?? false;
|
|
2607
|
+
const diagnostics = storeConnector.getDiagnostics();
|
|
2325
2608
|
const statusChildren = [
|
|
2326
|
-
|
|
2609
|
+
renderer_span({
|
|
2327
2610
|
className: `${styles_panel_module.statusDot} ${isConnected ? styles_panel_module.statusConnected : styles_panel_module.statusDisconnected}`
|
|
2328
2611
|
}),
|
|
2329
|
-
|
|
2612
|
+
renderer_span({
|
|
2330
2613
|
text: isConnected ? 'Connected' : 'Disconnected'
|
|
2331
2614
|
})
|
|
2332
2615
|
];
|
|
2333
|
-
if (isLoading) statusChildren.push(
|
|
2334
|
-
|
|
2335
|
-
marginLeft: '4px',
|
|
2336
|
-
opacity: '0.7'
|
|
2337
|
-
},
|
|
2616
|
+
if (isLoading) statusChildren.push(renderer_span({
|
|
2617
|
+
className: styles_panel_module.footerMeta,
|
|
2338
2618
|
text: '\u00b7 Fetching /init\u2026'
|
|
2339
2619
|
}));
|
|
2620
|
+
else if (!isConnected) statusChildren.push(renderer_span({
|
|
2621
|
+
className: styles_panel_module.footerMeta,
|
|
2622
|
+
text: `· ${diagnostics.namespace} · retry ${diagnostics.reconnectAttempts} · next ${formatRetryDelay(diagnostics.nextRetryInMs)}`
|
|
2623
|
+
}));
|
|
2340
2624
|
footerElement.appendChild(renderer_div({
|
|
2341
2625
|
className: styles_panel_module.footerStatus,
|
|
2342
2626
|
children: statusChildren
|
|
2343
2627
|
}));
|
|
2344
2628
|
if (!isConnected) footerElement.appendChild(renderer_button({
|
|
2345
|
-
className: styles_panel_module.
|
|
2629
|
+
className: styles_panel_module.inlineActionButton,
|
|
2346
2630
|
text: 'Retry',
|
|
2347
2631
|
onClick: ()=>{
|
|
2348
2632
|
storeConnector.retryConnection();
|
|
2349
2633
|
}
|
|
2350
2634
|
}));
|
|
2351
|
-
footerElement.appendChild(
|
|
2635
|
+
footerElement.appendChild(renderer_span({
|
|
2352
2636
|
text: `v${version}`
|
|
2353
2637
|
}));
|
|
2354
2638
|
}
|
|
2355
2639
|
function renderErrorState(container) {
|
|
2356
2640
|
clearElement(container);
|
|
2641
|
+
const diagnostics = storeConnector.getDiagnostics();
|
|
2357
2642
|
const errorState = renderer_div({
|
|
2358
2643
|
className: styles_panel_module.errorState,
|
|
2359
2644
|
children: [
|
|
@@ -2375,8 +2660,25 @@ function createPanel(options) {
|
|
|
2375
2660
|
className: styles_panel_module.errorMessage,
|
|
2376
2661
|
text: 'c15t consent manager is not initialized. Make sure you have set up the ConsentManagerProvider in your app.'
|
|
2377
2662
|
}),
|
|
2663
|
+
renderer_div({
|
|
2664
|
+
className: styles_panel_module.errorMessage,
|
|
2665
|
+
style: {
|
|
2666
|
+
marginTop: '4px',
|
|
2667
|
+
fontSize: 'var(--c15t-devtools-font-size-xs)'
|
|
2668
|
+
},
|
|
2669
|
+
text: `Namespace: ${diagnostics.namespace} · Retries: ${diagnostics.reconnectAttempts} · Next retry: ${formatRetryDelay(diagnostics.nextRetryInMs)}`
|
|
2670
|
+
}),
|
|
2671
|
+
diagnostics.lastError ? renderer_div({
|
|
2672
|
+
className: styles_panel_module.errorMessage,
|
|
2673
|
+
style: {
|
|
2674
|
+
marginTop: '4px',
|
|
2675
|
+
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
2676
|
+
color: 'var(--c15t-text-muted)'
|
|
2677
|
+
},
|
|
2678
|
+
text: `Last error: ${diagnostics.lastError}`
|
|
2679
|
+
}) : null,
|
|
2378
2680
|
renderer_button({
|
|
2379
|
-
className: styles_panel_module.
|
|
2681
|
+
className: styles_panel_module.inlineActionButton,
|
|
2380
2682
|
text: 'Retry Connection',
|
|
2381
2683
|
onClick: ()=>{
|
|
2382
2684
|
storeConnector.retryConnection();
|
|
@@ -2439,6 +2741,10 @@ function createPanel(options) {
|
|
|
2439
2741
|
if (contentContainer) if (storeConnector.isConnected()) onRenderContent(contentContainer);
|
|
2440
2742
|
else renderErrorState(contentContainer);
|
|
2441
2743
|
});
|
|
2744
|
+
const unsubscribeDiagnostics = storeConnector.subscribeDiagnostics(()=>{
|
|
2745
|
+
updateFooter();
|
|
2746
|
+
if (contentContainer && !storeConnector.isConnected()) renderErrorState(contentContainer);
|
|
2747
|
+
});
|
|
2442
2748
|
container.appendChild(floatingButton);
|
|
2443
2749
|
removePortal = createPortal(container);
|
|
2444
2750
|
return {
|
|
@@ -2448,6 +2754,7 @@ function createPanel(options) {
|
|
|
2448
2754
|
destroy: ()=>{
|
|
2449
2755
|
unsubscribeState();
|
|
2450
2756
|
unsubscribeStore();
|
|
2757
|
+
unsubscribeDiagnostics();
|
|
2451
2758
|
if (dropdownMenu) {
|
|
2452
2759
|
dropdownMenu.destroy();
|
|
2453
2760
|
dropdownMenu = null;
|
|
@@ -2497,6 +2804,11 @@ const EVENTS_ICON = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
|
|
|
2497
2804
|
<path d="M12 20h9"></path>
|
|
2498
2805
|
<path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z"></path>
|
|
2499
2806
|
</svg>`;
|
|
2807
|
+
const MORE_ICON = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
|
|
2808
|
+
<circle cx="12" cy="5" r="1.75"></circle>
|
|
2809
|
+
<circle cx="12" cy="12" r="1.75"></circle>
|
|
2810
|
+
<circle cx="12" cy="19" r="1.75"></circle>
|
|
2811
|
+
</svg>`;
|
|
2500
2812
|
const TABS = [
|
|
2501
2813
|
{
|
|
2502
2814
|
id: 'location',
|
|
@@ -2532,12 +2844,56 @@ const TABS = [
|
|
|
2532
2844
|
function createTabs(options) {
|
|
2533
2845
|
const { onTabChange, disabledTabs = [] } = options;
|
|
2534
2846
|
let activeTab = options.activeTab;
|
|
2847
|
+
let isOverflowMenuOpen = false;
|
|
2848
|
+
let visibleTabIds = [];
|
|
2849
|
+
let hiddenTabIds = [];
|
|
2535
2850
|
const tabButtons = new Map();
|
|
2851
|
+
const overflowButtons = new Map();
|
|
2536
2852
|
const tabList = renderer_div({
|
|
2537
|
-
className: styles_tabs_module.tabList
|
|
2853
|
+
className: styles_tabs_module.tabList
|
|
2854
|
+
});
|
|
2855
|
+
const tabStrip = renderer_div({
|
|
2856
|
+
className: styles_tabs_module.tabStrip,
|
|
2538
2857
|
role: 'tablist',
|
|
2539
2858
|
ariaLabel: 'DevTools tabs'
|
|
2540
2859
|
});
|
|
2860
|
+
tabList.appendChild(tabStrip);
|
|
2861
|
+
const overflowMenu = renderer_div({
|
|
2862
|
+
className: styles_tabs_module.overflowMenu,
|
|
2863
|
+
role: 'menu',
|
|
2864
|
+
ariaLabel: 'All tabs'
|
|
2865
|
+
});
|
|
2866
|
+
overflowMenu.dataset.state = 'closed';
|
|
2867
|
+
const overflowButton = renderer_button({
|
|
2868
|
+
className: styles_tabs_module.overflowButton,
|
|
2869
|
+
ariaLabel: 'More tabs',
|
|
2870
|
+
ariaExpanded: 'false',
|
|
2871
|
+
onClick: ()=>toggleOverflowMenu(),
|
|
2872
|
+
onKeyDown: (e)=>{
|
|
2873
|
+
if ('ArrowDown' === e.key || 'Enter' === e.key || ' ' === e.key) {
|
|
2874
|
+
e.preventDefault();
|
|
2875
|
+
openOverflowMenu();
|
|
2876
|
+
focusFirstEnabledOverflowItem();
|
|
2877
|
+
}
|
|
2878
|
+
}
|
|
2879
|
+
});
|
|
2880
|
+
overflowButton.setAttribute('aria-haspopup', 'menu');
|
|
2881
|
+
const overflowIcon = renderer_div({
|
|
2882
|
+
className: styles_tabs_module.overflowButtonIcon
|
|
2883
|
+
});
|
|
2884
|
+
overflowIcon.appendChild(createSvgElement(MORE_ICON, {
|
|
2885
|
+
width: 14,
|
|
2886
|
+
height: 14
|
|
2887
|
+
}));
|
|
2888
|
+
overflowButton.appendChild(overflowIcon);
|
|
2889
|
+
const overflowContainer = renderer_div({
|
|
2890
|
+
className: styles_tabs_module.overflowContainer,
|
|
2891
|
+
children: [
|
|
2892
|
+
overflowButton,
|
|
2893
|
+
overflowMenu
|
|
2894
|
+
]
|
|
2895
|
+
});
|
|
2896
|
+
tabList.appendChild(overflowContainer);
|
|
2541
2897
|
for (const tab of TABS){
|
|
2542
2898
|
const isActive = tab.id === activeTab;
|
|
2543
2899
|
const isDisabled = disabledTabs.includes(tab.id);
|
|
@@ -2551,6 +2907,7 @@ function createTabs(options) {
|
|
|
2551
2907
|
disabled: isDisabled,
|
|
2552
2908
|
onClick: ()=>{
|
|
2553
2909
|
if (!isDisabled) {
|
|
2910
|
+
closeOverflowMenu();
|
|
2554
2911
|
setActiveTab(tab.id);
|
|
2555
2912
|
onTabChange(tab.id);
|
|
2556
2913
|
}
|
|
@@ -2567,11 +2924,188 @@ function createTabs(options) {
|
|
|
2567
2924
|
tabButton.appendChild(iconWrapper);
|
|
2568
2925
|
tabButton.appendChild(document.createTextNode(tab.label));
|
|
2569
2926
|
tabButtons.set(tab.id, tabButton);
|
|
2570
|
-
|
|
2927
|
+
tabStrip.appendChild(tabButton);
|
|
2928
|
+
const overflowItem = renderer_button({
|
|
2929
|
+
className: `${styles_tabs_module.overflowItem} ${isActive ? styles_tabs_module.overflowItemActive : ''} ${isDisabled ? styles_tabs_module.overflowItemDisabled : ''}`,
|
|
2930
|
+
role: 'menuitemradio',
|
|
2931
|
+
ariaChecked: isActive ? 'true' : 'false',
|
|
2932
|
+
disabled: isDisabled,
|
|
2933
|
+
onClick: ()=>{
|
|
2934
|
+
if (!isDisabled) {
|
|
2935
|
+
setActiveTab(tab.id);
|
|
2936
|
+
onTabChange(tab.id);
|
|
2937
|
+
closeOverflowMenu();
|
|
2938
|
+
tabButtons.get(tab.id)?.focus();
|
|
2939
|
+
}
|
|
2940
|
+
},
|
|
2941
|
+
onKeyDown: (e)=>handleOverflowKeyDown(e, tab.id)
|
|
2942
|
+
});
|
|
2943
|
+
const overflowItemIcon = renderer_div({
|
|
2944
|
+
className: styles_tabs_module.overflowItemIcon
|
|
2945
|
+
});
|
|
2946
|
+
overflowItemIcon.appendChild(createSvgElement(tab.icon, {
|
|
2947
|
+
width: 14,
|
|
2948
|
+
height: 14
|
|
2949
|
+
}));
|
|
2950
|
+
overflowItem.appendChild(overflowItemIcon);
|
|
2951
|
+
overflowItem.appendChild(document.createTextNode(tab.label));
|
|
2952
|
+
overflowButtons.set(tab.id, overflowItem);
|
|
2953
|
+
overflowMenu.appendChild(overflowItem);
|
|
2571
2954
|
}
|
|
2572
|
-
function
|
|
2573
|
-
const
|
|
2574
|
-
|
|
2955
|
+
function applyActiveState(tab) {
|
|
2956
|
+
for (const [tabId, tabButton] of tabButtons){
|
|
2957
|
+
const isActive = tabId === tab;
|
|
2958
|
+
if (styles_tabs_module.tabActive) tabButton.classList.toggle(styles_tabs_module.tabActive, isActive);
|
|
2959
|
+
tabButton.setAttribute('aria-selected', isActive ? 'true' : 'false');
|
|
2960
|
+
tabButton.tabIndex = isActive ? 0 : -1;
|
|
2961
|
+
}
|
|
2962
|
+
for (const [tabId, overflowItem] of overflowButtons){
|
|
2963
|
+
const isActive = tabId === tab;
|
|
2964
|
+
if (styles_tabs_module.overflowItemActive) overflowItem.classList.toggle(styles_tabs_module.overflowItemActive, isActive);
|
|
2965
|
+
overflowItem.setAttribute('aria-checked', isActive ? 'true' : 'false');
|
|
2966
|
+
}
|
|
2967
|
+
}
|
|
2968
|
+
function updateVisibleTabs() {
|
|
2969
|
+
const allTabIds = TABS.map((t)=>t.id);
|
|
2970
|
+
const iabEnabled = !disabledTabs.includes('iab');
|
|
2971
|
+
const preferredSecondTab = iabEnabled ? 'iab' : 'consents';
|
|
2972
|
+
const overflowSecondTab = iabEnabled ? 'consents' : 'iab';
|
|
2973
|
+
const showOverflowSecondTabInStrip = activeTab === overflowSecondTab;
|
|
2974
|
+
const stripSecondTab = showOverflowSecondTabInStrip ? overflowSecondTab : preferredSecondTab;
|
|
2975
|
+
const forcedOverflowTab = showOverflowSecondTabInStrip ? preferredSecondTab : overflowSecondTab;
|
|
2976
|
+
const layoutTabIds = [
|
|
2977
|
+
'location',
|
|
2978
|
+
stripSecondTab,
|
|
2979
|
+
"scripts",
|
|
2980
|
+
'actions',
|
|
2981
|
+
'events',
|
|
2982
|
+
forcedOverflowTab
|
|
2983
|
+
];
|
|
2984
|
+
const forcedOverflowTabIds = new Set();
|
|
2985
|
+
forcedOverflowTabIds.add(forcedOverflowTab);
|
|
2986
|
+
for (const [index, tabId] of layoutTabIds.entries()){
|
|
2987
|
+
const tabButton = tabButtons.get(tabId);
|
|
2988
|
+
if (tabButton) tabButton.style.order = String(index);
|
|
2989
|
+
const overflowItem = overflowButtons.get(tabId);
|
|
2990
|
+
if (overflowItem) overflowItem.style.order = String(index);
|
|
2991
|
+
}
|
|
2992
|
+
for (const tabId of allTabIds){
|
|
2993
|
+
const tabButton = tabButtons.get(tabId);
|
|
2994
|
+
if (tabButton && styles_tabs_module.tabHidden) tabButton.classList.remove(styles_tabs_module.tabHidden);
|
|
2995
|
+
}
|
|
2996
|
+
if (styles_tabs_module.overflowContainerHidden) overflowContainer.classList.remove(styles_tabs_module.overflowContainerHidden);
|
|
2997
|
+
const stripGap = Number.parseFloat(getComputedStyle(tabStrip).gap || '0');
|
|
2998
|
+
const calculateVisibleTabs = (availableWidth)=>{
|
|
2999
|
+
if (availableWidth <= 0) return [];
|
|
3000
|
+
const nextVisible = [];
|
|
3001
|
+
let usedWidth = 0;
|
|
3002
|
+
for (const tabId of layoutTabIds){
|
|
3003
|
+
if (forcedOverflowTabIds.has(tabId)) continue;
|
|
3004
|
+
const tabButton = tabButtons.get(tabId);
|
|
3005
|
+
if (!tabButton) continue;
|
|
3006
|
+
const width = tabButton.getBoundingClientRect().width;
|
|
3007
|
+
const nextUsed = 0 === nextVisible.length ? width : usedWidth + stripGap + width;
|
|
3008
|
+
if (nextUsed <= availableWidth) {
|
|
3009
|
+
nextVisible.push(tabId);
|
|
3010
|
+
usedWidth = nextUsed;
|
|
3011
|
+
} else break;
|
|
3012
|
+
}
|
|
3013
|
+
return nextVisible;
|
|
3014
|
+
};
|
|
3015
|
+
const measureStripWidth = ()=>tabStrip.getBoundingClientRect().width;
|
|
3016
|
+
const showOverflowContainer = ()=>{
|
|
3017
|
+
if (styles_tabs_module.overflowContainerHidden) overflowContainer.classList.remove(styles_tabs_module.overflowContainerHidden);
|
|
3018
|
+
};
|
|
3019
|
+
const hideOverflowContainer = ()=>{
|
|
3020
|
+
if (styles_tabs_module.overflowContainerHidden) overflowContainer.classList.add(styles_tabs_module.overflowContainerHidden);
|
|
3021
|
+
};
|
|
3022
|
+
const measureVisibleWidth = (tabIds)=>{
|
|
3023
|
+
let width = 0;
|
|
3024
|
+
for (const [index, tabId] of tabIds.entries()){
|
|
3025
|
+
const tabButton = tabButtons.get(tabId);
|
|
3026
|
+
if (tabButton) {
|
|
3027
|
+
width += tabButton.getBoundingClientRect().width;
|
|
3028
|
+
if (index > 0) width += stripGap;
|
|
3029
|
+
}
|
|
3030
|
+
}
|
|
3031
|
+
return width;
|
|
3032
|
+
};
|
|
3033
|
+
if (0 === forcedOverflowTabIds.size) {
|
|
3034
|
+
hideOverflowContainer();
|
|
3035
|
+
const visibleWithoutOverflow = calculateVisibleTabs(measureStripWidth());
|
|
3036
|
+
if (visibleWithoutOverflow.length === layoutTabIds.length) visibleTabIds = visibleWithoutOverflow;
|
|
3037
|
+
else {
|
|
3038
|
+
showOverflowContainer();
|
|
3039
|
+
visibleTabIds = calculateVisibleTabs(measureStripWidth());
|
|
3040
|
+
}
|
|
3041
|
+
} else {
|
|
3042
|
+
showOverflowContainer();
|
|
3043
|
+
const withOverflow = calculateVisibleTabs(measureStripWidth());
|
|
3044
|
+
visibleTabIds = withOverflow.length > 0 ? withOverflow : [
|
|
3045
|
+
activeTab
|
|
3046
|
+
];
|
|
3047
|
+
}
|
|
3048
|
+
if (!visibleTabIds.includes(activeTab) && !disabledTabs.includes(activeTab)) if (visibleTabIds.length > 0) visibleTabIds[visibleTabIds.length - 1] = activeTab;
|
|
3049
|
+
else visibleTabIds = [
|
|
3050
|
+
activeTab
|
|
3051
|
+
];
|
|
3052
|
+
visibleTabIds = [
|
|
3053
|
+
...new Set(visibleTabIds)
|
|
3054
|
+
];
|
|
3055
|
+
const maxStripWidth = measureStripWidth();
|
|
3056
|
+
while(visibleTabIds.length > 1 && measureVisibleWidth(visibleTabIds) > maxStripWidth + 0.5){
|
|
3057
|
+
let removeIndex = visibleTabIds.length - 1;
|
|
3058
|
+
if (visibleTabIds[removeIndex] === activeTab) removeIndex = Math.max(0, removeIndex - 1);
|
|
3059
|
+
visibleTabIds.splice(removeIndex, 1);
|
|
3060
|
+
}
|
|
3061
|
+
hiddenTabIds = layoutTabIds.filter((tabId)=>!visibleTabIds.includes(tabId) || forcedOverflowTabIds.has(tabId) && tabId !== activeTab);
|
|
3062
|
+
for (const tabId of allTabIds){
|
|
3063
|
+
const tabButton = tabButtons.get(tabId);
|
|
3064
|
+
if (tabButton) {
|
|
3065
|
+
if (styles_tabs_module.tabHidden) tabButton.classList.toggle(styles_tabs_module.tabHidden, hiddenTabIds.includes(tabId));
|
|
3066
|
+
}
|
|
3067
|
+
}
|
|
3068
|
+
for (const tabId of allTabIds){
|
|
3069
|
+
const overflowItem = overflowButtons.get(tabId);
|
|
3070
|
+
if (overflowItem) {
|
|
3071
|
+
if (styles_tabs_module.overflowItemHidden) overflowItem.classList.toggle(styles_tabs_module.overflowItemHidden, !hiddenTabIds.includes(tabId));
|
|
3072
|
+
}
|
|
3073
|
+
}
|
|
3074
|
+
if (styles_tabs_module.overflowContainerHidden) overflowContainer.classList.toggle(styles_tabs_module.overflowContainerHidden, 0 === hiddenTabIds.length);
|
|
3075
|
+
if (0 === hiddenTabIds.length) closeOverflowMenu();
|
|
3076
|
+
}
|
|
3077
|
+
function focusFirstEnabledOverflowItem() {
|
|
3078
|
+
const firstEnabled = hiddenTabIds.find((tabId)=>!disabledTabs.includes(tabId));
|
|
3079
|
+
if (firstEnabled) overflowButtons.get(firstEnabled)?.focus();
|
|
3080
|
+
}
|
|
3081
|
+
function openOverflowMenu() {
|
|
3082
|
+
if (isOverflowMenuOpen || 0 === hiddenTabIds.length) return;
|
|
3083
|
+
isOverflowMenuOpen = true;
|
|
3084
|
+
overflowMenu.dataset.state = 'open';
|
|
3085
|
+
overflowButton.setAttribute('aria-expanded', 'true');
|
|
3086
|
+
document.addEventListener('click', handleOutsideClick);
|
|
3087
|
+
document.addEventListener('keydown', handleEscapeKey);
|
|
3088
|
+
}
|
|
3089
|
+
function closeOverflowMenu() {
|
|
3090
|
+
if (!isOverflowMenuOpen) return;
|
|
3091
|
+
isOverflowMenuOpen = false;
|
|
3092
|
+
overflowMenu.dataset.state = 'closed';
|
|
3093
|
+
overflowButton.setAttribute('aria-expanded', 'false');
|
|
3094
|
+
document.removeEventListener('click', handleOutsideClick);
|
|
3095
|
+
document.removeEventListener('keydown', handleEscapeKey);
|
|
3096
|
+
}
|
|
3097
|
+
function toggleOverflowMenu() {
|
|
3098
|
+
if (isOverflowMenuOpen) closeOverflowMenu();
|
|
3099
|
+
else openOverflowMenu();
|
|
3100
|
+
}
|
|
3101
|
+
function handleOutsideClick(e) {
|
|
3102
|
+
if (!overflowContainer.contains(e.target)) closeOverflowMenu();
|
|
3103
|
+
}
|
|
3104
|
+
function handleEscapeKey(e) {
|
|
3105
|
+
if ('Escape' === e.key) closeOverflowMenu();
|
|
3106
|
+
}
|
|
3107
|
+
function handleKeyDown(e, currentTab) {
|
|
3108
|
+
const enabledTabIds = visibleTabIds.filter((tabId)=>!disabledTabs.includes(tabId));
|
|
2575
3109
|
const currentIndex = enabledTabIds.indexOf(currentTab);
|
|
2576
3110
|
let newIndex = currentIndex;
|
|
2577
3111
|
switch(e.key){
|
|
@@ -2598,23 +3132,152 @@ function createTabs(options) {
|
|
|
2598
3132
|
tabButtons.get(newTab)?.focus();
|
|
2599
3133
|
}
|
|
2600
3134
|
}
|
|
3135
|
+
function handleOverflowKeyDown(e, currentTab) {
|
|
3136
|
+
const enabledTabIds = hiddenTabIds.filter((tabId)=>!disabledTabs.includes(tabId));
|
|
3137
|
+
const currentIndex = enabledTabIds.indexOf(currentTab);
|
|
3138
|
+
if ('Escape' === e.key) {
|
|
3139
|
+
e.preventDefault();
|
|
3140
|
+
closeOverflowMenu();
|
|
3141
|
+
overflowButton.focus();
|
|
3142
|
+
return;
|
|
3143
|
+
}
|
|
3144
|
+
let newIndex = currentIndex;
|
|
3145
|
+
switch(e.key){
|
|
3146
|
+
case 'ArrowDown':
|
|
3147
|
+
newIndex = (currentIndex + 1) % enabledTabIds.length;
|
|
3148
|
+
break;
|
|
3149
|
+
case 'ArrowUp':
|
|
3150
|
+
newIndex = currentIndex > 0 ? currentIndex - 1 : enabledTabIds.length - 1;
|
|
3151
|
+
break;
|
|
3152
|
+
default:
|
|
3153
|
+
return;
|
|
3154
|
+
}
|
|
3155
|
+
e.preventDefault();
|
|
3156
|
+
const newTab = enabledTabIds[newIndex];
|
|
3157
|
+
if (newTab) overflowButtons.get(newTab)?.focus();
|
|
3158
|
+
}
|
|
2601
3159
|
function setActiveTab(tab) {
|
|
2602
3160
|
activeTab = tab;
|
|
2603
|
-
|
|
2604
|
-
|
|
2605
|
-
if (styles_tabs_module.tabActive) tabButton.classList.toggle(styles_tabs_module.tabActive, isActive);
|
|
2606
|
-
tabButton.setAttribute('aria-selected', isActive ? 'true' : 'false');
|
|
2607
|
-
tabButton.tabIndex = isActive ? 0 : -1;
|
|
2608
|
-
}
|
|
3161
|
+
applyActiveState(tab);
|
|
3162
|
+
updateVisibleTabs();
|
|
2609
3163
|
}
|
|
3164
|
+
const handleWindowResize = ()=>{
|
|
3165
|
+
updateVisibleTabs();
|
|
3166
|
+
};
|
|
3167
|
+
let resizeObserver = null;
|
|
3168
|
+
if ('undefined' != typeof ResizeObserver) {
|
|
3169
|
+
resizeObserver = new ResizeObserver(()=>{
|
|
3170
|
+
updateVisibleTabs();
|
|
3171
|
+
});
|
|
3172
|
+
resizeObserver.observe(tabList);
|
|
3173
|
+
} else window.addEventListener('resize', handleWindowResize);
|
|
3174
|
+
applyActiveState(activeTab);
|
|
3175
|
+
requestAnimationFrame(()=>{
|
|
3176
|
+
updateVisibleTabs();
|
|
3177
|
+
});
|
|
2610
3178
|
return {
|
|
2611
3179
|
element: tabList,
|
|
2612
3180
|
setActiveTab,
|
|
2613
3181
|
destroy: ()=>{
|
|
3182
|
+
closeOverflowMenu();
|
|
3183
|
+
if (resizeObserver) {
|
|
3184
|
+
resizeObserver.disconnect();
|
|
3185
|
+
resizeObserver = null;
|
|
3186
|
+
} else window.removeEventListener('resize', handleWindowResize);
|
|
2614
3187
|
tabButtons.clear();
|
|
3188
|
+
overflowButtons.clear();
|
|
2615
3189
|
}
|
|
2616
3190
|
};
|
|
2617
3191
|
}
|
|
3192
|
+
function createDebugBundle(payload) {
|
|
3193
|
+
const { namespace, devToolsState, connection, recentEvents, storeState } = payload;
|
|
3194
|
+
const bundle = {
|
|
3195
|
+
generatedAt: new Date().toISOString(),
|
|
3196
|
+
namespace,
|
|
3197
|
+
devToolsState,
|
|
3198
|
+
connection,
|
|
3199
|
+
recentEvents,
|
|
3200
|
+
storeState,
|
|
3201
|
+
overrides: storeState?.overrides ?? null,
|
|
3202
|
+
iab: storeState?.iab ? {
|
|
3203
|
+
tcString: (storeState?.iab).tcString ?? null,
|
|
3204
|
+
purposeCount: Object.keys((storeState?.iab).purposeConsents ?? {}).length,
|
|
3205
|
+
vendorCount: Object.keys((storeState?.iab).vendorConsents ?? {}).length
|
|
3206
|
+
} : null
|
|
3207
|
+
};
|
|
3208
|
+
return JSON.stringify(bundle, null, 2);
|
|
3209
|
+
}
|
|
3210
|
+
function sanitizeStoreState(state) {
|
|
3211
|
+
if (!state) return null;
|
|
3212
|
+
try {
|
|
3213
|
+
return JSON.parse(JSON.stringify(state, (_key, value)=>'function' == typeof value ? void 0 : value));
|
|
3214
|
+
} catch {
|
|
3215
|
+
return {
|
|
3216
|
+
error: 'Unable to serialize store state'
|
|
3217
|
+
};
|
|
3218
|
+
}
|
|
3219
|
+
}
|
|
3220
|
+
function downloadDebugBundle(content) {
|
|
3221
|
+
const blob = new Blob([
|
|
3222
|
+
content
|
|
3223
|
+
], {
|
|
3224
|
+
type: 'application/json'
|
|
3225
|
+
});
|
|
3226
|
+
const url = URL.createObjectURL(blob);
|
|
3227
|
+
const timestamp = new Date().toISOString().replace(/[:.]/g, '-');
|
|
3228
|
+
const anchor = document.createElement('a');
|
|
3229
|
+
anchor.href = url;
|
|
3230
|
+
anchor.download = `c15t-debug-bundle-${timestamp}.json`;
|
|
3231
|
+
anchor.click();
|
|
3232
|
+
URL.revokeObjectURL(url);
|
|
3233
|
+
}
|
|
3234
|
+
const DEVTOOLS_OVERRIDES_STORAGE_KEY = 'c15t-devtools-overrides';
|
|
3235
|
+
function normalizeStringValue(value) {
|
|
3236
|
+
if ('string' != typeof value) return;
|
|
3237
|
+
const normalized = value.trim();
|
|
3238
|
+
return normalized.length > 0 ? normalized : void 0;
|
|
3239
|
+
}
|
|
3240
|
+
function normalizeBooleanValue(value) {
|
|
3241
|
+
return 'boolean' == typeof value ? value : void 0;
|
|
3242
|
+
}
|
|
3243
|
+
function normalizeOverrides(value) {
|
|
3244
|
+
if (!value || 'object' != typeof value) return null;
|
|
3245
|
+
const source = value;
|
|
3246
|
+
const overrides = {
|
|
3247
|
+
country: normalizeStringValue(source.country),
|
|
3248
|
+
region: normalizeStringValue(source.region),
|
|
3249
|
+
language: normalizeStringValue(source.language),
|
|
3250
|
+
gpc: normalizeBooleanValue(source.gpc)
|
|
3251
|
+
};
|
|
3252
|
+
return hasPersistedOverrides(overrides) ? overrides : null;
|
|
3253
|
+
}
|
|
3254
|
+
function hasPersistedOverrides(overrides) {
|
|
3255
|
+
return Boolean(overrides.country || overrides.region || overrides.language || void 0 !== overrides.gpc);
|
|
3256
|
+
}
|
|
3257
|
+
function loadPersistedOverrides(storageKey = DEVTOOLS_OVERRIDES_STORAGE_KEY) {
|
|
3258
|
+
if ('undefined' == typeof window) return null;
|
|
3259
|
+
try {
|
|
3260
|
+
const stored = localStorage.getItem(storageKey);
|
|
3261
|
+
if (!stored) return null;
|
|
3262
|
+
const parsed = JSON.parse(stored);
|
|
3263
|
+
return normalizeOverrides(parsed);
|
|
3264
|
+
} catch {
|
|
3265
|
+
return null;
|
|
3266
|
+
}
|
|
3267
|
+
}
|
|
3268
|
+
function persistOverrides(overrides, storageKey = DEVTOOLS_OVERRIDES_STORAGE_KEY) {
|
|
3269
|
+
if ('undefined' == typeof window) return;
|
|
3270
|
+
try {
|
|
3271
|
+
if (!hasPersistedOverrides(overrides)) return void localStorage.removeItem(storageKey);
|
|
3272
|
+
localStorage.setItem(storageKey, JSON.stringify(overrides));
|
|
3273
|
+
} catch {}
|
|
3274
|
+
}
|
|
3275
|
+
function clearPersistedOverrides(storageKey = DEVTOOLS_OVERRIDES_STORAGE_KEY) {
|
|
3276
|
+
if ('undefined' == typeof window) return;
|
|
3277
|
+
try {
|
|
3278
|
+
localStorage.removeItem(storageKey);
|
|
3279
|
+
} catch {}
|
|
3280
|
+
}
|
|
2618
3281
|
var components_module = __webpack_require__("../../node_modules/.bun/@rsbuild+core@1.6.12/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[1].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[1].use[2]!./src/styles/components.module.css");
|
|
2619
3282
|
var components_module_options = {};
|
|
2620
3283
|
components_module_options.styleTagTransform = styleTagTransform_default();
|
|
@@ -2651,7 +3314,7 @@ function createBadge(options) {
|
|
|
2651
3314
|
info: styles_components_module.badgeInfo,
|
|
2652
3315
|
neutral: styles_components_module.badgeNeutral
|
|
2653
3316
|
}[variant];
|
|
2654
|
-
return
|
|
3317
|
+
return renderer_span({
|
|
2655
3318
|
className: `${styles_components_module.badge} ${variantClass}`,
|
|
2656
3319
|
text
|
|
2657
3320
|
});
|
|
@@ -2682,31 +3345,19 @@ function createButton(options) {
|
|
|
2682
3345
|
btn.appendChild(document.createTextNode(text));
|
|
2683
3346
|
return btn;
|
|
2684
3347
|
}
|
|
2685
|
-
function
|
|
2686
|
-
const {
|
|
2687
|
-
const
|
|
2688
|
-
|
|
2689
|
-
|
|
2690
|
-
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
|
|
2694
|
-
|
|
2695
|
-
|
|
2696
|
-
|
|
2697
|
-
|
|
2698
|
-
]
|
|
2699
|
-
});
|
|
2700
|
-
const actionsContainer = renderer_div({
|
|
2701
|
-
className: styles_components_module.listItemActions,
|
|
2702
|
-
children: actions
|
|
2703
|
-
});
|
|
2704
|
-
return renderer_div({
|
|
2705
|
-
className: styles_components_module.listItem,
|
|
2706
|
-
children: [
|
|
2707
|
-
content,
|
|
2708
|
-
actionsContainer
|
|
2709
|
-
]
|
|
3348
|
+
function createInput(options) {
|
|
3349
|
+
const { value, placeholder, ariaLabel, small = false, onInput } = options;
|
|
3350
|
+
const sizeClass = small ? styles_components_module.inputSmall : '';
|
|
3351
|
+
return input({
|
|
3352
|
+
className: `${styles_components_module.input} ${sizeClass}`.trim(),
|
|
3353
|
+
type: 'text',
|
|
3354
|
+
value,
|
|
3355
|
+
placeholder,
|
|
3356
|
+
ariaLabel,
|
|
3357
|
+
onInput: (event)=>{
|
|
3358
|
+
const target = event.target;
|
|
3359
|
+
onInput?.(target?.value ?? '');
|
|
3360
|
+
}
|
|
2710
3361
|
});
|
|
2711
3362
|
}
|
|
2712
3363
|
function createSection(options) {
|
|
@@ -2714,7 +3365,7 @@ function createSection(options) {
|
|
|
2714
3365
|
const header = renderer_div({
|
|
2715
3366
|
className: styles_components_module.sectionHeader,
|
|
2716
3367
|
children: [
|
|
2717
|
-
|
|
3368
|
+
renderer_span({
|
|
2718
3369
|
className: styles_components_module.sectionTitle,
|
|
2719
3370
|
text: title
|
|
2720
3371
|
}),
|
|
@@ -2734,11 +3385,11 @@ function createInfoRow(options) {
|
|
|
2734
3385
|
return renderer_div({
|
|
2735
3386
|
className: styles_components_module.infoRow,
|
|
2736
3387
|
children: [
|
|
2737
|
-
|
|
3388
|
+
renderer_span({
|
|
2738
3389
|
className: styles_components_module.infoLabel,
|
|
2739
3390
|
text: label
|
|
2740
3391
|
}),
|
|
2741
|
-
|
|
3392
|
+
renderer_span({
|
|
2742
3393
|
className: styles_components_module.infoValue,
|
|
2743
3394
|
text: value
|
|
2744
3395
|
})
|
|
@@ -2758,7 +3409,7 @@ function createEmptyState(options) {
|
|
|
2758
3409
|
}));
|
|
2759
3410
|
children.push(iconWrapper);
|
|
2760
3411
|
}
|
|
2761
|
-
children.push(
|
|
3412
|
+
children.push(renderer_span({
|
|
2762
3413
|
className: styles_components_module.emptyStateText,
|
|
2763
3414
|
text
|
|
2764
3415
|
}));
|
|
@@ -2778,7 +3429,7 @@ function createGrid(options) {
|
|
|
2778
3429
|
function createGridCard(options) {
|
|
2779
3430
|
const { title, action } = options;
|
|
2780
3431
|
const children = [
|
|
2781
|
-
|
|
3432
|
+
renderer_span({
|
|
2782
3433
|
className: styles_components_module.gridCardTitle,
|
|
2783
3434
|
text: title
|
|
2784
3435
|
})
|
|
@@ -2789,6 +3440,18 @@ function createGridCard(options) {
|
|
|
2789
3440
|
children
|
|
2790
3441
|
});
|
|
2791
3442
|
}
|
|
3443
|
+
function createDisconnectedState(message = 'Store not connected') {
|
|
3444
|
+
return renderer_div({
|
|
3445
|
+
className: styles_components_module.disconnectedState,
|
|
3446
|
+
style: {
|
|
3447
|
+
padding: '24px',
|
|
3448
|
+
textAlign: 'center',
|
|
3449
|
+
color: 'var(--c15t-text-muted)',
|
|
3450
|
+
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
3451
|
+
},
|
|
3452
|
+
text: message
|
|
3453
|
+
});
|
|
3454
|
+
}
|
|
2792
3455
|
const REFRESH_ICON = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
2793
3456
|
<path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"></path>
|
|
2794
3457
|
<path d="M21 3v5h-5"></path>
|
|
@@ -2817,18 +3480,10 @@ const TERMINAL_ICON = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 2
|
|
|
2817
3480
|
<line x1="12" y1="19" x2="20" y2="19"></line>
|
|
2818
3481
|
</svg>`;
|
|
2819
3482
|
function renderActionsPanel(container, options) {
|
|
2820
|
-
const { getState, onResetConsents, onRefetchBanner, onShowBanner, onOpenPreferences, onCopyState } = options;
|
|
3483
|
+
const { getState, onResetConsents, onRefetchBanner, onShowBanner, onOpenPreferences, onCopyState, onExportDebugBundle } = options;
|
|
2821
3484
|
clearElement(container);
|
|
2822
3485
|
const state = getState();
|
|
2823
|
-
if (!state) return void container.appendChild(
|
|
2824
|
-
style: {
|
|
2825
|
-
padding: '24px',
|
|
2826
|
-
textAlign: 'center',
|
|
2827
|
-
color: 'var(--c15t-text-muted)',
|
|
2828
|
-
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
2829
|
-
},
|
|
2830
|
-
text: 'Store not connected'
|
|
2831
|
-
}));
|
|
3486
|
+
if (!state) return void container.appendChild(createDisconnectedState());
|
|
2832
3487
|
const actionCards = [
|
|
2833
3488
|
createActionCard({
|
|
2834
3489
|
icon: actions_EYE_ICON,
|
|
@@ -2849,6 +3504,12 @@ function renderActionsPanel(container, options) {
|
|
|
2849
3504
|
icon: COPY_ICON,
|
|
2850
3505
|
label: 'Copy State',
|
|
2851
3506
|
onClick: onCopyState
|
|
3507
|
+
}),
|
|
3508
|
+
createActionCard({
|
|
3509
|
+
icon: REFRESH_ICON,
|
|
3510
|
+
label: 'Export Debug',
|
|
3511
|
+
onClick: ()=>onExportDebugBundle?.(),
|
|
3512
|
+
disabled: !onExportDebugBundle
|
|
2852
3513
|
})
|
|
2853
3514
|
];
|
|
2854
3515
|
const grid = createGrid({
|
|
@@ -2886,7 +3547,7 @@ function renderActionsPanel(container, options) {
|
|
|
2886
3547
|
},
|
|
2887
3548
|
children: [
|
|
2888
3549
|
createIconWrapper(TERMINAL_ICON, 14),
|
|
2889
|
-
|
|
3550
|
+
renderer_span({
|
|
2890
3551
|
style: {
|
|
2891
3552
|
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
2892
3553
|
fontWeight: '600',
|
|
@@ -2909,10 +3570,10 @@ function renderActionsPanel(container, options) {
|
|
|
2909
3570
|
color: 'var(--c15t-text-muted)'
|
|
2910
3571
|
},
|
|
2911
3572
|
children: [
|
|
2912
|
-
|
|
3573
|
+
renderer_span({
|
|
2913
3574
|
text: `window.${getNamespace(state)}.getState()`
|
|
2914
3575
|
}),
|
|
2915
|
-
|
|
3576
|
+
renderer_span({
|
|
2916
3577
|
text: 'window.__c15tDevTools.open()'
|
|
2917
3578
|
})
|
|
2918
3579
|
]
|
|
@@ -2922,7 +3583,7 @@ function renderActionsPanel(container, options) {
|
|
|
2922
3583
|
container.appendChild(consoleSection);
|
|
2923
3584
|
}
|
|
2924
3585
|
function createActionCard(options) {
|
|
2925
|
-
const { icon, label, onClick } = options;
|
|
3586
|
+
const { icon, label, onClick, disabled = false } = options;
|
|
2926
3587
|
const card = renderer_div({
|
|
2927
3588
|
className: styles_components_module.gridCard ?? '',
|
|
2928
3589
|
style: {
|
|
@@ -2933,11 +3594,12 @@ function createActionCard(options) {
|
|
|
2933
3594
|
gap: '6px',
|
|
2934
3595
|
padding: '16px 8px',
|
|
2935
3596
|
cursor: 'pointer',
|
|
2936
|
-
transition: 'background-color var(--c15t-duration-fast) var(--c15t-easing)'
|
|
3597
|
+
transition: 'background-color var(--c15t-duration-fast) var(--c15t-easing)',
|
|
3598
|
+
opacity: disabled ? '0.55' : '1'
|
|
2937
3599
|
},
|
|
2938
3600
|
children: [
|
|
2939
3601
|
createIconWrapper(icon, 20),
|
|
2940
|
-
|
|
3602
|
+
renderer_span({
|
|
2941
3603
|
style: {
|
|
2942
3604
|
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
2943
3605
|
fontWeight: '500',
|
|
@@ -2948,13 +3610,15 @@ function createActionCard(options) {
|
|
|
2948
3610
|
})
|
|
2949
3611
|
]
|
|
2950
3612
|
});
|
|
2951
|
-
|
|
2952
|
-
|
|
2953
|
-
card.
|
|
2954
|
-
|
|
2955
|
-
|
|
2956
|
-
card.
|
|
2957
|
-
|
|
3613
|
+
if (!disabled) {
|
|
3614
|
+
card.addEventListener('click', onClick);
|
|
3615
|
+
card.addEventListener('mouseenter', ()=>{
|
|
3616
|
+
card.style.backgroundColor = 'var(--c15t-surface-hover)';
|
|
3617
|
+
});
|
|
3618
|
+
card.addEventListener('mouseleave', ()=>{
|
|
3619
|
+
card.style.backgroundColor = '';
|
|
3620
|
+
});
|
|
3621
|
+
}
|
|
2958
3622
|
return card;
|
|
2959
3623
|
}
|
|
2960
3624
|
function createIconWrapper(icon, size) {
|
|
@@ -2975,19 +3639,12 @@ function createIconWrapper(icon, size) {
|
|
|
2975
3639
|
function getNamespace(state) {
|
|
2976
3640
|
return state.config?.meta?.namespace || 'c15tStore';
|
|
2977
3641
|
}
|
|
3642
|
+
const consentSearchByContainer = new WeakMap();
|
|
2978
3643
|
function renderConsentsPanel(container, options) {
|
|
2979
3644
|
const { getState, onConsentChange, onSave, onAcceptAll, onRejectAll, onReset } = options;
|
|
2980
3645
|
clearElement(container);
|
|
2981
3646
|
const state = getState();
|
|
2982
|
-
if (!state) return void container.appendChild(
|
|
2983
|
-
style: {
|
|
2984
|
-
padding: '24px',
|
|
2985
|
-
textAlign: 'center',
|
|
2986
|
-
color: 'var(--c15t-text-muted)',
|
|
2987
|
-
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
2988
|
-
},
|
|
2989
|
-
text: 'Store not connected'
|
|
2990
|
-
}));
|
|
3647
|
+
if (!state) return void container.appendChild(createDisconnectedState());
|
|
2991
3648
|
const isIabMode = 'iab' === state.model;
|
|
2992
3649
|
const savedConsents = state.consents || {};
|
|
2993
3650
|
const selectedConsents = state.selectedConsents || {};
|
|
@@ -3001,15 +3658,40 @@ function renderConsentsPanel(container, options) {
|
|
|
3001
3658
|
ct.name,
|
|
3002
3659
|
ct
|
|
3003
3660
|
]));
|
|
3661
|
+
const searchQuery = consentSearchByContainer.get(container) ?? '';
|
|
3004
3662
|
const consentEntries = Object.entries(displayConsents);
|
|
3005
|
-
|
|
3663
|
+
const filteredConsentEntries = consentEntries.filter(([name])=>{
|
|
3664
|
+
if (!searchQuery) return true;
|
|
3665
|
+
const consentType = consentTypeMap.get(name);
|
|
3666
|
+
const displayName = consentType?.name || name;
|
|
3667
|
+
return `${name} ${displayName}`.toLowerCase().includes(searchQuery);
|
|
3668
|
+
});
|
|
3669
|
+
const showSearchInput = consentEntries.length > 4;
|
|
3670
|
+
if (showSearchInput) container.appendChild(renderer_div({
|
|
3671
|
+
style: {
|
|
3672
|
+
padding: '8px 0 10px'
|
|
3673
|
+
},
|
|
3674
|
+
children: [
|
|
3675
|
+
createInput({
|
|
3676
|
+
value: searchQuery,
|
|
3677
|
+
placeholder: 'Filter consents…',
|
|
3678
|
+
ariaLabel: 'Filter consents',
|
|
3679
|
+
small: true,
|
|
3680
|
+
onInput: (value)=>{
|
|
3681
|
+
consentSearchByContainer.set(container, value.trim().toLowerCase());
|
|
3682
|
+
renderConsentsPanel(container, options);
|
|
3683
|
+
}
|
|
3684
|
+
})
|
|
3685
|
+
]
|
|
3686
|
+
}));
|
|
3687
|
+
if (0 === filteredConsentEntries.length) container.appendChild(renderer_div({
|
|
3006
3688
|
style: {
|
|
3007
3689
|
padding: '24px',
|
|
3008
3690
|
textAlign: 'center',
|
|
3009
3691
|
color: 'var(--c15t-devtools-text-muted)',
|
|
3010
3692
|
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
3011
3693
|
},
|
|
3012
|
-
text: 'No consents configured'
|
|
3694
|
+
text: 0 === consentEntries.length ? 'No consents configured' : 'No matching consents'
|
|
3013
3695
|
}));
|
|
3014
3696
|
else {
|
|
3015
3697
|
if (isIabMode) {
|
|
@@ -3027,7 +3709,7 @@ function renderConsentsPanel(container, options) {
|
|
|
3027
3709
|
container.appendChild(iabNotice);
|
|
3028
3710
|
}
|
|
3029
3711
|
const gridCards = [];
|
|
3030
|
-
for (const [name, value] of
|
|
3712
|
+
for (const [name, value] of filteredConsentEntries){
|
|
3031
3713
|
const consentType = consentTypeMap.get(name);
|
|
3032
3714
|
const isNecessary = 'necessary' === name;
|
|
3033
3715
|
const displayName = consentType?.name || name;
|
|
@@ -3117,7 +3799,7 @@ function renderConsentsPanel(container, options) {
|
|
|
3117
3799
|
gap: '8px'
|
|
3118
3800
|
},
|
|
3119
3801
|
children: [
|
|
3120
|
-
|
|
3802
|
+
renderer_span({
|
|
3121
3803
|
style: {
|
|
3122
3804
|
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
3123
3805
|
color: 'var(--c15t-devtools-badge-warning)'
|
|
@@ -3131,7 +3813,7 @@ function renderConsentsPanel(container, options) {
|
|
|
3131
3813
|
onClick: onSave
|
|
3132
3814
|
})
|
|
3133
3815
|
]
|
|
3134
|
-
}) :
|
|
3816
|
+
}) : renderer_span({
|
|
3135
3817
|
style: {
|
|
3136
3818
|
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
3137
3819
|
color: 'var(--c15t-text-muted)'
|
|
@@ -3145,15 +3827,26 @@ function renderConsentsPanel(container, options) {
|
|
|
3145
3827
|
function formatConsentName(name) {
|
|
3146
3828
|
return name.replace(/_/g, ' ').replace(/\b\w/g, (l)=>l.toUpperCase());
|
|
3147
3829
|
}
|
|
3148
|
-
|
|
3149
|
-
|
|
3830
|
+
const panelStateByContainer = new WeakMap();
|
|
3831
|
+
function getPanelState(container) {
|
|
3832
|
+
const existing = panelStateByContainer.get(container);
|
|
3833
|
+
if (existing) return existing;
|
|
3834
|
+
const initialState = {
|
|
3835
|
+
activeFilter: 'all',
|
|
3836
|
+
selectedEventId: null,
|
|
3837
|
+
searchQuery: ''
|
|
3838
|
+
};
|
|
3839
|
+
panelStateByContainer.set(container, initialState);
|
|
3840
|
+
return initialState;
|
|
3841
|
+
}
|
|
3150
3842
|
function renderEventsPanel(container, options) {
|
|
3151
3843
|
const { getEvents, onClear } = options;
|
|
3844
|
+
const panelState = getPanelState(container);
|
|
3152
3845
|
clearElement(container);
|
|
3153
3846
|
const allEvents = getEvents();
|
|
3154
|
-
const events = allEvents.filter((event)=>matchesFilter(event, activeFilter));
|
|
3155
|
-
if (!events.some((event)=>event.id === selectedEventId)) selectedEventId = events[0]?.id ?? null;
|
|
3156
|
-
const selectedEvent = events.find((event)=>event.id === selectedEventId) ?? null;
|
|
3847
|
+
const events = allEvents.filter((event)=>matchesFilter(event, panelState.activeFilter)).filter((event)=>matchesSearch(event, panelState.searchQuery));
|
|
3848
|
+
if (!events.some((event)=>event.id === panelState.selectedEventId)) panelState.selectedEventId = events[0]?.id ?? null;
|
|
3849
|
+
const selectedEvent = events.find((event)=>event.id === panelState.selectedEventId) ?? null;
|
|
3157
3850
|
const header = renderer_div({
|
|
3158
3851
|
style: {
|
|
3159
3852
|
display: 'flex',
|
|
@@ -3163,7 +3856,7 @@ function renderEventsPanel(container, options) {
|
|
|
3163
3856
|
gap: '8px'
|
|
3164
3857
|
},
|
|
3165
3858
|
children: [
|
|
3166
|
-
|
|
3859
|
+
renderer_span({
|
|
3167
3860
|
style: {
|
|
3168
3861
|
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
3169
3862
|
fontWeight: '600',
|
|
@@ -3189,7 +3882,7 @@ function renderEventsPanel(container, options) {
|
|
|
3189
3882
|
small: true,
|
|
3190
3883
|
onClick: ()=>{
|
|
3191
3884
|
onClear();
|
|
3192
|
-
selectedEventId = null;
|
|
3885
|
+
panelState.selectedEventId = null;
|
|
3193
3886
|
renderEventsPanel(container, options);
|
|
3194
3887
|
}
|
|
3195
3888
|
})
|
|
@@ -3205,12 +3898,30 @@ function renderEventsPanel(container, options) {
|
|
|
3205
3898
|
gap: '6px',
|
|
3206
3899
|
padding: '0 16px 8px'
|
|
3207
3900
|
},
|
|
3208
|
-
children: EVENT_FILTERS.map((filter)=>createFilterButton(filter, filter === activeFilter, ()=>{
|
|
3209
|
-
activeFilter = filter;
|
|
3210
|
-
selectedEventId = null;
|
|
3901
|
+
children: EVENT_FILTERS.map((filter)=>createFilterButton(filter, filter === panelState.activeFilter, ()=>{
|
|
3902
|
+
panelState.activeFilter = filter;
|
|
3903
|
+
panelState.selectedEventId = null;
|
|
3211
3904
|
renderEventsPanel(container, options);
|
|
3212
3905
|
}))
|
|
3213
3906
|
}));
|
|
3907
|
+
container.appendChild(renderer_div({
|
|
3908
|
+
style: {
|
|
3909
|
+
padding: '0 16px 8px'
|
|
3910
|
+
},
|
|
3911
|
+
children: [
|
|
3912
|
+
createInput({
|
|
3913
|
+
value: panelState.searchQuery,
|
|
3914
|
+
placeholder: 'Search events…',
|
|
3915
|
+
ariaLabel: 'Search events',
|
|
3916
|
+
small: true,
|
|
3917
|
+
onInput: (value)=>{
|
|
3918
|
+
panelState.searchQuery = value.trim().toLowerCase();
|
|
3919
|
+
panelState.selectedEventId = null;
|
|
3920
|
+
renderEventsPanel(container, options);
|
|
3921
|
+
}
|
|
3922
|
+
})
|
|
3923
|
+
]
|
|
3924
|
+
}));
|
|
3214
3925
|
const eventList = renderer_div({
|
|
3215
3926
|
style: {
|
|
3216
3927
|
display: 'flex',
|
|
@@ -3230,8 +3941,8 @@ function renderEventsPanel(container, options) {
|
|
|
3230
3941
|
},
|
|
3231
3942
|
text: 'No events match this filter'
|
|
3232
3943
|
}));
|
|
3233
|
-
else for (const event of events)eventList.appendChild(createEventItem(event, event.id === selectedEventId, ()=>{
|
|
3234
|
-
selectedEventId = event.id;
|
|
3944
|
+
else for (const event of events)eventList.appendChild(createEventItem(event, event.id === panelState.selectedEventId, ()=>{
|
|
3945
|
+
panelState.selectedEventId = event.id;
|
|
3235
3946
|
renderEventsPanel(container, options);
|
|
3236
3947
|
}));
|
|
3237
3948
|
container.appendChild(eventList);
|
|
@@ -3259,6 +3970,11 @@ function matchesFilter(event, filter) {
|
|
|
3259
3970
|
if ('network' === filter) return 'network' === event.type;
|
|
3260
3971
|
return 'iab' === event.type;
|
|
3261
3972
|
}
|
|
3973
|
+
function matchesSearch(event, query) {
|
|
3974
|
+
if (!query) return true;
|
|
3975
|
+
const haystack = `${event.type} ${event.message} ${JSON.stringify(event.data ?? {})}`;
|
|
3976
|
+
return haystack.toLowerCase().includes(query);
|
|
3977
|
+
}
|
|
3262
3978
|
function createPayloadSection(event) {
|
|
3263
3979
|
const payload = event?.data ? JSON.stringify(event.data, null, 2) : null;
|
|
3264
3980
|
return renderer_div({
|
|
@@ -3311,7 +4027,7 @@ function createEventItem(event, selected, onSelect) {
|
|
|
3311
4027
|
},
|
|
3312
4028
|
onClick: onSelect,
|
|
3313
4029
|
children: [
|
|
3314
|
-
|
|
4030
|
+
renderer_span({
|
|
3315
4031
|
style: {
|
|
3316
4032
|
color,
|
|
3317
4033
|
fontSize: '8px',
|
|
@@ -3319,7 +4035,7 @@ function createEventItem(event, selected, onSelect) {
|
|
|
3319
4035
|
},
|
|
3320
4036
|
text: icon
|
|
3321
4037
|
}),
|
|
3322
|
-
|
|
4038
|
+
renderer_span({
|
|
3323
4039
|
style: {
|
|
3324
4040
|
color: 'var(--c15t-text-muted)',
|
|
3325
4041
|
fontFamily: 'monospace',
|
|
@@ -3328,7 +4044,7 @@ function createEventItem(event, selected, onSelect) {
|
|
|
3328
4044
|
},
|
|
3329
4045
|
text: time
|
|
3330
4046
|
}),
|
|
3331
|
-
|
|
4047
|
+
renderer_span({
|
|
3332
4048
|
style: {
|
|
3333
4049
|
color: 'var(--c15t-text)',
|
|
3334
4050
|
flex: '1'
|
|
@@ -3396,38 +4112,15 @@ function getEventColor(type) {
|
|
|
3396
4112
|
return 'var(--c15t-text-muted)';
|
|
3397
4113
|
}
|
|
3398
4114
|
}
|
|
4115
|
+
const iabSearchByContainer = new WeakMap();
|
|
3399
4116
|
function renderIabPanel(container, options) {
|
|
3400
4117
|
const { getState, onSetPurposeConsent, onSetVendorConsent, onSetSpecialFeatureOptIn, onAcceptAll, onRejectAll, onSave, onReset } = options;
|
|
3401
4118
|
clearElement(container);
|
|
3402
4119
|
const state = getState();
|
|
3403
|
-
if (!state) return void container.appendChild(
|
|
3404
|
-
|
|
3405
|
-
padding: '24px',
|
|
3406
|
-
textAlign: 'center',
|
|
3407
|
-
color: 'var(--c15t-text-muted)',
|
|
3408
|
-
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
3409
|
-
},
|
|
3410
|
-
text: 'Store not connected'
|
|
3411
|
-
}));
|
|
3412
|
-
if ('iab' !== state.model) return void container.appendChild(renderer_div({
|
|
3413
|
-
style: {
|
|
3414
|
-
padding: '24px',
|
|
3415
|
-
textAlign: 'center',
|
|
3416
|
-
color: 'var(--c15t-text-muted)',
|
|
3417
|
-
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
3418
|
-
},
|
|
3419
|
-
text: 'IAB TCF mode is not configured'
|
|
3420
|
-
}));
|
|
4120
|
+
if (!state) return void container.appendChild(createDisconnectedState());
|
|
4121
|
+
if ('iab' !== state.model) return void container.appendChild(createDisconnectedState('IAB TCF mode is not configured'));
|
|
3421
4122
|
const iabState = state.iab;
|
|
3422
|
-
if (!iabState) return void container.appendChild(
|
|
3423
|
-
style: {
|
|
3424
|
-
padding: '24px',
|
|
3425
|
-
textAlign: 'center',
|
|
3426
|
-
color: 'var(--c15t-text-muted)',
|
|
3427
|
-
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
3428
|
-
},
|
|
3429
|
-
text: 'IAB state not available'
|
|
3430
|
-
}));
|
|
4123
|
+
if (!iabState) return void container.appendChild(createDisconnectedState('IAB state not available'));
|
|
3431
4124
|
const tcString = iabState.tcString;
|
|
3432
4125
|
const tcStringSection = createSection({
|
|
3433
4126
|
title: 'TC String',
|
|
@@ -3459,9 +4152,30 @@ function renderIabPanel(container, options) {
|
|
|
3459
4152
|
});
|
|
3460
4153
|
container.appendChild(tcStringSection);
|
|
3461
4154
|
const gvl = iabState.gvl;
|
|
4155
|
+
const searchQuery = iabSearchByContainer.get(container) ?? '';
|
|
4156
|
+
container.appendChild(createSection({
|
|
4157
|
+
title: 'Filter',
|
|
4158
|
+
children: [
|
|
4159
|
+
createInput({
|
|
4160
|
+
value: searchQuery,
|
|
4161
|
+
placeholder: 'Filter purposes or vendors…',
|
|
4162
|
+
ariaLabel: 'Filter IAB purposes and vendors',
|
|
4163
|
+
small: true,
|
|
4164
|
+
onInput: (value)=>{
|
|
4165
|
+
iabSearchByContainer.set(container, value.trim().toLowerCase());
|
|
4166
|
+
renderIabPanel(container, options);
|
|
4167
|
+
}
|
|
4168
|
+
})
|
|
4169
|
+
]
|
|
4170
|
+
}));
|
|
3462
4171
|
const purposeConsents = iabState.purposeConsents || {};
|
|
3463
4172
|
const purposes = gvl?.purposes || {};
|
|
3464
|
-
const purposeEntries = Object.entries(purposeConsents)
|
|
4173
|
+
const purposeEntries = Object.entries(purposeConsents).filter(([purposeId])=>{
|
|
4174
|
+
if (!searchQuery) return true;
|
|
4175
|
+
const purposeInfo = purposes[purposeId];
|
|
4176
|
+
const purposeName = purposeInfo?.name || `Purpose ${purposeId}`;
|
|
4177
|
+
return `${purposeId} ${purposeName}`.toLowerCase().includes(searchQuery);
|
|
4178
|
+
});
|
|
3465
4179
|
if (purposeEntries.length > 0) {
|
|
3466
4180
|
const purposeList = renderer_div({
|
|
3467
4181
|
style: {
|
|
@@ -3489,7 +4203,12 @@ function renderIabPanel(container, options) {
|
|
|
3489
4203
|
}
|
|
3490
4204
|
const specialFeatureOptIns = iabState.specialFeatureOptIns || {};
|
|
3491
4205
|
const specialFeatures = gvl?.specialFeatures || {};
|
|
3492
|
-
const specialFeatureEntries = Object.entries(specialFeatureOptIns)
|
|
4206
|
+
const specialFeatureEntries = Object.entries(specialFeatureOptIns).filter(([featureId])=>{
|
|
4207
|
+
if (!searchQuery) return true;
|
|
4208
|
+
const featureInfo = specialFeatures[featureId];
|
|
4209
|
+
const featureName = featureInfo?.name || `Special Feature ${featureId}`;
|
|
4210
|
+
return `${featureId} ${featureName}`.toLowerCase().includes(searchQuery);
|
|
4211
|
+
});
|
|
3493
4212
|
if (specialFeatureEntries.length > 0) {
|
|
3494
4213
|
const specialFeatureList = renderer_div({
|
|
3495
4214
|
style: {
|
|
@@ -3517,7 +4236,12 @@ function renderIabPanel(container, options) {
|
|
|
3517
4236
|
}
|
|
3518
4237
|
const vendorConsents = iabState.vendorConsents || {};
|
|
3519
4238
|
const vendors = gvl?.vendors || {};
|
|
3520
|
-
const vendorEntries = Object.entries(vendorConsents)
|
|
4239
|
+
const vendorEntries = Object.entries(vendorConsents).filter(([vendorId])=>{
|
|
4240
|
+
if (!searchQuery) return true;
|
|
4241
|
+
const vendorInfo = vendors[vendorId];
|
|
4242
|
+
const vendorName = vendorInfo?.name || `Vendor ${vendorId}`;
|
|
4243
|
+
return `${vendorId} ${vendorName}`.toLowerCase().includes(searchQuery);
|
|
4244
|
+
});
|
|
3521
4245
|
const iabVendors = [];
|
|
3522
4246
|
const customVendors = [];
|
|
3523
4247
|
for (const [vendorId, consent] of vendorEntries){
|
|
@@ -3643,7 +4367,7 @@ function createPurposeRow(id, name, consent, onChange, ariaKind = 'purpose') {
|
|
|
3643
4367
|
borderBottom: '1px solid var(--c15t-border)'
|
|
3644
4368
|
},
|
|
3645
4369
|
children: [
|
|
3646
|
-
|
|
4370
|
+
renderer_span({
|
|
3647
4371
|
style: {
|
|
3648
4372
|
color: 'var(--c15t-text)',
|
|
3649
4373
|
overflow: 'hidden',
|
|
@@ -3697,7 +4421,7 @@ function createVendorRow(id, name, consent, type, onChange) {
|
|
|
3697
4421
|
marginRight: '8px'
|
|
3698
4422
|
},
|
|
3699
4423
|
children: [
|
|
3700
|
-
'custom' === type ?
|
|
4424
|
+
'custom' === type ? renderer_span({
|
|
3701
4425
|
style: {
|
|
3702
4426
|
fontSize: '9px',
|
|
3703
4427
|
padding: '1px 4px',
|
|
@@ -3708,7 +4432,7 @@ function createVendorRow(id, name, consent, type, onChange) {
|
|
|
3708
4432
|
},
|
|
3709
4433
|
text: 'CUSTOM'
|
|
3710
4434
|
}) : null,
|
|
3711
|
-
|
|
4435
|
+
renderer_span({
|
|
3712
4436
|
style: {
|
|
3713
4437
|
color: 'var(--c15t-text)',
|
|
3714
4438
|
overflow: 'hidden',
|
|
@@ -3740,15 +4464,7 @@ function renderLocationPanel(container, options) {
|
|
|
3740
4464
|
const { getState, onApplyOverrides, onClearOverrides } = options;
|
|
3741
4465
|
clearElement(container);
|
|
3742
4466
|
const state = getState();
|
|
3743
|
-
if (!state) return void container.appendChild(
|
|
3744
|
-
style: {
|
|
3745
|
-
padding: '24px',
|
|
3746
|
-
textAlign: 'center',
|
|
3747
|
-
color: 'var(--c15t-text-muted)',
|
|
3748
|
-
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
3749
|
-
},
|
|
3750
|
-
text: 'Store not connected'
|
|
3751
|
-
}));
|
|
4467
|
+
if (!state) return void container.appendChild(createDisconnectedState());
|
|
3752
4468
|
const locationInfo = state.locationInfo;
|
|
3753
4469
|
const overrides = state.overrides;
|
|
3754
4470
|
const translationConfig = state.translationConfig;
|
|
@@ -3788,7 +4504,7 @@ function renderLocationPanel(container, options) {
|
|
|
3788
4504
|
selectOptions: GPC_OPTIONS,
|
|
3789
4505
|
value: initialDraft.gpc
|
|
3790
4506
|
});
|
|
3791
|
-
const formStatus =
|
|
4507
|
+
const formStatus = renderer_span({
|
|
3792
4508
|
className: styles_components_module.overrideStatus,
|
|
3793
4509
|
text: 'In sync'
|
|
3794
4510
|
});
|
|
@@ -3834,7 +4550,7 @@ function renderLocationPanel(container, options) {
|
|
|
3834
4550
|
title: 'Override Settings',
|
|
3835
4551
|
children: [
|
|
3836
4552
|
overrideFieldsGrid,
|
|
3837
|
-
|
|
4553
|
+
renderer_span({
|
|
3838
4554
|
className: styles_components_module.overrideHint,
|
|
3839
4555
|
text: 'GPC override only affects opt-out or unregulated jurisdictions.'
|
|
3840
4556
|
}),
|
|
@@ -3922,7 +4638,7 @@ function createOverrideInput(options) {
|
|
|
3922
4638
|
element: renderer_div({
|
|
3923
4639
|
className: styles_components_module.overrideField,
|
|
3924
4640
|
children: [
|
|
3925
|
-
|
|
4641
|
+
renderer_span({
|
|
3926
4642
|
className: styles_components_module.overrideLabel,
|
|
3927
4643
|
text: label
|
|
3928
4644
|
}),
|
|
@@ -3943,7 +4659,7 @@ function createOverrideSelect(options) {
|
|
|
3943
4659
|
element: renderer_div({
|
|
3944
4660
|
className: styles_components_module.overrideField,
|
|
3945
4661
|
children: [
|
|
3946
|
-
|
|
4662
|
+
renderer_span({
|
|
3947
4663
|
className: styles_components_module.overrideLabel,
|
|
3948
4664
|
text: label
|
|
3949
4665
|
}),
|
|
@@ -4154,14 +4870,14 @@ function createCompactInfoCard(label, value) {
|
|
|
4154
4870
|
gap: '1px'
|
|
4155
4871
|
},
|
|
4156
4872
|
children: [
|
|
4157
|
-
|
|
4873
|
+
renderer_span({
|
|
4158
4874
|
style: {
|
|
4159
4875
|
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
4160
4876
|
color: 'var(--c15t-text-muted)'
|
|
4161
4877
|
},
|
|
4162
4878
|
text: label
|
|
4163
4879
|
}),
|
|
4164
|
-
|
|
4880
|
+
renderer_span({
|
|
4165
4881
|
style: {
|
|
4166
4882
|
fontSize: 'var(--c15t-font-size-sm)',
|
|
4167
4883
|
fontWeight: '500',
|
|
@@ -4337,21 +5053,21 @@ function createResourceRow(resource, variant, onDismiss) {
|
|
|
4337
5053
|
borderBottom: '1px solid var(--c15t-border)'
|
|
4338
5054
|
},
|
|
4339
5055
|
children: [
|
|
4340
|
-
|
|
5056
|
+
renderer_span({
|
|
4341
5057
|
style: {
|
|
4342
5058
|
color: iconColor,
|
|
4343
5059
|
flexShrink: '0'
|
|
4344
5060
|
},
|
|
4345
5061
|
text: icon
|
|
4346
5062
|
}),
|
|
4347
|
-
|
|
5063
|
+
renderer_span({
|
|
4348
5064
|
style: {
|
|
4349
5065
|
color: 'var(--c15t-text-muted)',
|
|
4350
5066
|
flexShrink: '0'
|
|
4351
5067
|
},
|
|
4352
5068
|
text: `${resource.type}:`
|
|
4353
5069
|
}),
|
|
4354
|
-
|
|
5070
|
+
renderer_span({
|
|
4355
5071
|
style: {
|
|
4356
5072
|
fontWeight: '500',
|
|
4357
5073
|
color: 'var(--c15t-text)',
|
|
@@ -4397,23 +5113,37 @@ const CODE_ICON = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" f
|
|
|
4397
5113
|
<polyline points="16 18 22 12 16 6"></polyline>
|
|
4398
5114
|
<polyline points="8 6 2 12 8 18"></polyline>
|
|
4399
5115
|
</svg>`;
|
|
5116
|
+
const scriptsSearchByContainer = new WeakMap();
|
|
4400
5117
|
function renderScriptsPanel(container, options) {
|
|
4401
5118
|
const { getState, getEvents } = options;
|
|
4402
5119
|
clearElement(container);
|
|
4403
5120
|
const state = getState();
|
|
4404
|
-
if (!state) return void container.appendChild(
|
|
4405
|
-
style: {
|
|
4406
|
-
padding: '24px',
|
|
4407
|
-
textAlign: 'center',
|
|
4408
|
-
color: 'var(--c15t-text-muted)',
|
|
4409
|
-
fontSize: 'var(--c15t-devtools-font-size-sm)'
|
|
4410
|
-
},
|
|
4411
|
-
text: 'Store not connected'
|
|
4412
|
-
}));
|
|
5121
|
+
if (!state) return void container.appendChild(createDisconnectedState());
|
|
4413
5122
|
const scripts = state.scripts || [];
|
|
4414
5123
|
const loadedScripts = state.loadedScripts || {};
|
|
4415
5124
|
const networkBlocker = state.networkBlocker;
|
|
4416
5125
|
const events = getEvents?.() ?? [];
|
|
5126
|
+
const searchQuery = scriptsSearchByContainer.get(container) ?? '';
|
|
5127
|
+
const filteredScripts = scripts.filter((script)=>{
|
|
5128
|
+
if (!searchQuery) return true;
|
|
5129
|
+
const category = 'string' == typeof script.category ? script.category : JSON.stringify(script.category);
|
|
5130
|
+
return `${script.id} ${category}`.toLowerCase().includes(searchQuery);
|
|
5131
|
+
});
|
|
5132
|
+
if (scripts.length > 4) container.appendChild(createSection({
|
|
5133
|
+
title: 'Filter',
|
|
5134
|
+
children: [
|
|
5135
|
+
createInput({
|
|
5136
|
+
value: searchQuery,
|
|
5137
|
+
placeholder: "Filter scripts…",
|
|
5138
|
+
ariaLabel: "Filter scripts",
|
|
5139
|
+
small: true,
|
|
5140
|
+
onInput: (value)=>{
|
|
5141
|
+
scriptsSearchByContainer.set(container, value.trim().toLowerCase());
|
|
5142
|
+
renderScriptsPanel(container, options);
|
|
5143
|
+
}
|
|
5144
|
+
})
|
|
5145
|
+
]
|
|
5146
|
+
}));
|
|
4417
5147
|
if (0 === scripts.length) {
|
|
4418
5148
|
const scriptsSection = createSection({
|
|
4419
5149
|
title: 'Configured Scripts',
|
|
@@ -4430,10 +5160,19 @@ function renderScriptsPanel(container, options) {
|
|
|
4430
5160
|
style: {
|
|
4431
5161
|
display: 'flex',
|
|
4432
5162
|
flexDirection: 'column',
|
|
4433
|
-
|
|
5163
|
+
borderTop: '1px solid var(--c15t-border)',
|
|
5164
|
+
borderBottom: '1px solid var(--c15t-border)'
|
|
4434
5165
|
}
|
|
4435
5166
|
});
|
|
4436
|
-
|
|
5167
|
+
if (0 === filteredScripts.length) scriptsList.appendChild(renderer_div({
|
|
5168
|
+
style: {
|
|
5169
|
+
padding: '10px 0',
|
|
5170
|
+
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
5171
|
+
color: 'var(--c15t-text-muted)'
|
|
5172
|
+
},
|
|
5173
|
+
text: "No matching scripts"
|
|
5174
|
+
}));
|
|
5175
|
+
for (const script of filteredScripts){
|
|
4437
5176
|
const scriptId = script.id;
|
|
4438
5177
|
const isLoaded = true === loadedScripts[scriptId];
|
|
4439
5178
|
const category = script.category;
|
|
@@ -4457,21 +5196,68 @@ function renderScriptsPanel(container, options) {
|
|
|
4457
5196
|
text: status.charAt(0).toUpperCase() + status.slice(1),
|
|
4458
5197
|
variant: statusVariant
|
|
4459
5198
|
});
|
|
4460
|
-
const
|
|
4461
|
-
|
|
4462
|
-
|
|
4463
|
-
|
|
4464
|
-
|
|
4465
|
-
|
|
4466
|
-
|
|
4467
|
-
|
|
4468
|
-
|
|
4469
|
-
|
|
4470
|
-
|
|
4471
|
-
|
|
4472
|
-
|
|
4473
|
-
|
|
4474
|
-
|
|
5199
|
+
const row = renderer_div({
|
|
5200
|
+
style: {
|
|
5201
|
+
display: 'flex',
|
|
5202
|
+
alignItems: 'center',
|
|
5203
|
+
justifyContent: 'space-between',
|
|
5204
|
+
gap: '8px',
|
|
5205
|
+
padding: '8px 0',
|
|
5206
|
+
borderBottom: '1px solid var(--c15t-border)'
|
|
5207
|
+
},
|
|
5208
|
+
children: [
|
|
5209
|
+
renderer_div({
|
|
5210
|
+
style: {
|
|
5211
|
+
display: 'flex',
|
|
5212
|
+
flexDirection: 'column',
|
|
5213
|
+
gap: '2px',
|
|
5214
|
+
minWidth: '0',
|
|
5215
|
+
flex: '1'
|
|
5216
|
+
},
|
|
5217
|
+
children: [
|
|
5218
|
+
renderer_div({
|
|
5219
|
+
style: {
|
|
5220
|
+
fontSize: 'var(--c15t-font-size-sm)',
|
|
5221
|
+
fontWeight: '500',
|
|
5222
|
+
color: 'var(--c15t-text)',
|
|
5223
|
+
overflow: 'hidden',
|
|
5224
|
+
textOverflow: 'ellipsis',
|
|
5225
|
+
whiteSpace: 'nowrap'
|
|
5226
|
+
},
|
|
5227
|
+
text: scriptId
|
|
5228
|
+
}),
|
|
5229
|
+
renderer_div({
|
|
5230
|
+
style: {
|
|
5231
|
+
fontSize: 'var(--c15t-devtools-font-size-xs)',
|
|
5232
|
+
color: 'var(--c15t-text-muted)',
|
|
5233
|
+
overflow: 'hidden',
|
|
5234
|
+
textOverflow: 'ellipsis',
|
|
5235
|
+
whiteSpace: 'nowrap'
|
|
5236
|
+
},
|
|
5237
|
+
text: `Category: ${categoryDisplay}`
|
|
5238
|
+
})
|
|
5239
|
+
]
|
|
5240
|
+
}),
|
|
5241
|
+
renderer_div({
|
|
5242
|
+
style: {
|
|
5243
|
+
flexShrink: '0'
|
|
5244
|
+
},
|
|
5245
|
+
children: [
|
|
5246
|
+
badge
|
|
5247
|
+
]
|
|
5248
|
+
})
|
|
5249
|
+
]
|
|
5250
|
+
});
|
|
5251
|
+
scriptsList.appendChild(row);
|
|
5252
|
+
}
|
|
5253
|
+
const lastRow = scriptsList.lastElementChild;
|
|
5254
|
+
if (lastRow) lastRow.style.borderBottom = 'none';
|
|
5255
|
+
const scriptsSection = createSection({
|
|
5256
|
+
title: `Configured Scripts (${filteredScripts.length}/${scripts.length})`,
|
|
5257
|
+
children: [
|
|
5258
|
+
scriptsList
|
|
5259
|
+
]
|
|
5260
|
+
});
|
|
4475
5261
|
container.appendChild(scriptsSection);
|
|
4476
5262
|
}
|
|
4477
5263
|
const networkSection = createSection({
|
|
@@ -4609,53 +5395,6 @@ function scripts_truncateText(text, maxLength) {
|
|
|
4609
5395
|
if (text.length <= maxLength) return text;
|
|
4610
5396
|
return `${text.slice(0, maxLength - 3)}...`;
|
|
4611
5397
|
}
|
|
4612
|
-
const DEVTOOLS_OVERRIDES_STORAGE_KEY = 'c15t-devtools-overrides';
|
|
4613
|
-
function normalizeStringValue(value) {
|
|
4614
|
-
if ('string' != typeof value) return;
|
|
4615
|
-
const normalized = value.trim();
|
|
4616
|
-
return normalized.length > 0 ? normalized : void 0;
|
|
4617
|
-
}
|
|
4618
|
-
function normalizeBooleanValue(value) {
|
|
4619
|
-
return 'boolean' == typeof value ? value : void 0;
|
|
4620
|
-
}
|
|
4621
|
-
function normalizeOverrides(value) {
|
|
4622
|
-
if (!value || 'object' != typeof value) return null;
|
|
4623
|
-
const source = value;
|
|
4624
|
-
const overrides = {
|
|
4625
|
-
country: normalizeStringValue(source.country),
|
|
4626
|
-
region: normalizeStringValue(source.region),
|
|
4627
|
-
language: normalizeStringValue(source.language),
|
|
4628
|
-
gpc: normalizeBooleanValue(source.gpc)
|
|
4629
|
-
};
|
|
4630
|
-
return hasPersistedOverrides(overrides) ? overrides : null;
|
|
4631
|
-
}
|
|
4632
|
-
function hasPersistedOverrides(overrides) {
|
|
4633
|
-
return Boolean(overrides.country || overrides.region || overrides.language || void 0 !== overrides.gpc);
|
|
4634
|
-
}
|
|
4635
|
-
function loadPersistedOverrides(storageKey = DEVTOOLS_OVERRIDES_STORAGE_KEY) {
|
|
4636
|
-
if ('undefined' == typeof window) return null;
|
|
4637
|
-
try {
|
|
4638
|
-
const stored = localStorage.getItem(storageKey);
|
|
4639
|
-
if (!stored) return null;
|
|
4640
|
-
const parsed = JSON.parse(stored);
|
|
4641
|
-
return normalizeOverrides(parsed);
|
|
4642
|
-
} catch {
|
|
4643
|
-
return null;
|
|
4644
|
-
}
|
|
4645
|
-
}
|
|
4646
|
-
function persistOverrides(overrides, storageKey = DEVTOOLS_OVERRIDES_STORAGE_KEY) {
|
|
4647
|
-
if ('undefined' == typeof window) return;
|
|
4648
|
-
try {
|
|
4649
|
-
if (!hasPersistedOverrides(overrides)) return void localStorage.removeItem(storageKey);
|
|
4650
|
-
localStorage.setItem(storageKey, JSON.stringify(overrides));
|
|
4651
|
-
} catch {}
|
|
4652
|
-
}
|
|
4653
|
-
function clearPersistedOverrides(storageKey = DEVTOOLS_OVERRIDES_STORAGE_KEY) {
|
|
4654
|
-
if ('undefined' == typeof window) return;
|
|
4655
|
-
try {
|
|
4656
|
-
localStorage.removeItem(storageKey);
|
|
4657
|
-
} catch {}
|
|
4658
|
-
}
|
|
4659
5398
|
const STORAGE_KEYS = {
|
|
4660
5399
|
C15T: 'c15t',
|
|
4661
5400
|
PENDING_SYNC: 'c15t:pending-consent-sync',
|
|
@@ -4692,7 +5431,222 @@ async function resetAllConsents(store, stateManager) {
|
|
|
4692
5431
|
message: 'All consents reset (storage cleared)'
|
|
4693
5432
|
});
|
|
4694
5433
|
}
|
|
5434
|
+
function createPanelRenderer(config) {
|
|
5435
|
+
const { storeConnector, stateManager, enableEventLogging = true, onPersistOverrides, onClearPersistedOverrides, onCopyState, onExportDebugBundle } = config;
|
|
5436
|
+
const getStoreState = ()=>storeConnector.getState();
|
|
5437
|
+
const logEvent = (type, message, data)=>{
|
|
5438
|
+
if (enableEventLogging) stateManager.addEvent({
|
|
5439
|
+
type,
|
|
5440
|
+
message,
|
|
5441
|
+
data
|
|
5442
|
+
});
|
|
5443
|
+
};
|
|
5444
|
+
const resetConsents = async ()=>{
|
|
5445
|
+
const store = storeConnector.getStore();
|
|
5446
|
+
if (store) await resetAllConsents(store, enableEventLogging ? stateManager : void 0);
|
|
5447
|
+
};
|
|
5448
|
+
const renderPanel = (container, tab)=>{
|
|
5449
|
+
switch(tab){
|
|
5450
|
+
case 'consents':
|
|
5451
|
+
renderConsentsPanel(container, {
|
|
5452
|
+
getState: getStoreState,
|
|
5453
|
+
onConsentChange: (name, value)=>{
|
|
5454
|
+
const store = storeConnector.getStore();
|
|
5455
|
+
if (store) {
|
|
5456
|
+
const consentName = String(name);
|
|
5457
|
+
store.getState().setSelectedConsent(consentName, value);
|
|
5458
|
+
logEvent('info', `${consentName} toggled to ${value} (not saved)`, {
|
|
5459
|
+
name: consentName,
|
|
5460
|
+
value
|
|
5461
|
+
});
|
|
5462
|
+
}
|
|
5463
|
+
},
|
|
5464
|
+
onSave: ()=>{
|
|
5465
|
+
const store = storeConnector.getStore();
|
|
5466
|
+
if (store) {
|
|
5467
|
+
store.getState().saveConsents('custom');
|
|
5468
|
+
logEvent('consent_save', 'Saved consent preferences');
|
|
5469
|
+
}
|
|
5470
|
+
},
|
|
5471
|
+
onAcceptAll: ()=>{
|
|
5472
|
+
const store = storeConnector.getStore();
|
|
5473
|
+
if (store) {
|
|
5474
|
+
store.getState().saveConsents('all');
|
|
5475
|
+
logEvent('consent_save', 'Accepted all consents');
|
|
5476
|
+
}
|
|
5477
|
+
},
|
|
5478
|
+
onRejectAll: ()=>{
|
|
5479
|
+
const store = storeConnector.getStore();
|
|
5480
|
+
if (store) {
|
|
5481
|
+
store.getState().saveConsents('necessary');
|
|
5482
|
+
logEvent('consent_save', 'Rejected all optional consents');
|
|
5483
|
+
}
|
|
5484
|
+
},
|
|
5485
|
+
onReset: resetConsents
|
|
5486
|
+
});
|
|
5487
|
+
break;
|
|
5488
|
+
case 'location':
|
|
5489
|
+
renderLocationPanel(container, {
|
|
5490
|
+
getState: getStoreState,
|
|
5491
|
+
onApplyOverrides: async (overrides)=>{
|
|
5492
|
+
const store = storeConnector.getStore();
|
|
5493
|
+
if (store) {
|
|
5494
|
+
await store.getState().setOverrides({
|
|
5495
|
+
country: overrides.country,
|
|
5496
|
+
region: overrides.region,
|
|
5497
|
+
language: overrides.language,
|
|
5498
|
+
gpc: overrides.gpc
|
|
5499
|
+
});
|
|
5500
|
+
logEvent('info', 'Overrides updated', {
|
|
5501
|
+
country: overrides.country,
|
|
5502
|
+
region: overrides.region,
|
|
5503
|
+
language: overrides.language,
|
|
5504
|
+
gpc: overrides.gpc
|
|
5505
|
+
});
|
|
5506
|
+
onPersistOverrides?.({
|
|
5507
|
+
country: overrides.country,
|
|
5508
|
+
region: overrides.region,
|
|
5509
|
+
language: overrides.language,
|
|
5510
|
+
gpc: overrides.gpc
|
|
5511
|
+
});
|
|
5512
|
+
}
|
|
5513
|
+
},
|
|
5514
|
+
onClearOverrides: async ()=>{
|
|
5515
|
+
const store = storeConnector.getStore();
|
|
5516
|
+
if (store) {
|
|
5517
|
+
await store.getState().setOverrides({
|
|
5518
|
+
country: void 0,
|
|
5519
|
+
region: void 0,
|
|
5520
|
+
language: void 0,
|
|
5521
|
+
gpc: void 0
|
|
5522
|
+
});
|
|
5523
|
+
logEvent('info', 'Overrides cleared');
|
|
5524
|
+
onClearPersistedOverrides?.();
|
|
5525
|
+
}
|
|
5526
|
+
}
|
|
5527
|
+
});
|
|
5528
|
+
break;
|
|
5529
|
+
case "scripts":
|
|
5530
|
+
renderScriptsPanel(container, {
|
|
5531
|
+
getState: getStoreState,
|
|
5532
|
+
getEvents: ()=>stateManager.getState().eventLog
|
|
5533
|
+
});
|
|
5534
|
+
break;
|
|
5535
|
+
case 'iab':
|
|
5536
|
+
renderIabPanel(container, {
|
|
5537
|
+
getState: getStoreState,
|
|
5538
|
+
onSetPurposeConsent: (purposeId, value)=>{
|
|
5539
|
+
const iab = storeConnector.getStore()?.getState().iab;
|
|
5540
|
+
if (!iab) return;
|
|
5541
|
+
iab.setPurposeConsent(purposeId, value);
|
|
5542
|
+
logEvent('iab', `IAB purpose ${purposeId} set to ${value}`);
|
|
5543
|
+
},
|
|
5544
|
+
onSetVendorConsent: (vendorId, value)=>{
|
|
5545
|
+
const iab = storeConnector.getStore()?.getState().iab;
|
|
5546
|
+
if (!iab) return;
|
|
5547
|
+
iab.setVendorConsent(vendorId, value);
|
|
5548
|
+
logEvent('iab', `IAB vendor ${vendorId} set to ${value}`);
|
|
5549
|
+
},
|
|
5550
|
+
onSetSpecialFeatureOptIn: (featureId, value)=>{
|
|
5551
|
+
const iab = storeConnector.getStore()?.getState().iab;
|
|
5552
|
+
if (!iab) return;
|
|
5553
|
+
iab.setSpecialFeatureOptIn(featureId, value);
|
|
5554
|
+
logEvent('iab', `IAB feature ${featureId} set to ${value}`);
|
|
5555
|
+
},
|
|
5556
|
+
onAcceptAll: ()=>{
|
|
5557
|
+
const iab = storeConnector.getStore()?.getState().iab;
|
|
5558
|
+
if (!iab) return;
|
|
5559
|
+
iab.acceptAll();
|
|
5560
|
+
logEvent('iab', 'IAB accept all selected');
|
|
5561
|
+
},
|
|
5562
|
+
onRejectAll: ()=>{
|
|
5563
|
+
const iab = storeConnector.getStore()?.getState().iab;
|
|
5564
|
+
if (!iab) return;
|
|
5565
|
+
iab.rejectAll();
|
|
5566
|
+
logEvent('iab', 'IAB reject all selected');
|
|
5567
|
+
},
|
|
5568
|
+
onSave: ()=>{
|
|
5569
|
+
const iab = storeConnector.getStore()?.getState().iab;
|
|
5570
|
+
if (!iab) return;
|
|
5571
|
+
iab.save().then(()=>logEvent('iab', 'IAB preferences saved')).catch((error)=>{
|
|
5572
|
+
logEvent('error', `Failed to save IAB preferences: ${String(error)}`);
|
|
5573
|
+
});
|
|
5574
|
+
},
|
|
5575
|
+
onReset: resetConsents
|
|
5576
|
+
});
|
|
5577
|
+
break;
|
|
5578
|
+
case 'events':
|
|
5579
|
+
renderEventsPanel(container, {
|
|
5580
|
+
getEvents: ()=>stateManager.getState().eventLog,
|
|
5581
|
+
onClear: ()=>{
|
|
5582
|
+
stateManager.clearEventLog();
|
|
5583
|
+
logEvent('info', 'Event log cleared');
|
|
5584
|
+
}
|
|
5585
|
+
});
|
|
5586
|
+
break;
|
|
5587
|
+
case 'actions':
|
|
5588
|
+
renderActionsPanel(container, {
|
|
5589
|
+
getState: getStoreState,
|
|
5590
|
+
onResetConsents: resetConsents,
|
|
5591
|
+
onRefetchBanner: async ()=>{
|
|
5592
|
+
const store = storeConnector.getStore();
|
|
5593
|
+
if (store) {
|
|
5594
|
+
await store.getState().initConsentManager();
|
|
5595
|
+
logEvent('info', 'Banner data refetched');
|
|
5596
|
+
}
|
|
5597
|
+
},
|
|
5598
|
+
onShowBanner: ()=>{
|
|
5599
|
+
const store = storeConnector.getStore();
|
|
5600
|
+
if (store) {
|
|
5601
|
+
store.getState().setActiveUI('banner', {
|
|
5602
|
+
force: true
|
|
5603
|
+
});
|
|
5604
|
+
logEvent('info', 'Banner shown');
|
|
5605
|
+
}
|
|
5606
|
+
},
|
|
5607
|
+
onOpenPreferences: ()=>{
|
|
5608
|
+
const store = storeConnector.getStore();
|
|
5609
|
+
if (store) {
|
|
5610
|
+
store.getState().setActiveUI('dialog');
|
|
5611
|
+
logEvent('info', 'Preferences dialog opened');
|
|
5612
|
+
}
|
|
5613
|
+
},
|
|
5614
|
+
onCopyState: ()=>{
|
|
5615
|
+
const state = getStoreState();
|
|
5616
|
+
if (state) if (onCopyState) {
|
|
5617
|
+
const result = onCopyState(state);
|
|
5618
|
+
if (result instanceof Promise) result.then((ok)=>{
|
|
5619
|
+
logEvent(ok ? 'info' : 'error', ok ? 'State copied to clipboard' : 'Failed to copy state');
|
|
5620
|
+
}).catch(()=>{
|
|
5621
|
+
logEvent('error', 'Failed to copy state');
|
|
5622
|
+
});
|
|
5623
|
+
else logEvent(result ? 'info' : 'error', result ? 'State copied to clipboard' : 'Failed to copy state');
|
|
5624
|
+
} else navigator.clipboard.writeText(JSON.stringify(state, null, 2)).then(()=>{
|
|
5625
|
+
logEvent('info', 'State copied to clipboard');
|
|
5626
|
+
}).catch(()=>{
|
|
5627
|
+
logEvent('error', 'Failed to copy state');
|
|
5628
|
+
});
|
|
5629
|
+
},
|
|
5630
|
+
onExportDebugBundle: onExportDebugBundle ? ()=>{
|
|
5631
|
+
try {
|
|
5632
|
+
onExportDebugBundle();
|
|
5633
|
+
logEvent('info', 'Debug bundle exported');
|
|
5634
|
+
} catch {
|
|
5635
|
+
logEvent('error', 'Failed to export debug bundle');
|
|
5636
|
+
}
|
|
5637
|
+
} : void 0
|
|
5638
|
+
});
|
|
5639
|
+
break;
|
|
5640
|
+
}
|
|
5641
|
+
};
|
|
5642
|
+
return {
|
|
5643
|
+
renderPanel,
|
|
5644
|
+
getStoreState,
|
|
5645
|
+
resetConsents
|
|
5646
|
+
};
|
|
5647
|
+
}
|
|
4695
5648
|
const STORAGE_KEY = 'c15t-devtools-events';
|
|
5649
|
+
const ACTIVE_TAB_STORAGE_KEY = 'c15t-devtools-active-tab';
|
|
4696
5650
|
function loadPersistedEvents() {
|
|
4697
5651
|
if ('undefined' == typeof window) return [];
|
|
4698
5652
|
try {
|
|
@@ -4707,11 +5661,29 @@ function persistEvents(events) {
|
|
|
4707
5661
|
sessionStorage.setItem(STORAGE_KEY, JSON.stringify(events));
|
|
4708
5662
|
} catch {}
|
|
4709
5663
|
}
|
|
5664
|
+
function isDevToolsTab(value) {
|
|
5665
|
+
return 'consents' === value || 'location' === value || "scripts" === value || 'iab' === value || 'events' === value || 'actions' === value;
|
|
5666
|
+
}
|
|
5667
|
+
function loadPersistedActiveTab() {
|
|
5668
|
+
if ('undefined' == typeof window) return null;
|
|
5669
|
+
try {
|
|
5670
|
+
const stored = localStorage.getItem(ACTIVE_TAB_STORAGE_KEY);
|
|
5671
|
+
if (isDevToolsTab(stored)) return stored;
|
|
5672
|
+
} catch {}
|
|
5673
|
+
return null;
|
|
5674
|
+
}
|
|
5675
|
+
function persistActiveTab(tab) {
|
|
5676
|
+
if ('undefined' == typeof window) return;
|
|
5677
|
+
try {
|
|
5678
|
+
localStorage.setItem(ACTIVE_TAB_STORAGE_KEY, tab);
|
|
5679
|
+
} catch {}
|
|
5680
|
+
}
|
|
4710
5681
|
function createStateManager(initialState = {}) {
|
|
4711
5682
|
const persistedEvents = loadPersistedEvents();
|
|
5683
|
+
const persistedActiveTab = loadPersistedActiveTab();
|
|
4712
5684
|
let state = {
|
|
4713
5685
|
isOpen: false,
|
|
4714
|
-
activeTab: 'location',
|
|
5686
|
+
activeTab: persistedActiveTab ?? 'location',
|
|
4715
5687
|
position: 'bottom-right',
|
|
4716
5688
|
isConnected: false,
|
|
4717
5689
|
eventLog: persistedEvents,
|
|
@@ -4752,6 +5724,7 @@ function createStateManager(initialState = {}) {
|
|
|
4752
5724
|
setState({
|
|
4753
5725
|
activeTab: tab
|
|
4754
5726
|
});
|
|
5727
|
+
persistActiveTab(tab);
|
|
4755
5728
|
},
|
|
4756
5729
|
setPosition: (position)=>{
|
|
4757
5730
|
setState({
|
|
@@ -4797,22 +5770,52 @@ function createStoreConnector(options = {}) {
|
|
|
4797
5770
|
let reconnectAttempts = 0;
|
|
4798
5771
|
let hasNotifiedDisconnect = false;
|
|
4799
5772
|
const listeners = new Set();
|
|
5773
|
+
const diagnosticsListeners = new Set();
|
|
5774
|
+
let diagnostics = {
|
|
5775
|
+
namespace,
|
|
5776
|
+
reconnectAttempts: 0,
|
|
5777
|
+
nextRetryInMs: null,
|
|
5778
|
+
lastError: null,
|
|
5779
|
+
isPolling: false,
|
|
5780
|
+
disconnectNotified: false
|
|
5781
|
+
};
|
|
4800
5782
|
const INITIAL_RETRY_DELAY_MS = 100;
|
|
4801
5783
|
const MAX_RETRY_DELAY_MS = 2000;
|
|
4802
5784
|
const DISCONNECT_NOTIFY_ATTEMPTS = 5;
|
|
5785
|
+
function updateDiagnostics(partial, notify = true) {
|
|
5786
|
+
diagnostics = {
|
|
5787
|
+
...diagnostics,
|
|
5788
|
+
...partial
|
|
5789
|
+
};
|
|
5790
|
+
if (!notify) return;
|
|
5791
|
+
for (const listener of diagnosticsListeners)listener(diagnostics);
|
|
5792
|
+
}
|
|
4803
5793
|
function clearReconnectTimer() {
|
|
4804
5794
|
if (reconnectTimeout) {
|
|
4805
5795
|
clearTimeout(reconnectTimeout);
|
|
4806
5796
|
reconnectTimeout = null;
|
|
5797
|
+
updateDiagnostics({
|
|
5798
|
+
isPolling: false,
|
|
5799
|
+
nextRetryInMs: null
|
|
5800
|
+
});
|
|
4807
5801
|
}
|
|
4808
5802
|
}
|
|
4809
5803
|
function resetReconnectState() {
|
|
4810
5804
|
reconnectAttempts = 0;
|
|
4811
5805
|
hasNotifiedDisconnect = false;
|
|
5806
|
+
updateDiagnostics({
|
|
5807
|
+
reconnectAttempts: 0,
|
|
5808
|
+
nextRetryInMs: null,
|
|
5809
|
+
lastError: null,
|
|
5810
|
+
disconnectNotified: false
|
|
5811
|
+
});
|
|
4812
5812
|
}
|
|
4813
5813
|
function notifyDisconnectedOnce() {
|
|
4814
5814
|
if (hasNotifiedDisconnect) return;
|
|
4815
5815
|
hasNotifiedDisconnect = true;
|
|
5816
|
+
updateDiagnostics({
|
|
5817
|
+
disconnectNotified: true
|
|
5818
|
+
});
|
|
4816
5819
|
onDisconnect?.();
|
|
4817
5820
|
}
|
|
4818
5821
|
function tryConnect() {
|
|
@@ -4833,16 +5836,31 @@ function createStoreConnector(options = {}) {
|
|
|
4833
5836
|
onConnect?.(currentState, store);
|
|
4834
5837
|
clearReconnectTimer();
|
|
4835
5838
|
resetReconnectState();
|
|
5839
|
+
updateDiagnostics({
|
|
5840
|
+
lastError: null
|
|
5841
|
+
});
|
|
4836
5842
|
return true;
|
|
4837
5843
|
}
|
|
5844
|
+
updateDiagnostics({
|
|
5845
|
+
lastError: `Store "${namespace}" not found on window`
|
|
5846
|
+
});
|
|
4838
5847
|
return false;
|
|
4839
5848
|
}
|
|
4840
5849
|
function scheduleReconnect(immediate = false) {
|
|
4841
5850
|
if (store || reconnectTimeout) return;
|
|
4842
5851
|
const delay = immediate ? 0 : Math.min(INITIAL_RETRY_DELAY_MS * 2 ** Math.min(reconnectAttempts, 5), MAX_RETRY_DELAY_MS);
|
|
5852
|
+
updateDiagnostics({
|
|
5853
|
+
isPolling: true,
|
|
5854
|
+
nextRetryInMs: delay,
|
|
5855
|
+
reconnectAttempts
|
|
5856
|
+
});
|
|
4843
5857
|
reconnectTimeout = setTimeout(()=>{
|
|
4844
5858
|
reconnectTimeout = null;
|
|
4845
5859
|
reconnectAttempts++;
|
|
5860
|
+
updateDiagnostics({
|
|
5861
|
+
reconnectAttempts,
|
|
5862
|
+
nextRetryInMs: null
|
|
5863
|
+
});
|
|
4846
5864
|
if (tryConnect()) return;
|
|
4847
5865
|
if (reconnectAttempts >= DISCONNECT_NOTIFY_ATTEMPTS) notifyDisconnectedOnce();
|
|
4848
5866
|
scheduleReconnect();
|
|
@@ -4864,6 +5882,14 @@ function createStoreConnector(options = {}) {
|
|
|
4864
5882
|
listeners.delete(listener);
|
|
4865
5883
|
};
|
|
4866
5884
|
},
|
|
5885
|
+
getDiagnostics: ()=>diagnostics,
|
|
5886
|
+
subscribeDiagnostics: (listener)=>{
|
|
5887
|
+
diagnosticsListeners.add(listener);
|
|
5888
|
+
listener(diagnostics);
|
|
5889
|
+
return ()=>{
|
|
5890
|
+
diagnosticsListeners.delete(listener);
|
|
5891
|
+
};
|
|
5892
|
+
},
|
|
4867
5893
|
retryConnection: ()=>{
|
|
4868
5894
|
if (store) return;
|
|
4869
5895
|
resetReconnectState();
|
|
@@ -4877,6 +5903,7 @@ function createStoreConnector(options = {}) {
|
|
|
4877
5903
|
}
|
|
4878
5904
|
store = null;
|
|
4879
5905
|
listeners.clear();
|
|
5906
|
+
diagnosticsListeners.clear();
|
|
4880
5907
|
}
|
|
4881
5908
|
};
|
|
4882
5909
|
}
|
|
@@ -4889,12 +5916,139 @@ function getC15tStore(namespace = 'c15tStore') {
|
|
|
4889
5916
|
function isC15tStoreAvailable(namespace = 'c15tStore') {
|
|
4890
5917
|
return null !== getC15tStore(namespace);
|
|
4891
5918
|
}
|
|
4892
|
-
|
|
4893
|
-
|
|
4894
|
-
|
|
4895
|
-
|
|
4896
|
-
|
|
4897
|
-
|
|
5919
|
+
const REGISTRY_KEY = '__c15tDevToolsInstrumentationRegistry';
|
|
5920
|
+
let fallbackRegistry = null;
|
|
5921
|
+
function getRegistry() {
|
|
5922
|
+
if ('undefined' == typeof window) {
|
|
5923
|
+
if (!fallbackRegistry) fallbackRegistry = new Map();
|
|
5924
|
+
return fallbackRegistry;
|
|
5925
|
+
}
|
|
5926
|
+
const host = window;
|
|
5927
|
+
const existing = host[REGISTRY_KEY];
|
|
5928
|
+
if (existing) return existing;
|
|
5929
|
+
const registry = new Map();
|
|
5930
|
+
host[REGISTRY_KEY] = registry;
|
|
5931
|
+
return registry;
|
|
5932
|
+
}
|
|
5933
|
+
function getBlockedRequestMessage(payload) {
|
|
5934
|
+
const data = payload;
|
|
5935
|
+
const method = 'string' == typeof data?.method ? data.method.toUpperCase() : 'REQUEST';
|
|
5936
|
+
const url = 'string' == typeof data?.url ? data.url : 'unknown-url';
|
|
5937
|
+
return `Network blocked: ${method} ${url}`;
|
|
5938
|
+
}
|
|
5939
|
+
function emitEvent(entry, event) {
|
|
5940
|
+
for (const listener of entry.listeners)listener(event);
|
|
5941
|
+
}
|
|
5942
|
+
function ensureNetworkBlockerWrapped(entry) {
|
|
5943
|
+
const blocker = entry.store.getState().networkBlocker;
|
|
5944
|
+
if (!blocker) return;
|
|
5945
|
+
if (blocker.onRequestBlocked === entry.wrappedNetworkBlockedCallback) return;
|
|
5946
|
+
entry.originalNetworkBlockedCallback = blocker.onRequestBlocked;
|
|
5947
|
+
entry.wrappedNetworkBlockedCallback = (payload)=>{
|
|
5948
|
+
emitEvent(entry, {
|
|
5949
|
+
type: 'network',
|
|
5950
|
+
message: getBlockedRequestMessage(payload),
|
|
5951
|
+
data: payload
|
|
5952
|
+
});
|
|
5953
|
+
if ('function' == typeof entry.originalNetworkBlockedCallback) entry.originalNetworkBlockedCallback(payload);
|
|
5954
|
+
};
|
|
5955
|
+
entry.store.getState().setNetworkBlocker({
|
|
5956
|
+
...blocker,
|
|
5957
|
+
onRequestBlocked: entry.wrappedNetworkBlockedCallback
|
|
5958
|
+
});
|
|
5959
|
+
}
|
|
5960
|
+
function restoreInstrumentation(entry) {
|
|
5961
|
+
entry.stopWatchingStore?.();
|
|
5962
|
+
entry.stopWatchingStore = null;
|
|
5963
|
+
const state = entry.store.getState();
|
|
5964
|
+
state.setCallback('onBannerFetched', entry.originalCallbacks.onBannerFetched);
|
|
5965
|
+
state.setCallback('onConsentSet', entry.originalCallbacks.onConsentSet);
|
|
5966
|
+
state.setCallback('onError', entry.originalCallbacks.onError);
|
|
5967
|
+
state.setCallback('onBeforeConsentRevocationReload', entry.originalCallbacks.onBeforeConsentRevocationReload);
|
|
5968
|
+
const blocker = state.networkBlocker;
|
|
5969
|
+
if (blocker && blocker.onRequestBlocked === entry.wrappedNetworkBlockedCallback) state.setNetworkBlocker({
|
|
5970
|
+
...blocker,
|
|
5971
|
+
onRequestBlocked: entry.originalNetworkBlockedCallback
|
|
5972
|
+
});
|
|
5973
|
+
entry.wrappedNetworkBlockedCallback = null;
|
|
5974
|
+
}
|
|
5975
|
+
function createInstrumentationEntry(store) {
|
|
5976
|
+
const entry = {
|
|
5977
|
+
store,
|
|
5978
|
+
listeners: new Set(),
|
|
5979
|
+
originalCallbacks: {
|
|
5980
|
+
...store.getState().callbacks
|
|
5981
|
+
},
|
|
5982
|
+
originalNetworkBlockedCallback: store.getState().networkBlocker?.onRequestBlocked,
|
|
5983
|
+
wrappedNetworkBlockedCallback: null,
|
|
5984
|
+
stopWatchingStore: null
|
|
5985
|
+
};
|
|
5986
|
+
store.getState().setCallback('onBannerFetched', (payload)=>{
|
|
5987
|
+
const jurisdiction = payload.jurisdiction;
|
|
5988
|
+
emitEvent(entry, {
|
|
5989
|
+
type: 'info',
|
|
5990
|
+
message: `Banner fetched: ${String(jurisdiction)}`,
|
|
5991
|
+
data: payload
|
|
5992
|
+
});
|
|
5993
|
+
if ('function' == typeof entry.originalCallbacks.onBannerFetched) entry.originalCallbacks.onBannerFetched(payload);
|
|
5994
|
+
});
|
|
5995
|
+
store.getState().setCallback('onConsentSet', (payload)=>{
|
|
5996
|
+
emitEvent(entry, {
|
|
5997
|
+
type: 'consent_set',
|
|
5998
|
+
message: 'Consent preferences updated',
|
|
5999
|
+
data: payload
|
|
6000
|
+
});
|
|
6001
|
+
if ('function' == typeof entry.originalCallbacks.onConsentSet) entry.originalCallbacks.onConsentSet(payload);
|
|
6002
|
+
});
|
|
6003
|
+
store.getState().setCallback('onError', (payload)=>{
|
|
6004
|
+
const errorMessage = payload.error;
|
|
6005
|
+
emitEvent(entry, {
|
|
6006
|
+
type: 'error',
|
|
6007
|
+
message: `Error: ${String(errorMessage)}`,
|
|
6008
|
+
data: payload
|
|
6009
|
+
});
|
|
6010
|
+
if ('function' == typeof entry.originalCallbacks.onError) entry.originalCallbacks.onError(payload);
|
|
6011
|
+
});
|
|
6012
|
+
store.getState().setCallback('onBeforeConsentRevocationReload', (payload)=>{
|
|
6013
|
+
emitEvent(entry, {
|
|
6014
|
+
type: 'info',
|
|
6015
|
+
message: 'Consent revocation - page will reload',
|
|
6016
|
+
data: payload
|
|
6017
|
+
});
|
|
6018
|
+
if ('function' == typeof entry.originalCallbacks.onBeforeConsentRevocationReload) entry.originalCallbacks.onBeforeConsentRevocationReload(payload);
|
|
6019
|
+
});
|
|
6020
|
+
ensureNetworkBlockerWrapped(entry);
|
|
6021
|
+
entry.stopWatchingStore = store.subscribe(()=>{
|
|
6022
|
+
ensureNetworkBlockerWrapped(entry);
|
|
6023
|
+
});
|
|
6024
|
+
return entry;
|
|
6025
|
+
}
|
|
6026
|
+
function registerStoreInstrumentation(options) {
|
|
6027
|
+
const { namespace, store, onEvent } = options;
|
|
6028
|
+
const registry = getRegistry();
|
|
6029
|
+
let entry = registry.get(namespace);
|
|
6030
|
+
if (!entry || entry.store !== store) {
|
|
6031
|
+
if (entry) restoreInstrumentation(entry);
|
|
6032
|
+
entry = createInstrumentationEntry(store);
|
|
6033
|
+
registry.set(namespace, entry);
|
|
6034
|
+
}
|
|
6035
|
+
entry.listeners.add(onEvent);
|
|
6036
|
+
return ()=>{
|
|
6037
|
+
const current = registry.get(namespace);
|
|
6038
|
+
if (!current) return;
|
|
6039
|
+
current.listeners.delete(onEvent);
|
|
6040
|
+
if (0 === current.listeners.size) {
|
|
6041
|
+
restoreInstrumentation(current);
|
|
6042
|
+
registry.delete(namespace);
|
|
6043
|
+
}
|
|
6044
|
+
};
|
|
6045
|
+
}
|
|
6046
|
+
var tokens = __webpack_require__("../../node_modules/.bun/@rsbuild+core@1.6.12/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[1].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[1].use[2]!./src/styles/tokens.css");
|
|
6047
|
+
var tokens_options = {};
|
|
6048
|
+
tokens_options.styleTagTransform = styleTagTransform_default();
|
|
6049
|
+
tokens_options.setAttributes = setAttributesWithoutAttributes_default();
|
|
6050
|
+
tokens_options.insert = insertBySelector_default().bind(null, "head");
|
|
6051
|
+
tokens_options.domAPI = styleDomAPI_default();
|
|
4898
6052
|
tokens_options.insertStyleElement = insertStyleElement_default();
|
|
4899
6053
|
injectStylesIntoStyleTag_default()(tokens.A, tokens_options);
|
|
4900
6054
|
tokens.A && tokens.A.locals && tokens.A.locals;
|
|
@@ -4912,12 +6066,6 @@ function normalizeOverridesForPersistence(overrides) {
|
|
|
4912
6066
|
function persistedOverridesEqual(a, b) {
|
|
4913
6067
|
return a.country === b.country && a.region === b.region && a.language === b.language && a.gpc === b.gpc;
|
|
4914
6068
|
}
|
|
4915
|
-
function getBlockedRequestMessage(payload) {
|
|
4916
|
-
const data = payload;
|
|
4917
|
-
const method = 'string' == typeof data?.method ? data.method.toUpperCase() : 'REQUEST';
|
|
4918
|
-
const url = 'string' == typeof data?.url ? data.url : 'unknown-url';
|
|
4919
|
-
return `Network blocked: ${method} ${url}`;
|
|
4920
|
-
}
|
|
4921
6069
|
function prefersReducedMotion() {
|
|
4922
6070
|
return 'undefined' != typeof window && 'function' == typeof window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
4923
6071
|
}
|
|
@@ -4978,74 +6126,43 @@ function createPanelHeightAnimator() {
|
|
|
4978
6126
|
destroy: clearAnimationState
|
|
4979
6127
|
};
|
|
4980
6128
|
}
|
|
6129
|
+
function createStateCopy(state) {
|
|
6130
|
+
return {
|
|
6131
|
+
consents: state.consents,
|
|
6132
|
+
selectedConsents: state.selectedConsents,
|
|
6133
|
+
consentInfo: state.consentInfo,
|
|
6134
|
+
locationInfo: state.locationInfo,
|
|
6135
|
+
model: state.model,
|
|
6136
|
+
overrides: state.overrides,
|
|
6137
|
+
scripts: state.scripts?.map((script)=>({
|
|
6138
|
+
id: script.id
|
|
6139
|
+
})),
|
|
6140
|
+
loadedScripts: state.loadedScripts
|
|
6141
|
+
};
|
|
6142
|
+
}
|
|
4981
6143
|
function createDevTools(options = {}) {
|
|
4982
6144
|
const { namespace = 'c15tStore', position = 'bottom-right', defaultOpen = false } = options;
|
|
4983
6145
|
const stateManager = createStateManager({
|
|
4984
6146
|
position,
|
|
4985
6147
|
isOpen: defaultOpen
|
|
4986
6148
|
});
|
|
4987
|
-
let
|
|
4988
|
-
let originalNetworkBlockedCallback;
|
|
4989
|
-
let hasWrappedNetworkBlockerCallback = false;
|
|
6149
|
+
let detachInstrumentation = null;
|
|
4990
6150
|
const storeConnector = createStoreConnector({
|
|
4991
6151
|
namespace,
|
|
4992
|
-
onConnect: (
|
|
6152
|
+
onConnect: (_state, store)=>{
|
|
6153
|
+
detachInstrumentation?.();
|
|
6154
|
+
detachInstrumentation = registerStoreInstrumentation({
|
|
6155
|
+
namespace,
|
|
6156
|
+
store,
|
|
6157
|
+
onEvent: (event)=>{
|
|
6158
|
+
stateManager.addEvent(event);
|
|
6159
|
+
}
|
|
6160
|
+
});
|
|
4993
6161
|
stateManager.setConnected(true);
|
|
4994
6162
|
stateManager.addEvent({
|
|
4995
6163
|
type: 'info',
|
|
4996
6164
|
message: 'Connected to c15tStore'
|
|
4997
6165
|
});
|
|
4998
|
-
originalCallbacks = {
|
|
4999
|
-
...state.callbacks
|
|
5000
|
-
};
|
|
5001
|
-
store.getState().setCallback('onBannerFetched', (payload)=>{
|
|
5002
|
-
stateManager.addEvent({
|
|
5003
|
-
type: 'info',
|
|
5004
|
-
message: `Banner fetched: ${String(payload.jurisdiction)}`,
|
|
5005
|
-
data: payload
|
|
5006
|
-
});
|
|
5007
|
-
if ('function' == typeof originalCallbacks.onBannerFetched) originalCallbacks.onBannerFetched(payload);
|
|
5008
|
-
});
|
|
5009
|
-
store.getState().setCallback('onConsentSet', (payload)=>{
|
|
5010
|
-
stateManager.addEvent({
|
|
5011
|
-
type: 'consent_set',
|
|
5012
|
-
message: 'Consent preferences updated',
|
|
5013
|
-
data: payload
|
|
5014
|
-
});
|
|
5015
|
-
if ('function' == typeof originalCallbacks.onConsentSet) originalCallbacks.onConsentSet(payload);
|
|
5016
|
-
});
|
|
5017
|
-
store.getState().setCallback('onError', (payload)=>{
|
|
5018
|
-
stateManager.addEvent({
|
|
5019
|
-
type: 'error',
|
|
5020
|
-
message: `Error: ${payload.error}`,
|
|
5021
|
-
data: payload
|
|
5022
|
-
});
|
|
5023
|
-
if ('function' == typeof originalCallbacks.onError) originalCallbacks.onError(payload);
|
|
5024
|
-
});
|
|
5025
|
-
store.getState().setCallback('onBeforeConsentRevocationReload', (payload)=>{
|
|
5026
|
-
stateManager.addEvent({
|
|
5027
|
-
type: 'info',
|
|
5028
|
-
message: 'Consent revocation - page will reload',
|
|
5029
|
-
data: payload
|
|
5030
|
-
});
|
|
5031
|
-
if ('function' == typeof originalCallbacks.onBeforeConsentRevocationReload) originalCallbacks.onBeforeConsentRevocationReload(payload);
|
|
5032
|
-
});
|
|
5033
|
-
const currentNetworkBlocker = store.getState().networkBlocker;
|
|
5034
|
-
if (currentNetworkBlocker && !hasWrappedNetworkBlockerCallback) {
|
|
5035
|
-
originalNetworkBlockedCallback = currentNetworkBlocker.onRequestBlocked;
|
|
5036
|
-
hasWrappedNetworkBlockerCallback = true;
|
|
5037
|
-
store.getState().setNetworkBlocker({
|
|
5038
|
-
...currentNetworkBlocker,
|
|
5039
|
-
onRequestBlocked: (payload)=>{
|
|
5040
|
-
stateManager.addEvent({
|
|
5041
|
-
type: 'network',
|
|
5042
|
-
message: getBlockedRequestMessage(payload),
|
|
5043
|
-
data: payload
|
|
5044
|
-
});
|
|
5045
|
-
if ('function' == typeof originalNetworkBlockedCallback) originalNetworkBlockedCallback(payload);
|
|
5046
|
-
}
|
|
5047
|
-
});
|
|
5048
|
-
}
|
|
5049
6166
|
const persistedOverrides = loadPersistedOverrides();
|
|
5050
6167
|
if (persistedOverrides) {
|
|
5051
6168
|
const currentOverrides = normalizeOverridesForPersistence(store.getState().overrides);
|
|
@@ -5075,6 +6192,8 @@ function createDevTools(options = {}) {
|
|
|
5075
6192
|
},
|
|
5076
6193
|
onDisconnect: ()=>{
|
|
5077
6194
|
stateManager.setConnected(false);
|
|
6195
|
+
detachInstrumentation?.();
|
|
6196
|
+
detachInstrumentation = null;
|
|
5078
6197
|
stateManager.addEvent({
|
|
5079
6198
|
type: 'error',
|
|
5080
6199
|
message: 'Disconnected from c15tStore'
|
|
@@ -5082,6 +6201,31 @@ function createDevTools(options = {}) {
|
|
|
5082
6201
|
},
|
|
5083
6202
|
onStateChange: ()=>{}
|
|
5084
6203
|
});
|
|
6204
|
+
const panelRenderer = createPanelRenderer({
|
|
6205
|
+
storeConnector,
|
|
6206
|
+
stateManager,
|
|
6207
|
+
enableEventLogging: true,
|
|
6208
|
+
onPersistOverrides: persistOverrides,
|
|
6209
|
+
onClearPersistedOverrides: clearPersistedOverrides,
|
|
6210
|
+
onCopyState: async (state)=>{
|
|
6211
|
+
try {
|
|
6212
|
+
await navigator.clipboard.writeText(JSON.stringify(createStateCopy(state), null, 2));
|
|
6213
|
+
return true;
|
|
6214
|
+
} catch {
|
|
6215
|
+
return false;
|
|
6216
|
+
}
|
|
6217
|
+
},
|
|
6218
|
+
onExportDebugBundle: ()=>{
|
|
6219
|
+
const bundle = createDebugBundle({
|
|
6220
|
+
namespace,
|
|
6221
|
+
devToolsState: stateManager.getState(),
|
|
6222
|
+
connection: storeConnector.getDiagnostics(),
|
|
6223
|
+
recentEvents: stateManager.getState().eventLog.slice(0, 100),
|
|
6224
|
+
storeState: sanitizeStoreState(storeConnector.getState())
|
|
6225
|
+
});
|
|
6226
|
+
downloadDebugBundle(bundle);
|
|
6227
|
+
}
|
|
6228
|
+
});
|
|
5085
6229
|
let tabsInstance = null;
|
|
5086
6230
|
const panelHeightAnimator = createPanelHeightAnimator();
|
|
5087
6231
|
const panelInstance = createPanel({
|
|
@@ -5089,19 +6233,24 @@ function createDevTools(options = {}) {
|
|
|
5089
6233
|
storeConnector,
|
|
5090
6234
|
namespace,
|
|
5091
6235
|
onRenderContent: (container)=>{
|
|
5092
|
-
renderContent(container
|
|
6236
|
+
renderContent(container);
|
|
5093
6237
|
}
|
|
5094
6238
|
});
|
|
5095
|
-
function renderContent(container
|
|
6239
|
+
function renderContent(container) {
|
|
5096
6240
|
const panel = container.parentElement;
|
|
5097
6241
|
const previousPanelHeight = panel?.getBoundingClientRect().height ?? 0;
|
|
5098
6242
|
clearElement(container);
|
|
5099
6243
|
const storeState = storeConnector.getState();
|
|
5100
6244
|
const disabledTabs = [];
|
|
5101
6245
|
if (!storeState || 'iab' !== storeState.model) disabledTabs.push('iab');
|
|
6246
|
+
let currentActiveTab = stateManager.getState().activeTab;
|
|
6247
|
+
if (disabledTabs.includes(currentActiveTab)) {
|
|
6248
|
+
stateManager.setActiveTab('consents');
|
|
6249
|
+
currentActiveTab = 'consents';
|
|
6250
|
+
}
|
|
5102
6251
|
if (tabsInstance) tabsInstance.destroy();
|
|
5103
6252
|
tabsInstance = createTabs({
|
|
5104
|
-
activeTab:
|
|
6253
|
+
activeTab: currentActiveTab,
|
|
5105
6254
|
onTabChange: (tab)=>{
|
|
5106
6255
|
stateManager.setActiveTab(tab);
|
|
5107
6256
|
},
|
|
@@ -5116,284 +6265,9 @@ function createDevTools(options = {}) {
|
|
|
5116
6265
|
}
|
|
5117
6266
|
});
|
|
5118
6267
|
container.appendChild(panelContent);
|
|
5119
|
-
|
|
5120
|
-
const getStoreState = ()=>storeConnector.getState();
|
|
5121
|
-
switch(state.activeTab){
|
|
5122
|
-
case 'consents':
|
|
5123
|
-
renderConsentsPanel(panelContent, {
|
|
5124
|
-
getState: getStoreState,
|
|
5125
|
-
onConsentChange: (name, value)=>{
|
|
5126
|
-
const store = storeConnector.getStore();
|
|
5127
|
-
if (store) {
|
|
5128
|
-
const consentName = String(name);
|
|
5129
|
-
store.getState().setSelectedConsent(consentName, value);
|
|
5130
|
-
stateManager.addEvent({
|
|
5131
|
-
type: 'info',
|
|
5132
|
-
message: `${consentName} toggled to ${value} (not saved)`,
|
|
5133
|
-
data: {
|
|
5134
|
-
name: consentName,
|
|
5135
|
-
value
|
|
5136
|
-
}
|
|
5137
|
-
});
|
|
5138
|
-
}
|
|
5139
|
-
},
|
|
5140
|
-
onSave: ()=>{
|
|
5141
|
-
const store = storeConnector.getStore();
|
|
5142
|
-
if (store) {
|
|
5143
|
-
store.getState().saveConsents('custom');
|
|
5144
|
-
stateManager.addEvent({
|
|
5145
|
-
type: 'consent_save',
|
|
5146
|
-
message: 'Saved consent preferences'
|
|
5147
|
-
});
|
|
5148
|
-
}
|
|
5149
|
-
},
|
|
5150
|
-
onAcceptAll: ()=>{
|
|
5151
|
-
const store = storeConnector.getStore();
|
|
5152
|
-
if (store) {
|
|
5153
|
-
store.getState().saveConsents('all');
|
|
5154
|
-
stateManager.addEvent({
|
|
5155
|
-
type: 'consent_save',
|
|
5156
|
-
message: 'Accepted all consents'
|
|
5157
|
-
});
|
|
5158
|
-
}
|
|
5159
|
-
},
|
|
5160
|
-
onRejectAll: ()=>{
|
|
5161
|
-
const store = storeConnector.getStore();
|
|
5162
|
-
if (store) {
|
|
5163
|
-
store.getState().saveConsents('necessary');
|
|
5164
|
-
stateManager.addEvent({
|
|
5165
|
-
type: 'consent_save',
|
|
5166
|
-
message: 'Rejected all optional consents'
|
|
5167
|
-
});
|
|
5168
|
-
}
|
|
5169
|
-
},
|
|
5170
|
-
onReset: async ()=>{
|
|
5171
|
-
const store = storeConnector.getStore();
|
|
5172
|
-
if (store) await resetAllConsents(store, stateManager);
|
|
5173
|
-
}
|
|
5174
|
-
});
|
|
5175
|
-
break;
|
|
5176
|
-
case 'location':
|
|
5177
|
-
renderLocationPanel(panelContent, {
|
|
5178
|
-
getState: getStoreState,
|
|
5179
|
-
onApplyOverrides: async (overrides)=>{
|
|
5180
|
-
const store = storeConnector.getStore();
|
|
5181
|
-
if (store) {
|
|
5182
|
-
await store.getState().setOverrides({
|
|
5183
|
-
country: overrides.country,
|
|
5184
|
-
region: overrides.region,
|
|
5185
|
-
language: overrides.language,
|
|
5186
|
-
gpc: overrides.gpc
|
|
5187
|
-
});
|
|
5188
|
-
persistOverrides({
|
|
5189
|
-
country: overrides.country,
|
|
5190
|
-
region: overrides.region,
|
|
5191
|
-
language: overrides.language,
|
|
5192
|
-
gpc: overrides.gpc
|
|
5193
|
-
});
|
|
5194
|
-
stateManager.addEvent({
|
|
5195
|
-
type: 'info',
|
|
5196
|
-
message: 'Overrides updated',
|
|
5197
|
-
data: {
|
|
5198
|
-
country: overrides.country,
|
|
5199
|
-
region: overrides.region,
|
|
5200
|
-
language: overrides.language,
|
|
5201
|
-
gpc: overrides.gpc
|
|
5202
|
-
}
|
|
5203
|
-
});
|
|
5204
|
-
}
|
|
5205
|
-
},
|
|
5206
|
-
onClearOverrides: async ()=>{
|
|
5207
|
-
const store = storeConnector.getStore();
|
|
5208
|
-
if (store) {
|
|
5209
|
-
await store.getState().setOverrides({
|
|
5210
|
-
country: void 0,
|
|
5211
|
-
region: void 0,
|
|
5212
|
-
language: void 0,
|
|
5213
|
-
gpc: void 0
|
|
5214
|
-
});
|
|
5215
|
-
clearPersistedOverrides();
|
|
5216
|
-
stateManager.addEvent({
|
|
5217
|
-
type: 'info',
|
|
5218
|
-
message: 'Overrides cleared'
|
|
5219
|
-
});
|
|
5220
|
-
}
|
|
5221
|
-
}
|
|
5222
|
-
});
|
|
5223
|
-
break;
|
|
5224
|
-
case "scripts":
|
|
5225
|
-
renderScriptsPanel(panelContent, {
|
|
5226
|
-
getState: getStoreState,
|
|
5227
|
-
getEvents: ()=>stateManager.getState().eventLog
|
|
5228
|
-
});
|
|
5229
|
-
break;
|
|
5230
|
-
case 'iab':
|
|
5231
|
-
renderIabPanel(panelContent, {
|
|
5232
|
-
getState: getStoreState,
|
|
5233
|
-
onSetPurposeConsent: (purposeId, value)=>{
|
|
5234
|
-
const iab = storeConnector.getStore()?.getState().iab;
|
|
5235
|
-
if (!iab) return;
|
|
5236
|
-
iab.setPurposeConsent(purposeId, value);
|
|
5237
|
-
stateManager.addEvent({
|
|
5238
|
-
type: 'iab',
|
|
5239
|
-
message: `IAB purpose ${purposeId} set to ${value}`,
|
|
5240
|
-
data: {
|
|
5241
|
-
purposeId,
|
|
5242
|
-
value
|
|
5243
|
-
}
|
|
5244
|
-
});
|
|
5245
|
-
},
|
|
5246
|
-
onSetVendorConsent: (vendorId, value)=>{
|
|
5247
|
-
const iab = storeConnector.getStore()?.getState().iab;
|
|
5248
|
-
if (!iab) return;
|
|
5249
|
-
iab.setVendorConsent(vendorId, value);
|
|
5250
|
-
stateManager.addEvent({
|
|
5251
|
-
type: 'iab',
|
|
5252
|
-
message: `IAB vendor ${vendorId} set to ${value}`,
|
|
5253
|
-
data: {
|
|
5254
|
-
vendorId,
|
|
5255
|
-
value
|
|
5256
|
-
}
|
|
5257
|
-
});
|
|
5258
|
-
},
|
|
5259
|
-
onSetSpecialFeatureOptIn: (featureId, value)=>{
|
|
5260
|
-
const iab = storeConnector.getStore()?.getState().iab;
|
|
5261
|
-
if (!iab) return;
|
|
5262
|
-
iab.setSpecialFeatureOptIn(featureId, value);
|
|
5263
|
-
stateManager.addEvent({
|
|
5264
|
-
type: 'iab',
|
|
5265
|
-
message: `IAB feature ${featureId} set to ${value}`,
|
|
5266
|
-
data: {
|
|
5267
|
-
featureId,
|
|
5268
|
-
value
|
|
5269
|
-
}
|
|
5270
|
-
});
|
|
5271
|
-
},
|
|
5272
|
-
onAcceptAll: ()=>{
|
|
5273
|
-
const iab = storeConnector.getStore()?.getState().iab;
|
|
5274
|
-
if (!iab) return;
|
|
5275
|
-
iab.acceptAll();
|
|
5276
|
-
stateManager.addEvent({
|
|
5277
|
-
type: 'iab',
|
|
5278
|
-
message: 'IAB accept all selected'
|
|
5279
|
-
});
|
|
5280
|
-
},
|
|
5281
|
-
onRejectAll: ()=>{
|
|
5282
|
-
const iab = storeConnector.getStore()?.getState().iab;
|
|
5283
|
-
if (!iab) return;
|
|
5284
|
-
iab.rejectAll();
|
|
5285
|
-
stateManager.addEvent({
|
|
5286
|
-
type: 'iab',
|
|
5287
|
-
message: 'IAB reject all selected'
|
|
5288
|
-
});
|
|
5289
|
-
},
|
|
5290
|
-
onSave: ()=>{
|
|
5291
|
-
const iab = storeConnector.getStore()?.getState().iab;
|
|
5292
|
-
if (!iab) return;
|
|
5293
|
-
iab.save().then(()=>{
|
|
5294
|
-
stateManager.addEvent({
|
|
5295
|
-
type: 'iab',
|
|
5296
|
-
message: 'IAB preferences saved'
|
|
5297
|
-
});
|
|
5298
|
-
}).catch((error)=>{
|
|
5299
|
-
stateManager.addEvent({
|
|
5300
|
-
type: 'error',
|
|
5301
|
-
message: `Failed to save IAB preferences: ${String(error)}`
|
|
5302
|
-
});
|
|
5303
|
-
});
|
|
5304
|
-
},
|
|
5305
|
-
onReset: async ()=>{
|
|
5306
|
-
const store = storeConnector.getStore();
|
|
5307
|
-
if (store) await resetAllConsents(store, stateManager);
|
|
5308
|
-
}
|
|
5309
|
-
});
|
|
5310
|
-
break;
|
|
5311
|
-
case 'events':
|
|
5312
|
-
renderEventsPanel(panelContent, {
|
|
5313
|
-
getEvents: ()=>stateManager.getState().eventLog,
|
|
5314
|
-
onClear: ()=>{
|
|
5315
|
-
stateManager.clearEventLog();
|
|
5316
|
-
stateManager.addEvent({
|
|
5317
|
-
type: 'info',
|
|
5318
|
-
message: 'Event log cleared'
|
|
5319
|
-
});
|
|
5320
|
-
}
|
|
5321
|
-
});
|
|
5322
|
-
break;
|
|
5323
|
-
case 'actions':
|
|
5324
|
-
renderActionsPanel(panelContent, {
|
|
5325
|
-
getState: getStoreState,
|
|
5326
|
-
onResetConsents: async ()=>{
|
|
5327
|
-
const store = storeConnector.getStore();
|
|
5328
|
-
if (store) await resetAllConsents(store, stateManager);
|
|
5329
|
-
},
|
|
5330
|
-
onRefetchBanner: async ()=>{
|
|
5331
|
-
const store = storeConnector.getStore();
|
|
5332
|
-
if (store) {
|
|
5333
|
-
await store.getState().initConsentManager();
|
|
5334
|
-
stateManager.addEvent({
|
|
5335
|
-
type: 'info',
|
|
5336
|
-
message: 'Banner data refetched'
|
|
5337
|
-
});
|
|
5338
|
-
}
|
|
5339
|
-
},
|
|
5340
|
-
onShowBanner: ()=>{
|
|
5341
|
-
const store = storeConnector.getStore();
|
|
5342
|
-
if (store) {
|
|
5343
|
-
store.getState().setActiveUI('banner', {
|
|
5344
|
-
force: true
|
|
5345
|
-
});
|
|
5346
|
-
stateManager.addEvent({
|
|
5347
|
-
type: 'info',
|
|
5348
|
-
message: 'Banner shown'
|
|
5349
|
-
});
|
|
5350
|
-
}
|
|
5351
|
-
},
|
|
5352
|
-
onOpenPreferences: ()=>{
|
|
5353
|
-
const store = storeConnector.getStore();
|
|
5354
|
-
if (store) {
|
|
5355
|
-
store.getState().setActiveUI('dialog');
|
|
5356
|
-
stateManager.addEvent({
|
|
5357
|
-
type: 'info',
|
|
5358
|
-
message: 'Preference center opened'
|
|
5359
|
-
});
|
|
5360
|
-
}
|
|
5361
|
-
},
|
|
5362
|
-
onCopyState: ()=>{
|
|
5363
|
-
const state = storeConnector.getState();
|
|
5364
|
-
if (state) {
|
|
5365
|
-
const stateCopy = {
|
|
5366
|
-
consents: state.consents,
|
|
5367
|
-
consentInfo: state.consentInfo,
|
|
5368
|
-
locationInfo: state.locationInfo,
|
|
5369
|
-
model: state.model,
|
|
5370
|
-
overrides: state.overrides,
|
|
5371
|
-
scripts: state.scripts?.map((s)=>({
|
|
5372
|
-
id: s.id
|
|
5373
|
-
})),
|
|
5374
|
-
loadedScripts: state.loadedScripts
|
|
5375
|
-
};
|
|
5376
|
-
navigator.clipboard.writeText(JSON.stringify(stateCopy, null, 2)).then(()=>{
|
|
5377
|
-
stateManager.addEvent({
|
|
5378
|
-
type: 'info',
|
|
5379
|
-
message: 'State copied to clipboard'
|
|
5380
|
-
});
|
|
5381
|
-
}).catch(()=>{
|
|
5382
|
-
stateManager.addEvent({
|
|
5383
|
-
type: 'error',
|
|
5384
|
-
message: 'Failed to copy state'
|
|
5385
|
-
});
|
|
5386
|
-
});
|
|
5387
|
-
}
|
|
5388
|
-
}
|
|
5389
|
-
});
|
|
5390
|
-
break;
|
|
5391
|
-
}
|
|
6268
|
+
panelRenderer.renderPanel(panelContent, currentActiveTab);
|
|
5392
6269
|
if (panel) panelHeightAnimator.animate(panel, previousPanelHeight);
|
|
5393
6270
|
}
|
|
5394
|
-
storeConnector.subscribe(()=>{
|
|
5395
|
-
panelInstance.update();
|
|
5396
|
-
});
|
|
5397
6271
|
const instance = {
|
|
5398
6272
|
open: ()=>stateManager.setOpen(true),
|
|
5399
6273
|
close: ()=>stateManager.setOpen(false),
|
|
@@ -5407,20 +6281,8 @@ function createDevTools(options = {}) {
|
|
|
5407
6281
|
};
|
|
5408
6282
|
},
|
|
5409
6283
|
destroy: ()=>{
|
|
5410
|
-
|
|
5411
|
-
|
|
5412
|
-
store.getState().setCallback('onBannerFetched', originalCallbacks.onBannerFetched);
|
|
5413
|
-
store.getState().setCallback('onConsentSet', originalCallbacks.onConsentSet);
|
|
5414
|
-
store.getState().setCallback('onError', originalCallbacks.onError);
|
|
5415
|
-
store.getState().setCallback('onBeforeConsentRevocationReload', originalCallbacks.onBeforeConsentRevocationReload);
|
|
5416
|
-
if (hasWrappedNetworkBlockerCallback) {
|
|
5417
|
-
const currentNetworkBlocker = store.getState().networkBlocker;
|
|
5418
|
-
if (currentNetworkBlocker) store.getState().setNetworkBlocker({
|
|
5419
|
-
...currentNetworkBlocker,
|
|
5420
|
-
onRequestBlocked: originalNetworkBlockedCallback
|
|
5421
|
-
});
|
|
5422
|
-
}
|
|
5423
|
-
}
|
|
6284
|
+
detachInstrumentation?.();
|
|
6285
|
+
detachInstrumentation = null;
|
|
5424
6286
|
panelHeightAnimator.destroy();
|
|
5425
6287
|
tabsInstance?.destroy();
|
|
5426
6288
|
panelInstance.destroy();
|
|
@@ -5434,31 +6296,20 @@ function createDevTools(options = {}) {
|
|
|
5434
6296
|
}
|
|
5435
6297
|
function createDevToolsPanel(options) {
|
|
5436
6298
|
const { namespace = 'c15tStore' } = options;
|
|
5437
|
-
let
|
|
5438
|
-
let hasWrappedEmbeddedNetworkBlocker = false;
|
|
6299
|
+
let detachInstrumentation = null;
|
|
5439
6300
|
const stateManager = createStateManager({
|
|
5440
6301
|
isOpen: true
|
|
5441
6302
|
});
|
|
5442
6303
|
const storeConnector = createStoreConnector({
|
|
5443
6304
|
namespace,
|
|
5444
6305
|
onConnect: (state, store)=>{
|
|
6306
|
+
detachInstrumentation?.();
|
|
6307
|
+
detachInstrumentation = registerStoreInstrumentation({
|
|
6308
|
+
namespace,
|
|
6309
|
+
store,
|
|
6310
|
+
onEvent: (event)=>stateManager.addEvent(event)
|
|
6311
|
+
});
|
|
5445
6312
|
stateManager.setConnected(true);
|
|
5446
|
-
const currentNetworkBlocker = state.networkBlocker;
|
|
5447
|
-
if (currentNetworkBlocker && !hasWrappedEmbeddedNetworkBlocker) {
|
|
5448
|
-
originalEmbeddedNetworkBlockedCallback = currentNetworkBlocker.onRequestBlocked;
|
|
5449
|
-
hasWrappedEmbeddedNetworkBlocker = true;
|
|
5450
|
-
store.getState().setNetworkBlocker({
|
|
5451
|
-
...currentNetworkBlocker,
|
|
5452
|
-
onRequestBlocked: (payload)=>{
|
|
5453
|
-
stateManager.addEvent({
|
|
5454
|
-
type: 'network',
|
|
5455
|
-
message: getBlockedRequestMessage(payload),
|
|
5456
|
-
data: payload
|
|
5457
|
-
});
|
|
5458
|
-
if ('function' == typeof originalEmbeddedNetworkBlockedCallback) originalEmbeddedNetworkBlockedCallback(payload);
|
|
5459
|
-
}
|
|
5460
|
-
});
|
|
5461
|
-
}
|
|
5462
6313
|
const persistedOverrides = loadPersistedOverrides();
|
|
5463
6314
|
if (persistedOverrides) {
|
|
5464
6315
|
const currentOverrides = normalizeOverridesForPersistence(state.overrides);
|
|
@@ -5470,7 +6321,36 @@ function createDevToolsPanel(options) {
|
|
|
5470
6321
|
});
|
|
5471
6322
|
}
|
|
5472
6323
|
},
|
|
5473
|
-
onDisconnect: ()=>
|
|
6324
|
+
onDisconnect: ()=>{
|
|
6325
|
+
stateManager.setConnected(false);
|
|
6326
|
+
detachInstrumentation?.();
|
|
6327
|
+
detachInstrumentation = null;
|
|
6328
|
+
}
|
|
6329
|
+
});
|
|
6330
|
+
const panelRenderer = createPanelRenderer({
|
|
6331
|
+
storeConnector,
|
|
6332
|
+
stateManager,
|
|
6333
|
+
enableEventLogging: false,
|
|
6334
|
+
onPersistOverrides: persistOverrides,
|
|
6335
|
+
onClearPersistedOverrides: clearPersistedOverrides,
|
|
6336
|
+
onCopyState: async (state)=>{
|
|
6337
|
+
try {
|
|
6338
|
+
await navigator.clipboard.writeText(JSON.stringify(createStateCopy(state), null, 2));
|
|
6339
|
+
return true;
|
|
6340
|
+
} catch {
|
|
6341
|
+
return false;
|
|
6342
|
+
}
|
|
6343
|
+
},
|
|
6344
|
+
onExportDebugBundle: ()=>{
|
|
6345
|
+
const bundle = createDebugBundle({
|
|
6346
|
+
namespace,
|
|
6347
|
+
devToolsState: stateManager.getState(),
|
|
6348
|
+
connection: storeConnector.getDiagnostics(),
|
|
6349
|
+
recentEvents: stateManager.getState().eventLog.slice(0, 100),
|
|
6350
|
+
storeState: sanitizeStoreState(storeConnector.getState())
|
|
6351
|
+
});
|
|
6352
|
+
downloadDebugBundle(bundle);
|
|
6353
|
+
}
|
|
5474
6354
|
});
|
|
5475
6355
|
const container = renderer_div({
|
|
5476
6356
|
style: {
|
|
@@ -5491,140 +6371,42 @@ function createDevToolsPanel(options) {
|
|
|
5491
6371
|
}
|
|
5492
6372
|
});
|
|
5493
6373
|
function renderActivePanel() {
|
|
5494
|
-
const
|
|
5495
|
-
|
|
5496
|
-
|
|
5497
|
-
|
|
5498
|
-
|
|
5499
|
-
|
|
5500
|
-
|
|
5501
|
-
|
|
5502
|
-
|
|
5503
|
-
|
|
5504
|
-
|
|
5505
|
-
|
|
5506
|
-
|
|
5507
|
-
|
|
5508
|
-
|
|
5509
|
-
|
|
5510
|
-
|
|
5511
|
-
|
|
5512
|
-
|
|
5513
|
-
|
|
5514
|
-
|
|
5515
|
-
|
|
5516
|
-
|
|
5517
|
-
|
|
5518
|
-
|
|
5519
|
-
|
|
5520
|
-
|
|
5521
|
-
|
|
5522
|
-
|
|
5523
|
-
|
|
5524
|
-
|
|
5525
|
-
|
|
5526
|
-
region: overrides.region,
|
|
5527
|
-
language: overrides.language,
|
|
5528
|
-
gpc: overrides.gpc
|
|
5529
|
-
});
|
|
5530
|
-
persistOverrides({
|
|
5531
|
-
country: overrides.country,
|
|
5532
|
-
region: overrides.region,
|
|
5533
|
-
language: overrides.language,
|
|
5534
|
-
gpc: overrides.gpc
|
|
5535
|
-
});
|
|
5536
|
-
}
|
|
5537
|
-
},
|
|
5538
|
-
onClearOverrides: async ()=>{
|
|
5539
|
-
await storeConnector.getStore()?.getState().setOverrides({
|
|
5540
|
-
country: void 0,
|
|
5541
|
-
region: void 0,
|
|
5542
|
-
language: void 0,
|
|
5543
|
-
gpc: void 0
|
|
5544
|
-
});
|
|
5545
|
-
clearPersistedOverrides();
|
|
5546
|
-
}
|
|
5547
|
-
});
|
|
5548
|
-
break;
|
|
5549
|
-
case "scripts":
|
|
5550
|
-
renderScriptsPanel(contentArea, {
|
|
5551
|
-
getState: getStoreState,
|
|
5552
|
-
getEvents: ()=>stateManager.getState().eventLog
|
|
5553
|
-
});
|
|
5554
|
-
break;
|
|
5555
|
-
case 'iab':
|
|
5556
|
-
renderIabPanel(contentArea, {
|
|
5557
|
-
getState: getStoreState,
|
|
5558
|
-
onSetPurposeConsent: (purposeId, value)=>{
|
|
5559
|
-
storeConnector.getStore()?.getState().iab?.setPurposeConsent(purposeId, value);
|
|
5560
|
-
},
|
|
5561
|
-
onSetVendorConsent: (vendorId, value)=>{
|
|
5562
|
-
storeConnector.getStore()?.getState().iab?.setVendorConsent(vendorId, value);
|
|
5563
|
-
},
|
|
5564
|
-
onSetSpecialFeatureOptIn: (featureId, value)=>{
|
|
5565
|
-
storeConnector.getStore()?.getState().iab?.setSpecialFeatureOptIn(featureId, value);
|
|
5566
|
-
},
|
|
5567
|
-
onAcceptAll: ()=>{
|
|
5568
|
-
storeConnector.getStore()?.getState().iab?.acceptAll();
|
|
5569
|
-
},
|
|
5570
|
-
onRejectAll: ()=>{
|
|
5571
|
-
storeConnector.getStore()?.getState().iab?.rejectAll();
|
|
5572
|
-
},
|
|
5573
|
-
onSave: ()=>{
|
|
5574
|
-
storeConnector.getStore()?.getState().iab?.save();
|
|
5575
|
-
},
|
|
5576
|
-
onReset: async ()=>{
|
|
5577
|
-
const store = storeConnector.getStore();
|
|
5578
|
-
if (store) await resetAllConsents(store);
|
|
5579
|
-
}
|
|
5580
|
-
});
|
|
5581
|
-
break;
|
|
5582
|
-
case 'events':
|
|
5583
|
-
renderEventsPanel(contentArea, {
|
|
5584
|
-
getEvents: ()=>stateManager.getState().eventLog,
|
|
5585
|
-
onClear: ()=>{
|
|
5586
|
-
stateManager.clearEventLog();
|
|
5587
|
-
}
|
|
5588
|
-
});
|
|
5589
|
-
break;
|
|
5590
|
-
case 'actions':
|
|
5591
|
-
renderActionsPanel(contentArea, {
|
|
5592
|
-
getState: getStoreState,
|
|
5593
|
-
onResetConsents: async ()=>{
|
|
5594
|
-
const store = storeConnector.getStore();
|
|
5595
|
-
if (store) await resetAllConsents(store);
|
|
5596
|
-
},
|
|
5597
|
-
onRefetchBanner: async ()=>{
|
|
5598
|
-
await storeConnector.getStore()?.getState().initConsentManager();
|
|
5599
|
-
},
|
|
5600
|
-
onShowBanner: ()=>{
|
|
5601
|
-
storeConnector.getStore()?.getState().setActiveUI('banner', {
|
|
5602
|
-
force: true
|
|
5603
|
-
});
|
|
5604
|
-
},
|
|
5605
|
-
onOpenPreferences: ()=>{
|
|
5606
|
-
storeConnector.getStore()?.getState().setActiveUI('dialog');
|
|
5607
|
-
},
|
|
5608
|
-
onCopyState: ()=>{
|
|
5609
|
-
const state = storeConnector.getState();
|
|
5610
|
-
if (state) navigator.clipboard.writeText(JSON.stringify(state, null, 2));
|
|
5611
|
-
}
|
|
5612
|
-
});
|
|
5613
|
-
break;
|
|
6374
|
+
const activeTab = syncTabs();
|
|
6375
|
+
panelRenderer.renderPanel(contentArea, activeTab);
|
|
6376
|
+
}
|
|
6377
|
+
let tabsInstance = null;
|
|
6378
|
+
let iabDisabled = true;
|
|
6379
|
+
function getDisabledTabs() {
|
|
6380
|
+
const disabledTabs = [];
|
|
6381
|
+
const storeState = storeConnector.getState();
|
|
6382
|
+
if (!storeState || 'iab' !== storeState.model) disabledTabs.push('iab');
|
|
6383
|
+
return disabledTabs;
|
|
6384
|
+
}
|
|
6385
|
+
function syncTabs() {
|
|
6386
|
+
const disabledTabs = getDisabledTabs();
|
|
6387
|
+
const nextIabDisabled = disabledTabs.includes('iab');
|
|
6388
|
+
let activeTab = stateManager.getState().activeTab;
|
|
6389
|
+
if (disabledTabs.includes(activeTab)) {
|
|
6390
|
+
activeTab = 'consents';
|
|
6391
|
+
stateManager.setActiveTab(activeTab);
|
|
6392
|
+
}
|
|
6393
|
+
if (tabsInstance && iabDisabled === nextIabDisabled) tabsInstance.setActiveTab(activeTab);
|
|
6394
|
+
else {
|
|
6395
|
+
tabsInstance?.destroy();
|
|
6396
|
+
tabsInstance = createTabs({
|
|
6397
|
+
activeTab,
|
|
6398
|
+
onTabChange: (tab)=>{
|
|
6399
|
+
stateManager.setActiveTab(tab);
|
|
6400
|
+
renderActivePanel();
|
|
6401
|
+
},
|
|
6402
|
+
disabledTabs
|
|
6403
|
+
});
|
|
6404
|
+
iabDisabled = nextIabDisabled;
|
|
6405
|
+
if (!tabsInstance.element.parentElement) container.appendChild(tabsInstance.element);
|
|
5614
6406
|
}
|
|
6407
|
+
return activeTab;
|
|
5615
6408
|
}
|
|
5616
|
-
|
|
5617
|
-
const disabledTabs = [];
|
|
5618
|
-
if (!storeState || 'iab' !== storeState.model) disabledTabs.push('iab');
|
|
5619
|
-
const tabsInstance = createTabs({
|
|
5620
|
-
activeTab: stateManager.getState().activeTab,
|
|
5621
|
-
onTabChange: (tab)=>{
|
|
5622
|
-
stateManager.setActiveTab(tab);
|
|
5623
|
-
renderActivePanel();
|
|
5624
|
-
},
|
|
5625
|
-
disabledTabs
|
|
5626
|
-
});
|
|
5627
|
-
container.appendChild(tabsInstance.element);
|
|
6409
|
+
syncTabs();
|
|
5628
6410
|
container.appendChild(contentArea);
|
|
5629
6411
|
renderActivePanel();
|
|
5630
6412
|
const unsubscribe = storeConnector.subscribe(()=>{
|
|
@@ -5633,16 +6415,10 @@ function createDevToolsPanel(options) {
|
|
|
5633
6415
|
return {
|
|
5634
6416
|
element: container,
|
|
5635
6417
|
destroy: ()=>{
|
|
5636
|
-
|
|
5637
|
-
|
|
5638
|
-
const currentNetworkBlocker = store.getState().networkBlocker;
|
|
5639
|
-
if (currentNetworkBlocker) store.getState().setNetworkBlocker({
|
|
5640
|
-
...currentNetworkBlocker,
|
|
5641
|
-
onRequestBlocked: originalEmbeddedNetworkBlockedCallback
|
|
5642
|
-
});
|
|
5643
|
-
}
|
|
6418
|
+
detachInstrumentation?.();
|
|
6419
|
+
detachInstrumentation = null;
|
|
5644
6420
|
unsubscribe();
|
|
5645
|
-
tabsInstance
|
|
6421
|
+
tabsInstance?.destroy();
|
|
5646
6422
|
storeConnector.destroy();
|
|
5647
6423
|
stateManager.destroy();
|
|
5648
6424
|
}
|