@incodetech/web 2.0.0-alpha.2 → 2.0.0-alpha.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.
Files changed (273) hide show
  1. package/dist/{styles/core.css → base.css} +53 -57
  2. package/dist/email/email.es.js +1 -1
  3. package/dist/email/styles.css +11 -11
  4. package/dist/flow/styles.css +688 -1
  5. package/dist/{incodeModule-BF5MX9GT.js → incodeModule-Ct9jp5k6.js} +22 -19
  6. package/dist/index.es.js +18 -18
  7. package/dist/phone/phone.es.js +1 -1
  8. package/dist/phone/styles.css +31 -31
  9. package/dist/selfie/selfie.es.js +16 -16
  10. package/dist/selfie/styles.css +0 -51
  11. package/dist/themes/dark.css +652 -0
  12. package/dist/types/dark.d.ts +1 -0
  13. package/dist/types/light.d.ts +1 -0
  14. package/dist/types/themes/light.d.ts +1 -0
  15. package/package.json +12 -6
  16. package/.turbo/turbo-build.log +0 -58
  17. package/.turbo/turbo-coverage.log +0 -23
  18. package/.turbo/turbo-format.log +0 -6
  19. package/.turbo/turbo-lint$colon$fix.log +0 -6
  20. package/.turbo/turbo-lint.log +0 -6
  21. package/.turbo/turbo-test.log +0 -1033
  22. package/.turbo/turbo-typecheck.log +0 -5
  23. package/coverage/base.css +0 -224
  24. package/coverage/block-navigation.js +0 -87
  25. package/coverage/email/email.tsx.html +0 -850
  26. package/coverage/email/emailInput.tsx.html +0 -340
  27. package/coverage/email/index.html +0 -131
  28. package/coverage/favicon.png +0 -0
  29. package/coverage/flow/flow.tsx.html +0 -961
  30. package/coverage/flow/flowCompleted.tsx.html +0 -448
  31. package/coverage/flow/flowInit.ts.html +0 -367
  32. package/coverage/flow/flowStart.tsx.html +0 -208
  33. package/coverage/flow/index.html +0 -221
  34. package/coverage/flow/preloadFlow.ts.html +0 -598
  35. package/coverage/flow/unsupportedModule.tsx.html +0 -202
  36. package/coverage/flow/useFlowInitialization.ts.html +0 -469
  37. package/coverage/flow/useModuleLoader.ts.html +0 -361
  38. package/coverage/hooks/index.html +0 -116
  39. package/coverage/hooks/useManager.ts.html +0 -205
  40. package/coverage/index.html +0 -401
  41. package/coverage/permissions/boldWithArrow.tsx.html +0 -208
  42. package/coverage/permissions/denied.tsx.html +0 -172
  43. package/coverage/permissions/deniedAndroid.tsx.html +0 -253
  44. package/coverage/permissions/deniedDesktop.tsx.html +0 -277
  45. package/coverage/permissions/deniedIOS.tsx.html +0 -304
  46. package/coverage/permissions/deniedInstructions.tsx.html +0 -142
  47. package/coverage/permissions/iconWrapper.tsx.html +0 -130
  48. package/coverage/permissions/index.html +0 -251
  49. package/coverage/permissions/learnMore.tsx.html +0 -340
  50. package/coverage/permissions/numberedStep.tsx.html +0 -127
  51. package/coverage/permissions/permissions.tsx.html +0 -289
  52. package/coverage/phone/index.html +0 -116
  53. package/coverage/phone/phoneInput.tsx.html +0 -832
  54. package/coverage/prettify.css +0 -1
  55. package/coverage/prettify.js +0 -2
  56. package/coverage/selfie/index.html +0 -131
  57. package/coverage/selfie/selfie.tsx.html +0 -334
  58. package/coverage/selfie/tutorial.tsx.html +0 -214
  59. package/coverage/shared/baseTutorial/baseTutorial.tsx.html +0 -250
  60. package/coverage/shared/baseTutorial/index.html +0 -131
  61. package/coverage/shared/baseTutorial/replaceBaseTutorial.ts.html +0 -289
  62. package/coverage/shared/button/button.tsx.html +0 -226
  63. package/coverage/shared/button/index.html +0 -116
  64. package/coverage/shared/componentRoot/incodeComponent.tsx.html +0 -121
  65. package/coverage/shared/componentRoot/index.html +0 -116
  66. package/coverage/shared/countries/countries.ts.html +0 -502
  67. package/coverage/shared/countries/index.html +0 -116
  68. package/coverage/shared/icons/chevronDown.tsx.html +0 -151
  69. package/coverage/shared/icons/index.html +0 -131
  70. package/coverage/shared/icons/successIcon.tsx.html +0 -163
  71. package/coverage/shared/loader/index.html +0 -116
  72. package/coverage/shared/loader/loadingIcon.tsx.html +0 -286
  73. package/coverage/shared/otpInput/index.html +0 -116
  74. package/coverage/shared/otpInput/otpInput.tsx.html +0 -808
  75. package/coverage/shared/page/index.html +0 -146
  76. package/coverage/shared/page/page.tsx.html +0 -358
  77. package/coverage/shared/page/pageUiConfig.ts.html +0 -277
  78. package/coverage/shared/page/verifiedByIncode.tsx.html +0 -310
  79. package/coverage/shared/spacer/index.html +0 -116
  80. package/coverage/shared/spacer/spacer.tsx.html +0 -349
  81. package/coverage/shared/spinner/index.html +0 -116
  82. package/coverage/shared/spinner/spinner.tsx.html +0 -280
  83. package/coverage/shared/title/index.html +0 -116
  84. package/coverage/shared/title/title.tsx.html +0 -121
  85. package/coverage/shared/uiConfig/index.html +0 -116
  86. package/coverage/shared/uiConfig/uiConfig.ts.html +0 -193
  87. package/coverage/shared/webComponent/incodeModule.ts.html +0 -172
  88. package/coverage/shared/webComponent/index.html +0 -131
  89. package/coverage/shared/webComponent/registerIncodeElement.ts.html +0 -130
  90. package/coverage/sort-arrow-sprite.png +0 -0
  91. package/coverage/sorter.js +0 -210
  92. package/coverage/styles/cn.tsx.html +0 -148
  93. package/coverage/styles/fetchTheme.ts.html +0 -349
  94. package/coverage/styles/index.html +0 -131
  95. package/dev/README.md +0 -163
  96. package/dev/getToken.ts +0 -36
  97. package/dev/headless.html +0 -875
  98. package/dev/index.html +0 -366
  99. package/dev/main-headless.tsx +0 -1332
  100. package/dev/main-orchestrated-flow.tsx +0 -1158
  101. package/dev/main-preact.tsx +0 -323
  102. package/dev/main-simplified.tsx +0 -123
  103. package/dev/main-web-component.tsx +0 -256
  104. package/dev/main.tsx +0 -332
  105. package/dev/manual.html +0 -27
  106. package/dev/orchestrated-flow.html +0 -64
  107. package/dev/simplified.html +0 -64
  108. package/dev/tiktok-logo.svg +0 -7
  109. package/dist/asset-manifest.json +0 -18
  110. package/src/defineCustomElement.tsx +0 -30
  111. package/src/email/email.test.tsx +0 -368
  112. package/src/email/email.tsx +0 -255
  113. package/src/email/emailInput.test.tsx +0 -264
  114. package/src/email/emailInput.tsx +0 -85
  115. package/src/email/styles.css +0 -59
  116. package/src/flow/flow.test.tsx +0 -796
  117. package/src/flow/flow.tsx +0 -292
  118. package/src/flow/flowCompleted.css +0 -30
  119. package/src/flow/flowCompleted.test.tsx +0 -331
  120. package/src/flow/flowCompleted.tsx +0 -121
  121. package/src/flow/flowInit.test.ts +0 -264
  122. package/src/flow/flowInit.ts +0 -94
  123. package/src/flow/flowStart.css +0 -58
  124. package/src/flow/flowStart.test.tsx +0 -49
  125. package/src/flow/flowStart.tsx +0 -41
  126. package/src/flow/incode-logo.svg +0 -8
  127. package/src/flow/index.ts +0 -7
  128. package/src/flow/preloadFlow.test.ts +0 -421
  129. package/src/flow/preloadFlow.ts +0 -171
  130. package/src/flow/styles.css +0 -9
  131. package/src/flow/unsupportedModule.css +0 -21
  132. package/src/flow/unsupportedModule.tsx +0 -39
  133. package/src/flow/useFlowInitialization.test.tsx +0 -292
  134. package/src/flow/useFlowInitialization.ts +0 -128
  135. package/src/flow/useModuleLoader.test.tsx +0 -212
  136. package/src/flow/useModuleLoader.ts +0 -92
  137. package/src/hooks/index.ts +0 -1
  138. package/src/hooks/useManager.test.ts +0 -91
  139. package/src/hooks/useManager.ts +0 -40
  140. package/src/i18n/index.ts +0 -3
  141. package/src/i18n/instance.ts +0 -16
  142. package/src/i18n/setup.ts +0 -184
  143. package/src/i18n/useTranslation.ts +0 -42
  144. package/src/index.ts +0 -27
  145. package/src/permissions/assets/android-dots-icon.svg +0 -7
  146. package/src/permissions/assets/android-settings-icon.svg +0 -16
  147. package/src/permissions/assets/android-toggle-icon.svg +0 -20
  148. package/src/permissions/assets/bank-card-icon.svg +0 -14
  149. package/src/permissions/assets/camera-icon.svg +0 -12
  150. package/src/permissions/assets/camera-ios.svg +0 -53
  151. package/src/permissions/assets/check-icon.svg +0 -8
  152. package/src/permissions/assets/chrome-icon.svg +0 -43
  153. package/src/permissions/assets/password-icon.svg +0 -11
  154. package/src/permissions/assets/permissions-img.svg +0 -51
  155. package/src/permissions/assets/safari-icon.svg +0 -37
  156. package/src/permissions/assets/settings-icon.svg +0 -33
  157. package/src/permissions/assets/toggle-icon.svg +0 -19
  158. package/src/permissions/assets/warning-icon.svg +0 -6
  159. package/src/permissions/boldWithArrow.css +0 -9
  160. package/src/permissions/boldWithArrow.tsx +0 -41
  161. package/src/permissions/denied.css +0 -37
  162. package/src/permissions/denied.tsx +0 -29
  163. package/src/permissions/deniedAndroid.tsx +0 -56
  164. package/src/permissions/deniedDesktop.css +0 -9
  165. package/src/permissions/deniedDesktop.tsx +0 -64
  166. package/src/permissions/deniedIOS.tsx +0 -73
  167. package/src/permissions/deniedInstructions.tsx +0 -19
  168. package/src/permissions/iconWrapper.css +0 -9
  169. package/src/permissions/iconWrapper.tsx +0 -15
  170. package/src/permissions/learnMore.css +0 -37
  171. package/src/permissions/learnMore.tsx +0 -85
  172. package/src/permissions/numberedStep.css +0 -13
  173. package/src/permissions/numberedStep.tsx +0 -14
  174. package/src/permissions/permissions.css +0 -13
  175. package/src/permissions/permissions.tsx +0 -68
  176. package/src/phone/phone.tsx +0 -246
  177. package/src/phone/phoneInput.test.tsx +0 -275
  178. package/src/phone/phoneInput.tsx +0 -249
  179. package/src/phone/styles.css +0 -158
  180. package/src/selfie/cameraButton.css +0 -13
  181. package/src/selfie/cameraButton.tsx +0 -35
  182. package/src/selfie/capture.css +0 -57
  183. package/src/selfie/capture.tsx +0 -232
  184. package/src/selfie/errorModal.tsx +0 -218
  185. package/src/selfie/errorModalContent.css +0 -33
  186. package/src/selfie/errorModalContent.tsx +0 -44
  187. package/src/selfie/faceOutline.css +0 -5
  188. package/src/selfie/faceOutline.tsx +0 -22
  189. package/src/selfie/loadingBorder.css +0 -12
  190. package/src/selfie/loadingBorder.tsx +0 -77
  191. package/src/selfie/manualCaptureButton.css +0 -13
  192. package/src/selfie/manualCaptureButton.tsx +0 -35
  193. package/src/selfie/noMoreAttemptsModal.tsx +0 -44
  194. package/src/selfie/notification.css +0 -9
  195. package/src/selfie/notification.tsx +0 -36
  196. package/src/selfie/retryErrorModal.tsx +0 -56
  197. package/src/selfie/selfie.test.tsx +0 -458
  198. package/src/selfie/selfie.tsx +0 -83
  199. package/src/selfie/selfieTutorial.json +0 -2626
  200. package/src/selfie/styles.css +0 -1
  201. package/src/selfie/tutorial.test.tsx +0 -200
  202. package/src/selfie/tutorial.tsx +0 -43
  203. package/src/setup.ts +0 -33
  204. package/src/shared/baseTutorial/baseTutorial.css +0 -21
  205. package/src/shared/baseTutorial/baseTutorial.test.tsx +0 -184
  206. package/src/shared/baseTutorial/baseTutorial.tsx +0 -55
  207. package/src/shared/baseTutorial/replaceBaseTutorial.test.ts +0 -267
  208. package/src/shared/baseTutorial/replaceBaseTutorial.ts +0 -68
  209. package/src/shared/button/button.css +0 -55
  210. package/src/shared/button/button.test.tsx +0 -101
  211. package/src/shared/button/button.tsx +0 -47
  212. package/src/shared/componentRoot/incodeComponent.tsx +0 -12
  213. package/src/shared/countries/countries.test.ts +0 -75
  214. package/src/shared/countries/countries.ts +0 -139
  215. package/src/shared/countries/index.ts +0 -6
  216. package/src/shared/icons/chevronDown.tsx +0 -22
  217. package/src/shared/icons/index.ts +0 -2
  218. package/src/shared/icons/successIcon.css +0 -5
  219. package/src/shared/icons/successIcon.test.tsx +0 -40
  220. package/src/shared/icons/successIcon.tsx +0 -26
  221. package/src/shared/loader/loadingIcon.css +0 -28
  222. package/src/shared/loader/loadingIcon.tsx +0 -67
  223. package/src/shared/lottie/lottie.tsx +0 -108
  224. package/src/shared/otpInput/otpInput.css +0 -85
  225. package/src/shared/otpInput/otpInput.test.tsx +0 -356
  226. package/src/shared/otpInput/otpInput.tsx +0 -241
  227. package/src/shared/page/incode-logo.svg +0 -3
  228. package/src/shared/page/page.css +0 -47
  229. package/src/shared/page/page.test.tsx +0 -97
  230. package/src/shared/page/page.tsx +0 -91
  231. package/src/shared/page/pageUiConfig.test.ts +0 -112
  232. package/src/shared/page/pageUiConfig.ts +0 -64
  233. package/src/shared/page/verifiedByIncode.css +0 -5
  234. package/src/shared/page/verifiedByIncode.tsx +0 -75
  235. package/src/shared/spacer/spacer.css +0 -149
  236. package/src/shared/spacer/spacer.test.tsx +0 -143
  237. package/src/shared/spacer/spacer.tsx +0 -88
  238. package/src/shared/spinner/index.ts +0 -2
  239. package/src/shared/spinner/spinner.css +0 -28
  240. package/src/shared/spinner/spinner.test.tsx +0 -82
  241. package/src/shared/spinner/spinner.tsx +0 -65
  242. package/src/shared/title/title.css +0 -7
  243. package/src/shared/title/title.tsx +0 -12
  244. package/src/shared/uiConfig/uiConfig.ts +0 -36
  245. package/src/shared/webComponent/incodeModule.ts +0 -29
  246. package/src/shared/webComponent/registerIncodeElement.ts +0 -15
  247. package/src/styles/__mocks__/fetchTheme.ts +0 -19
  248. package/src/styles/applyTheme.ts +0 -37
  249. package/src/styles/cn.test.tsx +0 -57
  250. package/src/styles/cn.tsx +0 -21
  251. package/src/styles/core.css +0 -12
  252. package/src/styles/fetchTheme.test.ts +0 -390
  253. package/src/styles/fetchTheme.ts +0 -88
  254. package/src/styles/generatePalette.ts +0 -111
  255. package/src/styles/reset.css +0 -65
  256. package/src/styles/resolveCssVariableToHex.ts +0 -28
  257. package/src/styles/tailwind.css +0 -291
  258. package/src/styles/themeTypes.ts +0 -18
  259. package/src/styles/tokens/colors.css +0 -190
  260. package/src/styles/tokens/components.css +0 -174
  261. package/src/styles/tokens/index.css +0 -4
  262. package/src/styles/tokens/primitives.css +0 -129
  263. package/src/styles/tokens/semantic.css +0 -51
  264. package/src/svg.d.ts +0 -4
  265. package/src/types/assets.d.ts +0 -1
  266. package/src/types/custom-elements.d.ts +0 -104
  267. package/tsconfig.json +0 -22
  268. package/vite.config.ts +0 -260
  269. package/vitest.config.ts +0 -40
  270. package/vitest.setup.ts +0 -16
  271. /package/dist/{styles/tokens.css → themes/light.css} +0 -0
  272. /package/dist/types/{core.d.ts → base.d.ts} +0 -0
  273. /package/dist/types/{styles/core.d.ts → themes/dark.d.ts} +0 -0
package/coverage/styles/fetchTheme.ts.html DELETED
@@ -1,349 +0,0 @@
1
-
2
- <!doctype html>
3
- <html lang="en">
4
-
5
- <head>
6
- <title>Code coverage report for styles/fetchTheme.ts</title>
7
- <meta charset="utf-8" />
8
- <link rel="stylesheet" href="../prettify.css" />
9
- <link rel="stylesheet" href="../base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="../favicon.png" />
11
- <meta name="viewport" content="width=device-width, initial-scale=1" />
12
- <style type='text/css'>
13
- .coverage-summary .sorter {
14
- background-image: url(../sort-arrow-sprite.png);
15
- }
16
- </style>
17
- </head>
18
-
19
- <body>
20
- <div class='wrapper'>
21
- <div class='pad1'>
22
- <h1><a href="../index.html">All files</a> / <a href="index.html">styles</a> fetchTheme.ts</h1>
23
- <div class='clearfix'>
24
-
25
- <div class='fl pad1y space-right2'>
26
- <span class="strong">100% </span>
27
- <span class="quiet">Statements</span>
28
- <span class='fraction'>39/39</span>
29
- </div>
30
-
31
-
32
- <div class='fl pad1y space-right2'>
33
- <span class="strong">100% </span>
34
- <span class="quiet">Branches</span>
35
- <span class='fraction'>22/22</span>
36
- </div>
37
-
38
-
39
- <div class='fl pad1y space-right2'>
40
- <span class="strong">100% </span>
41
- <span class="quiet">Functions</span>
42
- <span class='fraction'>6/6</span>
43
- </div>
44
-
45
-
46
- <div class='fl pad1y space-right2'>
47
- <span class="strong">100% </span>
48
- <span class="quiet">Lines</span>
49
- <span class='fraction'>38/38</span>
50
- </div>
51
-
52
-
53
- </div>
54
- <p class="quiet">
55
- Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
- </p>
57
- <template id="filterTemplate">
58
- <div class="quiet">
59
- Filter:
60
- <input type="search" id="fileSearch">
61
- </div>
62
- </template>
63
- </div>
64
- <div class='status-line high'></div>
65
- <pre><table class="coverage">
66
- <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
- <a name='L2'></a><a href='#L2'>2</a>
68
- <a name='L3'></a><a href='#L3'>3</a>
69
- <a name='L4'></a><a href='#L4'>4</a>
70
- <a name='L5'></a><a href='#L5'>5</a>
71
- <a name='L6'></a><a href='#L6'>6</a>
72
- <a name='L7'></a><a href='#L7'>7</a>
73
- <a name='L8'></a><a href='#L8'>8</a>
74
- <a name='L9'></a><a href='#L9'>9</a>
75
- <a name='L10'></a><a href='#L10'>10</a>
76
- <a name='L11'></a><a href='#L11'>11</a>
77
- <a name='L12'></a><a href='#L12'>12</a>
78
- <a name='L13'></a><a href='#L13'>13</a>
79
- <a name='L14'></a><a href='#L14'>14</a>
80
- <a name='L15'></a><a href='#L15'>15</a>
81
- <a name='L16'></a><a href='#L16'>16</a>
82
- <a name='L17'></a><a href='#L17'>17</a>
83
- <a name='L18'></a><a href='#L18'>18</a>
84
- <a name='L19'></a><a href='#L19'>19</a>
85
- <a name='L20'></a><a href='#L20'>20</a>
86
- <a name='L21'></a><a href='#L21'>21</a>
87
- <a name='L22'></a><a href='#L22'>22</a>
88
- <a name='L23'></a><a href='#L23'>23</a>
89
- <a name='L24'></a><a href='#L24'>24</a>
90
- <a name='L25'></a><a href='#L25'>25</a>
91
- <a name='L26'></a><a href='#L26'>26</a>
92
- <a name='L27'></a><a href='#L27'>27</a>
93
- <a name='L28'></a><a href='#L28'>28</a>
94
- <a name='L29'></a><a href='#L29'>29</a>
95
- <a name='L30'></a><a href='#L30'>30</a>
96
- <a name='L31'></a><a href='#L31'>31</a>
97
- <a name='L32'></a><a href='#L32'>32</a>
98
- <a name='L33'></a><a href='#L33'>33</a>
99
- <a name='L34'></a><a href='#L34'>34</a>
100
- <a name='L35'></a><a href='#L35'>35</a>
101
- <a name='L36'></a><a href='#L36'>36</a>
102
- <a name='L37'></a><a href='#L37'>37</a>
103
- <a name='L38'></a><a href='#L38'>38</a>
104
- <a name='L39'></a><a href='#L39'>39</a>
105
- <a name='L40'></a><a href='#L40'>40</a>
106
- <a name='L41'></a><a href='#L41'>41</a>
107
- <a name='L42'></a><a href='#L42'>42</a>
108
- <a name='L43'></a><a href='#L43'>43</a>
109
- <a name='L44'></a><a href='#L44'>44</a>
110
- <a name='L45'></a><a href='#L45'>45</a>
111
- <a name='L46'></a><a href='#L46'>46</a>
112
- <a name='L47'></a><a href='#L47'>47</a>
113
- <a name='L48'></a><a href='#L48'>48</a>
114
- <a name='L49'></a><a href='#L49'>49</a>
115
- <a name='L50'></a><a href='#L50'>50</a>
116
- <a name='L51'></a><a href='#L51'>51</a>
117
- <a name='L52'></a><a href='#L52'>52</a>
118
- <a name='L53'></a><a href='#L53'>53</a>
119
- <a name='L54'></a><a href='#L54'>54</a>
120
- <a name='L55'></a><a href='#L55'>55</a>
121
- <a name='L56'></a><a href='#L56'>56</a>
122
- <a name='L57'></a><a href='#L57'>57</a>
123
- <a name='L58'></a><a href='#L58'>58</a>
124
- <a name='L59'></a><a href='#L59'>59</a>
125
- <a name='L60'></a><a href='#L60'>60</a>
126
- <a name='L61'></a><a href='#L61'>61</a>
127
- <a name='L62'></a><a href='#L62'>62</a>
128
- <a name='L63'></a><a href='#L63'>63</a>
129
- <a name='L64'></a><a href='#L64'>64</a>
130
- <a name='L65'></a><a href='#L65'>65</a>
131
- <a name='L66'></a><a href='#L66'>66</a>
132
- <a name='L67'></a><a href='#L67'>67</a>
133
- <a name='L68'></a><a href='#L68'>68</a>
134
- <a name='L69'></a><a href='#L69'>69</a>
135
- <a name='L70'></a><a href='#L70'>70</a>
136
- <a name='L71'></a><a href='#L71'>71</a>
137
- <a name='L72'></a><a href='#L72'>72</a>
138
- <a name='L73'></a><a href='#L73'>73</a>
139
- <a name='L74'></a><a href='#L74'>74</a>
140
- <a name='L75'></a><a href='#L75'>75</a>
141
- <a name='L76'></a><a href='#L76'>76</a>
142
- <a name='L77'></a><a href='#L77'>77</a>
143
- <a name='L78'></a><a href='#L78'>78</a>
144
- <a name='L79'></a><a href='#L79'>79</a>
145
- <a name='L80'></a><a href='#L80'>80</a>
146
- <a name='L81'></a><a href='#L81'>81</a>
147
- <a name='L82'></a><a href='#L82'>82</a>
148
- <a name='L83'></a><a href='#L83'>83</a>
149
- <a name='L84'></a><a href='#L84'>84</a>
150
- <a name='L85'></a><a href='#L85'>85</a>
151
- <a name='L86'></a><a href='#L86'>86</a>
152
- <a name='L87'></a><a href='#L87'>87</a>
153
- <a name='L88'></a><a href='#L88'>88</a>
154
- <a name='L89'></a><a href='#L89'>89</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
155
- <span class="cline-any cline-neutral">&nbsp;</span>
156
- <span class="cline-any cline-neutral">&nbsp;</span>
157
- <span class="cline-any cline-neutral">&nbsp;</span>
158
- <span class="cline-any cline-neutral">&nbsp;</span>
159
- <span class="cline-any cline-yes">40x</span>
160
- <span class="cline-any cline-yes">39x</span>
161
- <span class="cline-any cline-neutral">&nbsp;</span>
162
- <span class="cline-any cline-neutral">&nbsp;</span>
163
- <span class="cline-any cline-yes">2x</span>
164
- <span class="cline-any cline-neutral">&nbsp;</span>
165
- <span class="cline-any cline-neutral">&nbsp;</span>
166
- <span class="cline-any cline-yes">6x</span>
167
- <span class="cline-any cline-yes">1x</span>
168
- <span class="cline-any cline-neutral">&nbsp;</span>
169
- <span class="cline-any cline-neutral">&nbsp;</span>
170
- <span class="cline-any cline-yes">5x</span>
171
- <span class="cline-any cline-yes">5x</span>
172
- <span class="cline-any cline-yes">1x</span>
173
- <span class="cline-any cline-neutral">&nbsp;</span>
174
- <span class="cline-any cline-neutral">&nbsp;</span>
175
- <span class="cline-any cline-yes">4x</span>
176
- <span class="cline-any cline-yes">4x</span>
177
- <span class="cline-any cline-yes">4x</span>
178
- <span class="cline-any cline-yes">4x</span>
179
- <span class="cline-any cline-yes">4x</span>
180
- <span class="cline-any cline-yes">4x</span>
181
- <span class="cline-any cline-yes">4x</span>
182
- <span class="cline-any cline-neutral">&nbsp;</span>
183
- <span class="cline-any cline-neutral">&nbsp;</span>
184
- <span class="cline-any cline-yes">4x</span>
185
- <span class="cline-any cline-yes">4x</span>
186
- <span class="cline-any cline-neutral">&nbsp;</span>
187
- <span class="cline-any cline-neutral">&nbsp;</span>
188
- <span class="cline-any cline-neutral">&nbsp;</span>
189
- <span class="cline-any cline-yes">38x</span>
190
- <span class="cline-any cline-neutral">&nbsp;</span>
191
- <span class="cline-any cline-yes">38x</span>
192
- <span class="cline-any cline-yes">1x</span>
193
- <span class="cline-any cline-neutral">&nbsp;</span>
194
- <span class="cline-any cline-neutral">&nbsp;</span>
195
- <span class="cline-any cline-yes">37x</span>
196
- <span class="cline-any cline-neutral">&nbsp;</span>
197
- <span class="cline-any cline-yes">37x</span>
198
- <span class="cline-any cline-neutral">&nbsp;</span>
199
- <span class="cline-any cline-neutral">&nbsp;</span>
200
- <span class="cline-any cline-neutral">&nbsp;</span>
201
- <span class="cline-any cline-yes">38x</span>
202
- <span class="cline-any cline-yes">28x</span>
203
- <span class="cline-any cline-neutral">&nbsp;</span>
204
- <span class="cline-any cline-yes">28x</span>
205
- <span class="cline-any cline-yes">27x</span>
206
- <span class="cline-any cline-neutral">&nbsp;</span>
207
- <span class="cline-any cline-neutral">&nbsp;</span>
208
- <span class="cline-any cline-yes">1x</span>
209
- <span class="cline-any cline-neutral">&nbsp;</span>
210
- <span class="cline-any cline-yes">9x</span>
211
- <span class="cline-any cline-yes">9x</span>
212
- <span class="cline-any cline-neutral">&nbsp;</span>
213
- <span class="cline-any cline-neutral">&nbsp;</span>
214
- <span class="cline-any cline-neutral">&nbsp;</span>
215
- <span class="cline-any cline-yes">10x</span>
216
- <span class="cline-any cline-neutral">&nbsp;</span>
217
- <span class="cline-any cline-neutral">&nbsp;</span>
218
- <span class="cline-any cline-neutral">&nbsp;</span>
219
- <span class="cline-any cline-neutral">&nbsp;</span>
220
- <span class="cline-any cline-neutral">&nbsp;</span>
221
- <span class="cline-any cline-neutral">&nbsp;</span>
222
- <span class="cline-any cline-yes">38x</span>
223
- <span class="cline-any cline-yes">38x</span>
224
- <span class="cline-any cline-yes">6x</span>
225
- <span class="cline-any cline-neutral">&nbsp;</span>
226
- <span class="cline-any cline-neutral">&nbsp;</span>
227
- <span class="cline-any cline-yes">10x</span>
228
- <span class="cline-any cline-neutral">&nbsp;</span>
229
- <span class="cline-any cline-neutral">&nbsp;</span>
230
- <span class="cline-any cline-neutral">&nbsp;</span>
231
- <span class="cline-any cline-neutral">&nbsp;</span>
232
- <span class="cline-any cline-neutral">&nbsp;</span>
233
- <span class="cline-any cline-neutral">&nbsp;</span>
234
- <span class="cline-any cline-yes">28x</span>
235
- <span class="cline-any cline-neutral">&nbsp;</span>
236
- <span class="cline-any cline-yes">2x</span>
237
- <span class="cline-any cline-yes">1x</span>
238
- <span class="cline-any cline-neutral">&nbsp;</span>
239
- <span class="cline-any cline-neutral">&nbsp;</span>
240
- <span class="cline-any cline-yes">2x</span>
241
- <span class="cline-any cline-neutral">&nbsp;</span>
242
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { api } from '@incodetech/core';
243
- import { applyTheme } from './applyTheme';
244
- import type { AssetsResponse, ThemeConfig } from './themeTypes';
245
- &nbsp;
246
- export async function fetchAssets(): Promise&lt;AssetsResponse&gt; {
247
- const response = await api.get&lt;AssetsResponse&gt;('/omni/asset/fetch-all');
248
- return response.data;
249
- }
250
- &nbsp;
251
- const dataUrlCache = new Map&lt;string, string&gt;();
252
- &nbsp;
253
- async function urlToDataUrl(url: string): Promise&lt;string&gt; {
254
- if (url.startsWith('data:')) {
255
- return url;
256
- }
257
- &nbsp;
258
- const cached = dataUrlCache.get(url);
259
- if (cached) {
260
- return cached;
261
- }
262
- &nbsp;
263
- const response = await fetch(url);
264
- const blob = await response.blob();
265
- const dataUrl = await new Promise&lt;string&gt;((resolve, reject) =&gt; {
266
- const reader = new FileReader();
267
- reader.onloadend = () =&gt; resolve(reader.result as string);
268
- reader.onerror = reject;
269
- reader.readAsDataURL(blob);
270
- });
271
- &nbsp;
272
- dataUrlCache.set(url, dataUrl);
273
- return dataUrl;
274
- }
275
- &nbsp;
276
- export async function fetchTheme(): Promise&lt;ThemeConfig&gt; {
277
- const assets = await fetchAssets();
278
- &nbsp;
279
- if (!assets.theme) {
280
- throw new Error('Theme URL not found in assets response');
281
- }
282
- &nbsp;
283
- const themeUrl = assets.theme;
284
- const isAbsoluteUrl =
285
- themeUrl.startsWith('http://') || themeUrl.startsWith('https://');
286
- &nbsp;
287
- let theme: ThemeConfig;
288
- &nbsp;
289
- if (isAbsoluteUrl) {
290
- const themeResponse = await fetch(themeUrl);
291
- &nbsp;
292
- if (!themeResponse.ok) {
293
- throw new Error(`Failed to fetch theme: ${themeResponse.statusText}`);
294
- }
295
- &nbsp;
296
- theme = (await themeResponse.json()) as ThemeConfig;
297
- } else {
298
- const themeResponse = await api.get&lt;ThemeConfig&gt;(themeUrl);
299
- theme = themeResponse.data;
300
- }
301
- &nbsp;
302
- const logoUrl =
303
- assets['logo.png'] ||
304
- assets['logo.svg'] ||
305
- assets['logo.jpg'] ||
306
- assets['logo.jpeg'] ||
307
- assets['logo.webp'] ||
308
- theme.logo;
309
- &nbsp;
310
- let cachedLogoUrl = logoUrl;
311
- if (logoUrl) {
312
- cachedLogoUrl = await urlToDataUrl(logoUrl);
313
- }
314
- &nbsp;
315
- return {
316
- ...theme,
317
- logo: cachedLogoUrl,
318
- };
319
- }
320
- &nbsp;
321
- export async function fetchAndApplyTheme(): Promise&lt;ThemeConfig&gt; {
322
- const theme = await fetchTheme();
323
- &nbsp;
324
- if (theme.main) {
325
- applyTheme(theme.main, theme.buttonColor);
326
- }
327
- &nbsp;
328
- return theme;
329
- }
330
- &nbsp;</pre></td></tr></table></pre>
331
-
332
- <div class='push'></div><!-- for sticky footer -->
333
- </div><!-- /wrapper -->
334
- <div class='footer quiet pad2 space-top1 center small'>
335
- Code coverage generated by
336
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
337
- at 2025-12-31T22:12:31.439Z
338
- </div>
339
- <script src="../prettify.js"></script>
340
- <script>
341
- window.onload = function () {
342
- prettyPrint();
343
- };
344
- </script>
345
- <script src="../sorter.js"></script>
346
- <script src="../block-navigation.js"></script>
347
- </body>
348
- </html>
349
-
package/coverage/styles/index.html DELETED
@@ -1,131 +0,0 @@
1
-
2
- <!doctype html>
3
- <html lang="en">
4
-
5
- <head>
6
- <title>Code coverage report for styles</title>
7
- <meta charset="utf-8" />
8
- <link rel="stylesheet" href="../prettify.css" />
9
- <link rel="stylesheet" href="../base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="../favicon.png" />
11
- <meta name="viewport" content="width=device-width, initial-scale=1" />
12
- <style type='text/css'>
13
- .coverage-summary .sorter {
14
- background-image: url(../sort-arrow-sprite.png);
15
- }
16
- </style>
17
- </head>
18
-
19
- <body>
20
- <div class='wrapper'>
21
- <div class='pad1'>
22
- <h1><a href="../index.html">All files</a> styles</h1>
23
- <div class='clearfix'>
24
-
25
- <div class='fl pad1y space-right2'>
26
- <span class="strong">100% </span>
27
- <span class="quiet">Statements</span>
28
- <span class='fraction'>51/51</span>
29
- </div>
30
-
31
-
32
- <div class='fl pad1y space-right2'>
33
- <span class="strong">96.66% </span>
34
- <span class="quiet">Branches</span>
35
- <span class='fraction'>29/30</span>
36
- </div>
37
-
38
-
39
- <div class='fl pad1y space-right2'>
40
- <span class="strong">100% </span>
41
- <span class="quiet">Functions</span>
42
- <span class='fraction'>7/7</span>
43
- </div>
44
-
45
-
46
- <div class='fl pad1y space-right2'>
47
- <span class="strong">100% </span>
48
- <span class="quiet">Lines</span>
49
- <span class='fraction'>49/49</span>
50
- </div>
51
-
52
-
53
- </div>
54
- <p class="quiet">
55
- Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
- </p>
57
- <template id="filterTemplate">
58
- <div class="quiet">
59
- Filter:
60
- <input type="search" id="fileSearch">
61
- </div>
62
- </template>
63
- </div>
64
- <div class='status-line high'></div>
65
- <div class="pad1">
66
- <table class="coverage-summary">
67
- <thead>
68
- <tr>
69
- <th data-col="file" data-fmt="html" data-html="true" class="file">File</th>
70
- <th data-col="pic" data-type="number" data-fmt="html" data-html="true" class="pic"></th>
71
- <th data-col="statements" data-type="number" data-fmt="pct" class="pct">Statements</th>
72
- <th data-col="statements_raw" data-type="number" data-fmt="html" class="abs"></th>
73
- <th data-col="branches" data-type="number" data-fmt="pct" class="pct">Branches</th>
74
- <th data-col="branches_raw" data-type="number" data-fmt="html" class="abs"></th>
75
- <th data-col="functions" data-type="number" data-fmt="pct" class="pct">Functions</th>
76
- <th data-col="functions_raw" data-type="number" data-fmt="html" class="abs"></th>
77
- <th data-col="lines" data-type="number" data-fmt="pct" class="pct">Lines</th>
78
- <th data-col="lines_raw" data-type="number" data-fmt="html" class="abs"></th>
79
- </tr>
80
- </thead>
81
- <tbody><tr>
82
- <td class="file high" data-value="cn.tsx"><a href="cn.tsx.html">cn.tsx</a></td>
83
- <td data-value="100" class="pic high">
84
- <div class="chart"><div class="cover-fill cover-full" style="width: 100%"></div><div class="cover-empty" style="width: 0%"></div></div>
85
- </td>
86
- <td data-value="100" class="pct high">100%</td>
87
- <td data-value="12" class="abs high">12/12</td>
88
- <td data-value="87.5" class="pct high">87.5%</td>
89
- <td data-value="8" class="abs high">7/8</td>
90
- <td data-value="100" class="pct high">100%</td>
91
- <td data-value="1" class="abs high">1/1</td>
92
- <td data-value="100" class="pct high">100%</td>
93
- <td data-value="11" class="abs high">11/11</td>
94
- </tr>
95
-
96
- <tr>
97
- <td class="file high" data-value="fetchTheme.ts"><a href="fetchTheme.ts.html">fetchTheme.ts</a></td>
98
- <td data-value="100" class="pic high">
99
- <div class="chart"><div class="cover-fill cover-full" style="width: 100%"></div><div class="cover-empty" style="width: 0%"></div></div>
100
- </td>
101
- <td data-value="100" class="pct high">100%</td>
102
- <td data-value="39" class="abs high">39/39</td>
103
- <td data-value="100" class="pct high">100%</td>
104
- <td data-value="22" class="abs high">22/22</td>
105
- <td data-value="100" class="pct high">100%</td>
106
- <td data-value="6" class="abs high">6/6</td>
107
- <td data-value="100" class="pct high">100%</td>
108
- <td data-value="38" class="abs high">38/38</td>
109
- </tr>
110
-
111
- </tbody>
112
- </table>
113
- </div>
114
- <div class='push'></div><!-- for sticky footer -->
115
- </div><!-- /wrapper -->
116
- <div class='footer quiet pad2 space-top1 center small'>
117
- Code coverage generated by
118
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2025-12-31T22:12:31.439Z
120
- </div>
121
- <script src="../prettify.js"></script>
122
- <script>
123
- window.onload = function () {
124
- prettyPrint();
125
- };
126
- </script>
127
- <script src="../sorter.js"></script>
128
- <script src="../block-navigation.js"></script>
129
- </body>
130
- </html>
131
-
package/dev/README.md DELETED
@@ -1,163 +0,0 @@
1
- # UI Dev Demos
2
-
3
- This folder contains various demo files to test and demonstrate different integration patterns for the Incode Web SDK.
4
-
5
- ## Running the Demos
6
-
7
- ```bash
8
- cd packages/ui
9
- pnpm dev
10
- ```
11
-
12
- Then open the landing page at `/dev/index.html` to see all available demos.
13
-
14
- ### Landing Page
15
-
16
- The landing page (`/dev/index.html`) provides:
17
- - Overview of all integration patterns
18
- - Config ID input field (persisted to localStorage)
19
- - Quick links to each demo with configId passed as query parameter
20
-
21
- ---
22
-
23
- ## Demo Scenarios
24
-
25
- ### 1. Simplified Flow (`/dev/simplified.html`)
26
-
27
- **Files:** `simplified.html`, `main-simplified.tsx`
28
-
29
- **Pattern:** Drop-in `<incode-flow>` web component
30
-
31
- **Best for:** Customers who want the simplest integration with minimal code.
32
-
33
- ```html
34
- <incode-flow id="flow"></incode-flow>
35
-
36
- <script type="module">
37
- import '@incodetech/ui/flow';
38
-
39
- const flow = document.getElementById('flow');
40
- flow.token = 'your-session-token';
41
- flow.onComplete = (result) => {
42
- console.log('Done!', result);
43
- };
44
- </script>
45
- ```
46
-
47
- **What it demonstrates:**
48
- - Single web component handles everything
49
- - No manual flow management needed
50
- - Automatic module orchestration
51
-
52
- ---
53
-
54
- ### 2. Orchestrated Flow with Custom UI (`/dev/orchestrated-flow.html`)
55
-
56
- **Files:** `orchestrated-flow.html`, `main-orchestrated-flow.tsx`
57
-
58
- **Pattern:** `createOrchestratedFlowManager` with custom UI components
59
-
60
- **Best for:** Customers who want orchestration benefits but need custom UI.
61
-
62
- ```tsx
63
- const [state, flowManager] = useManager(() =>
64
- createOrchestratedFlowManager({
65
- modules: { PHONE: phoneMachine },
66
- })
67
- );
68
-
69
- // Render your own UI, signal completion when done
70
- <Phone
71
- config={config}
72
- onFinish={() => flowManager.completeModule()}
73
- />
74
- ```
75
-
76
- **What it demonstrates:**
77
- - Using the orchestrator directly
78
- - Custom UI rendering based on flow state
79
- - Signaling module completion with `completeModule()`
80
- - Access to `finishStatus` when flow completes
81
-
82
- ---
83
-
84
- ### 3. Manual Flow Control (`/dev/manual.html`)
85
-
86
- **Files:** `manual.html`, `main-web-component.tsx`
87
-
88
- **Pattern:** `createFlowManager` with manual `nextStep()` calls
89
-
90
- **Best for:** Legacy pattern or customers needing full manual control.
91
-
92
- ```tsx
93
- const [state, flowManager] = useManager(() => createFlowManager());
94
-
95
- // Manually advance the flow
96
- <Phone
97
- config={config}
98
- onFinish={() => flowManager.nextStep()}
99
- />
100
- ```
101
-
102
- **What it demonstrates:**
103
- - Original flow manager (non-orchestrated)
104
- - Manual step advancement
105
- - Full control over flow progression
106
-
107
- ---
108
-
109
- ### 4. Headless Demo (`/dev/headless.html`)
110
-
111
- **Files:** `headless.html`, `main-headless.tsx`
112
-
113
- **Pattern:** Core SDK only, custom vanilla UI
114
-
115
- **Best for:** Customers building completely custom UIs (React, Vue, vanilla JS, etc.)
116
-
117
- ```ts
118
- import { createPhoneManager } from '@incodetech/core/phone';
119
-
120
- const manager = createPhoneManager({ config });
121
-
122
- // Subscribe to state changes
123
- manager.subscribe((state) => {
124
- // Render your own UI based on state
125
- renderCustomUI(state);
126
- });
127
-
128
- // Call manager methods
129
- manager.setPhoneNumber('+1234567890', true);
130
- manager.submit();
131
- ```
132
-
133
- **What it demonstrates:**
134
- - Using Core SDK without any Incode UI components
135
- - Building custom UI with vanilla JavaScript (or any framework)
136
- - Full state machine visibility and control
137
- - Manager pattern API
138
-
139
- ---
140
-
141
- ## Comparison Chart
142
-
143
- | Demo | Flow Manager | UI Components | Complexity | Use Case |
144
- |------|--------------|---------------|------------|----------|
145
- | Simplified | Orchestrated (internal) | `<incode-flow>` | ⭐ Lowest | Drop-in integration |
146
- | Orchestrated | `createOrchestratedFlowManager` | Incode UI | ⭐⭐ Medium | Custom flow, Incode UI |
147
- | Manual | `createFlowManager` | Incode UI | ⭐⭐⭐ Higher | Full manual control |
148
- | Headless | None | Custom | ⭐⭐⭐⭐ Highest | Fully custom UI |
149
-
150
- ---
151
-
152
- ## Architecture Layers
153
-
154
- All demos follow the three-layer architecture:
155
-
156
- ```
157
- Layer 2 (UI) → Preact components, CSS, web components
158
- Layer 1 (Core) → State machines, managers, business logic
159
- Layer 0 (Infra) → Browser APIs, WASM, utilities
160
- ```
161
-
162
- See `/docs/ARCHITECTURE_GOALS.md` for full details.
163
-