ku4web-components 6.5.6 → 6.7.0

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