ku4web-components 6.5.6 → 6.5.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (276) hide show
  1. package/angular/index.js +3 -1
  2. package/angular/index.mjs +1 -1
  3. package/dist/cjs/{index-e69a9e98.js → index-4e2544a7.js} +10 -8
  4. package/dist/cjs/index-ad5278ca.js +10 -0
  5. package/dist/cjs/ku4-carousel-controls.cjs.entry.js +2 -2
  6. package/dist/cjs/ku4-carousel-slide.cjs.entry.js +1 -1
  7. package/dist/cjs/ku4-carousel.cjs.entry.js +3 -3
  8. package/dist/cjs/ku4-col.cjs.entry.js +1 -1
  9. package/dist/cjs/ku4-drawer.cjs.entry.js +1 -1
  10. package/dist/cjs/ku4-feature.cjs.entry.js +2 -2
  11. package/dist/cjs/ku4-focus-trap.cjs.entry.js +26 -26
  12. package/dist/cjs/ku4-form.cjs.entry.js +3 -3
  13. package/dist/cjs/ku4-grid.cjs.entry.js +1 -1
  14. package/dist/cjs/ku4-label.cjs.entry.js +2 -2
  15. package/dist/cjs/ku4-mask.cjs.entry.js +2 -2
  16. package/dist/cjs/ku4-modal.cjs.entry.js +3 -3
  17. package/dist/cjs/ku4-panel.cjs.entry.js +1 -1
  18. package/dist/cjs/ku4-preview.cjs.entry.js +14 -43
  19. package/dist/cjs/ku4-tab-list.cjs.entry.js +4 -4
  20. package/dist/cjs/ku4-tab-panel.cjs.entry.js +3 -3
  21. package/dist/cjs/ku4-tab.cjs.entry.js +3 -3
  22. package/dist/cjs/ku4-table.cjs.entry.js +1 -1
  23. package/dist/cjs/ku4-tooltip.cjs.entry.js +2 -2
  24. package/dist/cjs/ku4-validation.cjs.entry.js +2 -2
  25. package/dist/cjs/ku4web-components.cjs.js +7 -102
  26. package/dist/cjs/loader.cjs.js +2 -18
  27. package/dist/cjs/{shadow-css-42acdd0e.js → shadow-css-abc19485.js} +2 -3
  28. package/dist/esm/{index-3a223c58.js → index-e5173978.js} +10 -8
  29. package/dist/esm/index-f06d1dc2.js +3 -0
  30. package/dist/esm/ku4-carousel-controls.entry.js +2 -2
  31. package/dist/esm/ku4-carousel-slide.entry.js +1 -1
  32. package/dist/esm/ku4-carousel.entry.js +3 -3
  33. package/dist/esm/ku4-col.entry.js +1 -1
  34. package/dist/esm/ku4-drawer.entry.js +1 -1
  35. package/dist/esm/ku4-feature.entry.js +2 -2
  36. package/dist/esm/ku4-focus-trap.entry.js +3 -3
  37. package/dist/esm/ku4-form.entry.js +3 -3
  38. package/dist/esm/ku4-grid.entry.js +1 -1
  39. package/dist/esm/ku4-label.entry.js +2 -2
  40. package/dist/esm/ku4-mask.entry.js +2 -2
  41. package/dist/esm/ku4-modal.entry.js +3 -3
  42. package/dist/esm/ku4-panel.entry.js +1 -1
  43. package/dist/esm/ku4-preview.entry.js +5 -34
  44. package/dist/esm/ku4-tab-list.entry.js +4 -4
  45. package/dist/esm/ku4-tab-panel.entry.js +3 -3
  46. package/dist/esm/ku4-tab.entry.js +3 -3
  47. package/dist/esm/ku4-table.entry.js +1 -1
  48. package/dist/esm/ku4-tooltip.entry.js +2 -2
  49. package/dist/esm/ku4-validation.entry.js +2 -2
  50. package/dist/esm/ku4web-components.js +7 -102
  51. package/dist/esm/loader.js +2 -18
  52. package/dist/{ku4web-components/shadow-css-38a1326b.js → esm/shadow-css-02866686.js} +2 -3
  53. package/dist/esm-es5/{index-3a223c58.js → index-e5173978.js} +2 -1
  54. package/dist/esm-es5/index-f06d1dc2.js +1 -0
  55. package/dist/esm-es5/ku4-carousel-controls.entry.js +1 -1
  56. package/dist/esm-es5/ku4-carousel-slide.entry.js +1 -1
  57. package/dist/esm-es5/ku4-carousel.entry.js +1 -1
  58. package/dist/esm-es5/ku4-col.entry.js +1 -1
  59. package/dist/esm-es5/ku4-drawer.entry.js +1 -1
  60. package/dist/esm-es5/ku4-feature.entry.js +1 -1
  61. package/dist/esm-es5/ku4-focus-trap.entry.js +1 -1
  62. package/dist/esm-es5/ku4-form.entry.js +1 -1
  63. package/dist/esm-es5/ku4-grid.entry.js +1 -1
  64. package/dist/esm-es5/ku4-label.entry.js +1 -1
  65. package/dist/esm-es5/ku4-mask.entry.js +1 -1
  66. package/dist/esm-es5/ku4-modal.entry.js +1 -1
  67. package/dist/esm-es5/ku4-panel.entry.js +1 -1
  68. package/dist/esm-es5/ku4-preview.entry.js +1 -1
  69. package/dist/esm-es5/ku4-tab-list.entry.js +1 -1
  70. package/dist/esm-es5/ku4-tab-panel.entry.js +1 -1
  71. package/dist/esm-es5/ku4-tab.entry.js +1 -1
  72. package/dist/esm-es5/ku4-table.entry.js +1 -1
  73. package/dist/esm-es5/ku4-tooltip.entry.js +1 -1
  74. package/dist/esm-es5/ku4-validation.entry.js +1 -1
  75. package/dist/esm-es5/ku4web-components.js +1 -1
  76. package/dist/esm-es5/loader.js +1 -1
  77. package/dist/esm-es5/shadow-css-02866686.js +12 -0
  78. package/dist/index.js +1 -1
  79. package/dist/ku4web-components/index.esm.js +0 -1
  80. package/dist/ku4web-components/ku4web-components.css +1 -299
  81. package/dist/ku4web-components/ku4web-components.esm.js +1 -129
  82. package/dist/ku4web-components/ku4web-components.js +1 -1
  83. package/dist/ku4web-components/{p-96033515.system.entry.js → p-02eef79e.system.entry.js} +1 -1
  84. package/dist/ku4web-components/p-06b0b9bc.js +2 -0
  85. package/dist/ku4web-components/{p-2ee63f57.system.js → p-0b3bdc7f.system.js} +1 -1
  86. package/dist/ku4web-components/{p-b1680ef4.entry.js → p-155f4481.entry.js} +1 -1
  87. package/dist/ku4web-components/{p-c5448cc1.system.entry.js → p-2723d2b6.system.entry.js} +1 -1
  88. package/dist/ku4web-components/{p-e31755cd.system.entry.js → p-2c79be2e.system.entry.js} +1 -1
  89. package/dist/ku4web-components/p-2df8696a.entry.js +1 -0
  90. package/dist/ku4web-components/{p-046b3990.entry.js → p-364b562f.entry.js} +1 -1
  91. package/dist/ku4web-components/{p-bb698020.system.entry.js → p-3ba44adc.system.entry.js} +1 -1
  92. package/dist/ku4web-components/{p-4ecd9b1d.system.entry.js → p-42d52222.system.entry.js} +1 -1
  93. package/dist/ku4web-components/{p-0f1646ca.system.entry.js → p-4733f8b6.system.entry.js} +1 -1
  94. package/dist/ku4web-components/{p-8173d389.system.entry.js → p-48b0bb76.system.entry.js} +1 -1
  95. package/dist/ku4web-components/p-5109ce9d.system.js +1 -0
  96. package/dist/ku4web-components/{p-ae7ce1fe.system.entry.js → p-55a4a947.system.entry.js} +1 -1
  97. package/dist/ku4web-components/{p-d0f3bec4.js → p-5a51f33e.js} +1 -1
  98. package/dist/ku4web-components/{p-e11fbd79.entry.js → p-5c296352.entry.js} +1 -1
  99. package/dist/ku4web-components/{p-3deab7f6.system.entry.js → p-5e666fe4.system.entry.js} +1 -1
  100. package/dist/ku4web-components/{p-bb5410b5.entry.js → p-6028fc6f.entry.js} +1 -1
  101. package/dist/ku4web-components/{p-72be654e.system.entry.js → p-65643a0b.system.entry.js} +1 -1
  102. package/dist/ku4web-components/{p-4da33ea7.entry.js → p-67a2204b.entry.js} +1 -1
  103. package/dist/ku4web-components/{p-7b6ca6a8.entry.js → p-6ab4928a.entry.js} +1 -1
  104. package/dist/ku4web-components/{p-cfd1b93c.entry.js → p-6e918f89.entry.js} +1 -1
  105. package/dist/ku4web-components/{p-1e19bc01.system.entry.js → p-71cbf981.system.entry.js} +1 -1
  106. package/dist/ku4web-components/{p-7b93a362.system.entry.js → p-7260c454.system.entry.js} +1 -1
  107. package/dist/ku4web-components/{p-5e628256.entry.js → p-731cff07.entry.js} +1 -1
  108. package/dist/ku4web-components/{p-fd3d3f56.system.js → p-8f2e658a.system.js} +2 -1
  109. package/dist/ku4web-components/{p-9e2f37cc.entry.js → p-939f438f.entry.js} +1 -1
  110. package/dist/ku4web-components/{p-6509d3e7.system.entry.js → p-9a6aa058.system.entry.js} +1 -1
  111. package/dist/ku4web-components/{p-da8a8b83.entry.js → p-9db782b0.entry.js} +1 -1
  112. package/dist/ku4web-components/{p-0b777b57.entry.js → p-9ebb7181.entry.js} +1 -1
  113. package/dist/ku4web-components/{p-d42bd64d.entry.js → p-9fcb26bb.entry.js} +1 -1
  114. package/dist/ku4web-components/{p-27647af0.system.entry.js → p-a3b9acd3.system.entry.js} +1 -1
  115. package/dist/ku4web-components/{p-de3b2ba1.entry.js → p-a45df4c1.entry.js} +1 -1
  116. package/dist/ku4web-components/{p-17c2a7ac.system.entry.js → p-b2512286.system.entry.js} +1 -1
  117. package/dist/ku4web-components/{p-ea1961f5.entry.js → p-b334f07e.entry.js} +1 -1
  118. package/dist/ku4web-components/{p-a13796dc.system.entry.js → p-bc388bcc.system.entry.js} +1 -1
  119. package/dist/ku4web-components/p-c00ad706.system.js +13 -0
  120. package/dist/ku4web-components/{p-6515c623.system.entry.js → p-c0dce18b.system.entry.js} +1 -1
  121. package/dist/ku4web-components/{p-1abe6f26.entry.js → p-c46a6ff5.entry.js} +1 -1
  122. package/dist/ku4web-components/p-ccf9d584.js +1 -0
  123. package/dist/ku4web-components/{p-9778d082.system.entry.js → p-e4693cda.system.entry.js} +1 -1
  124. package/dist/ku4web-components/{p-d4877fdf.entry.js → p-e5170dc1.entry.js} +1 -1
  125. package/dist/ku4web-components/{p-0a68e802.entry.js → p-e65f0ac5.entry.js} +1 -1
  126. package/dist/ku4web-components/{p-1a09ae2c.entry.js → p-ea1b0df6.entry.js} +1 -1
  127. package/dist/ku4web-components/{p-5e8921ef.system.entry.js → p-f0dbdb77.system.entry.js} +1 -1
  128. package/dist/ku4web-components/{p-9b01a63a.entry.js → p-f76dfee1.entry.js} +1 -1
  129. package/dist/ku4web-components/{p-a7ab7c23.system.entry.js → p-faa0713d.system.entry.js} +1 -1
  130. package/dist/types/components.d.ts +27 -7
  131. package/package.json +37 -30
  132. package/react/index.js +3 -1
  133. package/react/index.mjs +1 -1
  134. package/vue/index.js +3 -1
  135. package/vue/index.mjs +1 -1
  136. package/vue3/index.js +3 -1
  137. package/vue3/index.mjs +1 -1
  138. package/dist/cjs/app-globals-3a1e7e63.js +0 -5
  139. package/dist/cjs/css-shim-f1391d35.js +0 -6
  140. package/dist/cjs/dom-5345ed9a.js +0 -75
  141. package/dist/cjs/index-065185f8.js +0 -3093
  142. package/dist/cjs/index-16f16ed9.js +0 -14
  143. package/dist/cjs/index-436596bf.js +0 -10
  144. package/dist/cjs/index-49d3746b.js +0 -10
  145. package/dist/cjs/uid-a1348ea5.js +0 -11
  146. package/dist/collection/capabilities/a11y/aria.js +0 -26
  147. package/dist/collection/capabilities/angular/index.js +0 -24
  148. package/dist/collection/capabilities/decorators/deprecated.js +0 -20
  149. package/dist/collection/capabilities/decorators/index.js +0 -3
  150. package/dist/collection/capabilities/decorators/memoize.js +0 -7
  151. package/dist/collection/capabilities/dom/isFocusable.js +0 -7
  152. package/dist/collection/capabilities/dom/queryFocusable.js +0 -2
  153. package/dist/collection/capabilities/identity/uid.js +0 -6
  154. package/dist/collection/capabilities/mask/index.js +0 -5
  155. package/dist/collection/capabilities/mask/patterns/date.js +0 -40
  156. package/dist/collection/capabilities/mask/patterns/index.js +0 -7
  157. package/dist/collection/capabilities/react/index.js +0 -25
  158. package/dist/collection/capabilities/testing/html.js +0 -14
  159. package/dist/collection/capabilities/testing/styles.js +0 -14
  160. package/dist/collection/capabilities/vue/index.js +0 -28
  161. package/dist/collection/capabilities/vue3/index.js +0 -26
  162. package/dist/collection/collection-manifest.json +0 -31
  163. package/dist/collection/components/ku4-carousel/ku4-carousel.css +0 -221
  164. package/dist/collection/components/ku4-carousel/ku4-carousel.js +0 -369
  165. package/dist/collection/components/ku4-carousel-controls/ku4-carousel-controls.css +0 -32
  166. package/dist/collection/components/ku4-carousel-controls/ku4-carousel-controls.js +0 -112
  167. package/dist/collection/components/ku4-carousel-slide/ku4-carousel-slide.css +0 -3
  168. package/dist/collection/components/ku4-carousel-slide/ku4-carousel-slide.js +0 -159
  169. package/dist/collection/components/ku4-col/ku4-col.css +0 -601
  170. package/dist/collection/components/ku4-col/ku4-col.js +0 -288
  171. package/dist/collection/components/ku4-drawer/ku4-drawer.css +0 -56
  172. package/dist/collection/components/ku4-drawer/ku4-drawer.js +0 -163
  173. package/dist/collection/components/ku4-feature/ku4-feature.js +0 -70
  174. package/dist/collection/components/ku4-focus-trap/ku4-focus-trap.css +0 -3
  175. package/dist/collection/components/ku4-focus-trap/ku4-focus-trap.js +0 -441
  176. package/dist/collection/components/ku4-form/ku4-form.js +0 -265
  177. package/dist/collection/components/ku4-grid/ku4-grid.css +0 -751
  178. package/dist/collection/components/ku4-grid/ku4-grid.js +0 -408
  179. package/dist/collection/components/ku4-label/ku4-label.css +0 -36
  180. package/dist/collection/components/ku4-label/ku4-label.js +0 -115
  181. package/dist/collection/components/ku4-mask/ku4-mask.css +0 -3
  182. package/dist/collection/components/ku4-mask/ku4-mask.js +0 -459
  183. package/dist/collection/components/ku4-modal/ku4-modal.css +0 -85
  184. package/dist/collection/components/ku4-modal/ku4-modal.js +0 -231
  185. package/dist/collection/components/ku4-panel/ku4-panel.css +0 -14
  186. package/dist/collection/components/ku4-panel/ku4-panel.js +0 -119
  187. package/dist/collection/components/ku4-preview/ku4-preview.css +0 -23
  188. package/dist/collection/components/ku4-preview/ku4-preview.js +0 -266
  189. package/dist/collection/components/ku4-tab/ku4-tab.css +0 -82
  190. package/dist/collection/components/ku4-tab/ku4-tab.js +0 -191
  191. package/dist/collection/components/ku4-tab-list/ku4-tab-list.css +0 -6
  192. package/dist/collection/components/ku4-tab-list/ku4-tab-list.js +0 -118
  193. package/dist/collection/components/ku4-tab-panel/ku4-tab-panel.css +0 -26
  194. package/dist/collection/components/ku4-tab-panel/ku4-tab-panel.js +0 -166
  195. package/dist/collection/components/ku4-table/ku4-table.css +0 -116
  196. package/dist/collection/components/ku4-table/ku4-table.js +0 -120
  197. package/dist/collection/components/ku4-tooltip/ku4-tooltip.css +0 -56
  198. package/dist/collection/components/ku4-tooltip/ku4-tooltip.js +0 -274
  199. package/dist/collection/components/ku4-validation/ku4-validation.css +0 -19
  200. package/dist/collection/components/ku4-validation/ku4-validation.js +0 -364
  201. package/dist/collection/components/ku4-validation/validate.js +0 -14
  202. package/dist/collection/index.js +0 -1
  203. package/dist/collection/security.js +0 -27
  204. package/dist/esm/app-globals-0f993ce5.js +0 -3
  205. package/dist/esm/css-shim-10e6e2ae.js +0 -4
  206. package/dist/esm/dom-7cd9cf71.js +0 -73
  207. package/dist/esm/index-5448a818.js +0 -3
  208. package/dist/esm/index-6cfd87e4.js +0 -3
  209. package/dist/esm/index-a02dcfc8.js +0 -3057
  210. package/dist/esm/index-aa119486.js +0 -3
  211. package/dist/esm/shadow-css-38a1326b.js +0 -388
  212. package/dist/esm/uid-3716c2c4.js +0 -9
  213. package/dist/esm-es5/index-5448a818.js +0 -1
  214. package/dist/esm-es5/shadow-css-38a1326b.js +0 -12
  215. package/dist/ku4web-components/app-globals-0f993ce5.js +0 -3
  216. package/dist/ku4web-components/app-globals-497eb362.system.js +0 -1
  217. package/dist/ku4web-components/css-shim-10e6e2ae.js +0 -4
  218. package/dist/ku4web-components/css-shim-c8dd4551.system.js +0 -1
  219. package/dist/ku4web-components/dom-67d1e45e.system.js +0 -21
  220. package/dist/ku4web-components/dom-7cd9cf71.js +0 -73
  221. package/dist/ku4web-components/index-1c93827a.system.js +0 -1
  222. package/dist/ku4web-components/index-29f2b09f.system.js +0 -1
  223. package/dist/ku4web-components/index-5d0cb00d.system.js +0 -1
  224. package/dist/ku4web-components/index-6cfd87e4.js +0 -3
  225. package/dist/ku4web-components/index-a02dcfc8.js +0 -3057
  226. package/dist/ku4web-components/index-aa119486.js +0 -3
  227. package/dist/ku4web-components/index.system.js +0 -1
  228. package/dist/ku4web-components/ku4-carousel-controls.entry.js +0 -89
  229. package/dist/ku4web-components/ku4-carousel-controls.system.entry.js +0 -1
  230. package/dist/ku4web-components/ku4-carousel-slide.entry.js +0 -47
  231. package/dist/ku4web-components/ku4-carousel-slide.system.entry.js +0 -1
  232. package/dist/ku4web-components/ku4-carousel.entry.js +0 -175
  233. package/dist/ku4web-components/ku4-carousel.system.entry.js +0 -1
  234. package/dist/ku4web-components/ku4-col.entry.js +0 -75
  235. package/dist/ku4web-components/ku4-col.system.entry.js +0 -1
  236. package/dist/ku4web-components/ku4-drawer.entry.js +0 -35
  237. package/dist/ku4web-components/ku4-drawer.system.entry.js +0 -1
  238. package/dist/ku4web-components/ku4-feature.entry.js +0 -29
  239. package/dist/ku4web-components/ku4-feature.system.entry.js +0 -1
  240. package/dist/ku4web-components/ku4-focus-trap.entry.js +0 -323
  241. package/dist/ku4web-components/ku4-focus-trap.system.entry.js +0 -1
  242. package/dist/ku4web-components/ku4-form.entry.js +0 -120
  243. package/dist/ku4web-components/ku4-form.system.entry.js +0 -1
  244. package/dist/ku4web-components/ku4-grid.entry.js +0 -108
  245. package/dist/ku4web-components/ku4-grid.system.entry.js +0 -1
  246. package/dist/ku4web-components/ku4-label.entry.js +0 -70
  247. package/dist/ku4web-components/ku4-label.system.entry.js +0 -1
  248. package/dist/ku4web-components/ku4-mask.entry.js +0 -343
  249. package/dist/ku4web-components/ku4-mask.system.entry.js +0 -1
  250. package/dist/ku4web-components/ku4-modal.entry.js +0 -80
  251. package/dist/ku4web-components/ku4-modal.system.entry.js +0 -1
  252. package/dist/ku4web-components/ku4-panel.entry.js +0 -49
  253. package/dist/ku4web-components/ku4-panel.system.entry.js +0 -1
  254. package/dist/ku4web-components/ku4-preview.entry.js +0 -128
  255. package/dist/ku4web-components/ku4-preview.system.entry.js +0 -1
  256. package/dist/ku4web-components/ku4-tab-list.entry.js +0 -76
  257. package/dist/ku4web-components/ku4-tab-list.system.entry.js +0 -1
  258. package/dist/ku4web-components/ku4-tab-panel.entry.js +0 -72
  259. package/dist/ku4web-components/ku4-tab-panel.system.entry.js +0 -1
  260. package/dist/ku4web-components/ku4-tab.entry.js +0 -63
  261. package/dist/ku4web-components/ku4-tab.system.entry.js +0 -1
  262. package/dist/ku4web-components/ku4-table.entry.js +0 -79
  263. package/dist/ku4web-components/ku4-table.system.entry.js +0 -1
  264. package/dist/ku4web-components/ku4-tooltip.entry.js +0 -120
  265. package/dist/ku4web-components/ku4-tooltip.system.entry.js +0 -1
  266. package/dist/ku4web-components/ku4-validation.entry.js +0 -162
  267. package/dist/ku4web-components/ku4-validation.system.entry.js +0 -1
  268. package/dist/ku4web-components/ku4web-components.system.js +0 -1
  269. package/dist/ku4web-components/p-016a7b4e.js +0 -1
  270. package/dist/ku4web-components/p-0de744b1.system.js +0 -1
  271. package/dist/ku4web-components/p-791e2dfc.js +0 -1
  272. package/dist/ku4web-components/p-ac7884f3.entry.js +0 -1
  273. package/dist/ku4web-components/p-e7cd2284.system.js +0 -13
  274. package/dist/ku4web-components/shadow-css-7fde17ac.system.js +0 -13
  275. package/dist/ku4web-components/uid-2ed9f227.system.js +0 -1
  276. package/dist/ku4web-components/uid-3716c2c4.js +0 -9
@@ -1,3057 +0,0 @@
1
- const NAMESPACE = 'ku4web-components';
2
- const BUILD = /* ku4web-components */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: true, hydratedClass: false, initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: true, isTesting: true, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: true, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: false, vdomListener: true, vdomPropOrAttr: true, vdomRef: false, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: false, watchCallback: true };
3
- const Env = /* ku4web-components */ {};
4
-
5
- let scopeId;
6
- let contentRef;
7
- let hostTagName;
8
- let customError;
9
- let i = 0;
10
- let useNativeShadowDom = false;
11
- let checkSlotFallbackVisibility = false;
12
- let checkSlotRelocate = false;
13
- let isSvgMode = false;
14
- let renderingRef = null;
15
- let queueCongestion = 0;
16
- let queuePending = false;
17
- const win = typeof window !== 'undefined' ? window : {};
18
- const CSS = BUILD.cssVarShim ? win.CSS : null;
19
- const doc = win.document || { head: {} };
20
- const H = (win.HTMLElement || class {
21
- });
22
- const plt = {
23
- $flags$: 0,
24
- $resourcesUrl$: '',
25
- jmp: (h) => h(),
26
- raf: (h) => requestAnimationFrame(h),
27
- ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
28
- rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
29
- ce: (eventName, opts) => new CustomEvent(eventName, opts),
30
- };
31
- const setPlatformHelpers = (helpers) => {
32
- Object.assign(plt, helpers);
33
- };
34
- const supportsShadow = BUILD.shadowDomShim && BUILD.shadowDom
35
- ? /*@__PURE__*/ (() => (doc.head.attachShadow + '').indexOf('[native') > -1)()
36
- : true;
37
- const supportsListenerOptions = /*@__PURE__*/ (() => {
38
- let supportsListenerOptions = false;
39
- try {
40
- doc.addEventListener('e', null, Object.defineProperty({}, 'passive', {
41
- get() {
42
- supportsListenerOptions = true;
43
- },
44
- }));
45
- }
46
- catch (e) { }
47
- return supportsListenerOptions;
48
- })();
49
- const promiseResolve = (v) => Promise.resolve(v);
50
- const supportsConstructibleStylesheets = BUILD.constructableCSS
51
- ? /*@__PURE__*/ (() => {
52
- try {
53
- new CSSStyleSheet();
54
- return typeof new CSSStyleSheet().replace === 'function';
55
- }
56
- catch (e) { }
57
- return false;
58
- })()
59
- : false;
60
- const Context = {};
61
- const addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
62
- if (BUILD.hostListener && listeners) {
63
- // this is called immediately within the element's constructor
64
- // initialize our event listeners on the host element
65
- // we do this now so that we can listen to events that may
66
- // have fired even before the instance is ready
67
- if (BUILD.hostListenerTargetParent) {
68
- // this component may have event listeners that should be attached to the parent
69
- if (attachParentListeners) {
70
- // this is being ran from within the connectedCallback
71
- // which is important so that we know the host element actually has a parent element
72
- // filter out the listeners to only have the ones that ARE being attached to the parent
73
- listeners = listeners.filter(([flags]) => flags & 32 /* TargetParent */);
74
- }
75
- else {
76
- // this is being ran from within the component constructor
77
- // everything BUT the parent element listeners should be attached at this time
78
- // filter out the listeners that are NOT being attached to the parent
79
- listeners = listeners.filter(([flags]) => !(flags & 32 /* TargetParent */));
80
- }
81
- }
82
- listeners.map(([flags, name, method]) => {
83
- const target = BUILD.hostListenerTarget ? getHostListenerTarget(elm, flags) : elm;
84
- const handler = hostListenerProxy(hostRef, method);
85
- const opts = hostListenerOpts(flags);
86
- plt.ael(target, name, handler, opts);
87
- (hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
88
- });
89
- }
90
- };
91
- const hostListenerProxy = (hostRef, methodName) => (ev) => {
92
- try {
93
- if (BUILD.lazyLoad) {
94
- if (hostRef.$flags$ & 256 /* isListenReady */) {
95
- // instance is ready, let's call it's member method for this event
96
- hostRef.$lazyInstance$[methodName](ev);
97
- }
98
- else {
99
- (hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
100
- }
101
- }
102
- else {
103
- hostRef.$hostElement$[methodName](ev);
104
- }
105
- }
106
- catch (e) {
107
- consoleError(e);
108
- }
109
- };
110
- const getHostListenerTarget = (elm, flags) => {
111
- if (BUILD.hostListenerTargetDocument && flags & 4 /* TargetDocument */)
112
- return doc;
113
- if (BUILD.hostListenerTargetWindow && flags & 8 /* TargetWindow */)
114
- return win;
115
- if (BUILD.hostListenerTargetBody && flags & 16 /* TargetBody */)
116
- return doc.body;
117
- if (BUILD.hostListenerTargetParent && flags & 32 /* TargetParent */)
118
- return elm.parentElement;
119
- return elm;
120
- };
121
- // prettier-ignore
122
- const hostListenerOpts = (flags) => supportsListenerOptions
123
- ? ({
124
- passive: (flags & 1 /* Passive */) !== 0,
125
- capture: (flags & 2 /* Capture */) !== 0,
126
- })
127
- : (flags & 2 /* Capture */) !== 0;
128
- const CONTENT_REF_ID = 'r';
129
- const ORG_LOCATION_ID = 'o';
130
- const SLOT_NODE_ID = 's';
131
- const TEXT_NODE_ID = 't';
132
- const HYDRATE_ID = 's-id';
133
- const HYDRATED_STYLE_ID = 'sty-id';
134
- const HYDRATE_CHILD_ID = 'c-id';
135
- const HYDRATED_CSS = '{visibility:hidden}[hydrated]{visibility:inherit}';
136
- const XLINK_NS = 'http://www.w3.org/1999/xlink';
137
- const createTime = (fnName, tagName = '') => {
138
- if (BUILD.profile && performance.mark) {
139
- const key = `st:${fnName}:${tagName}:${i++}`;
140
- // Start
141
- performance.mark(key);
142
- // End
143
- return () => performance.measure(`[Stencil] ${fnName}() <${tagName}>`, key);
144
- }
145
- else {
146
- return () => {
147
- return;
148
- };
149
- }
150
- };
151
- const uniqueTime = (key, measureText) => {
152
- if (BUILD.profile && performance.mark) {
153
- if (performance.getEntriesByName(key).length === 0) {
154
- performance.mark(key);
155
- }
156
- return () => {
157
- if (performance.getEntriesByName(measureText).length === 0) {
158
- performance.measure(measureText, key);
159
- }
160
- };
161
- }
162
- else {
163
- return () => {
164
- return;
165
- };
166
- }
167
- };
168
- const inspect = (ref) => {
169
- const hostRef = getHostRef(ref);
170
- if (!hostRef) {
171
- return undefined;
172
- }
173
- const flags = hostRef.$flags$;
174
- const hostElement = hostRef.$hostElement$;
175
- return {
176
- renderCount: hostRef.$renderCount$,
177
- flags: {
178
- hasRendered: !!(flags & 2 /* hasRendered */),
179
- hasConnected: !!(flags & 1 /* hasConnected */),
180
- isWaitingForChildren: !!(flags & 4 /* isWaitingForChildren */),
181
- isConstructingInstance: !!(flags & 8 /* isConstructingInstance */),
182
- isQueuedForUpdate: !!(flags & 16 /* isQueuedForUpdate */),
183
- hasInitializedComponent: !!(flags & 32 /* hasInitializedComponent */),
184
- hasLoadedComponent: !!(flags & 64 /* hasLoadedComponent */),
185
- isWatchReady: !!(flags & 128 /* isWatchReady */),
186
- isListenReady: !!(flags & 256 /* isListenReady */),
187
- needsRerender: !!(flags & 512 /* needsRerender */),
188
- },
189
- instanceValues: hostRef.$instanceValues$,
190
- ancestorComponent: hostRef.$ancestorComponent$,
191
- hostElement,
192
- lazyInstance: hostRef.$lazyInstance$,
193
- vnode: hostRef.$vnode$,
194
- modeName: hostRef.$modeName$,
195
- onReadyPromise: hostRef.$onReadyPromise$,
196
- onReadyResolve: hostRef.$onReadyResolve$,
197
- onInstancePromise: hostRef.$onInstancePromise$,
198
- onInstanceResolve: hostRef.$onInstanceResolve$,
199
- onRenderResolve: hostRef.$onRenderResolve$,
200
- queuedListeners: hostRef.$queuedListeners$,
201
- rmListeners: hostRef.$rmListeners$,
202
- ['s-id']: hostElement['s-id'],
203
- ['s-cr']: hostElement['s-cr'],
204
- ['s-lr']: hostElement['s-lr'],
205
- ['s-p']: hostElement['s-p'],
206
- ['s-rc']: hostElement['s-rc'],
207
- ['s-sc']: hostElement['s-sc'],
208
- };
209
- };
210
- const installDevTools = () => {
211
- if (BUILD.devTools) {
212
- const stencil = (win.stencil = win.stencil || {});
213
- const originalInspect = stencil.inspect;
214
- stencil.inspect = (ref) => {
215
- let result = inspect(ref);
216
- if (!result && typeof originalInspect === 'function') {
217
- result = originalInspect(ref);
218
- }
219
- return result;
220
- };
221
- }
222
- };
223
- const rootAppliedStyles = new WeakMap();
224
- const registerStyle = (scopeId, cssText, allowCS) => {
225
- let style = styles.get(scopeId);
226
- if (supportsConstructibleStylesheets && allowCS) {
227
- style = (style || new CSSStyleSheet());
228
- style.replace(cssText);
229
- }
230
- else {
231
- style = cssText;
232
- }
233
- styles.set(scopeId, style);
234
- };
235
- const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
236
- let scopeId = getScopeId(cmpMeta, mode);
237
- let style = styles.get(scopeId);
238
- if (!BUILD.attachStyles) {
239
- return scopeId;
240
- }
241
- // if an element is NOT connected then getRootNode() will return the wrong root node
242
- // so the fallback is to always use the document for the root node in those cases
243
- styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc;
244
- if (style) {
245
- if (typeof style === 'string') {
246
- styleContainerNode = styleContainerNode.head || styleContainerNode;
247
- let appliedStyles = rootAppliedStyles.get(styleContainerNode);
248
- let styleElm;
249
- if (!appliedStyles) {
250
- rootAppliedStyles.set(styleContainerNode, (appliedStyles = new Set()));
251
- }
252
- if (!appliedStyles.has(scopeId)) {
253
- if (BUILD.hydrateClientSide &&
254
- styleContainerNode.host &&
255
- (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId}"]`))) {
256
- // This is only happening on native shadow-dom, do not needs CSS var shim
257
- styleElm.innerHTML = style;
258
- }
259
- else {
260
- if (BUILD.cssVarShim && plt.$cssShim$) {
261
- styleElm = plt.$cssShim$.createHostStyle(hostElm, scopeId, style, !!(cmpMeta.$flags$ & 10 /* needsScopedEncapsulation */));
262
- const newScopeId = styleElm['s-sc'];
263
- if (newScopeId) {
264
- scopeId = newScopeId;
265
- // we don't want to add this styleID to the appliedStyles Set
266
- // since the cssVarShim might need to apply several different
267
- // stylesheets for the same component
268
- appliedStyles = null;
269
- }
270
- }
271
- else {
272
- styleElm = doc.createElement('style');
273
- styleElm.innerHTML = style;
274
- }
275
- if (BUILD.hydrateServerSide || BUILD.hotModuleReplacement) {
276
- styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId);
277
- }
278
- styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector('link'));
279
- }
280
- if (appliedStyles) {
281
- appliedStyles.add(scopeId);
282
- }
283
- }
284
- }
285
- else if (BUILD.constructableCSS && !styleContainerNode.adoptedStyleSheets.includes(style)) {
286
- styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, style];
287
- }
288
- }
289
- return scopeId;
290
- };
291
- const attachStyles = (hostRef) => {
292
- const cmpMeta = hostRef.$cmpMeta$;
293
- const elm = hostRef.$hostElement$;
294
- const flags = cmpMeta.$flags$;
295
- const endAttachStyles = createTime('attachStyles', cmpMeta.$tagName$);
296
- const scopeId = addStyle(BUILD.shadowDom && supportsShadow && elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(), cmpMeta, hostRef.$modeName$, elm);
297
- if ((BUILD.shadowDom || BUILD.scoped) && BUILD.cssAnnotations && flags & 10 /* needsScopedEncapsulation */) {
298
- // only required when we're NOT using native shadow dom (slot)
299
- // or this browser doesn't support native shadow dom
300
- // and this host element was NOT created with SSR
301
- // let's pick out the inner content for slot projection
302
- // create a node to represent where the original
303
- // content was first placed, which is useful later on
304
- // DOM WRITE!!
305
- elm['s-sc'] = scopeId;
306
- elm.classList.add(scopeId + '-h');
307
- if (BUILD.scoped && flags & 2 /* scopedCssEncapsulation */) {
308
- elm.classList.add(scopeId + '-s');
309
- }
310
- }
311
- endAttachStyles();
312
- };
313
- const getScopeId = (cmp, mode) => 'sc-' + (BUILD.mode && mode && cmp.$flags$ & 32 /* hasMode */ ? cmp.$tagName$ + '-' + mode : cmp.$tagName$);
314
- const convertScopedToShadow = (css) => css.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, '$1{');
315
- // Private
316
- const computeMode = (elm) => modeResolutionChain.map((h) => h(elm)).find((m) => !!m);
317
- // Public
318
- const setMode = (handler) => modeResolutionChain.push(handler);
319
- const getMode = (ref) => getHostRef(ref).$modeName$;
320
- /**
321
- * Default style mode id
322
- */
323
- /**
324
- * Reusable empty obj/array
325
- * Don't add values to these!!
326
- */
327
- const EMPTY_OBJ = {};
328
- /**
329
- * Namespaces
330
- */
331
- const SVG_NS = 'http://www.w3.org/2000/svg';
332
- const HTML_NS = 'http://www.w3.org/1999/xhtml';
333
- const isDef = (v) => v != null;
334
- const isComplexType = (o) => {
335
- // https://jsperf.com/typeof-fn-object/5
336
- o = typeof o;
337
- return o === 'object' || o === 'function';
338
- };
339
- /**
340
- * Production h() function based on Preact by
341
- * Jason Miller (@developit)
342
- * Licensed under the MIT License
343
- * https://github.com/developit/preact/blob/master/LICENSE
344
- *
345
- * Modified for Stencil's compiler and vdom
346
- */
347
- // const stack: any[] = [];
348
- // export function h(nodeName: string | d.FunctionalComponent, vnodeData: d.PropsType, child?: d.ChildType): d.VNode;
349
- // export function h(nodeName: string | d.FunctionalComponent, vnodeData: d.PropsType, ...children: d.ChildType[]): d.VNode;
350
- const h = (nodeName, vnodeData, ...children) => {
351
- let child = null;
352
- let key = null;
353
- let slotName = null;
354
- let simple = false;
355
- let lastSimple = false;
356
- let vNodeChildren = [];
357
- const walk = (c) => {
358
- for (let i = 0; i < c.length; i++) {
359
- child = c[i];
360
- if (Array.isArray(child)) {
361
- walk(child);
362
- }
363
- else if (child != null && typeof child !== 'boolean') {
364
- if ((simple = typeof nodeName !== 'function' && !isComplexType(child))) {
365
- child = String(child);
366
- }
367
- else if (BUILD.isDev && typeof nodeName !== 'function' && child.$flags$ === undefined) {
368
- consoleDevError(`vNode passed as children has unexpected type.
369
- Make sure it's using the correct h() function.
370
- Empty objects can also be the cause, look for JSX comments that became objects.`);
371
- }
372
- if (simple && lastSimple) {
373
- // If the previous child was simple (string), we merge both
374
- vNodeChildren[vNodeChildren.length - 1].$text$ += child;
375
- }
376
- else {
377
- // Append a new vNode, if it's text, we create a text vNode
378
- vNodeChildren.push(simple ? newVNode(null, child) : child);
379
- }
380
- lastSimple = simple;
381
- }
382
- }
383
- };
384
- walk(children);
385
- if (vnodeData) {
386
- if (BUILD.isDev && nodeName === 'input') {
387
- validateInputProperties(vnodeData);
388
- }
389
- // normalize class / classname attributes
390
- if (BUILD.vdomKey && vnodeData.key) {
391
- key = vnodeData.key;
392
- }
393
- if (BUILD.slotRelocation && vnodeData.name) {
394
- slotName = vnodeData.name;
395
- }
396
- if (BUILD.vdomClass) {
397
- const classData = vnodeData.className || vnodeData.class;
398
- if (classData) {
399
- vnodeData.class =
400
- typeof classData !== 'object'
401
- ? classData
402
- : Object.keys(classData)
403
- .filter((k) => classData[k])
404
- .join(' ');
405
- }
406
- }
407
- }
408
- if (BUILD.isDev && vNodeChildren.some(isHost)) {
409
- consoleDevError(`The <Host> must be the single root component. Make sure:
410
- - You are NOT using hostData() and <Host> in the same component.
411
- - <Host> is used once, and it's the single root component of the render() function.`);
412
- }
413
- if (BUILD.vdomFunctional && typeof nodeName === 'function') {
414
- // nodeName is a functional component
415
- return nodeName(vnodeData === null ? {} : vnodeData, vNodeChildren, vdomFnUtils);
416
- }
417
- const vnode = newVNode(nodeName, null);
418
- vnode.$attrs$ = vnodeData;
419
- if (vNodeChildren.length > 0) {
420
- vnode.$children$ = vNodeChildren;
421
- }
422
- if (BUILD.vdomKey) {
423
- vnode.$key$ = key;
424
- }
425
- if (BUILD.slotRelocation) {
426
- vnode.$name$ = slotName;
427
- }
428
- return vnode;
429
- };
430
- const newVNode = (tag, text) => {
431
- const vnode = {
432
- $flags$: 0,
433
- $tag$: tag,
434
- $text$: text,
435
- $elm$: null,
436
- $children$: null,
437
- };
438
- if (BUILD.vdomAttribute) {
439
- vnode.$attrs$ = null;
440
- }
441
- if (BUILD.vdomKey) {
442
- vnode.$key$ = null;
443
- }
444
- if (BUILD.slotRelocation) {
445
- vnode.$name$ = null;
446
- }
447
- return vnode;
448
- };
449
- const Host = {};
450
- const isHost = (node) => node && node.$tag$ === Host;
451
- const vdomFnUtils = {
452
- forEach: (children, cb) => children.map(convertToPublic).forEach(cb),
453
- map: (children, cb) => children.map(convertToPublic).map(cb).map(convertToPrivate),
454
- };
455
- const convertToPublic = (node) => ({
456
- vattrs: node.$attrs$,
457
- vchildren: node.$children$,
458
- vkey: node.$key$,
459
- vname: node.$name$,
460
- vtag: node.$tag$,
461
- vtext: node.$text$,
462
- });
463
- const convertToPrivate = (node) => {
464
- if (typeof node.vtag === 'function') {
465
- const vnodeData = Object.assign({}, node.vattrs);
466
- if (node.vkey) {
467
- vnodeData.key = node.vkey;
468
- }
469
- if (node.vname) {
470
- vnodeData.name = node.vname;
471
- }
472
- return h(node.vtag, vnodeData, ...(node.vchildren || []));
473
- }
474
- const vnode = newVNode(node.vtag, node.vtext);
475
- vnode.$attrs$ = node.vattrs;
476
- vnode.$children$ = node.vchildren;
477
- vnode.$key$ = node.vkey;
478
- vnode.$name$ = node.vname;
479
- return vnode;
480
- };
481
- /**
482
- * Validates the ordering of attributes on an input element
483
- * @param inputElm the element to validate
484
- */
485
- const validateInputProperties = (inputElm) => {
486
- const props = Object.keys(inputElm);
487
- const value = props.indexOf('value');
488
- if (value === -1) {
489
- return;
490
- }
491
- const typeIndex = props.indexOf('type');
492
- const minIndex = props.indexOf('min');
493
- const maxIndex = props.indexOf('max');
494
- const stepIndex = props.indexOf('step');
495
- if (value < typeIndex || value < minIndex || value < maxIndex || value < stepIndex) {
496
- consoleDevWarn(`The "value" prop of <input> should be set after "min", "max", "type" and "step"`);
497
- }
498
- };
499
- /**
500
- * Production setAccessor() function based on Preact by
501
- * Jason Miller (@developit)
502
- * Licensed under the MIT License
503
- * https://github.com/developit/preact/blob/master/LICENSE
504
- *
505
- * Modified for Stencil's compiler and vdom
506
- */
507
- const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
508
- if (oldValue !== newValue) {
509
- let isProp = isMemberInElement(elm, memberName);
510
- let ln = memberName.toLowerCase();
511
- if (BUILD.vdomClass && memberName === 'class') {
512
- const classList = elm.classList;
513
- const oldClasses = parseClassList(oldValue);
514
- const newClasses = parseClassList(newValue);
515
- classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
516
- classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
517
- }
518
- else if (BUILD.vdomStyle && memberName === 'style') {
519
- // update style attribute, css properties and values
520
- if (BUILD.updatable) {
521
- for (const prop in oldValue) {
522
- if (!newValue || newValue[prop] == null) {
523
- if (!BUILD.hydrateServerSide && prop.includes('-')) {
524
- elm.style.removeProperty(prop);
525
- }
526
- else {
527
- elm.style[prop] = '';
528
- }
529
- }
530
- }
531
- }
532
- for (const prop in newValue) {
533
- if (!oldValue || newValue[prop] !== oldValue[prop]) {
534
- if (!BUILD.hydrateServerSide && prop.includes('-')) {
535
- elm.style.setProperty(prop, newValue[prop]);
536
- }
537
- else {
538
- elm.style[prop] = newValue[prop];
539
- }
540
- }
541
- }
542
- }
543
- else if (BUILD.vdomKey && memberName === 'key')
544
- ;
545
- else if (BUILD.vdomRef && memberName === 'ref') {
546
- // minifier will clean this up
547
- if (newValue) {
548
- newValue(elm);
549
- }
550
- }
551
- else if (BUILD.vdomListener &&
552
- (BUILD.lazyLoad ? !isProp : !elm.__lookupSetter__(memberName)) &&
553
- memberName[0] === 'o' &&
554
- memberName[1] === 'n') {
555
- // Event Handlers
556
- // so if the member name starts with "on" and the 3rd characters is
557
- // a capital letter, and it's not already a member on the element,
558
- // then we're assuming it's an event listener
559
- if (memberName[2] === '-') {
560
- // on- prefixed events
561
- // allows to be explicit about the dom event to listen without any magic
562
- // under the hood:
563
- // <my-cmp on-click> // listens for "click"
564
- // <my-cmp on-Click> // listens for "Click"
565
- // <my-cmp on-ionChange> // listens for "ionChange"
566
- // <my-cmp on-EVENTS> // listens for "EVENTS"
567
- memberName = memberName.slice(3);
568
- }
569
- else if (isMemberInElement(win, ln)) {
570
- // standard event
571
- // the JSX attribute could have been "onMouseOver" and the
572
- // member name "onmouseover" is on the window's prototype
573
- // so let's add the listener "mouseover", which is all lowercased
574
- memberName = ln.slice(2);
575
- }
576
- else {
577
- // custom event
578
- // the JSX attribute could have been "onMyCustomEvent"
579
- // so let's trim off the "on" prefix and lowercase the first character
580
- // and add the listener "myCustomEvent"
581
- // except for the first character, we keep the event name case
582
- memberName = ln[2] + memberName.slice(3);
583
- }
584
- if (oldValue) {
585
- plt.rel(elm, memberName, oldValue, false);
586
- }
587
- if (newValue) {
588
- plt.ael(elm, memberName, newValue, false);
589
- }
590
- }
591
- else if (BUILD.vdomPropOrAttr) {
592
- // Set property if it exists and it's not a SVG
593
- const isComplex = isComplexType(newValue);
594
- if ((isProp || (isComplex && newValue !== null)) && !isSvg) {
595
- try {
596
- if (!elm.tagName.includes('-')) {
597
- let n = newValue == null ? '' : newValue;
598
- // Workaround for Safari, moving the <input> caret when re-assigning the same valued
599
- if (memberName === 'list') {
600
- isProp = false;
601
- }
602
- else if (oldValue == null || elm[memberName] != n) {
603
- elm[memberName] = n;
604
- }
605
- }
606
- else {
607
- elm[memberName] = newValue;
608
- }
609
- }
610
- catch (e) { }
611
- }
612
- /**
613
- * Need to manually update attribute if:
614
- * - memberName is not an attribute
615
- * - if we are rendering the host element in order to reflect attribute
616
- * - if it's a SVG, since properties might not work in <svg>
617
- * - if the newValue is null/undefined or 'false'.
618
- */
619
- let xlink = false;
620
- if (BUILD.vdomXlink) {
621
- if (ln !== (ln = ln.replace(/^xlink\:?/, ''))) {
622
- memberName = ln;
623
- xlink = true;
624
- }
625
- }
626
- if (newValue == null || newValue === false) {
627
- if (newValue !== false || elm.getAttribute(memberName) === '') {
628
- if (BUILD.vdomXlink && xlink) {
629
- elm.removeAttributeNS(XLINK_NS, memberName);
630
- }
631
- else {
632
- elm.removeAttribute(memberName);
633
- }
634
- }
635
- }
636
- else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex) {
637
- newValue = newValue === true ? '' : newValue;
638
- if (BUILD.vdomXlink && xlink) {
639
- elm.setAttributeNS(XLINK_NS, memberName, newValue);
640
- }
641
- else {
642
- elm.setAttribute(memberName, newValue);
643
- }
644
- }
645
- }
646
- }
647
- };
648
- const parseClassListRegex = /\s/;
649
- const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
650
- const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
651
- // if the element passed in is a shadow root, which is a document fragment
652
- // then we want to be adding attrs/props to the shadow root's "host" element
653
- // if it's not a shadow root, then we add attrs/props to the same element
654
- const elm = newVnode.$elm$.nodeType === 11 /* DocumentFragment */ && newVnode.$elm$.host
655
- ? newVnode.$elm$.host
656
- : newVnode.$elm$;
657
- const oldVnodeAttrs = (oldVnode && oldVnode.$attrs$) || EMPTY_OBJ;
658
- const newVnodeAttrs = newVnode.$attrs$ || EMPTY_OBJ;
659
- if (BUILD.updatable) {
660
- // remove attributes no longer present on the vnode by setting them to undefined
661
- for (memberName in oldVnodeAttrs) {
662
- if (!(memberName in newVnodeAttrs)) {
663
- setAccessor(elm, memberName, oldVnodeAttrs[memberName], undefined, isSvgMode, newVnode.$flags$);
664
- }
665
- }
666
- }
667
- // add new & update changed attributes
668
- for (memberName in newVnodeAttrs) {
669
- setAccessor(elm, memberName, oldVnodeAttrs[memberName], newVnodeAttrs[memberName], isSvgMode, newVnode.$flags$);
670
- }
671
- };
672
- const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
673
- // tslint:disable-next-line: prefer-const
674
- let newVNode = newParentVNode.$children$[childIndex];
675
- let i = 0;
676
- let elm;
677
- let childNode;
678
- let oldVNode;
679
- if (BUILD.slotRelocation && !useNativeShadowDom) {
680
- // remember for later we need to check to relocate nodes
681
- checkSlotRelocate = true;
682
- if (newVNode.$tag$ === 'slot') {
683
- if (scopeId) {
684
- // scoped css needs to add its scoped id to the parent element
685
- parentElm.classList.add(scopeId + '-s');
686
- }
687
- newVNode.$flags$ |= newVNode.$children$
688
- ? // slot element has fallback content
689
- 2 /* isSlotFallback */
690
- : // slot element does not have fallback content
691
- 1 /* isSlotReference */;
692
- }
693
- }
694
- if (BUILD.isDev && newVNode.$elm$) {
695
- consoleDevError(`The JSX ${newVNode.$text$ !== null ? `"${newVNode.$text$}" text` : `"${newVNode.$tag$}" element`} node should not be shared within the same renderer. The renderer caches element lookups in order to improve performance. However, a side effect from this is that the exact same JSX node should not be reused. For more information please see https://stenciljs.com/docs/templating-jsx#avoid-shared-jsx-nodes`);
696
- }
697
- if (BUILD.vdomText && newVNode.$text$ !== null) {
698
- // create text node
699
- elm = newVNode.$elm$ = doc.createTextNode(newVNode.$text$);
700
- }
701
- else if (BUILD.slotRelocation && newVNode.$flags$ & 1 /* isSlotReference */) {
702
- // create a slot reference node
703
- elm = newVNode.$elm$ =
704
- BUILD.isDebug || BUILD.hydrateServerSide ? slotReferenceDebugNode(newVNode) : doc.createTextNode('');
705
- }
706
- else {
707
- if (BUILD.svg && !isSvgMode) {
708
- isSvgMode = newVNode.$tag$ === 'svg';
709
- }
710
- // create element
711
- elm = newVNode.$elm$ = (BUILD.svg
712
- ? doc.createElementNS(isSvgMode ? SVG_NS : HTML_NS, BUILD.slotRelocation && newVNode.$flags$ & 2 /* isSlotFallback */
713
- ? 'slot-fb'
714
- : newVNode.$tag$)
715
- : doc.createElement(BUILD.slotRelocation && newVNode.$flags$ & 2 /* isSlotFallback */
716
- ? 'slot-fb'
717
- : newVNode.$tag$));
718
- if (BUILD.svg && isSvgMode && newVNode.$tag$ === 'foreignObject') {
719
- isSvgMode = false;
720
- }
721
- // add css classes, attrs, props, listeners, etc.
722
- if (BUILD.vdomAttribute) {
723
- updateElement(null, newVNode, isSvgMode);
724
- }
725
- if ((BUILD.shadowDom || BUILD.scoped) && isDef(scopeId) && elm['s-si'] !== scopeId) {
726
- // if there is a scopeId and this is the initial render
727
- // then let's add the scopeId as a css class
728
- elm.classList.add((elm['s-si'] = scopeId));
729
- }
730
- if (newVNode.$children$) {
731
- for (i = 0; i < newVNode.$children$.length; ++i) {
732
- // create the node
733
- childNode = createElm(oldParentVNode, newVNode, i, elm);
734
- // return node could have been null
735
- if (childNode) {
736
- // append our new node
737
- elm.appendChild(childNode);
738
- }
739
- }
740
- }
741
- if (BUILD.svg) {
742
- if (newVNode.$tag$ === 'svg') {
743
- // Only reset the SVG context when we're exiting <svg> element
744
- isSvgMode = false;
745
- }
746
- else if (elm.tagName === 'foreignObject') {
747
- // Reenter SVG context when we're exiting <foreignObject> element
748
- isSvgMode = true;
749
- }
750
- }
751
- }
752
- if (BUILD.slotRelocation) {
753
- elm['s-hn'] = hostTagName;
754
- if (newVNode.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) {
755
- // remember the content reference comment
756
- elm['s-sr'] = true;
757
- // remember the content reference comment
758
- elm['s-cr'] = contentRef;
759
- // remember the slot name, or empty string for default slot
760
- elm['s-sn'] = newVNode.$name$ || '';
761
- // check if we've got an old vnode for this slot
762
- oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
763
- if (oldVNode && oldVNode.$tag$ === newVNode.$tag$ && oldParentVNode.$elm$) {
764
- // we've got an old slot vnode and the wrapper is being replaced
765
- // so let's move the old slot content back to it's original location
766
- putBackInOriginalLocation(oldParentVNode.$elm$, false);
767
- }
768
- }
769
- }
770
- return elm;
771
- };
772
- const putBackInOriginalLocation = (parentElm, recursive) => {
773
- plt.$flags$ |= 1 /* isTmpDisconnected */;
774
- const oldSlotChildNodes = parentElm.childNodes;
775
- for (let i = oldSlotChildNodes.length - 1; i >= 0; i--) {
776
- const childNode = oldSlotChildNodes[i];
777
- if (childNode['s-hn'] !== hostTagName && childNode['s-ol']) {
778
- // // this child node in the old element is from another component
779
- // // remove this node from the old slot's parent
780
- // childNode.remove();
781
- // and relocate it back to it's original location
782
- parentReferenceNode(childNode).insertBefore(childNode, referenceNode(childNode));
783
- // remove the old original location comment entirely
784
- // later on the patch function will know what to do
785
- // and move this to the correct spot in need be
786
- childNode['s-ol'].remove();
787
- childNode['s-ol'] = undefined;
788
- checkSlotRelocate = true;
789
- }
790
- if (recursive) {
791
- putBackInOriginalLocation(childNode, recursive);
792
- }
793
- }
794
- plt.$flags$ &= ~1 /* isTmpDisconnected */;
795
- };
796
- const addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
797
- let containerElm = ((BUILD.slotRelocation && parentElm['s-cr'] && parentElm['s-cr'].parentNode) || parentElm);
798
- let childNode;
799
- if (BUILD.shadowDom && containerElm.shadowRoot && containerElm.tagName === hostTagName) {
800
- containerElm = containerElm.shadowRoot;
801
- }
802
- for (; startIdx <= endIdx; ++startIdx) {
803
- if (vnodes[startIdx]) {
804
- childNode = createElm(null, parentVNode, startIdx, parentElm);
805
- if (childNode) {
806
- vnodes[startIdx].$elm$ = childNode;
807
- containerElm.insertBefore(childNode, BUILD.slotRelocation ? referenceNode(before) : before);
808
- }
809
- }
810
- }
811
- };
812
- const removeVnodes = (vnodes, startIdx, endIdx, vnode, elm) => {
813
- for (; startIdx <= endIdx; ++startIdx) {
814
- if ((vnode = vnodes[startIdx])) {
815
- elm = vnode.$elm$;
816
- callNodeRefs(vnode);
817
- if (BUILD.slotRelocation) {
818
- // we're removing this element
819
- // so it's possible we need to show slot fallback content now
820
- checkSlotFallbackVisibility = true;
821
- if (elm['s-ol']) {
822
- // remove the original location comment
823
- elm['s-ol'].remove();
824
- }
825
- else {
826
- // it's possible that child nodes of the node
827
- // that's being removed are slot nodes
828
- putBackInOriginalLocation(elm, true);
829
- }
830
- }
831
- // remove the vnode's element from the dom
832
- elm.remove();
833
- }
834
- }
835
- };
836
- const updateChildren = (parentElm, oldCh, newVNode, newCh) => {
837
- let oldStartIdx = 0;
838
- let newStartIdx = 0;
839
- let idxInOld = 0;
840
- let i = 0;
841
- let oldEndIdx = oldCh.length - 1;
842
- let oldStartVnode = oldCh[0];
843
- let oldEndVnode = oldCh[oldEndIdx];
844
- let newEndIdx = newCh.length - 1;
845
- let newStartVnode = newCh[0];
846
- let newEndVnode = newCh[newEndIdx];
847
- let node;
848
- let elmToMove;
849
- while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
850
- if (oldStartVnode == null) {
851
- // Vnode might have been moved left
852
- oldStartVnode = oldCh[++oldStartIdx];
853
- }
854
- else if (oldEndVnode == null) {
855
- oldEndVnode = oldCh[--oldEndIdx];
856
- }
857
- else if (newStartVnode == null) {
858
- newStartVnode = newCh[++newStartIdx];
859
- }
860
- else if (newEndVnode == null) {
861
- newEndVnode = newCh[--newEndIdx];
862
- }
863
- else if (isSameVnode(oldStartVnode, newStartVnode)) {
864
- patch(oldStartVnode, newStartVnode);
865
- oldStartVnode = oldCh[++oldStartIdx];
866
- newStartVnode = newCh[++newStartIdx];
867
- }
868
- else if (isSameVnode(oldEndVnode, newEndVnode)) {
869
- patch(oldEndVnode, newEndVnode);
870
- oldEndVnode = oldCh[--oldEndIdx];
871
- newEndVnode = newCh[--newEndIdx];
872
- }
873
- else if (isSameVnode(oldStartVnode, newEndVnode)) {
874
- // Vnode moved right
875
- if (BUILD.slotRelocation && (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot')) {
876
- putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false);
877
- }
878
- patch(oldStartVnode, newEndVnode);
879
- parentElm.insertBefore(oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
880
- oldStartVnode = oldCh[++oldStartIdx];
881
- newEndVnode = newCh[--newEndIdx];
882
- }
883
- else if (isSameVnode(oldEndVnode, newStartVnode)) {
884
- // Vnode moved left
885
- if (BUILD.slotRelocation && (oldStartVnode.$tag$ === 'slot' || newEndVnode.$tag$ === 'slot')) {
886
- putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false);
887
- }
888
- patch(oldEndVnode, newStartVnode);
889
- parentElm.insertBefore(oldEndVnode.$elm$, oldStartVnode.$elm$);
890
- oldEndVnode = oldCh[--oldEndIdx];
891
- newStartVnode = newCh[++newStartIdx];
892
- }
893
- else {
894
- // createKeyToOldIdx
895
- idxInOld = -1;
896
- if (BUILD.vdomKey) {
897
- for (i = oldStartIdx; i <= oldEndIdx; ++i) {
898
- if (oldCh[i] && oldCh[i].$key$ !== null && oldCh[i].$key$ === newStartVnode.$key$) {
899
- idxInOld = i;
900
- break;
901
- }
902
- }
903
- }
904
- if (BUILD.vdomKey && idxInOld >= 0) {
905
- elmToMove = oldCh[idxInOld];
906
- if (elmToMove.$tag$ !== newStartVnode.$tag$) {
907
- node = createElm(oldCh && oldCh[newStartIdx], newVNode, idxInOld, parentElm);
908
- }
909
- else {
910
- patch(elmToMove, newStartVnode);
911
- oldCh[idxInOld] = undefined;
912
- node = elmToMove.$elm$;
913
- }
914
- newStartVnode = newCh[++newStartIdx];
915
- }
916
- else {
917
- // new element
918
- node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx, parentElm);
919
- newStartVnode = newCh[++newStartIdx];
920
- }
921
- if (node) {
922
- if (BUILD.slotRelocation) {
923
- parentReferenceNode(oldStartVnode.$elm$).insertBefore(node, referenceNode(oldStartVnode.$elm$));
924
- }
925
- else {
926
- oldStartVnode.$elm$.parentNode.insertBefore(node, oldStartVnode.$elm$);
927
- }
928
- }
929
- }
930
- }
931
- if (oldStartIdx > oldEndIdx) {
932
- addVnodes(parentElm, newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$, newVNode, newCh, newStartIdx, newEndIdx);
933
- }
934
- else if (BUILD.updatable && newStartIdx > newEndIdx) {
935
- removeVnodes(oldCh, oldStartIdx, oldEndIdx);
936
- }
937
- };
938
- const isSameVnode = (vnode1, vnode2) => {
939
- // compare if two vnode to see if they're "technically" the same
940
- // need to have the same element tag, and same key to be the same
941
- if (vnode1.$tag$ === vnode2.$tag$) {
942
- if (BUILD.slotRelocation && vnode1.$tag$ === 'slot') {
943
- return vnode1.$name$ === vnode2.$name$;
944
- }
945
- if (BUILD.vdomKey) {
946
- return vnode1.$key$ === vnode2.$key$;
947
- }
948
- return true;
949
- }
950
- return false;
951
- };
952
- const referenceNode = (node) => {
953
- // this node was relocated to a new location in the dom
954
- // because of some other component's slot
955
- // but we still have an html comment in place of where
956
- // it's original location was according to it's original vdom
957
- return (node && node['s-ol']) || node;
958
- };
959
- const parentReferenceNode = (node) => (node['s-ol'] ? node['s-ol'] : node).parentNode;
960
- const patch = (oldVNode, newVNode) => {
961
- const elm = (newVNode.$elm$ = oldVNode.$elm$);
962
- const oldChildren = oldVNode.$children$;
963
- const newChildren = newVNode.$children$;
964
- const tag = newVNode.$tag$;
965
- const text = newVNode.$text$;
966
- let defaultHolder;
967
- if (!BUILD.vdomText || text === null) {
968
- if (BUILD.svg) {
969
- // test if we're rendering an svg element, or still rendering nodes inside of one
970
- // only add this to the when the compiler sees we're using an svg somewhere
971
- isSvgMode = tag === 'svg' ? true : tag === 'foreignObject' ? false : isSvgMode;
972
- }
973
- // element node
974
- if (BUILD.vdomAttribute || BUILD.reflect) {
975
- if (BUILD.slot && tag === 'slot')
976
- ;
977
- else {
978
- // either this is the first render of an element OR it's an update
979
- // AND we already know it's possible it could have changed
980
- // this updates the element's css classes, attrs, props, listeners, etc.
981
- updateElement(oldVNode, newVNode, isSvgMode);
982
- }
983
- }
984
- if (BUILD.updatable && oldChildren !== null && newChildren !== null) {
985
- // looks like there's child vnodes for both the old and new vnodes
986
- updateChildren(elm, oldChildren, newVNode, newChildren);
987
- }
988
- else if (newChildren !== null) {
989
- // no old child vnodes, but there are new child vnodes to add
990
- if (BUILD.updatable && BUILD.vdomText && oldVNode.$text$ !== null) {
991
- // the old vnode was text, so be sure to clear it out
992
- elm.textContent = '';
993
- }
994
- // add the new vnode children
995
- addVnodes(elm, null, newVNode, newChildren, 0, newChildren.length - 1);
996
- }
997
- else if (BUILD.updatable && oldChildren !== null) {
998
- // no new child vnodes, but there are old child vnodes to remove
999
- removeVnodes(oldChildren, 0, oldChildren.length - 1);
1000
- }
1001
- if (BUILD.svg && isSvgMode && tag === 'svg') {
1002
- isSvgMode = false;
1003
- }
1004
- }
1005
- else if (BUILD.vdomText && BUILD.slotRelocation && (defaultHolder = elm['s-cr'])) {
1006
- // this element has slotted content
1007
- defaultHolder.parentNode.textContent = text;
1008
- }
1009
- else if (BUILD.vdomText && oldVNode.$text$ !== text) {
1010
- // update the text content for the text only vnode
1011
- // and also only if the text is different than before
1012
- elm.data = text;
1013
- }
1014
- };
1015
- const updateFallbackSlotVisibility = (elm) => {
1016
- // tslint:disable-next-line: prefer-const
1017
- let childNodes = elm.childNodes;
1018
- let childNode;
1019
- let i;
1020
- let ilen;
1021
- let j;
1022
- let slotNameAttr;
1023
- let nodeType;
1024
- for (i = 0, ilen = childNodes.length; i < ilen; i++) {
1025
- childNode = childNodes[i];
1026
- if (childNode.nodeType === 1 /* ElementNode */) {
1027
- if (childNode['s-sr']) {
1028
- // this is a slot fallback node
1029
- // get the slot name for this slot reference node
1030
- slotNameAttr = childNode['s-sn'];
1031
- // by default always show a fallback slot node
1032
- // then hide it if there are other slots in the light dom
1033
- childNode.hidden = false;
1034
- for (j = 0; j < ilen; j++) {
1035
- nodeType = childNodes[j].nodeType;
1036
- if (childNodes[j]['s-hn'] !== childNode['s-hn'] || slotNameAttr !== '') {
1037
- // this sibling node is from a different component OR is a named fallback slot node
1038
- if (nodeType === 1 /* ElementNode */ && slotNameAttr === childNodes[j].getAttribute('slot')) {
1039
- childNode.hidden = true;
1040
- break;
1041
- }
1042
- }
1043
- else {
1044
- // this is a default fallback slot node
1045
- // any element or text node (with content)
1046
- // should hide the default fallback slot node
1047
- if (nodeType === 1 /* ElementNode */ ||
1048
- (nodeType === 3 /* TextNode */ && childNodes[j].textContent.trim() !== '')) {
1049
- childNode.hidden = true;
1050
- break;
1051
- }
1052
- }
1053
- }
1054
- }
1055
- // keep drilling down
1056
- updateFallbackSlotVisibility(childNode);
1057
- }
1058
- }
1059
- };
1060
- const relocateNodes = [];
1061
- const relocateSlotContent = (elm) => {
1062
- // tslint:disable-next-line: prefer-const
1063
- let childNode;
1064
- let node;
1065
- let hostContentNodes;
1066
- let slotNameAttr;
1067
- let relocateNodeData;
1068
- let j;
1069
- let i = 0;
1070
- let childNodes = elm.childNodes;
1071
- let ilen = childNodes.length;
1072
- for (; i < ilen; i++) {
1073
- childNode = childNodes[i];
1074
- if (childNode['s-sr'] && (node = childNode['s-cr']) && node.parentNode) {
1075
- // first got the content reference comment node
1076
- // then we got it's parent, which is where all the host content is in now
1077
- hostContentNodes = node.parentNode.childNodes;
1078
- slotNameAttr = childNode['s-sn'];
1079
- for (j = hostContentNodes.length - 1; j >= 0; j--) {
1080
- node = hostContentNodes[j];
1081
- if (!node['s-cn'] && !node['s-nr'] && node['s-hn'] !== childNode['s-hn']) {
1082
- // let's do some relocating to its new home
1083
- // but never relocate a content reference node
1084
- // that is suppose to always represent the original content location
1085
- if (isNodeLocatedInSlot(node, slotNameAttr)) {
1086
- // it's possible we've already decided to relocate this node
1087
- relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
1088
- // made some changes to slots
1089
- // let's make sure we also double check
1090
- // fallbacks are correctly hidden or shown
1091
- checkSlotFallbackVisibility = true;
1092
- node['s-sn'] = node['s-sn'] || slotNameAttr;
1093
- if (relocateNodeData) {
1094
- // previously we never found a slot home for this node
1095
- // but turns out we did, so let's remember it now
1096
- relocateNodeData.$slotRefNode$ = childNode;
1097
- }
1098
- else {
1099
- // add to our list of nodes to relocate
1100
- relocateNodes.push({
1101
- $slotRefNode$: childNode,
1102
- $nodeToRelocate$: node,
1103
- });
1104
- }
1105
- if (node['s-sr']) {
1106
- relocateNodes.map((relocateNode) => {
1107
- if (isNodeLocatedInSlot(relocateNode.$nodeToRelocate$, node['s-sn'])) {
1108
- relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
1109
- if (relocateNodeData && !relocateNode.$slotRefNode$) {
1110
- relocateNode.$slotRefNode$ = relocateNodeData.$slotRefNode$;
1111
- }
1112
- }
1113
- });
1114
- }
1115
- }
1116
- else if (!relocateNodes.some((r) => r.$nodeToRelocate$ === node)) {
1117
- // so far this element does not have a slot home, not setting slotRefNode on purpose
1118
- // if we never find a home for this element then we'll need to hide it
1119
- relocateNodes.push({
1120
- $nodeToRelocate$: node,
1121
- });
1122
- }
1123
- }
1124
- }
1125
- }
1126
- if (childNode.nodeType === 1 /* ElementNode */) {
1127
- relocateSlotContent(childNode);
1128
- }
1129
- }
1130
- };
1131
- const isNodeLocatedInSlot = (nodeToRelocate, slotNameAttr) => {
1132
- if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
1133
- if (nodeToRelocate.getAttribute('slot') === null && slotNameAttr === '') {
1134
- return true;
1135
- }
1136
- if (nodeToRelocate.getAttribute('slot') === slotNameAttr) {
1137
- return true;
1138
- }
1139
- return false;
1140
- }
1141
- if (nodeToRelocate['s-sn'] === slotNameAttr) {
1142
- return true;
1143
- }
1144
- return slotNameAttr === '';
1145
- };
1146
- const callNodeRefs = (vNode) => {
1147
- if (BUILD.vdomRef) {
1148
- vNode.$attrs$ && vNode.$attrs$.ref && vNode.$attrs$.ref(null);
1149
- vNode.$children$ && vNode.$children$.map(callNodeRefs);
1150
- }
1151
- };
1152
- const renderVdom = (hostRef, renderFnResults) => {
1153
- const hostElm = hostRef.$hostElement$;
1154
- const cmpMeta = hostRef.$cmpMeta$;
1155
- const oldVNode = hostRef.$vnode$ || newVNode(null, null);
1156
- const rootVnode = isHost(renderFnResults) ? renderFnResults : h(null, null, renderFnResults);
1157
- hostTagName = hostElm.tagName;
1158
- // <Host> runtime check
1159
- if (BUILD.isDev && Array.isArray(renderFnResults) && renderFnResults.some(isHost)) {
1160
- throw new Error(`The <Host> must be the single root component.
1161
- Looks like the render() function of "${hostTagName.toLowerCase()}" is returning an array that contains the <Host>.
1162
-
1163
- The render() function should look like this instead:
1164
-
1165
- render() {
1166
- // Do not return an array
1167
- return (
1168
- <Host>{content}</Host>
1169
- );
1170
- }
1171
- `);
1172
- }
1173
- if (BUILD.reflect && cmpMeta.$attrsToReflect$) {
1174
- rootVnode.$attrs$ = rootVnode.$attrs$ || {};
1175
- cmpMeta.$attrsToReflect$.map(([propName, attribute]) => (rootVnode.$attrs$[attribute] = hostElm[propName]));
1176
- }
1177
- rootVnode.$tag$ = null;
1178
- rootVnode.$flags$ |= 4 /* isHost */;
1179
- hostRef.$vnode$ = rootVnode;
1180
- rootVnode.$elm$ = oldVNode.$elm$ = (BUILD.shadowDom ? hostElm.shadowRoot || hostElm : hostElm);
1181
- if (BUILD.scoped || BUILD.shadowDom) {
1182
- scopeId = hostElm['s-sc'];
1183
- }
1184
- if (BUILD.slotRelocation) {
1185
- contentRef = hostElm['s-cr'];
1186
- useNativeShadowDom = supportsShadow && (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0;
1187
- // always reset
1188
- checkSlotFallbackVisibility = false;
1189
- }
1190
- // synchronous patch
1191
- patch(oldVNode, rootVnode);
1192
- if (BUILD.slotRelocation) {
1193
- // while we're moving nodes around existing nodes, temporarily disable
1194
- // the disconnectCallback from working
1195
- plt.$flags$ |= 1 /* isTmpDisconnected */;
1196
- if (checkSlotRelocate) {
1197
- relocateSlotContent(rootVnode.$elm$);
1198
- let relocateData;
1199
- let nodeToRelocate;
1200
- let orgLocationNode;
1201
- let parentNodeRef;
1202
- let insertBeforeNode;
1203
- let refNode;
1204
- let i = 0;
1205
- for (; i < relocateNodes.length; i++) {
1206
- relocateData = relocateNodes[i];
1207
- nodeToRelocate = relocateData.$nodeToRelocate$;
1208
- if (!nodeToRelocate['s-ol']) {
1209
- // add a reference node marking this node's original location
1210
- // keep a reference to this node for later lookups
1211
- orgLocationNode =
1212
- BUILD.isDebug || BUILD.hydrateServerSide
1213
- ? originalLocationDebugNode(nodeToRelocate)
1214
- : doc.createTextNode('');
1215
- orgLocationNode['s-nr'] = nodeToRelocate;
1216
- nodeToRelocate.parentNode.insertBefore((nodeToRelocate['s-ol'] = orgLocationNode), nodeToRelocate);
1217
- }
1218
- }
1219
- for (i = 0; i < relocateNodes.length; i++) {
1220
- relocateData = relocateNodes[i];
1221
- nodeToRelocate = relocateData.$nodeToRelocate$;
1222
- if (relocateData.$slotRefNode$) {
1223
- // by default we're just going to insert it directly
1224
- // after the slot reference node
1225
- parentNodeRef = relocateData.$slotRefNode$.parentNode;
1226
- insertBeforeNode = relocateData.$slotRefNode$.nextSibling;
1227
- orgLocationNode = nodeToRelocate['s-ol'];
1228
- while ((orgLocationNode = orgLocationNode.previousSibling)) {
1229
- refNode = orgLocationNode['s-nr'];
1230
- if (refNode && refNode['s-sn'] === nodeToRelocate['s-sn'] && parentNodeRef === refNode.parentNode) {
1231
- refNode = refNode.nextSibling;
1232
- if (!refNode || !refNode['s-nr']) {
1233
- insertBeforeNode = refNode;
1234
- break;
1235
- }
1236
- }
1237
- }
1238
- if ((!insertBeforeNode && parentNodeRef !== nodeToRelocate.parentNode) ||
1239
- nodeToRelocate.nextSibling !== insertBeforeNode) {
1240
- // we've checked that it's worth while to relocate
1241
- // since that the node to relocate
1242
- // has a different next sibling or parent relocated
1243
- if (nodeToRelocate !== insertBeforeNode) {
1244
- if (!nodeToRelocate['s-hn'] && nodeToRelocate['s-ol']) {
1245
- // probably a component in the index.html that doesn't have it's hostname set
1246
- nodeToRelocate['s-hn'] = nodeToRelocate['s-ol'].parentNode.nodeName;
1247
- }
1248
- // add it back to the dom but in its new home
1249
- parentNodeRef.insertBefore(nodeToRelocate, insertBeforeNode);
1250
- }
1251
- }
1252
- }
1253
- else {
1254
- // this node doesn't have a slot home to go to, so let's hide it
1255
- if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
1256
- nodeToRelocate.hidden = true;
1257
- }
1258
- }
1259
- }
1260
- }
1261
- if (checkSlotFallbackVisibility) {
1262
- updateFallbackSlotVisibility(rootVnode.$elm$);
1263
- }
1264
- // done moving nodes around
1265
- // allow the disconnect callback to work again
1266
- plt.$flags$ &= ~1 /* isTmpDisconnected */;
1267
- // always reset
1268
- relocateNodes.length = 0;
1269
- }
1270
- };
1271
- // slot comment debug nodes only created with the `--debug` flag
1272
- // otherwise these nodes are text nodes w/out content
1273
- const slotReferenceDebugNode = (slotVNode) => doc.createComment(`<slot${slotVNode.$name$ ? ' name="' + slotVNode.$name$ + '"' : ''}> (host=${hostTagName.toLowerCase()})`);
1274
- const originalLocationDebugNode = (nodeToRelocate) => doc.createComment(`org-location for ` +
1275
- (nodeToRelocate.localName
1276
- ? `<${nodeToRelocate.localName}> (host=${nodeToRelocate['s-hn']})`
1277
- : `[${nodeToRelocate.textContent}]`));
1278
- const getElement = (ref) => (BUILD.lazyLoad ? getHostRef(ref).$hostElement$ : ref);
1279
- const createEvent = (ref, name, flags) => {
1280
- const elm = getElement(ref);
1281
- return {
1282
- emit: (detail) => {
1283
- if (BUILD.isDev && !elm.isConnected) {
1284
- consoleDevWarn(`The "${name}" event was emitted, but the dispatcher node is no longer connected to the dom.`);
1285
- }
1286
- return emitEvent(elm, name, {
1287
- bubbles: !!(flags & 4 /* Bubbles */),
1288
- composed: !!(flags & 2 /* Composed */),
1289
- cancelable: !!(flags & 1 /* Cancellable */),
1290
- detail,
1291
- });
1292
- },
1293
- };
1294
- };
1295
- /**
1296
- * Helper function to create & dispatch a custom Event on a provided target
1297
- * @param elm the target of the Event
1298
- * @param name the name to give the custom Event
1299
- * @param opts options for configuring a custom Event
1300
- * @returns the custom Event
1301
- */
1302
- const emitEvent = (elm, name, opts) => {
1303
- const ev = plt.ce(name, opts);
1304
- elm.dispatchEvent(ev);
1305
- return ev;
1306
- };
1307
- const attachToAncestor = (hostRef, ancestorComponent) => {
1308
- if (BUILD.asyncLoading && ancestorComponent && !hostRef.$onRenderResolve$ && ancestorComponent['s-p']) {
1309
- ancestorComponent['s-p'].push(new Promise((r) => (hostRef.$onRenderResolve$ = r)));
1310
- }
1311
- };
1312
- const scheduleUpdate = (hostRef, isInitialLoad) => {
1313
- if (BUILD.taskQueue && BUILD.updatable) {
1314
- hostRef.$flags$ |= 16 /* isQueuedForUpdate */;
1315
- }
1316
- if (BUILD.asyncLoading && hostRef.$flags$ & 4 /* isWaitingForChildren */) {
1317
- hostRef.$flags$ |= 512 /* needsRerender */;
1318
- return;
1319
- }
1320
- attachToAncestor(hostRef, hostRef.$ancestorComponent$);
1321
- // there is no ancestor component or the ancestor component
1322
- // has already fired off its lifecycle update then
1323
- // fire off the initial update
1324
- const dispatch = () => dispatchHooks(hostRef, isInitialLoad);
1325
- return BUILD.taskQueue ? writeTask(dispatch) : dispatch();
1326
- };
1327
- const dispatchHooks = (hostRef, isInitialLoad) => {
1328
- const elm = hostRef.$hostElement$;
1329
- const endSchedule = createTime('scheduleUpdate', hostRef.$cmpMeta$.$tagName$);
1330
- const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
1331
- let promise;
1332
- if (isInitialLoad) {
1333
- if (BUILD.lazyLoad && BUILD.hostListener) {
1334
- hostRef.$flags$ |= 256 /* isListenReady */;
1335
- if (hostRef.$queuedListeners$) {
1336
- hostRef.$queuedListeners$.map(([methodName, event]) => safeCall(instance, methodName, event));
1337
- hostRef.$queuedListeners$ = null;
1338
- }
1339
- }
1340
- emitLifecycleEvent(elm, 'componentWillLoad');
1341
- if (BUILD.cmpWillLoad) {
1342
- promise = safeCall(instance, 'componentWillLoad');
1343
- }
1344
- }
1345
- else {
1346
- emitLifecycleEvent(elm, 'componentWillUpdate');
1347
- if (BUILD.cmpWillUpdate) {
1348
- promise = safeCall(instance, 'componentWillUpdate');
1349
- }
1350
- }
1351
- emitLifecycleEvent(elm, 'componentWillRender');
1352
- if (BUILD.cmpWillRender) {
1353
- promise = then(promise, () => safeCall(instance, 'componentWillRender'));
1354
- }
1355
- endSchedule();
1356
- return then(promise, () => updateComponent(hostRef, instance, isInitialLoad));
1357
- };
1358
- const updateComponent = async (hostRef, instance, isInitialLoad) => {
1359
- // updateComponent
1360
- const elm = hostRef.$hostElement$;
1361
- const endUpdate = createTime('update', hostRef.$cmpMeta$.$tagName$);
1362
- const rc = elm['s-rc'];
1363
- if (BUILD.style && isInitialLoad) {
1364
- // DOM WRITE!
1365
- attachStyles(hostRef);
1366
- }
1367
- const endRender = createTime('render', hostRef.$cmpMeta$.$tagName$);
1368
- if (BUILD.isDev) {
1369
- hostRef.$flags$ |= 1024 /* devOnRender */;
1370
- }
1371
- if (BUILD.hydrateServerSide) {
1372
- await callRender(hostRef, instance, elm);
1373
- }
1374
- else {
1375
- callRender(hostRef, instance, elm);
1376
- }
1377
- if (BUILD.cssVarShim && plt.$cssShim$) {
1378
- plt.$cssShim$.updateHost(elm);
1379
- }
1380
- if (BUILD.isDev) {
1381
- hostRef.$renderCount$++;
1382
- hostRef.$flags$ &= ~1024 /* devOnRender */;
1383
- }
1384
- if (BUILD.hydrateServerSide) {
1385
- try {
1386
- // manually connected child components during server-side hydrate
1387
- serverSideConnected(elm);
1388
- if (isInitialLoad) {
1389
- // using only during server-side hydrate
1390
- if (hostRef.$cmpMeta$.$flags$ & 1 /* shadowDomEncapsulation */) {
1391
- elm['s-en'] = '';
1392
- }
1393
- else if (hostRef.$cmpMeta$.$flags$ & 2 /* scopedCssEncapsulation */) {
1394
- elm['s-en'] = 'c';
1395
- }
1396
- }
1397
- }
1398
- catch (e) {
1399
- consoleError(e, elm);
1400
- }
1401
- }
1402
- if (BUILD.asyncLoading && rc) {
1403
- // ok, so turns out there are some child host elements
1404
- // waiting on this parent element to load
1405
- // let's fire off all update callbacks waiting
1406
- rc.map((cb) => cb());
1407
- elm['s-rc'] = undefined;
1408
- }
1409
- endRender();
1410
- endUpdate();
1411
- if (BUILD.asyncLoading) {
1412
- const childrenPromises = elm['s-p'];
1413
- const postUpdate = () => postUpdateComponent(hostRef);
1414
- if (childrenPromises.length === 0) {
1415
- postUpdate();
1416
- }
1417
- else {
1418
- Promise.all(childrenPromises).then(postUpdate);
1419
- hostRef.$flags$ |= 4 /* isWaitingForChildren */;
1420
- childrenPromises.length = 0;
1421
- }
1422
- }
1423
- else {
1424
- postUpdateComponent(hostRef);
1425
- }
1426
- };
1427
- const callRender = (hostRef, instance, elm) => {
1428
- // in order for bundlers to correctly treeshake the BUILD object
1429
- // we need to ensure BUILD is not deoptimized within a try/catch
1430
- // https://rollupjs.org/guide/en/#treeshake tryCatchDeoptimization
1431
- const allRenderFn = BUILD.allRenderFn ? true : false;
1432
- const lazyLoad = BUILD.lazyLoad ? true : false;
1433
- const taskQueue = BUILD.taskQueue ? true : false;
1434
- const updatable = BUILD.updatable ? true : false;
1435
- try {
1436
- renderingRef = instance;
1437
- instance = allRenderFn ? instance.render() : instance.render && instance.render();
1438
- if (updatable && taskQueue) {
1439
- hostRef.$flags$ &= ~16 /* isQueuedForUpdate */;
1440
- }
1441
- if (updatable || lazyLoad) {
1442
- hostRef.$flags$ |= 2 /* hasRendered */;
1443
- }
1444
- if (BUILD.hasRenderFn || BUILD.reflect) {
1445
- if (BUILD.vdomRender || BUILD.reflect) {
1446
- // looks like we've got child nodes to render into this host element
1447
- // or we need to update the css class/attrs on the host element
1448
- // DOM WRITE!
1449
- if (BUILD.hydrateServerSide) {
1450
- return Promise.resolve(instance).then((value) => renderVdom(hostRef, value));
1451
- }
1452
- else {
1453
- renderVdom(hostRef, instance);
1454
- }
1455
- }
1456
- else {
1457
- elm.textContent = instance;
1458
- }
1459
- }
1460
- }
1461
- catch (e) {
1462
- consoleError(e, hostRef.$hostElement$);
1463
- }
1464
- renderingRef = null;
1465
- return null;
1466
- };
1467
- const getRenderingRef = () => renderingRef;
1468
- const postUpdateComponent = (hostRef) => {
1469
- const tagName = hostRef.$cmpMeta$.$tagName$;
1470
- const elm = hostRef.$hostElement$;
1471
- const endPostUpdate = createTime('postUpdate', tagName);
1472
- const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
1473
- const ancestorComponent = hostRef.$ancestorComponent$;
1474
- if (BUILD.cmpDidRender) {
1475
- if (BUILD.isDev) {
1476
- hostRef.$flags$ |= 1024 /* devOnRender */;
1477
- }
1478
- safeCall(instance, 'componentDidRender');
1479
- if (BUILD.isDev) {
1480
- hostRef.$flags$ &= ~1024 /* devOnRender */;
1481
- }
1482
- }
1483
- emitLifecycleEvent(elm, 'componentDidRender');
1484
- if (!(hostRef.$flags$ & 64 /* hasLoadedComponent */)) {
1485
- hostRef.$flags$ |= 64 /* hasLoadedComponent */;
1486
- if (BUILD.asyncLoading && BUILD.cssAnnotations) {
1487
- // DOM WRITE!
1488
- addHydratedFlag(elm);
1489
- }
1490
- if (BUILD.cmpDidLoad) {
1491
- if (BUILD.isDev) {
1492
- hostRef.$flags$ |= 2048 /* devOnDidLoad */;
1493
- }
1494
- safeCall(instance, 'componentDidLoad');
1495
- if (BUILD.isDev) {
1496
- hostRef.$flags$ &= ~2048 /* devOnDidLoad */;
1497
- }
1498
- }
1499
- emitLifecycleEvent(elm, 'componentDidLoad');
1500
- endPostUpdate();
1501
- if (BUILD.asyncLoading) {
1502
- hostRef.$onReadyResolve$(elm);
1503
- if (!ancestorComponent) {
1504
- appDidLoad(tagName);
1505
- }
1506
- }
1507
- }
1508
- else {
1509
- if (BUILD.cmpDidUpdate) {
1510
- // we've already loaded this component
1511
- // fire off the user's componentDidUpdate method (if one was provided)
1512
- // componentDidUpdate runs AFTER render() has been called
1513
- // and all child components have finished updating
1514
- if (BUILD.isDev) {
1515
- hostRef.$flags$ |= 1024 /* devOnRender */;
1516
- }
1517
- safeCall(instance, 'componentDidUpdate');
1518
- if (BUILD.isDev) {
1519
- hostRef.$flags$ &= ~1024 /* devOnRender */;
1520
- }
1521
- }
1522
- emitLifecycleEvent(elm, 'componentDidUpdate');
1523
- endPostUpdate();
1524
- }
1525
- if (BUILD.hotModuleReplacement) {
1526
- elm['s-hmr-load'] && elm['s-hmr-load']();
1527
- }
1528
- if (BUILD.method && BUILD.lazyLoad) {
1529
- hostRef.$onInstanceResolve$(elm);
1530
- }
1531
- // load events fire from bottom to top
1532
- // the deepest elements load first then bubbles up
1533
- if (BUILD.asyncLoading) {
1534
- if (hostRef.$onRenderResolve$) {
1535
- hostRef.$onRenderResolve$();
1536
- hostRef.$onRenderResolve$ = undefined;
1537
- }
1538
- if (hostRef.$flags$ & 512 /* needsRerender */) {
1539
- nextTick(() => scheduleUpdate(hostRef, false));
1540
- }
1541
- hostRef.$flags$ &= ~(4 /* isWaitingForChildren */ | 512 /* needsRerender */);
1542
- }
1543
- // ( •_•)
1544
- // ( •_•)>⌐■-■
1545
- // (⌐■_■)
1546
- };
1547
- const forceUpdate = (ref) => {
1548
- if (BUILD.updatable) {
1549
- const hostRef = getHostRef(ref);
1550
- const isConnected = hostRef.$hostElement$.isConnected;
1551
- if (isConnected &&
1552
- (hostRef.$flags$ & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
1553
- scheduleUpdate(hostRef, false);
1554
- }
1555
- // Returns "true" when the forced update was successfully scheduled
1556
- return isConnected;
1557
- }
1558
- return false;
1559
- };
1560
- const appDidLoad = (who) => {
1561
- // on appload
1562
- // we have finish the first big initial render
1563
- if (BUILD.cssAnnotations) {
1564
- addHydratedFlag(doc.documentElement);
1565
- }
1566
- if (BUILD.asyncQueue) {
1567
- plt.$flags$ |= 2 /* appLoaded */;
1568
- }
1569
- nextTick(() => emitEvent(win, 'appload', { detail: { namespace: NAMESPACE } }));
1570
- if (BUILD.profile && performance.measure) {
1571
- performance.measure(`[Stencil] ${NAMESPACE} initial load (by ${who})`, 'st:app:start');
1572
- }
1573
- };
1574
- const safeCall = (instance, method, arg) => {
1575
- if (instance && instance[method]) {
1576
- try {
1577
- return instance[method](arg);
1578
- }
1579
- catch (e) {
1580
- consoleError(e);
1581
- }
1582
- }
1583
- return undefined;
1584
- };
1585
- const then = (promise, thenFn) => {
1586
- return promise && promise.then ? promise.then(thenFn) : thenFn();
1587
- };
1588
- const emitLifecycleEvent = (elm, lifecycleName) => {
1589
- if (BUILD.lifecycleDOMEvents) {
1590
- emitEvent(elm, 'stencil_' + lifecycleName, {
1591
- bubbles: true,
1592
- composed: true,
1593
- detail: {
1594
- namespace: NAMESPACE,
1595
- },
1596
- });
1597
- }
1598
- };
1599
- const addHydratedFlag = (elm) => BUILD.hydratedClass
1600
- ? elm.classList.add('hydrated')
1601
- : BUILD.hydratedAttribute
1602
- ? elm.setAttribute('hydrated', '')
1603
- : undefined;
1604
- const serverSideConnected = (elm) => {
1605
- const children = elm.children;
1606
- if (children != null) {
1607
- for (let i = 0, ii = children.length; i < ii; i++) {
1608
- const childElm = children[i];
1609
- if (typeof childElm.connectedCallback === 'function') {
1610
- childElm.connectedCallback();
1611
- }
1612
- serverSideConnected(childElm);
1613
- }
1614
- }
1615
- };
1616
- const initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
1617
- const endHydrate = createTime('hydrateClient', tagName);
1618
- const shadowRoot = hostElm.shadowRoot;
1619
- const childRenderNodes = [];
1620
- const slotNodes = [];
1621
- const shadowRootNodes = BUILD.shadowDom && shadowRoot ? [] : null;
1622
- const vnode = (hostRef.$vnode$ = newVNode(tagName, null));
1623
- if (!plt.$orgLocNodes$) {
1624
- initializeDocumentHydrate(doc.body, (plt.$orgLocNodes$ = new Map()));
1625
- }
1626
- hostElm[HYDRATE_ID] = hostId;
1627
- hostElm.removeAttribute(HYDRATE_ID);
1628
- clientHydrate(vnode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, hostElm, hostId);
1629
- childRenderNodes.map((c) => {
1630
- const orgLocationId = c.$hostId$ + '.' + c.$nodeId$;
1631
- const orgLocationNode = plt.$orgLocNodes$.get(orgLocationId);
1632
- const node = c.$elm$;
1633
- if (orgLocationNode && supportsShadow && orgLocationNode['s-en'] === '') {
1634
- orgLocationNode.parentNode.insertBefore(node, orgLocationNode.nextSibling);
1635
- }
1636
- if (!shadowRoot) {
1637
- node['s-hn'] = tagName;
1638
- if (orgLocationNode) {
1639
- node['s-ol'] = orgLocationNode;
1640
- node['s-ol']['s-nr'] = node;
1641
- }
1642
- }
1643
- plt.$orgLocNodes$.delete(orgLocationId);
1644
- });
1645
- if (BUILD.shadowDom && shadowRoot) {
1646
- shadowRootNodes.map((shadowRootNode) => {
1647
- if (shadowRootNode) {
1648
- shadowRoot.appendChild(shadowRootNode);
1649
- }
1650
- });
1651
- }
1652
- endHydrate();
1653
- };
1654
- const clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node, hostId) => {
1655
- let childNodeType;
1656
- let childIdSplt;
1657
- let childVNode;
1658
- let i;
1659
- if (node.nodeType === 1 /* ElementNode */) {
1660
- childNodeType = node.getAttribute(HYDRATE_CHILD_ID);
1661
- if (childNodeType) {
1662
- // got the node data from the element's attribute
1663
- // `${hostId}.${nodeId}.${depth}.${index}`
1664
- childIdSplt = childNodeType.split('.');
1665
- if (childIdSplt[0] === hostId || childIdSplt[0] === '0') {
1666
- childVNode = {
1667
- $flags$: 0,
1668
- $hostId$: childIdSplt[0],
1669
- $nodeId$: childIdSplt[1],
1670
- $depth$: childIdSplt[2],
1671
- $index$: childIdSplt[3],
1672
- $tag$: node.tagName.toLowerCase(),
1673
- $elm$: node,
1674
- $attrs$: null,
1675
- $children$: null,
1676
- $key$: null,
1677
- $name$: null,
1678
- $text$: null,
1679
- };
1680
- childRenderNodes.push(childVNode);
1681
- node.removeAttribute(HYDRATE_CHILD_ID);
1682
- // this is a new child vnode
1683
- // so ensure its parent vnode has the vchildren array
1684
- if (!parentVNode.$children$) {
1685
- parentVNode.$children$ = [];
1686
- }
1687
- // add our child vnode to a specific index of the vnode's children
1688
- parentVNode.$children$[childVNode.$index$] = childVNode;
1689
- // this is now the new parent vnode for all the next child checks
1690
- parentVNode = childVNode;
1691
- if (shadowRootNodes && childVNode.$depth$ === '0') {
1692
- shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
1693
- }
1694
- }
1695
- }
1696
- // recursively drill down, end to start so we can remove nodes
1697
- for (i = node.childNodes.length - 1; i >= 0; i--) {
1698
- clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node.childNodes[i], hostId);
1699
- }
1700
- if (node.shadowRoot) {
1701
- // keep drilling down through the shadow root nodes
1702
- for (i = node.shadowRoot.childNodes.length - 1; i >= 0; i--) {
1703
- clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node.shadowRoot.childNodes[i], hostId);
1704
- }
1705
- }
1706
- }
1707
- else if (node.nodeType === 8 /* CommentNode */) {
1708
- // `${COMMENT_TYPE}.${hostId}.${nodeId}.${depth}.${index}`
1709
- childIdSplt = node.nodeValue.split('.');
1710
- if (childIdSplt[1] === hostId || childIdSplt[1] === '0') {
1711
- // comment node for either the host id or a 0 host id
1712
- childNodeType = childIdSplt[0];
1713
- childVNode = {
1714
- $flags$: 0,
1715
- $hostId$: childIdSplt[1],
1716
- $nodeId$: childIdSplt[2],
1717
- $depth$: childIdSplt[3],
1718
- $index$: childIdSplt[4],
1719
- $elm$: node,
1720
- $attrs$: null,
1721
- $children$: null,
1722
- $key$: null,
1723
- $name$: null,
1724
- $tag$: null,
1725
- $text$: null,
1726
- };
1727
- if (childNodeType === TEXT_NODE_ID) {
1728
- childVNode.$elm$ = node.nextSibling;
1729
- if (childVNode.$elm$ && childVNode.$elm$.nodeType === 3 /* TextNode */) {
1730
- childVNode.$text$ = childVNode.$elm$.textContent;
1731
- childRenderNodes.push(childVNode);
1732
- // remove the text comment since it's no longer needed
1733
- node.remove();
1734
- if (!parentVNode.$children$) {
1735
- parentVNode.$children$ = [];
1736
- }
1737
- parentVNode.$children$[childVNode.$index$] = childVNode;
1738
- if (shadowRootNodes && childVNode.$depth$ === '0') {
1739
- shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
1740
- }
1741
- }
1742
- }
1743
- else if (childVNode.$hostId$ === hostId) {
1744
- // this comment node is specifcally for this host id
1745
- if (childNodeType === SLOT_NODE_ID) {
1746
- // `${SLOT_NODE_ID}.${hostId}.${nodeId}.${depth}.${index}.${slotName}`;
1747
- childVNode.$tag$ = 'slot';
1748
- if (childIdSplt[5]) {
1749
- node['s-sn'] = childVNode.$name$ = childIdSplt[5];
1750
- }
1751
- else {
1752
- node['s-sn'] = '';
1753
- }
1754
- node['s-sr'] = true;
1755
- if (BUILD.shadowDom && shadowRootNodes) {
1756
- // browser support shadowRoot and this is a shadow dom component
1757
- // create an actual slot element
1758
- childVNode.$elm$ = doc.createElement(childVNode.$tag$);
1759
- if (childVNode.$name$) {
1760
- // add the slot name attribute
1761
- childVNode.$elm$.setAttribute('name', childVNode.$name$);
1762
- }
1763
- // insert the new slot element before the slot comment
1764
- node.parentNode.insertBefore(childVNode.$elm$, node);
1765
- // remove the slot comment since it's not needed for shadow
1766
- node.remove();
1767
- if (childVNode.$depth$ === '0') {
1768
- shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
1769
- }
1770
- }
1771
- slotNodes.push(childVNode);
1772
- if (!parentVNode.$children$) {
1773
- parentVNode.$children$ = [];
1774
- }
1775
- parentVNode.$children$[childVNode.$index$] = childVNode;
1776
- }
1777
- else if (childNodeType === CONTENT_REF_ID) {
1778
- // `${CONTENT_REF_ID}.${hostId}`;
1779
- if (BUILD.shadowDom && shadowRootNodes) {
1780
- // remove the content ref comment since it's not needed for shadow
1781
- node.remove();
1782
- }
1783
- else if (BUILD.slotRelocation) {
1784
- hostElm['s-cr'] = node;
1785
- node['s-cn'] = true;
1786
- }
1787
- }
1788
- }
1789
- }
1790
- }
1791
- else if (parentVNode && parentVNode.$tag$ === 'style') {
1792
- const vnode = newVNode(null, node.textContent);
1793
- vnode.$elm$ = node;
1794
- vnode.$index$ = '0';
1795
- parentVNode.$children$ = [vnode];
1796
- }
1797
- };
1798
- const initializeDocumentHydrate = (node, orgLocNodes) => {
1799
- if (node.nodeType === 1 /* ElementNode */) {
1800
- let i = 0;
1801
- for (; i < node.childNodes.length; i++) {
1802
- initializeDocumentHydrate(node.childNodes[i], orgLocNodes);
1803
- }
1804
- if (node.shadowRoot) {
1805
- for (i = 0; i < node.shadowRoot.childNodes.length; i++) {
1806
- initializeDocumentHydrate(node.shadowRoot.childNodes[i], orgLocNodes);
1807
- }
1808
- }
1809
- }
1810
- else if (node.nodeType === 8 /* CommentNode */) {
1811
- const childIdSplt = node.nodeValue.split('.');
1812
- if (childIdSplt[0] === ORG_LOCATION_ID) {
1813
- orgLocNodes.set(childIdSplt[1] + '.' + childIdSplt[2], node);
1814
- node.nodeValue = '';
1815
- // useful to know if the original location is
1816
- // the root light-dom of a shadow dom component
1817
- node['s-en'] = childIdSplt[3];
1818
- }
1819
- }
1820
- };
1821
- /**
1822
- * Parse a new property value for a given property type.
1823
- *
1824
- * While the prop value can reasonably be expected to be of `any` type as far as TypeScript's type checker is concerned,
1825
- * it is not safe to assume that the string returned by evaluating `typeof propValue` matches:
1826
- * 1. `any`, the type given to `propValue` in the function signature
1827
- * 2. the type stored from `propType`.
1828
- *
1829
- * This function provides the capability to parse/coerce a property's value to potentially any other JavaScript type.
1830
- *
1831
- * Property values represented in TSX preserve their type information. In the example below, the number 0 is passed to
1832
- * a component. This `propValue` will preserve its type information (`typeof propValue === 'number'`). Note that is
1833
- * based on the type of the value being passed in, not the type declared of the class member decorated with `@Prop`.
1834
- * ```tsx
1835
- * <my-cmp prop-val={0}></my-cmp>
1836
- * ```
1837
- *
1838
- * HTML prop values on the other hand, will always a string
1839
- *
1840
- * @param propValue the new value to coerce to some type
1841
- * @param propType the type of the prop, expressed as a binary number
1842
- * @returns the parsed/coerced value
1843
- */
1844
- const parsePropertyValue = (propValue, propType) => {
1845
- // ensure this value is of the correct prop type
1846
- if (propValue != null && !isComplexType(propValue)) {
1847
- if (BUILD.propBoolean && propType & 4 /* Boolean */) {
1848
- // per the HTML spec, any string value means it is a boolean true value
1849
- // but we'll cheat here and say that the string "false" is the boolean false
1850
- return propValue === 'false' ? false : propValue === '' || !!propValue;
1851
- }
1852
- if (BUILD.propNumber && propType & 2 /* Number */) {
1853
- // force it to be a number
1854
- return parseFloat(propValue);
1855
- }
1856
- if (BUILD.propString && propType & 1 /* String */) {
1857
- // could have been passed as a number or boolean
1858
- // but we still want it as a string
1859
- return String(propValue);
1860
- }
1861
- // redundant return here for better minification
1862
- return propValue;
1863
- }
1864
- // not sure exactly what type we want
1865
- // so no need to change to a different type
1866
- return propValue;
1867
- };
1868
- const getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName);
1869
- const setValue = (ref, propName, newVal, cmpMeta) => {
1870
- // check our new property value against our internal value
1871
- const hostRef = getHostRef(ref);
1872
- const elm = BUILD.lazyLoad ? hostRef.$hostElement$ : ref;
1873
- const oldVal = hostRef.$instanceValues$.get(propName);
1874
- const flags = hostRef.$flags$;
1875
- const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
1876
- newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
1877
- // explicitly check for NaN on both sides, as `NaN === NaN` is always false
1878
- const areBothNaN = Number.isNaN(oldVal) && Number.isNaN(newVal);
1879
- const didValueChange = newVal !== oldVal && !areBothNaN;
1880
- if ((!BUILD.lazyLoad || !(flags & 8 /* isConstructingInstance */) || oldVal === undefined) && didValueChange) {
1881
- // gadzooks! the property's value has changed!!
1882
- // set our new value!
1883
- hostRef.$instanceValues$.set(propName, newVal);
1884
- if (BUILD.isDev) {
1885
- if (hostRef.$flags$ & 1024 /* devOnRender */) {
1886
- consoleDevWarn(`The state/prop "${propName}" changed during rendering. This can potentially lead to infinite-loops and other bugs.`, '\nElement', elm, '\nNew value', newVal, '\nOld value', oldVal);
1887
- }
1888
- else if (hostRef.$flags$ & 2048 /* devOnDidLoad */) {
1889
- consoleDevWarn(`The state/prop "${propName}" changed during "componentDidLoad()", this triggers extra re-renders, try to setup on "componentWillLoad()"`, '\nElement', elm, '\nNew value', newVal, '\nOld value', oldVal);
1890
- }
1891
- }
1892
- if (!BUILD.lazyLoad || instance) {
1893
- // get an array of method names of watch functions to call
1894
- if (BUILD.watchCallback && cmpMeta.$watchers$ && flags & 128 /* isWatchReady */) {
1895
- const watchMethods = cmpMeta.$watchers$[propName];
1896
- if (watchMethods) {
1897
- // this instance is watching for when this property changed
1898
- watchMethods.map((watchMethodName) => {
1899
- try {
1900
- // fire off each of the watch methods that are watching this property
1901
- instance[watchMethodName](newVal, oldVal, propName);
1902
- }
1903
- catch (e) {
1904
- consoleError(e, elm);
1905
- }
1906
- });
1907
- }
1908
- }
1909
- if (BUILD.updatable &&
1910
- (flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
1911
- if (BUILD.cmpShouldUpdate && instance.componentShouldUpdate) {
1912
- if (instance.componentShouldUpdate(newVal, oldVal, propName) === false) {
1913
- return;
1914
- }
1915
- }
1916
- // looks like this value actually changed, so we've got work to do!
1917
- // but only if we've already rendered, otherwise just chill out
1918
- // queue that we need to do an update, but don't worry about queuing
1919
- // up millions cuz this function ensures it only runs once
1920
- scheduleUpdate(hostRef, false);
1921
- }
1922
- }
1923
- }
1924
- };
1925
- const proxyComponent = (Cstr, cmpMeta, flags) => {
1926
- if (BUILD.member && cmpMeta.$members$) {
1927
- if (BUILD.watchCallback && Cstr.watchers) {
1928
- cmpMeta.$watchers$ = Cstr.watchers;
1929
- }
1930
- // It's better to have a const than two Object.entries()
1931
- const members = Object.entries(cmpMeta.$members$);
1932
- const prototype = Cstr.prototype;
1933
- members.map(([memberName, [memberFlags]]) => {
1934
- if ((BUILD.prop || BUILD.state) &&
1935
- (memberFlags & 31 /* Prop */ ||
1936
- ((!BUILD.lazyLoad || flags & 2 /* proxyState */) && memberFlags & 32 /* State */))) {
1937
- // proxyComponent - prop
1938
- Object.defineProperty(prototype, memberName, {
1939
- get() {
1940
- // proxyComponent, get value
1941
- return getValue(this, memberName);
1942
- },
1943
- set(newValue) {
1944
- // only during dev time
1945
- if (BUILD.isDev) {
1946
- const ref = getHostRef(this);
1947
- if (
1948
- // we are proxying the instance (not element)
1949
- (flags & 1 /* isElementConstructor */) === 0 &&
1950
- // the element is not constructing
1951
- (ref.$flags$ & 8 /* isConstructingInstance */) === 0 &&
1952
- // the member is a prop
1953
- (memberFlags & 31 /* Prop */) !== 0 &&
1954
- // the member is not mutable
1955
- (memberFlags & 1024 /* Mutable */) === 0) {
1956
- consoleDevWarn(`@Prop() "${memberName}" on <${cmpMeta.$tagName$}> is immutable but was modified from within the component.\nMore information: https://stenciljs.com/docs/properties#prop-mutability`);
1957
- }
1958
- }
1959
- // proxyComponent, set value
1960
- setValue(this, memberName, newValue, cmpMeta);
1961
- },
1962
- configurable: true,
1963
- enumerable: true,
1964
- });
1965
- }
1966
- else if (BUILD.lazyLoad &&
1967
- BUILD.method &&
1968
- flags & 1 /* isElementConstructor */ &&
1969
- memberFlags & 64 /* Method */) {
1970
- // proxyComponent - method
1971
- Object.defineProperty(prototype, memberName, {
1972
- value(...args) {
1973
- const ref = getHostRef(this);
1974
- return ref.$onInstancePromise$.then(() => ref.$lazyInstance$[memberName](...args));
1975
- },
1976
- });
1977
- }
1978
- });
1979
- if (BUILD.observeAttribute && (!BUILD.lazyLoad || flags & 1 /* isElementConstructor */)) {
1980
- const attrNameToPropName = new Map();
1981
- prototype.attributeChangedCallback = function (attrName, _oldValue, newValue) {
1982
- plt.jmp(() => {
1983
- const propName = attrNameToPropName.get(attrName);
1984
- // In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
1985
- // in the case where an attribute was set inline.
1986
- // ```html
1987
- // <my-component some-attribute="some-value"></my-component>
1988
- // ```
1989
- //
1990
- // There is an edge case where a developer sets the attribute inline on a custom element and then
1991
- // programmatically changes it before it has been upgraded as shown below:
1992
- //
1993
- // ```html
1994
- // <!-- this component has _not_ been upgraded yet -->
1995
- // <my-component id="test" some-attribute="some-value"></my-component>
1996
- // <script>
1997
- // // grab non-upgraded component
1998
- // el = document.querySelector("#test");
1999
- // el.someAttribute = "another-value";
2000
- // // upgrade component
2001
- // customElements.define('my-component', MyComponent);
2002
- // </script>
2003
- // ```
2004
- // In this case if we do not unshadow here and use the value of the shadowing property, attributeChangedCallback
2005
- // will be called with `newValue = "some-value"` and will set the shadowed property (this.someAttribute = "another-value")
2006
- // to the value that was set inline i.e. "some-value" from above example. When
2007
- // the connectedCallback attempts to unshadow it will use "some-value" as the initial value rather than "another-value"
2008
- //
2009
- // The case where the attribute was NOT set inline but was not set programmatically shall be handled/unshadowed
2010
- // by connectedCallback as this attributeChangedCallback will not fire.
2011
- //
2012
- // https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties
2013
- //
2014
- // TODO(STENCIL-16) we should think about whether or not we actually want to be reflecting the attributes to
2015
- // properties here given that this goes against best practices outlined here
2016
- // https://developers.google.com/web/fundamentals/web-components/best-practices#avoid-reentrancy
2017
- if (this.hasOwnProperty(propName)) {
2018
- newValue = this[propName];
2019
- delete this[propName];
2020
- }
2021
- else if (prototype.hasOwnProperty(propName) &&
2022
- typeof this[propName] === 'number' &&
2023
- this[propName] == newValue) {
2024
- // if the propName exists on the prototype of `Cstr`, this update may be a result of Stencil using native
2025
- // APIs to reflect props as attributes. Calls to `setAttribute(someElement, propName)` will result in
2026
- // `propName` to be converted to a `DOMString`, which may not be what we want for other primitive props.
2027
- return;
2028
- }
2029
- this[propName] = newValue === null && typeof this[propName] === 'boolean' ? false : newValue;
2030
- });
2031
- };
2032
- // create an array of attributes to observe
2033
- // and also create a map of html attribute name to js property name
2034
- Cstr.observedAttributes = members
2035
- .filter(([_, m]) => m[0] & 15 /* HasAttribute */) // filter to only keep props that should match attributes
2036
- .map(([propName, m]) => {
2037
- const attrName = m[1] || propName;
2038
- attrNameToPropName.set(attrName, propName);
2039
- if (BUILD.reflect && m[0] & 512 /* ReflectAttr */) {
2040
- cmpMeta.$attrsToReflect$.push([propName, attrName]);
2041
- }
2042
- return attrName;
2043
- });
2044
- }
2045
- }
2046
- return Cstr;
2047
- };
2048
- const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => {
2049
- // initializeComponent
2050
- if ((BUILD.lazyLoad || BUILD.hydrateServerSide || BUILD.style) &&
2051
- (hostRef.$flags$ & 32 /* hasInitializedComponent */) === 0) {
2052
- if (BUILD.lazyLoad || BUILD.hydrateClientSide) {
2053
- // we haven't initialized this element yet
2054
- hostRef.$flags$ |= 32 /* hasInitializedComponent */;
2055
- // lazy loaded components
2056
- // request the component's implementation to be
2057
- // wired up with the host element
2058
- Cstr = loadModule(cmpMeta, hostRef, hmrVersionId);
2059
- if (Cstr.then) {
2060
- // Await creates a micro-task avoid if possible
2061
- const endLoad = uniqueTime(`st:load:${cmpMeta.$tagName$}:${hostRef.$modeName$}`, `[Stencil] Load module for <${cmpMeta.$tagName$}>`);
2062
- Cstr = await Cstr;
2063
- endLoad();
2064
- }
2065
- if ((BUILD.isDev || BUILD.isDebug) && !Cstr) {
2066
- throw new Error(`Constructor for "${cmpMeta.$tagName$}#${hostRef.$modeName$}" was not found`);
2067
- }
2068
- if (BUILD.member && !Cstr.isProxied) {
2069
- // we've never proxied this Constructor before
2070
- // let's add the getters/setters to its prototype before
2071
- // the first time we create an instance of the implementation
2072
- if (BUILD.watchCallback) {
2073
- cmpMeta.$watchers$ = Cstr.watchers;
2074
- }
2075
- proxyComponent(Cstr, cmpMeta, 2 /* proxyState */);
2076
- Cstr.isProxied = true;
2077
- }
2078
- const endNewInstance = createTime('createInstance', cmpMeta.$tagName$);
2079
- // ok, time to construct the instance
2080
- // but let's keep track of when we start and stop
2081
- // so that the getters/setters don't incorrectly step on data
2082
- if (BUILD.member) {
2083
- hostRef.$flags$ |= 8 /* isConstructingInstance */;
2084
- }
2085
- // construct the lazy-loaded component implementation
2086
- // passing the hostRef is very important during
2087
- // construction in order to directly wire together the
2088
- // host element and the lazy-loaded instance
2089
- try {
2090
- new Cstr(hostRef);
2091
- }
2092
- catch (e) {
2093
- consoleError(e);
2094
- }
2095
- if (BUILD.member) {
2096
- hostRef.$flags$ &= ~8 /* isConstructingInstance */;
2097
- }
2098
- if (BUILD.watchCallback) {
2099
- hostRef.$flags$ |= 128 /* isWatchReady */;
2100
- }
2101
- endNewInstance();
2102
- fireConnectedCallback(hostRef.$lazyInstance$);
2103
- }
2104
- else {
2105
- // sync constructor component
2106
- Cstr = elm.constructor;
2107
- hostRef.$flags$ |= 32 /* hasInitializedComponent */;
2108
- // wait for the CustomElementRegistry to mark the component as ready before setting `isWatchReady`. Otherwise,
2109
- // watchers may fire prematurely if `customElements.get()`/`customElements.whenDefined()` resolves _before_
2110
- // Stencil has completed instantiating the component.
2111
- customElements.whenDefined(cmpMeta.$tagName$).then(() => (hostRef.$flags$ |= 128 /* isWatchReady */));
2112
- }
2113
- if (BUILD.style && Cstr.style) {
2114
- // this component has styles but we haven't registered them yet
2115
- let style = Cstr.style;
2116
- if (BUILD.mode && typeof style !== 'string') {
2117
- style = style[(hostRef.$modeName$ = computeMode(elm))];
2118
- if (BUILD.hydrateServerSide && hostRef.$modeName$) {
2119
- elm.setAttribute('s-mode', hostRef.$modeName$);
2120
- }
2121
- }
2122
- const scopeId = getScopeId(cmpMeta, hostRef.$modeName$);
2123
- if (!styles.has(scopeId)) {
2124
- const endRegisterStyles = createTime('registerStyles', cmpMeta.$tagName$);
2125
- if (!BUILD.hydrateServerSide &&
2126
- BUILD.shadowDom &&
2127
- BUILD.shadowDomShim &&
2128
- cmpMeta.$flags$ & 8 /* needsShadowDomShim */) {
2129
- style = await import('./shadow-css-38a1326b.js').then((m) => m.scopeCss(style, scopeId, false));
2130
- }
2131
- registerStyle(scopeId, style, !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */));
2132
- endRegisterStyles();
2133
- }
2134
- }
2135
- }
2136
- // we've successfully created a lazy instance
2137
- const ancestorComponent = hostRef.$ancestorComponent$;
2138
- const schedule = () => scheduleUpdate(hostRef, true);
2139
- if (BUILD.asyncLoading && ancestorComponent && ancestorComponent['s-rc']) {
2140
- // this is the initial load and this component it has an ancestor component
2141
- // but the ancestor component has NOT fired its will update lifecycle yet
2142
- // so let's just cool our jets and wait for the ancestor to continue first
2143
- // this will get fired off when the ancestor component
2144
- // finally gets around to rendering its lazy self
2145
- // fire off the initial update
2146
- ancestorComponent['s-rc'].push(schedule);
2147
- }
2148
- else {
2149
- schedule();
2150
- }
2151
- };
2152
- const fireConnectedCallback = (instance) => {
2153
- if (BUILD.lazyLoad && BUILD.connectedCallback) {
2154
- safeCall(instance, 'connectedCallback');
2155
- }
2156
- };
2157
- const connectedCallback = (elm) => {
2158
- if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
2159
- const hostRef = getHostRef(elm);
2160
- const cmpMeta = hostRef.$cmpMeta$;
2161
- const endConnected = createTime('connectedCallback', cmpMeta.$tagName$);
2162
- if (BUILD.hostListenerTargetParent) {
2163
- // only run if we have listeners being attached to a parent
2164
- addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, true);
2165
- }
2166
- if (!(hostRef.$flags$ & 1 /* hasConnected */)) {
2167
- // first time this component has connected
2168
- hostRef.$flags$ |= 1 /* hasConnected */;
2169
- let hostId;
2170
- if (BUILD.hydrateClientSide) {
2171
- hostId = elm.getAttribute(HYDRATE_ID);
2172
- if (hostId) {
2173
- if (BUILD.shadowDom && supportsShadow && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
2174
- const scopeId = BUILD.mode
2175
- ? addStyle(elm.shadowRoot, cmpMeta, elm.getAttribute('s-mode'))
2176
- : addStyle(elm.shadowRoot, cmpMeta);
2177
- elm.classList.remove(scopeId + '-h', scopeId + '-s');
2178
- }
2179
- initializeClientHydrate(elm, cmpMeta.$tagName$, hostId, hostRef);
2180
- }
2181
- }
2182
- if (BUILD.slotRelocation && !hostId) {
2183
- // initUpdate
2184
- // if the slot polyfill is required we'll need to put some nodes
2185
- // in here to act as original content anchors as we move nodes around
2186
- // host element has been connected to the DOM
2187
- if (BUILD.hydrateServerSide ||
2188
- ((BUILD.slot || BUILD.shadowDom) &&
2189
- cmpMeta.$flags$ & (4 /* hasSlotRelocation */ | 8 /* needsShadowDomShim */))) {
2190
- setContentReference(elm);
2191
- }
2192
- }
2193
- if (BUILD.asyncLoading) {
2194
- // find the first ancestor component (if there is one) and register
2195
- // this component as one of the actively loading child components for its ancestor
2196
- let ancestorComponent = elm;
2197
- while ((ancestorComponent = ancestorComponent.parentNode || ancestorComponent.host)) {
2198
- // climb up the ancestors looking for the first
2199
- // component that hasn't finished its lifecycle update yet
2200
- if ((BUILD.hydrateClientSide &&
2201
- ancestorComponent.nodeType === 1 /* ElementNode */ &&
2202
- ancestorComponent.hasAttribute('s-id') &&
2203
- ancestorComponent['s-p']) ||
2204
- ancestorComponent['s-p']) {
2205
- // we found this components first ancestor component
2206
- // keep a reference to this component's ancestor component
2207
- attachToAncestor(hostRef, (hostRef.$ancestorComponent$ = ancestorComponent));
2208
- break;
2209
- }
2210
- }
2211
- }
2212
- // Lazy properties
2213
- // https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties
2214
- if (BUILD.prop && !BUILD.hydrateServerSide && cmpMeta.$members$) {
2215
- Object.entries(cmpMeta.$members$).map(([memberName, [memberFlags]]) => {
2216
- if (memberFlags & 31 /* Prop */ && elm.hasOwnProperty(memberName)) {
2217
- const value = elm[memberName];
2218
- delete elm[memberName];
2219
- elm[memberName] = value;
2220
- }
2221
- });
2222
- }
2223
- if (BUILD.initializeNextTick) {
2224
- // connectedCallback, taskQueue, initialLoad
2225
- // angular sets attribute AFTER connectCallback
2226
- // https://github.com/angular/angular/issues/18909
2227
- // https://github.com/angular/angular/issues/19940
2228
- nextTick(() => initializeComponent(elm, hostRef, cmpMeta));
2229
- }
2230
- else {
2231
- initializeComponent(elm, hostRef, cmpMeta);
2232
- }
2233
- }
2234
- else {
2235
- // not the first time this has connected
2236
- // reattach any event listeners to the host
2237
- // since they would have been removed when disconnected
2238
- addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, false);
2239
- // fire off connectedCallback() on component instance
2240
- fireConnectedCallback(hostRef.$lazyInstance$);
2241
- }
2242
- endConnected();
2243
- }
2244
- };
2245
- const setContentReference = (elm) => {
2246
- // only required when we're NOT using native shadow dom (slot)
2247
- // or this browser doesn't support native shadow dom
2248
- // and this host element was NOT created with SSR
2249
- // let's pick out the inner content for slot projection
2250
- // create a node to represent where the original
2251
- // content was first placed, which is useful later on
2252
- const contentRefElm = (elm['s-cr'] = doc.createComment(BUILD.isDebug ? `content-ref (host=${elm.localName})` : ''));
2253
- contentRefElm['s-cn'] = true;
2254
- elm.insertBefore(contentRefElm, elm.firstChild);
2255
- };
2256
- const disconnectedCallback = (elm) => {
2257
- if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
2258
- const hostRef = getHostRef(elm);
2259
- const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
2260
- if (BUILD.hostListener) {
2261
- if (hostRef.$rmListeners$) {
2262
- hostRef.$rmListeners$.map((rmListener) => rmListener());
2263
- hostRef.$rmListeners$ = undefined;
2264
- }
2265
- }
2266
- // clear CSS var-shim tracking
2267
- if (BUILD.cssVarShim && plt.$cssShim$) {
2268
- plt.$cssShim$.removeHost(elm);
2269
- }
2270
- if (BUILD.lazyLoad && BUILD.disconnectedCallback) {
2271
- safeCall(instance, 'disconnectedCallback');
2272
- }
2273
- if (BUILD.cmpDidUnload) {
2274
- safeCall(instance, 'componentDidUnload');
2275
- }
2276
- }
2277
- };
2278
- const defineCustomElement = (Cstr, compactMeta) => {
2279
- customElements.define(compactMeta[1], proxyCustomElement(Cstr, compactMeta));
2280
- };
2281
- const proxyCustomElement = (Cstr, compactMeta) => {
2282
- const cmpMeta = {
2283
- $flags$: compactMeta[0],
2284
- $tagName$: compactMeta[1],
2285
- };
2286
- if (BUILD.member) {
2287
- cmpMeta.$members$ = compactMeta[2];
2288
- }
2289
- if (BUILD.hostListener) {
2290
- cmpMeta.$listeners$ = compactMeta[3];
2291
- }
2292
- if (BUILD.watchCallback) {
2293
- cmpMeta.$watchers$ = Cstr.$watchers$;
2294
- }
2295
- if (BUILD.reflect) {
2296
- cmpMeta.$attrsToReflect$ = [];
2297
- }
2298
- if (BUILD.shadowDom && !supportsShadow && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
2299
- cmpMeta.$flags$ |= 8 /* needsShadowDomShim */;
2300
- }
2301
- const originalConnectedCallback = Cstr.prototype.connectedCallback;
2302
- const originalDisconnectedCallback = Cstr.prototype.disconnectedCallback;
2303
- Object.assign(Cstr.prototype, {
2304
- __registerHost() {
2305
- registerHost(this, cmpMeta);
2306
- },
2307
- connectedCallback() {
2308
- connectedCallback(this);
2309
- if (BUILD.connectedCallback && originalConnectedCallback) {
2310
- originalConnectedCallback.call(this);
2311
- }
2312
- },
2313
- disconnectedCallback() {
2314
- disconnectedCallback(this);
2315
- if (BUILD.disconnectedCallback && originalDisconnectedCallback) {
2316
- originalDisconnectedCallback.call(this);
2317
- }
2318
- },
2319
- __attachShadow() {
2320
- if (supportsShadow) {
2321
- if (BUILD.shadowDelegatesFocus) {
2322
- this.attachShadow({
2323
- mode: 'open',
2324
- delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */),
2325
- });
2326
- }
2327
- else {
2328
- this.attachShadow({ mode: 'open' });
2329
- }
2330
- }
2331
- else {
2332
- this.shadowRoot = this;
2333
- }
2334
- },
2335
- });
2336
- Cstr.is = cmpMeta.$tagName$;
2337
- return proxyComponent(Cstr, cmpMeta, 1 /* isElementConstructor */ | 2 /* proxyState */);
2338
- };
2339
- const forceModeUpdate = (elm) => {
2340
- if (BUILD.style && BUILD.mode && !BUILD.lazyLoad) {
2341
- const mode = computeMode(elm);
2342
- const hostRef = getHostRef(elm);
2343
- if (hostRef.$modeName$ !== mode) {
2344
- const cmpMeta = hostRef.$cmpMeta$;
2345
- const oldScopeId = elm['s-sc'];
2346
- const scopeId = getScopeId(cmpMeta, mode);
2347
- const style = elm.constructor.style[mode];
2348
- const flags = cmpMeta.$flags$;
2349
- if (style) {
2350
- if (!styles.has(scopeId)) {
2351
- registerStyle(scopeId, style, !!(flags & 1 /* shadowDomEncapsulation */));
2352
- }
2353
- hostRef.$modeName$ = mode;
2354
- elm.classList.remove(oldScopeId + '-h', oldScopeId + '-s');
2355
- attachStyles(hostRef);
2356
- forceUpdate(elm);
2357
- }
2358
- }
2359
- }
2360
- };
2361
- const hmrStart = (elm, cmpMeta, hmrVersionId) => {
2362
- // ¯\_(ツ)_/¯
2363
- const hostRef = getHostRef(elm);
2364
- // reset state flags to only have been connected
2365
- hostRef.$flags$ = 1 /* hasConnected */;
2366
- // TODO
2367
- // detatch any event listeners that may have been added
2368
- // because we're not passing an exact event name it'll
2369
- // remove all of this element's event, which is good
2370
- // create a callback for when this component finishes hmr
2371
- elm['s-hmr-load'] = () => {
2372
- // finished hmr for this element
2373
- delete elm['s-hmr-load'];
2374
- };
2375
- // re-initialize the component
2376
- initializeComponent(elm, hostRef, cmpMeta, hmrVersionId);
2377
- };
2378
- const patchCloneNode = (HostElementPrototype) => {
2379
- const orgCloneNode = HostElementPrototype.cloneNode;
2380
- HostElementPrototype.cloneNode = function (deep) {
2381
- const srcNode = this;
2382
- const isShadowDom = BUILD.shadowDom ? srcNode.shadowRoot && supportsShadow : false;
2383
- const clonedNode = orgCloneNode.call(srcNode, isShadowDom ? deep : false);
2384
- if (BUILD.slot && !isShadowDom && deep) {
2385
- let i = 0;
2386
- let slotted, nonStencilNode;
2387
- let stencilPrivates = [
2388
- 's-id',
2389
- 's-cr',
2390
- 's-lr',
2391
- 's-rc',
2392
- 's-sc',
2393
- 's-p',
2394
- 's-cn',
2395
- 's-sr',
2396
- 's-sn',
2397
- 's-hn',
2398
- 's-ol',
2399
- 's-nr',
2400
- 's-si',
2401
- ];
2402
- for (; i < srcNode.childNodes.length; i++) {
2403
- slotted = srcNode.childNodes[i]['s-nr'];
2404
- nonStencilNode = stencilPrivates.every((privateField) => !srcNode.childNodes[i][privateField]);
2405
- if (slotted) {
2406
- if (BUILD.appendChildSlotFix && clonedNode.__appendChild) {
2407
- clonedNode.__appendChild(slotted.cloneNode(true));
2408
- }
2409
- else {
2410
- clonedNode.appendChild(slotted.cloneNode(true));
2411
- }
2412
- }
2413
- if (nonStencilNode) {
2414
- clonedNode.appendChild(srcNode.childNodes[i].cloneNode(true));
2415
- }
2416
- }
2417
- }
2418
- return clonedNode;
2419
- };
2420
- };
2421
- const patchSlotAppendChild = (HostElementPrototype) => {
2422
- HostElementPrototype.__appendChild = HostElementPrototype.appendChild;
2423
- HostElementPrototype.appendChild = function (newChild) {
2424
- const slotName = (newChild['s-sn'] = getSlotName(newChild));
2425
- const slotNode = getHostSlotNode(this.childNodes, slotName);
2426
- if (slotNode) {
2427
- const slotChildNodes = getHostSlotChildNodes(slotNode, slotName);
2428
- const appendAfter = slotChildNodes[slotChildNodes.length - 1];
2429
- return appendAfter.parentNode.insertBefore(newChild, appendAfter.nextSibling);
2430
- }
2431
- return this.__appendChild(newChild);
2432
- };
2433
- };
2434
- /**
2435
- * Patches the text content of an unnamed slotted node inside a scoped component
2436
- * @param hostElementPrototype the `Element` to be patched
2437
- * @param cmpMeta component runtime metadata used to determine if the component should be patched or not
2438
- */
2439
- const patchTextContent = (hostElementPrototype, cmpMeta) => {
2440
- if (BUILD.scoped && cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */) {
2441
- const descriptor = Object.getOwnPropertyDescriptor(Node.prototype, 'textContent');
2442
- Object.defineProperty(hostElementPrototype, '__textContent', descriptor);
2443
- Object.defineProperty(hostElementPrototype, 'textContent', {
2444
- get() {
2445
- var _a;
2446
- // get the 'default slot', which would be the first slot in a shadow tree (if we were using one), whose name is
2447
- // the empty string
2448
- const slotNode = getHostSlotNode(this.childNodes, '');
2449
- // when a slot node is found, the textContent _may_ be found in the next sibling (text) node, depending on how
2450
- // nodes were reordered during the vdom render. first try to get the text content from the sibling.
2451
- if (((_a = slotNode === null || slotNode === void 0 ? void 0 : slotNode.nextSibling) === null || _a === void 0 ? void 0 : _a.nodeType) === 3 /* TEXT_NODE */) {
2452
- return slotNode.nextSibling.textContent;
2453
- }
2454
- else if (slotNode) {
2455
- return slotNode.textContent;
2456
- }
2457
- else {
2458
- // fallback to the original implementation
2459
- return this.__textContent;
2460
- }
2461
- },
2462
- set(value) {
2463
- var _a;
2464
- // get the 'default slot', which would be the first slot in a shadow tree (if we were using one), whose name is
2465
- // the empty string
2466
- const slotNode = getHostSlotNode(this.childNodes, '');
2467
- // when a slot node is found, the textContent _may_ need to be placed in the next sibling (text) node,
2468
- // depending on how nodes were reordered during the vdom render. first try to set the text content on the
2469
- // sibling.
2470
- if (((_a = slotNode === null || slotNode === void 0 ? void 0 : slotNode.nextSibling) === null || _a === void 0 ? void 0 : _a.nodeType) === 3 /* TEXT_NODE */) {
2471
- slotNode.nextSibling.textContent = value;
2472
- }
2473
- else if (slotNode) {
2474
- slotNode.textContent = value;
2475
- }
2476
- else {
2477
- // we couldn't find a slot, but that doesn't mean that there isn't one. if this check ran before the DOM
2478
- // loaded, we could have missed it. check for a content reference element on the scoped component and insert
2479
- // it there
2480
- this.__textContent = value;
2481
- const contentRefElm = this['s-cr'];
2482
- if (contentRefElm) {
2483
- this.insertBefore(contentRefElm, this.firstChild);
2484
- }
2485
- }
2486
- },
2487
- });
2488
- }
2489
- };
2490
- const patchChildSlotNodes = (elm, cmpMeta) => {
2491
- class FakeNodeList extends Array {
2492
- item(n) {
2493
- return this[n];
2494
- }
2495
- }
2496
- if (cmpMeta.$flags$ & 8 /* needsShadowDomShim */) {
2497
- const childNodesFn = elm.__lookupGetter__('childNodes');
2498
- Object.defineProperty(elm, 'children', {
2499
- get() {
2500
- return this.childNodes.map((n) => n.nodeType === 1);
2501
- },
2502
- });
2503
- Object.defineProperty(elm, 'childElementCount', {
2504
- get() {
2505
- return elm.children.length;
2506
- },
2507
- });
2508
- Object.defineProperty(elm, 'childNodes', {
2509
- get() {
2510
- const childNodes = childNodesFn.call(this);
2511
- if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0 &&
2512
- getHostRef(this).$flags$ & 2 /* hasRendered */) {
2513
- const result = new FakeNodeList();
2514
- for (let i = 0; i < childNodes.length; i++) {
2515
- const slot = childNodes[i]['s-nr'];
2516
- if (slot) {
2517
- result.push(slot);
2518
- }
2519
- }
2520
- return result;
2521
- }
2522
- return FakeNodeList.from(childNodes);
2523
- },
2524
- });
2525
- }
2526
- };
2527
- const getSlotName = (node) => node['s-sn'] || (node.nodeType === 1 && node.getAttribute('slot')) || '';
2528
- /**
2529
- * Recursively searches a series of child nodes for a slot with the provided name.
2530
- * @param childNodes the nodes to search for a slot with a specific name.
2531
- * @param slotName the name of the slot to match on.
2532
- * @returns a reference to the slot node that matches the provided name, `null` otherwise
2533
- */
2534
- const getHostSlotNode = (childNodes, slotName) => {
2535
- let i = 0;
2536
- let childNode;
2537
- for (; i < childNodes.length; i++) {
2538
- childNode = childNodes[i];
2539
- if (childNode['s-sr'] && childNode['s-sn'] === slotName) {
2540
- return childNode;
2541
- }
2542
- childNode = getHostSlotNode(childNode.childNodes, slotName);
2543
- if (childNode) {
2544
- return childNode;
2545
- }
2546
- }
2547
- return null;
2548
- };
2549
- const getHostSlotChildNodes = (n, slotName) => {
2550
- const childNodes = [n];
2551
- while ((n = n.nextSibling) && n['s-sn'] === slotName) {
2552
- childNodes.push(n);
2553
- }
2554
- return childNodes;
2555
- };
2556
- const bootstrapLazy = (lazyBundles, options = {}) => {
2557
- if (BUILD.profile && performance.mark) {
2558
- performance.mark('st:app:start');
2559
- }
2560
- installDevTools();
2561
- const endBootstrap = createTime('bootstrapLazy');
2562
- const cmpTags = [];
2563
- const exclude = options.exclude || [];
2564
- const customElements = win.customElements;
2565
- const head = doc.head;
2566
- const metaCharset = /*@__PURE__*/ head.querySelector('meta[charset]');
2567
- const visibilityStyle = /*@__PURE__*/ doc.createElement('style');
2568
- const deferredConnectedCallbacks = [];
2569
- const styles = /*@__PURE__*/ doc.querySelectorAll(`[${HYDRATED_STYLE_ID}]`);
2570
- let appLoadFallback;
2571
- let isBootstrapping = true;
2572
- let i = 0;
2573
- Object.assign(plt, options);
2574
- plt.$resourcesUrl$ = new URL(options.resourcesUrl || './', doc.baseURI).href;
2575
- if (BUILD.asyncQueue) {
2576
- if (options.syncQueue) {
2577
- plt.$flags$ |= 4 /* queueSync */;
2578
- }
2579
- }
2580
- if (BUILD.hydrateClientSide) {
2581
- // If the app is already hydrated there is not point to disable the
2582
- // async queue. This will improve the first input delay
2583
- plt.$flags$ |= 2 /* appLoaded */;
2584
- }
2585
- if (BUILD.hydrateClientSide && BUILD.shadowDom) {
2586
- for (; i < styles.length; i++) {
2587
- registerStyle(styles[i].getAttribute(HYDRATED_STYLE_ID), convertScopedToShadow(styles[i].innerHTML), true);
2588
- }
2589
- }
2590
- lazyBundles.map((lazyBundle) => {
2591
- lazyBundle[1].map((compactMeta) => {
2592
- const cmpMeta = {
2593
- $flags$: compactMeta[0],
2594
- $tagName$: compactMeta[1],
2595
- $members$: compactMeta[2],
2596
- $listeners$: compactMeta[3],
2597
- };
2598
- if (BUILD.member) {
2599
- cmpMeta.$members$ = compactMeta[2];
2600
- }
2601
- if (BUILD.hostListener) {
2602
- cmpMeta.$listeners$ = compactMeta[3];
2603
- }
2604
- if (BUILD.reflect) {
2605
- cmpMeta.$attrsToReflect$ = [];
2606
- }
2607
- if (BUILD.watchCallback) {
2608
- cmpMeta.$watchers$ = {};
2609
- }
2610
- if (BUILD.shadowDom && !supportsShadow && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
2611
- cmpMeta.$flags$ |= 8 /* needsShadowDomShim */;
2612
- }
2613
- const tagName = BUILD.transformTagName && options.transformTagName
2614
- ? options.transformTagName(cmpMeta.$tagName$)
2615
- : cmpMeta.$tagName$;
2616
- const HostElement = class extends HTMLElement {
2617
- // StencilLazyHost
2618
- constructor(self) {
2619
- // @ts-ignore
2620
- super(self);
2621
- self = this;
2622
- registerHost(self, cmpMeta);
2623
- if (BUILD.shadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
2624
- // this component is using shadow dom
2625
- // and this browser supports shadow dom
2626
- // add the read-only property "shadowRoot" to the host element
2627
- // adding the shadow root build conditionals to minimize runtime
2628
- if (supportsShadow) {
2629
- if (BUILD.shadowDelegatesFocus) {
2630
- self.attachShadow({
2631
- mode: 'open',
2632
- delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */),
2633
- });
2634
- }
2635
- else {
2636
- self.attachShadow({ mode: 'open' });
2637
- }
2638
- }
2639
- else if (!BUILD.hydrateServerSide && !('shadowRoot' in self)) {
2640
- self.shadowRoot = self;
2641
- }
2642
- }
2643
- if (BUILD.slotChildNodesFix) {
2644
- patchChildSlotNodes(self, cmpMeta);
2645
- }
2646
- }
2647
- connectedCallback() {
2648
- if (appLoadFallback) {
2649
- clearTimeout(appLoadFallback);
2650
- appLoadFallback = null;
2651
- }
2652
- if (isBootstrapping) {
2653
- // connectedCallback will be processed once all components have been registered
2654
- deferredConnectedCallbacks.push(this);
2655
- }
2656
- else {
2657
- plt.jmp(() => connectedCallback(this));
2658
- }
2659
- }
2660
- disconnectedCallback() {
2661
- plt.jmp(() => disconnectedCallback(this));
2662
- }
2663
- componentOnReady() {
2664
- return getHostRef(this).$onReadyPromise$;
2665
- }
2666
- };
2667
- if (BUILD.cloneNodeFix) {
2668
- patchCloneNode(HostElement.prototype);
2669
- }
2670
- if (BUILD.appendChildSlotFix) {
2671
- patchSlotAppendChild(HostElement.prototype);
2672
- }
2673
- if (BUILD.hotModuleReplacement) {
2674
- HostElement.prototype['s-hmr'] = function (hmrVersionId) {
2675
- hmrStart(this, cmpMeta, hmrVersionId);
2676
- };
2677
- }
2678
- if (BUILD.scopedSlotTextContentFix) {
2679
- patchTextContent(HostElement.prototype, cmpMeta);
2680
- }
2681
- cmpMeta.$lazyBundleId$ = lazyBundle[0];
2682
- if (!exclude.includes(tagName) && !customElements.get(tagName)) {
2683
- cmpTags.push(tagName);
2684
- customElements.define(tagName, proxyComponent(HostElement, cmpMeta, 1 /* isElementConstructor */));
2685
- }
2686
- });
2687
- });
2688
- if (BUILD.invisiblePrehydration && (BUILD.hydratedClass || BUILD.hydratedAttribute)) {
2689
- visibilityStyle.innerHTML = cmpTags + HYDRATED_CSS;
2690
- visibilityStyle.setAttribute('data-styles', '');
2691
- head.insertBefore(visibilityStyle, metaCharset ? metaCharset.nextSibling : head.firstChild);
2692
- }
2693
- // Process deferred connectedCallbacks now all components have been registered
2694
- isBootstrapping = false;
2695
- if (deferredConnectedCallbacks.length) {
2696
- deferredConnectedCallbacks.map((host) => host.connectedCallback());
2697
- }
2698
- else {
2699
- if (BUILD.profile) {
2700
- plt.jmp(() => (appLoadFallback = setTimeout(appDidLoad, 30, 'timeout')));
2701
- }
2702
- else {
2703
- plt.jmp(() => (appLoadFallback = setTimeout(appDidLoad, 30)));
2704
- }
2705
- }
2706
- // Fallback appLoad event
2707
- endBootstrap();
2708
- };
2709
- const getAssetPath = (path) => {
2710
- const assetUrl = new URL(path, plt.$resourcesUrl$);
2711
- return assetUrl.origin !== win.location.origin ? assetUrl.href : assetUrl.pathname;
2712
- };
2713
- const setAssetPath = (path) => (plt.$resourcesUrl$ = path);
2714
- const getConnect = (_ref, tagName) => {
2715
- const componentOnReady = () => {
2716
- let elm = doc.querySelector(tagName);
2717
- if (!elm) {
2718
- elm = doc.createElement(tagName);
2719
- doc.body.appendChild(elm);
2720
- }
2721
- return typeof elm.componentOnReady === 'function' ? elm.componentOnReady() : Promise.resolve(elm);
2722
- };
2723
- const create = (...args) => {
2724
- return componentOnReady().then((el) => el.create(...args));
2725
- };
2726
- return {
2727
- create,
2728
- componentOnReady,
2729
- };
2730
- };
2731
- const getContext = (_elm, context) => {
2732
- if (context in Context) {
2733
- return Context[context];
2734
- }
2735
- else if (context === 'window') {
2736
- return win;
2737
- }
2738
- else if (context === 'document') {
2739
- return doc;
2740
- }
2741
- else if (context === 'isServer' || context === 'isPrerender') {
2742
- return BUILD.hydrateServerSide ? true : false;
2743
- }
2744
- else if (context === 'isClient') {
2745
- return BUILD.hydrateServerSide ? false : true;
2746
- }
2747
- else if (context === 'resourcesUrl' || context === 'publicPath') {
2748
- return getAssetPath('.');
2749
- }
2750
- else if (context === 'queue') {
2751
- return {
2752
- write: writeTask,
2753
- read: readTask,
2754
- tick: {
2755
- then(cb) {
2756
- return nextTick(cb);
2757
- },
2758
- },
2759
- };
2760
- }
2761
- return undefined;
2762
- };
2763
- const insertVdomAnnotations = (doc, staticComponents) => {
2764
- if (doc != null) {
2765
- const docData = {
2766
- hostIds: 0,
2767
- rootLevelIds: 0,
2768
- staticComponents: new Set(staticComponents),
2769
- };
2770
- const orgLocationNodes = [];
2771
- parseVNodeAnnotations(doc, doc.body, docData, orgLocationNodes);
2772
- orgLocationNodes.forEach((orgLocationNode) => {
2773
- if (orgLocationNode != null) {
2774
- const nodeRef = orgLocationNode['s-nr'];
2775
- let hostId = nodeRef['s-host-id'];
2776
- let nodeId = nodeRef['s-node-id'];
2777
- let childId = `${hostId}.${nodeId}`;
2778
- if (hostId == null) {
2779
- hostId = 0;
2780
- docData.rootLevelIds++;
2781
- nodeId = docData.rootLevelIds;
2782
- childId = `${hostId}.${nodeId}`;
2783
- if (nodeRef.nodeType === 1 /* ElementNode */) {
2784
- nodeRef.setAttribute(HYDRATE_CHILD_ID, childId);
2785
- }
2786
- else if (nodeRef.nodeType === 3 /* TextNode */) {
2787
- if (hostId === 0) {
2788
- const textContent = nodeRef.nodeValue.trim();
2789
- if (textContent === '') {
2790
- // useless whitespace node at the document root
2791
- orgLocationNode.remove();
2792
- return;
2793
- }
2794
- }
2795
- const commentBeforeTextNode = doc.createComment(childId);
2796
- commentBeforeTextNode.nodeValue = `${TEXT_NODE_ID}.${childId}`;
2797
- nodeRef.parentNode.insertBefore(commentBeforeTextNode, nodeRef);
2798
- }
2799
- }
2800
- let orgLocationNodeId = `${ORG_LOCATION_ID}.${childId}`;
2801
- const orgLocationParentNode = orgLocationNode.parentElement;
2802
- if (orgLocationParentNode) {
2803
- if (orgLocationParentNode['s-en'] === '') {
2804
- // ending with a "." means that the parent element
2805
- // of this node's original location is a SHADOW dom element
2806
- // and this node is apart of the root level light dom
2807
- orgLocationNodeId += `.`;
2808
- }
2809
- else if (orgLocationParentNode['s-en'] === 'c') {
2810
- // ending with a ".c" means that the parent element
2811
- // of this node's original location is a SCOPED element
2812
- // and this node is apart of the root level light dom
2813
- orgLocationNodeId += `.c`;
2814
- }
2815
- }
2816
- orgLocationNode.nodeValue = orgLocationNodeId;
2817
- }
2818
- });
2819
- }
2820
- };
2821
- const parseVNodeAnnotations = (doc, node, docData, orgLocationNodes) => {
2822
- if (node == null) {
2823
- return;
2824
- }
2825
- if (node['s-nr'] != null) {
2826
- orgLocationNodes.push(node);
2827
- }
2828
- if (node.nodeType === 1 /* ElementNode */) {
2829
- node.childNodes.forEach((childNode) => {
2830
- const hostRef = getHostRef(childNode);
2831
- if (hostRef != null && !docData.staticComponents.has(childNode.nodeName.toLowerCase())) {
2832
- const cmpData = {
2833
- nodeIds: 0,
2834
- };
2835
- insertVNodeAnnotations(doc, childNode, hostRef.$vnode$, docData, cmpData);
2836
- }
2837
- parseVNodeAnnotations(doc, childNode, docData, orgLocationNodes);
2838
- });
2839
- }
2840
- };
2841
- const insertVNodeAnnotations = (doc, hostElm, vnode, docData, cmpData) => {
2842
- if (vnode != null) {
2843
- const hostId = ++docData.hostIds;
2844
- hostElm.setAttribute(HYDRATE_ID, hostId);
2845
- if (hostElm['s-cr'] != null) {
2846
- hostElm['s-cr'].nodeValue = `${CONTENT_REF_ID}.${hostId}`;
2847
- }
2848
- if (vnode.$children$ != null) {
2849
- const depth = 0;
2850
- vnode.$children$.forEach((vnodeChild, index) => {
2851
- insertChildVNodeAnnotations(doc, vnodeChild, cmpData, hostId, depth, index);
2852
- });
2853
- }
2854
- if (hostElm && vnode && vnode.$elm$ && !hostElm.hasAttribute('c-id')) {
2855
- const parent = hostElm.parentElement;
2856
- if (parent && parent.childNodes) {
2857
- const parentChildNodes = Array.from(parent.childNodes);
2858
- const comment = parentChildNodes.find((node) => node.nodeType === 8 /* CommentNode */ && node['s-sr']);
2859
- if (comment) {
2860
- const index = parentChildNodes.indexOf(hostElm) - 1;
2861
- vnode.$elm$.setAttribute(HYDRATE_CHILD_ID, `${comment['s-host-id']}.${comment['s-node-id']}.0.${index}`);
2862
- }
2863
- }
2864
- }
2865
- }
2866
- };
2867
- const insertChildVNodeAnnotations = (doc, vnodeChild, cmpData, hostId, depth, index) => {
2868
- const childElm = vnodeChild.$elm$;
2869
- if (childElm == null) {
2870
- return;
2871
- }
2872
- const nodeId = cmpData.nodeIds++;
2873
- const childId = `${hostId}.${nodeId}.${depth}.${index}`;
2874
- childElm['s-host-id'] = hostId;
2875
- childElm['s-node-id'] = nodeId;
2876
- if (childElm.nodeType === 1 /* ElementNode */) {
2877
- childElm.setAttribute(HYDRATE_CHILD_ID, childId);
2878
- }
2879
- else if (childElm.nodeType === 3 /* TextNode */) {
2880
- const parentNode = childElm.parentNode;
2881
- const nodeName = parentNode.nodeName;
2882
- if (nodeName !== 'STYLE' && nodeName !== 'SCRIPT') {
2883
- const textNodeId = `${TEXT_NODE_ID}.${childId}`;
2884
- const commentBeforeTextNode = doc.createComment(textNodeId);
2885
- parentNode.insertBefore(commentBeforeTextNode, childElm);
2886
- }
2887
- }
2888
- else if (childElm.nodeType === 8 /* CommentNode */) {
2889
- if (childElm['s-sr']) {
2890
- const slotName = childElm['s-sn'] || '';
2891
- const slotNodeId = `${SLOT_NODE_ID}.${childId}.${slotName}`;
2892
- childElm.nodeValue = slotNodeId;
2893
- }
2894
- }
2895
- if (vnodeChild.$children$ != null) {
2896
- const childDepth = depth + 1;
2897
- vnodeChild.$children$.forEach((vnode, index) => {
2898
- insertChildVNodeAnnotations(doc, vnode, cmpData, hostId, childDepth, index);
2899
- });
2900
- }
2901
- };
2902
- const setPlatformOptions = (opts) => Object.assign(plt, opts);
2903
- const Fragment = (_, children) => children;
2904
- const hostRefs = new WeakMap();
2905
- const getHostRef = (ref) => hostRefs.get(ref);
2906
- const registerInstance = (lazyInstance, hostRef) => hostRefs.set((hostRef.$lazyInstance$ = lazyInstance), hostRef);
2907
- const registerHost = (elm, cmpMeta) => {
2908
- const hostRef = {
2909
- $flags$: 0,
2910
- $hostElement$: elm,
2911
- $cmpMeta$: cmpMeta,
2912
- $instanceValues$: new Map(),
2913
- };
2914
- if (BUILD.isDev) {
2915
- hostRef.$renderCount$ = 0;
2916
- }
2917
- if (BUILD.method && BUILD.lazyLoad) {
2918
- hostRef.$onInstancePromise$ = new Promise((r) => (hostRef.$onInstanceResolve$ = r));
2919
- }
2920
- if (BUILD.asyncLoading) {
2921
- hostRef.$onReadyPromise$ = new Promise((r) => (hostRef.$onReadyResolve$ = r));
2922
- elm['s-p'] = [];
2923
- elm['s-rc'] = [];
2924
- }
2925
- addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, false);
2926
- return hostRefs.set(elm, hostRef);
2927
- };
2928
- const isMemberInElement = (elm, memberName) => memberName in elm;
2929
- const consoleError = (e, el) => (customError || console.error)(e, el);
2930
- const STENCIL_DEV_MODE = BUILD.isTesting
2931
- ? ['STENCIL:'] // E2E testing
2932
- : [
2933
- '%cstencil',
2934
- 'color: white;background:#4c47ff;font-weight: bold; font-size:10px; padding:2px 6px; border-radius: 5px',
2935
- ];
2936
- const consoleDevError = (...m) => console.error(...STENCIL_DEV_MODE, ...m);
2937
- const consoleDevWarn = (...m) => console.warn(...STENCIL_DEV_MODE, ...m);
2938
- const consoleDevInfo = (...m) => console.info(...STENCIL_DEV_MODE, ...m);
2939
- const setErrorHandler = (handler) => (customError = handler);
2940
- const cmpModules = /*@__PURE__*/ new Map();
2941
- const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
2942
- // loadModuleImport
2943
- const exportName = cmpMeta.$tagName$.replace(/-/g, '_');
2944
- const bundleId = cmpMeta.$lazyBundleId$;
2945
- if (BUILD.isDev && typeof bundleId !== 'string') {
2946
- consoleDevError(`Trying to lazily load component <${cmpMeta.$tagName$}> with style mode "${hostRef.$modeName$}", but it does not exist.`);
2947
- return undefined;
2948
- }
2949
- const module = !BUILD.hotModuleReplacement ? cmpModules.get(bundleId) : false;
2950
- if (module) {
2951
- return module[exportName];
2952
- }
2953
- return import(
2954
- /* webpackInclude: /\.entry\.js$/ */
2955
- /* webpackExclude: /\.system\.entry\.js$/ */
2956
- /* webpackMode: "lazy" */
2957
- `./${bundleId}.entry.js${BUILD.hotModuleReplacement && hmrVersionId ? '?s-hmr=' + hmrVersionId : ''}`).then((importedModule) => {
2958
- if (!BUILD.hotModuleReplacement) {
2959
- cmpModules.set(bundleId, importedModule);
2960
- }
2961
- return importedModule[exportName];
2962
- }, consoleError);
2963
- };
2964
- const styles = new Map();
2965
- const modeResolutionChain = [];
2966
- const queueDomReads = [];
2967
- const queueDomWrites = [];
2968
- const queueDomWritesLow = [];
2969
- const queueTask = (queue, write) => (cb) => {
2970
- queue.push(cb);
2971
- if (!queuePending) {
2972
- queuePending = true;
2973
- if (write && plt.$flags$ & 4 /* queueSync */) {
2974
- nextTick(flush);
2975
- }
2976
- else {
2977
- plt.raf(flush);
2978
- }
2979
- }
2980
- };
2981
- const consume = (queue) => {
2982
- for (let i = 0; i < queue.length; i++) {
2983
- try {
2984
- queue[i](performance.now());
2985
- }
2986
- catch (e) {
2987
- consoleError(e);
2988
- }
2989
- }
2990
- queue.length = 0;
2991
- };
2992
- const consumeTimeout = (queue, timeout) => {
2993
- let i = 0;
2994
- let ts = 0;
2995
- while (i < queue.length && (ts = performance.now()) < timeout) {
2996
- try {
2997
- queue[i++](ts);
2998
- }
2999
- catch (e) {
3000
- consoleError(e);
3001
- }
3002
- }
3003
- if (i === queue.length) {
3004
- queue.length = 0;
3005
- }
3006
- else if (i !== 0) {
3007
- queue.splice(0, i);
3008
- }
3009
- };
3010
- const flush = () => {
3011
- if (BUILD.asyncQueue) {
3012
- queueCongestion++;
3013
- }
3014
- // always force a bunch of medium callbacks to run, but still have
3015
- // a throttle on how many can run in a certain time
3016
- // DOM READS!!!
3017
- consume(queueDomReads);
3018
- // DOM WRITES!!!
3019
- if (BUILD.asyncQueue) {
3020
- const timeout = (plt.$flags$ & 6 /* queueMask */) === 2 /* appLoaded */
3021
- ? performance.now() + 14 * Math.ceil(queueCongestion * (1.0 / 10.0))
3022
- : Infinity;
3023
- consumeTimeout(queueDomWrites, timeout);
3024
- consumeTimeout(queueDomWritesLow, timeout);
3025
- if (queueDomWrites.length > 0) {
3026
- queueDomWritesLow.push(...queueDomWrites);
3027
- queueDomWrites.length = 0;
3028
- }
3029
- if ((queuePending = queueDomReads.length + queueDomWrites.length + queueDomWritesLow.length > 0)) {
3030
- // still more to do yet, but we've run out of time
3031
- // let's let this thing cool off and try again in the next tick
3032
- plt.raf(flush);
3033
- }
3034
- else {
3035
- queueCongestion = 0;
3036
- }
3037
- }
3038
- else {
3039
- consume(queueDomWrites);
3040
- if ((queuePending = queueDomReads.length > 0)) {
3041
- // still more to do yet, but we've run out of time
3042
- // let's let this thing cool off and try again in the next tick
3043
- plt.raf(flush);
3044
- }
3045
- }
3046
- };
3047
- const nextTick = /*@__PURE__*/ (cb) => promiseResolve().then(cb);
3048
- const readTask = /*@__PURE__*/ queueTask(queueDomReads, false);
3049
- const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
3050
- const Build = {
3051
- isDev: BUILD.isDev ? true : false,
3052
- isBrowser: true,
3053
- isServer: false,
3054
- isTesting: BUILD.isTesting ? true : false,
3055
- };
3056
-
3057
- export { BUILD as B, CSS as C, H, NAMESPACE as N, promiseResolve as a, bootstrapLazy as b, consoleDevInfo as c, doc as d, createEvent as e, Host as f, getElement as g, h, plt as p, registerInstance as r, win as w };