@incodetech/web 0.0.0-dev-20260831-e0b1ec3e → 0.0.0-dev-20260831-15fb9a3e

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.
Files changed (4) hide show
  1. package/dist/video-selfie/video-selfie.es.js +1 -2
  2. package/dist/workflow/styles.css +677 -129
  3. package/dist/workflow/workflow.es.js +2 -1
  4. package/package.json +2 -2
package/dist/video-selfie/video-selfie.es.js CHANGED
@@ -7,7 +7,7 @@ import { A as Button, d as SuccessIcon } from "../dropdownComposed-BWU8k5hZ.js";
7
7
  import { t as registerIncodeModuleElement } from "../incodeModule-Bvl3mk_L.js";
8
8
  import { a as IdFlipModal, c as VideoSelfieTutorial, i as IdMask, l as useVideoSelfiePermissions, n as SwitchingCameraScreen, o as preloadIdFlipAnimation, r as StepsHeader, s as SelfieMask, t as VideoSelfieFinalSuccessScreen } from "../finalSuccessScreen-bifs9LGs.js";
9
9
  import { eventModuleNames, eventScreenNames, screenEvent, videoSelfieEvents } from "@incodetech/core/events";
10
- import { VIDEO_SELFIE_VALIDATION_ATTEMPTS_EXHAUSTED_CODE, createConsentRecorder, createVideoSelfieCameraWarmer, createVideoSelfieRecordingManager, facingModeForStep, getVideoSelfieQuestions, getVoiceConsentPhrase, resolveVideoSelfieSteps, warmupVideoSelfieWasm } from "@incodetech/core/video-selfie";
10
+ import { VIDEO_SELFIE_VALIDATION_ATTEMPTS_EXHAUSTED_CODE, createConsentRecorder, createVideoSelfieCameraWarmer, createVideoSelfieRecordingManager, facingModeForStep, getVideoSelfieQuestions, getVoiceConsentPhrase, resolveVideoSelfieSteps } from "@incodetech/core/video-selfie";
11
11
  //#region src/modules/video-selfie/poaMask.tsx
12
12
  /**
13
13
  * Port of V1's `ProofOfAddressMask`: a pass-through overlay for the
@@ -442,7 +442,6 @@ var VideoSelfieContent = ({ config, onFinish, onError }) => {
442
442
  });
443
443
  y(() => {
444
444
  if ((phase === "tutorial" || phase === "permissions") && config) {
445
- warmupVideoSelfieWasm(config, steps);
446
445
  if (steps.some((step) => step === "frontId" || step === "backId")) {
447
446
  preloadCaptureAnimations();
448
447
  preloadIdFlipAnimation();
package/dist/workflow/styles.css CHANGED
@@ -65,135 +65,6 @@
65
65
  }
66
66
  }
67
67
 
68
- .IncodeCaptureContainer {
69
- flex-direction: column;
70
- flex: 1;
71
- justify-content: flex-start;
72
- align-items: center;
73
- width: 100%;
74
- height: 100%;
75
- display: flex;
76
- position: relative;
77
- overflow: hidden;
78
- }
79
-
80
- .IncodeCaptureContainer .IncodeCaptureFrame {
81
- aspect-ratio: 1;
82
- width: 100%;
83
- max-width: var(--face-capture-frame-max-w);
84
- border-radius: var(--radius-full, var(--border-radius-full));
85
- border-style: var(--tw-border-style);
86
- border-width: 12px;
87
- border-color: #0000;
88
- position: relative;
89
- }
90
-
91
- .IncodeCaptureContainer .IncodeCaptureVideoWrapper {
92
- --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
93
- --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
94
- width: calc(100% - 24px);
95
- height: calc(100% - 24px);
96
- translate: var(--tw-translate-x) var(--tw-translate-y);
97
- transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
98
- border-radius: var(--radius-full, var(--border-radius-full));
99
- background-color: var(--color-surface-neutral-100-static, var(--surface-neutral-100-static));
100
- justify-content: center;
101
- align-items: center;
102
- display: flex;
103
- position: absolute;
104
- top: 50%;
105
- left: 50%;
106
- overflow: hidden;
107
- }
108
-
109
- .IncodeCaptureContainer .IncodeCaptureVideo {
110
- z-index: 50;
111
- width: 100%;
112
- height: 100%;
113
- position: absolute;
114
- }
115
-
116
- .IncodeCaptureContainer .IncodeCaptureVideoElement {
117
- object-fit: cover;
118
- width: 100%;
119
- height: 100%;
120
- position: absolute;
121
- }
122
-
123
- .IncodeCaptureContainer .IncodeCaptureVideoElement.IncodeCaptureVideoMirrored {
124
- transform: scaleX(-1);
125
- }
126
-
127
- .IncodeCaptureContainer .IncodeCaptureAvatarHost {
128
- width: 100%;
129
- height: 100%;
130
- position: absolute;
131
- }
132
-
133
- .IncodeCaptureContainer .IncodeCaptureAvatarElement {
134
- object-fit: cover;
135
- width: 100%;
136
- height: 100%;
137
- position: absolute;
138
- }
139
-
140
- .IncodeCaptureContainer .IncodeCaptureAvatarElement.IncodeCaptureAvatarMirrored {
141
- transform: scaleX(-1);
142
- }
143
-
144
- .IncodeCaptureVisuallyHidden {
145
- clip-path: inset(50%);
146
- white-space: nowrap;
147
- border-width: 0;
148
- width: 1px;
149
- height: 1px;
150
- margin: -1px;
151
- padding: 0;
152
- position: absolute;
153
- overflow: hidden;
154
- }
155
-
156
- .IncodeFaceOutline {
157
- width: 100%;
158
- height: 100%;
159
- }
160
-
161
- .IncodeLoadingBorder {
162
- aspect-ratio: 1;
163
- width: 100%;
164
- max-width: var(--face-capture-frame-max-w);
165
- position: absolute;
166
- }
167
-
168
- .IncodeLoadingBorder .IncodeLoadingBorderBase, .IncodeLoadingBorder .IncodeLoadingBorderForeground {
169
- inset: var(--spacing-0, var(--spacing-none, 0px));
170
- position: absolute;
171
- }
172
-
173
- .IncodeLoadingBorder .IncodeLoadingBorderForeground.IncodeLoadingBorderSpinning {
174
- animation: var(--animate-spin, spin 1s linear infinite);
175
- }
176
-
177
- .IncodeLoadingBorder .IncodeLoadingBorderPath {
178
- transition: all 1s ease-in-out;
179
- }
180
-
181
- .IncodeNotification {
182
- flex-direction: column;
183
- align-items: center;
184
- display: flex;
185
- }
186
-
187
- .IncodeNotification .IncodeNotificationText {
188
- text-align: center;
189
- font-family: var(--typography-feedback-family);
190
- font-size: var(--typography-feedback-l-size);
191
- font-weight: var(--typography-feedback-l-weight);
192
- line-height: var(--typography-feedback-l-line-height);
193
- letter-spacing: var(--typography-feedback-l-letter-spacing);
194
- color: var(--color-text-body-primary, var(--text-body-800-primary));
195
- }
196
-
197
68
  .IncodeCameraButton {
198
69
  justify-content: center;
199
70
  align-items: center;
@@ -435,6 +306,683 @@
435
306
  overflow: hidden;
436
307
  }
437
308
 
309
+ .IncodeCaptureContainer {
310
+ flex-direction: column;
311
+ flex: 1;
312
+ justify-content: flex-start;
313
+ align-items: center;
314
+ width: 100%;
315
+ height: 100%;
316
+ display: flex;
317
+ position: relative;
318
+ overflow: hidden;
319
+ }
320
+
321
+ .IncodeCaptureContainer .IncodeCaptureFrame {
322
+ aspect-ratio: 1;
323
+ width: 100%;
324
+ max-width: var(--face-capture-frame-max-w);
325
+ border-radius: var(--radius-full, var(--border-radius-full));
326
+ border-style: var(--tw-border-style);
327
+ border-width: 12px;
328
+ border-color: #0000;
329
+ position: relative;
330
+ }
331
+
332
+ .IncodeCaptureContainer .IncodeCaptureVideoWrapper {
333
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
334
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
335
+ width: calc(100% - 24px);
336
+ height: calc(100% - 24px);
337
+ translate: var(--tw-translate-x) var(--tw-translate-y);
338
+ transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
339
+ border-radius: var(--radius-full, var(--border-radius-full));
340
+ background-color: var(--color-surface-neutral-100-static, var(--surface-neutral-100-static));
341
+ justify-content: center;
342
+ align-items: center;
343
+ display: flex;
344
+ position: absolute;
345
+ top: 50%;
346
+ left: 50%;
347
+ overflow: hidden;
348
+ }
349
+
350
+ .IncodeCaptureContainer .IncodeCaptureVideo {
351
+ z-index: 50;
352
+ width: 100%;
353
+ height: 100%;
354
+ position: absolute;
355
+ }
356
+
357
+ .IncodeCaptureContainer .IncodeCaptureVideoElement {
358
+ object-fit: cover;
359
+ width: 100%;
360
+ height: 100%;
361
+ position: absolute;
362
+ }
363
+
364
+ .IncodeCaptureContainer .IncodeCaptureVideoElement.IncodeCaptureVideoMirrored {
365
+ transform: scaleX(-1);
366
+ }
367
+
368
+ .IncodeCaptureContainer .IncodeCaptureAvatarHost {
369
+ width: 100%;
370
+ height: 100%;
371
+ position: absolute;
372
+ }
373
+
374
+ .IncodeCaptureContainer .IncodeCaptureAvatarElement {
375
+ object-fit: cover;
376
+ width: 100%;
377
+ height: 100%;
378
+ position: absolute;
379
+ }
380
+
381
+ .IncodeCaptureContainer .IncodeCaptureAvatarElement.IncodeCaptureAvatarMirrored {
382
+ transform: scaleX(-1);
383
+ }
384
+
385
+ .IncodeCaptureVisuallyHidden {
386
+ clip-path: inset(50%);
387
+ white-space: nowrap;
388
+ border-width: 0;
389
+ width: 1px;
390
+ height: 1px;
391
+ margin: -1px;
392
+ padding: 0;
393
+ position: absolute;
394
+ overflow: hidden;
395
+ }
396
+
397
+ .IncodeFaceOutline {
398
+ width: 100%;
399
+ height: 100%;
400
+ }
401
+
402
+ .IncodeLoadingBorder {
403
+ aspect-ratio: 1;
404
+ width: 100%;
405
+ max-width: var(--face-capture-frame-max-w);
406
+ position: absolute;
407
+ }
408
+
409
+ .IncodeLoadingBorder .IncodeLoadingBorderBase, .IncodeLoadingBorder .IncodeLoadingBorderForeground {
410
+ inset: var(--spacing-0, var(--spacing-none, 0px));
411
+ position: absolute;
412
+ }
413
+
414
+ .IncodeLoadingBorder .IncodeLoadingBorderForeground.IncodeLoadingBorderSpinning {
415
+ animation: var(--animate-spin, spin 1s linear infinite);
416
+ }
417
+
418
+ .IncodeLoadingBorder .IncodeLoadingBorderPath {
419
+ transition: all 1s ease-in-out;
420
+ }
421
+
422
+ .IncodeNotification {
423
+ flex-direction: column;
424
+ align-items: center;
425
+ display: flex;
426
+ }
427
+
428
+ .IncodeNotification .IncodeNotificationText {
429
+ text-align: center;
430
+ font-family: var(--typography-feedback-family);
431
+ font-size: var(--typography-feedback-l-size);
432
+ font-weight: var(--typography-feedback-l-weight);
433
+ line-height: var(--typography-feedback-l-line-height);
434
+ letter-spacing: var(--typography-feedback-l-letter-spacing);
435
+ color: var(--color-text-body-primary, var(--text-body-800-primary));
436
+ }
437
+
438
+ .IncodeVideoSelfieCapturePage {
439
+ background-color: var(--capture-page-backdrop-color);
440
+ }
441
+
442
+ .IncodeVideoSelfieCapturePage .IncodePageInner {
443
+ padding: var(--spacing-0, var(--spacing-none, 0px));
444
+ }
445
+
446
+ .IncodeVideoSelfieCapturePage .IncodePageContent {
447
+ flex: 1;
448
+ position: relative;
449
+ }
450
+
451
+ .IncodeVideoSelfieOverlay {
452
+ pointer-events: none;
453
+ inset: var(--spacing-0, var(--spacing-none, 0px));
454
+ z-index: 10;
455
+ flex-direction: column;
456
+ align-items: center;
457
+ display: flex;
458
+ position: absolute;
459
+ container-type: inline-size;
460
+ }
461
+
462
+ .IncodeVideoSelfieSwitchingCameraPage {
463
+ background-color: var(--color-surface-neutral-900-static, var(--surface-neutral-900-static));
464
+ }
465
+
466
+ .IncodeVideoSelfieSwitchingCameraPage .IncodePageInner {
467
+ padding: var(--spacing-0, var(--spacing-none, 0px));
468
+ }
469
+
470
+ .IncodeVideoSelfieSwitchingCameraPage .IncodePageContent {
471
+ flex: 1;
472
+ position: relative;
473
+ }
474
+
475
+ .IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCamera {
476
+ width: 100%;
477
+ height: 100%;
478
+ padding-inline: var(--spacing-24, var(--spacing-24, 24px));
479
+ flex-direction: column;
480
+ justify-content: center;
481
+ align-items: center;
482
+ display: flex;
483
+ position: relative;
484
+ }
485
+
486
+ .IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraContent {
487
+ align-items: center;
488
+ gap: var(--spacing-16, var(--spacing-16, 16px));
489
+ text-align: center;
490
+ flex-direction: column;
491
+ display: flex;
492
+ }
493
+
494
+ .IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraIcon {
495
+ width: var(--spacing-40, var(--spacing-40, 40px));
496
+ height: var(--spacing-40, var(--spacing-40, 40px));
497
+ }
498
+
499
+ .IncodeVideoSelfieSwitchingCameraPage .IncodeVideoSelfieSwitchingCameraTitle {
500
+ font-family: var(--typography-headline-family);
501
+ font-size: var(--typography-headline-h2-size);
502
+ font-weight: var(--typography-headline-h2-weight);
503
+ line-height: var(--typography-headline-h2-line-height);
504
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
505
+ color: var(--color-text-body-0-static, var(--text-body-0-static));
506
+ }
507
+
508
+ .IncodeVideoSelfieTutorialPage .IncodePageContent {
509
+ min-height: var(--spacing-0, var(--spacing-none, 0px));
510
+ }
511
+
512
+ .IncodeVideoSelfieTutorialBody {
513
+ margin-top: var(--spacing-24, var(--spacing-24, 24px));
514
+ min-height: var(--spacing-0, var(--spacing-none, 0px));
515
+ flex: 1;
516
+ overflow-y: auto;
517
+ }
518
+
519
+ .IncodeVideoSelfieTutorialSteps {
520
+ width: 100%;
521
+ max-width: var(--incode-form-max-w);
522
+ gap: var(--spacing-8, var(--spacing-8, 8px));
523
+ flex-direction: column;
524
+ margin-inline: auto;
525
+ display: flex;
526
+ }
527
+
528
+ .IncodeVideoSelfieTutorialStep {
529
+ align-items: center;
530
+ gap: var(--spacing-12, var(--spacing-12, 12px));
531
+ display: flex;
532
+ }
533
+
534
+ .IncodeVideoSelfieTutorialStepIcon {
535
+ width: var(--spacing-40, var(--spacing-40, 40px));
536
+ height: var(--spacing-40, var(--spacing-40, 40px));
537
+ border-radius: var(--radius-small, var(--border-radius-small));
538
+ border-style: var(--tw-border-style);
539
+ border-width: 2px;
540
+ border-color: var(--color-border-neutral-100, var(--border-neutral-100));
541
+ background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
542
+ color: var(--color-text-body-secondary, var(--text-body-500-secondary));
543
+ flex-shrink: 0;
544
+ justify-content: center;
545
+ align-items: center;
546
+ display: flex;
547
+ position: relative;
548
+ }
549
+
550
+ .IncodeVideoSelfieTutorialStepIcon svg {
551
+ height: var(--spacing-24, var(--spacing-24, 24px));
552
+ width: var(--spacing-24, var(--spacing-24, 24px));
553
+ }
554
+
555
+ .IncodeVideoSelfieTutorialStep:not(:last-child) .IncodeVideoSelfieTutorialStepIcon:after {
556
+ content: "";
557
+ height: var(--spacing-8, var(--spacing-8, 8px));
558
+ width: var(--spacing-2, var(--spacing-2, 2px));
559
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
560
+ translate: var(--tw-translate-x) var(--tw-translate-y);
561
+ background-color: var(--color-border-neutral-100, var(--border-neutral-100));
562
+ position: absolute;
563
+ top: 100%;
564
+ left: 50%;
565
+ }
566
+
567
+ .IncodeVideoSelfieTutorialStepLabel {
568
+ text-align: left;
569
+ font-family: var(--typography-headline-family);
570
+ font-size: var(--typography-headline-h4-size);
571
+ font-weight: var(--typography-headline-h4-weight);
572
+ line-height: var(--typography-headline-h4-line-height);
573
+ letter-spacing: var(--typography-headline-h4-letter-spacing);
574
+ color: var(--color-text-body-secondary, var(--text-body-500-secondary));
575
+ }
576
+
577
+ .IncodeVideoSelfieTutorialActions {
578
+ bottom: var(--spacing-0, var(--spacing-none, 0px));
579
+ background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
580
+ width: 100%;
581
+ padding-top: var(--spacing-24, var(--spacing-24, 24px));
582
+ padding-bottom: var(--spacing-24, var(--spacing-24, 24px));
583
+ flex-shrink: 0;
584
+ display: flex;
585
+ position: sticky;
586
+ }
587
+
588
+ .IncodeVideoSelfieTutorialStartButton {
589
+ max-width: var(--incode-form-max-w);
590
+ margin: auto;
591
+ }
592
+
593
+ .IncodeVsStepsHeader {
594
+ inset-inline: var(--spacing-0, var(--spacing-none, 0px));
595
+ top: var(--spacing-0, var(--spacing-none, 0px));
596
+ gap: var(--spacing-2, var(--spacing-2, 2px));
597
+ width: 100%;
598
+ padding-inline: var(--spacing-24, var(--spacing-24, 24px));
599
+ padding-top: var(--spacing-24, var(--spacing-24, 24px));
600
+ color: var(--color-text-body-0-static, var(--text-body-0-static));
601
+ z-index: var(--video-selfie-chrome-z-index);
602
+ background-color: #0000;
603
+ list-style-type: none;
604
+ display: flex;
605
+ position: absolute;
606
+ }
607
+
608
+ .IncodeVsStepsHeader .IncodeVsStepsHeaderStep {
609
+ align-items: center;
610
+ gap: var(--spacing-8, var(--spacing-8, 8px));
611
+ width: 100%;
612
+ height: var(--video-selfie-stepper-height);
613
+ flex-direction: column;
614
+ flex: 1;
615
+ display: flex;
616
+ position: relative;
617
+ }
618
+
619
+ .IncodeVsStepsHeader .IncodeVsStepsHeaderStep img {
620
+ width: var(--spacing-32, var(--spacing-32, 32px));
621
+ height: var(--spacing-32, var(--spacing-32, 32px));
622
+ }
623
+
624
+ .IncodeVsStepsHeader .IncodeVsStepsHeaderPill {
625
+ border-radius: var(--radius-full, var(--border-radius-full));
626
+ background-color: var(--color-surface-neutral-200, var(--surface-neutral-200));
627
+ width: 100%;
628
+ height: var(--video-selfie-stepper-pill-height);
629
+ opacity: .25;
630
+ transition: opacity .3s ease-in-out;
631
+ }
632
+
633
+ .IncodeVsStepsHeader .IncodeVsStepsHeaderStepCompleted .IncodeVsStepsHeaderPill {
634
+ opacity: .5;
635
+ }
636
+
637
+ .IncodeVsStepsHeader .IncodeVsStepsHeaderStepCurrent .IncodeVsStepsHeaderPill {
638
+ opacity: 1;
639
+ }
640
+
641
+ .IncodeVsStepsHeader.IncodeVsStepsHeaderFinished .IncodeVsStepsHeaderPill {
642
+ background-color: var(--border-status-positive-static);
643
+ opacity: 1;
644
+ }
645
+
646
+ .IncodeVsSelfieManualCapture {
647
+ pointer-events: auto;
648
+ }
649
+
650
+ .IncodeVideoSelfieOverlay .IncodeVsSelfieMask {
651
+ border-radius: var(--radius-full, var(--border-radius-full));
652
+ z-index: var(--video-selfie-mask-z-index);
653
+ width: 86cqw;
654
+ height: 86cqw;
655
+ box-shadow: var(--video-selfie-mask-vignette-shadow);
656
+ position: absolute;
657
+ top: calc(50% - 7cqw);
658
+ left: 50%;
659
+ transform: translate(-50%, -50%);
660
+ }
661
+
662
+ .IncodeVideoSelfieOverlay .IncodeVsSelfieMask .IncodeVsSelfieMaskRing {
663
+ inset: var(--spacing-0, var(--spacing-none, 0px));
664
+ width: 100%;
665
+ height: 100%;
666
+ position: absolute;
667
+ overflow: visible;
668
+ }
669
+
670
+ .IncodeVideoSelfieOverlay .IncodeVsSelfieMaskFeedback {
671
+ inset-inline: var(--spacing-0, var(--spacing-none, 0px));
672
+ align-items: center;
673
+ gap: var(--spacing-16, var(--spacing-16, 16px));
674
+ text-align: center;
675
+ width: 100%;
676
+ z-index: var(--video-selfie-chrome-z-index);
677
+ max-width: var(--video-selfie-feedback-max-width);
678
+ flex-direction: column;
679
+ margin-inline: auto;
680
+ display: flex;
681
+ position: absolute;
682
+ top: calc(50% + 36cqw + 40px);
683
+ }
684
+
685
+ .IncodeVideoSelfieOverlay .IncodeVsSelfieMaskIcon {
686
+ width: var(--spacing-32, var(--spacing-32, 32px));
687
+ height: var(--spacing-32, var(--spacing-32, 32px));
688
+ }
689
+
690
+ .IncodeVideoSelfieOverlay .IncodeVsSelfieMaskText {
691
+ margin: var(--spacing-0, var(--spacing-none, 0px));
692
+ font-family: var(--typography-headline-family);
693
+ font-size: var(--typography-headline-h2-size);
694
+ font-weight: var(--typography-headline-h2-weight);
695
+ line-height: var(--typography-headline-h2-line-height);
696
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
697
+ color: var(--color-text-body-0-static, var(--text-body-0-static));
698
+ }
699
+
700
+ .IncodeVsIdMask {
701
+ z-index: 50;
702
+ padding-inline: var(--spacing-24);
703
+ justify-content: center;
704
+ align-items: center;
705
+ display: flex;
706
+ position: absolute;
707
+ inset: 0;
708
+ }
709
+
710
+ .IncodeVsIdMask .IncodeVsIdManualCapture {
711
+ bottom: var(--spacing-32);
712
+ z-index: 60;
713
+ pointer-events: auto;
714
+ position: absolute;
715
+ left: 50%;
716
+ transform: translateX(-50%);
717
+ }
718
+
719
+ .IncodeVsIdMask .IncodeIdCaptureNotification {
720
+ top: calc(var(--spacing-24) + var(--video-selfie-stepper-height) + var(--spacing-16));
721
+ }
722
+
723
+ .IncodeVsIdMask .IncodeIdCaptureNotification .IncodeIdCaptureNotificationContent {
724
+ background-color: var(--surface-neutral-900-static);
725
+ }
726
+
727
+ .IncodeVsIdMask .IncodeVsIdFeedback {
728
+ z-index: 100;
729
+ justify-content: center;
730
+ align-items: center;
731
+ gap: var(--spacing-12, var(--spacing-12, 12px));
732
+ border-radius: var(--radius-medium, var(--border-radius-medium));
733
+ padding: var(--spacing-32, var(--spacing-32, 32px));
734
+ text-align: center;
735
+ font-family: var(--typography-headline-family);
736
+ font-size: var(--typography-headline-h2-size);
737
+ font-weight: var(--typography-headline-h2-weight);
738
+ line-height: var(--typography-headline-h2-line-height);
739
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
740
+ color: var(--color-text-body-0-static, var(--text-body-0-static));
741
+ background-color: var(--surface-neutral-900-static);
742
+ border: var(--border-width-regular) solid var(--border-neutral-100-static);
743
+ width: max-content;
744
+ max-width: var(--video-selfie-id-feedback-max-width);
745
+ flex-direction: column;
746
+ display: flex;
747
+ position: absolute;
748
+ top: 50%;
749
+ left: 50%;
750
+ overflow: hidden;
751
+ transform: translate(-50%, -50%);
752
+ }
753
+
754
+ .IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackError {
755
+ width: var(--video-selfie-id-feedback-width);
756
+ }
757
+
758
+ .IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackProcessing {
759
+ gap: var(--spacing-16);
760
+ color: var(--text-body-50-static);
761
+ width: var(--video-selfie-id-processing-feedback-width);
762
+ height: var(--video-selfie-id-processing-feedback-height);
763
+ }
764
+
765
+ .IncodeVsIdMask .IncodeVsIdFeedback.IncodeVsIdFeedbackProcessing p {
766
+ white-space: nowrap;
767
+ }
768
+
769
+ .IncodeVsIdMask .IncodeVsIdFeedback .IncodeVsIdFeedbackSpinnerPrimary {
770
+ fill: var(--spinner-surface-primary);
771
+ }
772
+
773
+ .IncodeVsIdMask .IncodeVsIdFeedback .IncodeVsIdFeedbackSpinnerSecondary {
774
+ fill: var(--surface-brand-900-static);
775
+ }
776
+
777
+ .IncodeVsIdFlipModal .IncodeModalDialog {
778
+ max-width: none;
779
+ height: 100%;
780
+ }
781
+
782
+ .IncodeVsIdFlipModal .IncodeModalContent {
783
+ border-radius: var(--radius-none, var(--border-radius-none));
784
+ background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
785
+ max-width: none;
786
+ height: 100%;
787
+ padding: var(--spacing-24, var(--spacing-24, 24px));
788
+ justify-content: center;
789
+ gap: var(--video-selfie-id-flip-gap);
790
+ }
791
+
792
+ .IncodeVsIdFlipModal .IncodeModalTitleSectionCenter {
793
+ margin: var(--spacing-0, var(--spacing-none, 0px));
794
+ }
795
+
796
+ .IncodeVsIdFlipModal .IncodeVsIdFlipAnimation {
797
+ height: var(--video-selfie-id-flip-animation-height);
798
+ width: var(--video-selfie-id-flip-animation-width);
799
+ overflow: hidden;
800
+ }
801
+
802
+ .IncodeVsFinalSuccess {
803
+ justify-content: center;
804
+ align-items: center;
805
+ gap: var(--spacing-12, var(--spacing-12, 12px));
806
+ padding-block: var(--spacing-16, var(--spacing-16, 16px));
807
+ flex-direction: column;
808
+ flex: 1;
809
+ display: flex;
810
+ }
811
+
812
+ .IncodeVsFinalSuccess .IncodeVsFinalSuccessTitle {
813
+ margin: var(--spacing-0, var(--spacing-none, 0px));
814
+ text-align: center;
815
+ font-family: var(--typography-headline-family);
816
+ font-size: var(--typography-headline-h2-size);
817
+ font-weight: var(--typography-headline-h2-weight);
818
+ line-height: var(--typography-headline-h2-line-height);
819
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
820
+ color: var(--color-text-body-primary, var(--text-body-800-primary));
821
+ }
822
+
823
+ .IncodeVsPoaMask {
824
+ pointer-events: none;
825
+ z-index: 50;
826
+ position: absolute;
827
+ inset: 0;
828
+ }
829
+
830
+ .IncodeVsPoaBanner {
831
+ top: var(--spacing-0, var(--spacing-none, 0px));
832
+ right: var(--spacing-0, var(--spacing-none, 0px));
833
+ left: var(--spacing-0, var(--spacing-none, 0px));
834
+ background-color: var(--color-surface-neutral-1000-80-static, var(--surface-neutral-1000-80-static));
835
+ padding-inline: var(--spacing-16, var(--spacing-16, 16px));
836
+ padding-top: var(--poa-mask-banner-padding-top);
837
+ padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
838
+ justify-content: center;
839
+ align-items: center;
840
+ display: flex;
841
+ position: absolute;
842
+ }
843
+
844
+ .IncodeVsPoaBannerText {
845
+ text-align: center;
846
+ color: var(--poa-mask-banner-text-color);
847
+ margin: 0;
848
+ font-size: 1.5rem;
849
+ font-weight: 700;
850
+ line-height: 1.4;
851
+ }
852
+
853
+ .IncodeVsPoaBannerEmphasis {
854
+ color: var(--poa-mask-emphasis-color);
855
+ }
856
+
857
+ .IncodeVsPoaActions {
858
+ right: var(--spacing-16, var(--spacing-16, 16px));
859
+ bottom: var(--spacing-16, var(--spacing-16, 16px));
860
+ left: var(--spacing-16, var(--spacing-16, 16px));
861
+ justify-content: center;
862
+ display: flex;
863
+ position: absolute;
864
+ }
865
+
866
+ .IncodeVsPoaButton {
867
+ pointer-events: auto;
868
+ width: 100%;
869
+ }
870
+
871
+ .IncodeVsVoicePanel {
872
+ pointer-events: auto;
873
+ z-index: var(--video-selfie-mask-z-index);
874
+ align-items: center;
875
+ gap: var(--spacing-12);
876
+ padding: var(--spacing-20) var(--spacing-16);
877
+ border-radius: var(--border-radius-large);
878
+ background: var(--surface-neutral-0-static);
879
+ color: var(--text-body-800-primary-static);
880
+ border: var(--video-selfie-voice-panel-border-width) solid transparent;
881
+ box-shadow: var(--video-selfie-voice-vignette-shadow);
882
+ flex-direction: column;
883
+ transition: border-color .3s ease-in-out;
884
+ display: flex;
885
+ position: absolute;
886
+ bottom: 10px;
887
+ left: 10px;
888
+ right: 10px;
889
+ }
890
+
891
+ .IncodeVsVoicePanel.IncodeVsVoicePanelActive {
892
+ border-color: var(--border-brand-500);
893
+ }
894
+
895
+ .IncodeVsVoicePanel.IncodeVsVoicePanelProcessing {
896
+ border-style: var(--tw-border-style);
897
+ left: var(--spacing-8);
898
+ right: var(--spacing-8);
899
+ bottom: var(--spacing-8);
900
+ justify-content: center;
901
+ align-items: center;
902
+ gap: var(--spacing-16);
903
+ height: var(--video-selfie-voice-processing-height);
904
+ min-height: var(--video-selfie-voice-processing-height);
905
+ padding: var(--spacing-24) var(--spacing-16);
906
+ border-width: 0;
907
+ }
908
+
909
+ .IncodeVsVoicePanel .IncodeVsVoicePanelProcessingTitle {
910
+ margin: var(--spacing-0, var(--spacing-none, 0px));
911
+ text-align: center;
912
+ font-family: var(--typography-headline-family);
913
+ font-size: var(--typography-headline-h2-size);
914
+ font-weight: var(--typography-headline-h2-weight);
915
+ line-height: var(--typography-headline-h2-line-height);
916
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
917
+ color: var(--color-spinner-text-title, var(--spinner-text-title));
918
+ }
919
+
920
+ .IncodeVsVoicePanel .IncodeVsVoicePanelLabel {
921
+ margin: var(--spacing-0, var(--spacing-none, 0px));
922
+ font-family: var(--typography-headline-family);
923
+ font-size: var(--typography-headline-h4-size);
924
+ font-weight: var(--typography-headline-h4-weight);
925
+ line-height: var(--typography-headline-h4-line-height);
926
+ letter-spacing: var(--typography-headline-h4-letter-spacing);
927
+ color: var(--text-body-500-secondary-static);
928
+ }
929
+
930
+ .IncodeVsVoicePanel .IncodeVsVoicePanelTitle {
931
+ margin: var(--spacing-0, var(--spacing-none, 0px));
932
+ padding-inline: var(--spacing-16, var(--spacing-16, 16px));
933
+ text-align: center;
934
+ font-family: var(--typography-headline-family);
935
+ font-size: var(--typography-headline-h2-size);
936
+ font-weight: var(--typography-headline-h2-weight);
937
+ line-height: var(--typography-headline-h2-line-height);
938
+ letter-spacing: var(--typography-headline-h2-letter-spacing);
939
+ color: var(--text-body-800-primary-static);
940
+ }
941
+
942
+ .IncodeVsVoicePanel .IncodeVsVoicePanelButton {
943
+ width: 100%;
944
+ }
945
+
946
+ .IncodeVsVoicePanel .IncodeVsVoiceStepper {
947
+ margin: var(--spacing-0, var(--spacing-none, 0px));
948
+ gap: var(--spacing-8, var(--spacing-8, 8px));
949
+ width: 100%;
950
+ padding: var(--spacing-0, var(--spacing-none, 0px));
951
+ list-style-type: none;
952
+ display: flex;
953
+ }
954
+
955
+ .IncodeVsVoicePanel .IncodeVsVoiceStep {
956
+ height: var(--spacing-4);
957
+ border-radius: var(--border-radius-full);
958
+ background: var(--surface-neutral-100-static);
959
+ flex: 1;
960
+ }
961
+
962
+ .IncodeVsVoicePanel .IncodeVsVoiceStepActive {
963
+ background: var(--surface-brand-500-static);
964
+ }
965
+
966
+ .IncodeVsVoicePanel .IncodeVsVoiceMic {
967
+ width: var(--spacing-16);
968
+ height: var(--spacing-16);
969
+ border-radius: var(--border-radius-full);
970
+ background: var(--icon-status-negative);
971
+ animation: 1.2s ease-in-out infinite IncodeVsVoiceMicPulse;
972
+ }
973
+
974
+ @keyframes IncodeVsVoiceMicPulse {
975
+ 0%, 100% {
976
+ opacity: 1;
977
+ transform: scale(1);
978
+ }
979
+
980
+ 50% {
981
+ opacity: .4;
982
+ transform: scale(.8);
983
+ }
984
+ }
985
+
438
986
  .IncodePhonePage .IncodePageContent {
439
987
  padding-top: var(--spacing-32, var(--spacing-32, 32px));
440
988
  padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
package/dist/workflow/workflow.es.js CHANGED
@@ -4,7 +4,7 @@ import { i as fetchAndApplyTheme } from "../dashboardTheme-fO-uG9u5.js";
4
4
  import { St as useManager, at as AutoFocusTitle, ct as ResolvedConfigProvider, dt as Page, mt as TransitionSpinner, rt as IncodeComponent, ut as TerminalErrorPage } from "../extensibility-hMUS8eTZ.js";
5
5
  import { t as registerIncodeModuleElement } from "../incodeModule-Bvl3mk_L.js";
6
6
  import { a as resolveApiKey, g as setupSDK, i as HEADLESS_WORKFLOW_MODULE_KEYS, l as LAZY_UI_MODULES, o as extractIncodeStatus, s as UnsupportedModule, t as useModuleLoader, v as isDesktopOrEmulated, y as resolveSessionLanguage } from "../useModuleLoader-CXwWvvSL.js";
7
- import { resolveWasmConfigForPipelines, upgradeToWasmHttpClient, warmupWasm } from "@incodetech/core/wasm";
7
+ import { resolveWasmConfigForPipelines, setWasmConfig, upgradeToWasmHttpClient, warmupWasm } from "@incodetech/core/wasm";
8
8
  import { classifyScoreStatus } from "@incodetech/core/flow";
9
9
  import { bootstrapSession, refreshQrUrlUuid } from "@incodetech/core/session";
10
10
  import { createWorkflowManager } from "@incodetech/core/workflow";
@@ -160,6 +160,7 @@ function warmupWorkflowWasm(wasmConfig) {
160
160
  ...resolved,
161
161
  pipelines: resolved.pipelines ? [...resolved.pipelines] : void 0
162
162
  };
163
+ setWasmConfig(upgradeConfig);
163
164
  return warmupWasm(resolved).then(() => upgradeToWasmHttpClient(upgradeConfig)).catch((error) => {
164
165
  console.error("Workflow WASM warmup failed:", error);
165
166
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@incodetech/web",
3
- "version": "0.0.0-dev-20260831-e0b1ec3e",
3
+ "version": "0.0.0-dev-20260831-15fb9a3e",
4
4
  "license": "ISC",
5
5
  "repository": {
6
6
  "type": "git",
@@ -292,7 +292,7 @@
292
292
  "qrcode": "^1.5.4",
293
293
  "signature_pad": "^5.1.3",
294
294
  "tailwindcss": "^4.1.17",
295
- "@incodetech/core": "0.0.0-dev-20260831-e0b1ec3e"
295
+ "@incodetech/core": "0.0.0-dev-20260831-15fb9a3e"
296
296
  },
297
297
  "devDependencies": {
298
298
  "@microsoft/api-extractor": "^7.53.3",