@twobirds/microcomponents 0.0.81 → 0.0.83

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (233) hide show
  1. package/assets/documentation/MC.md +0 -1
  2. package/dist/MC.d.ts +3 -3
  3. package/dist/MC.d.ts.map +1 -1
  4. package/dist/MC.js +43 -74
  5. package/dist/MC.min.js +43 -74
  6. package/dist/MC.ts +67 -143
  7. package/dist/elements.d.ts +1 -1
  8. package/dist/elements.d.ts.map +1 -1
  9. package/dist/elements.js +16 -2
  10. package/dist/elements.min.js +1 -1
  11. package/dist/elements.ts +33 -3
  12. package/dist/formValues.min.js +1 -1
  13. package/dist/microcomponents.min.js +1 -1
  14. package/dist/observables.d.ts.map +1 -1
  15. package/dist/observables.js +40 -47
  16. package/dist/observables.min.js +1 -1
  17. package/dist/observables.ts +54 -59
  18. package/dist/selectors.d.ts +2 -4
  19. package/dist/selectors.d.ts.map +1 -1
  20. package/dist/selectors.js +2 -214
  21. package/dist/selectors.min.js +1 -1
  22. package/dist/selectors.ts +2 -367
  23. package/package.json +6 -5
  24. package/public/MC.d.ts +3 -3
  25. package/public/MC.d.ts.map +1 -1
  26. package/public/MC.js +43 -74
  27. package/public/MC.js.map +1 -1
  28. package/public/MC.min.js +43 -74
  29. package/public/MC.ts +67 -143
  30. package/public/documentation/MC.md +0 -1
  31. package/public/elements.d.ts +1 -1
  32. package/public/elements.d.ts.map +1 -1
  33. package/public/elements.js +16 -2
  34. package/public/elements.js.map +1 -1
  35. package/public/elements.min.js +1 -1
  36. package/public/elements.ts +33 -3
  37. package/public/formValues.min.js +1 -1
  38. package/public/microcomponents.min.js +1 -1
  39. package/public/observables.d.ts.map +1 -1
  40. package/public/observables.js +40 -47
  41. package/public/observables.js.map +1 -1
  42. package/public/observables.min.js +1 -1
  43. package/public/observables.ts +54 -59
  44. package/public/selectors.d.ts +2 -4
  45. package/public/selectors.d.ts.map +1 -1
  46. package/public/selectors.js +2 -214
  47. package/public/selectors.js.map +1 -1
  48. package/public/selectors.min.js +1 -1
  49. package/public/selectors.ts +2 -367
  50. package/public/src/MC.d.ts +36 -0
  51. package/public/src/MC.d.ts.map +1 -0
  52. package/public/src/MC.js +348 -0
  53. package/public/src/MC.js.map +1 -0
  54. package/public/src/MC.ts +67 -143
  55. package/public/src/McEvent.d.ts +15 -0
  56. package/public/src/McEvent.d.ts.map +1 -0
  57. package/public/src/McEvent.js +71 -0
  58. package/public/src/elements.d.ts +5 -0
  59. package/public/src/elements.d.ts.map +1 -0
  60. package/public/src/elements.js +62 -0
  61. package/public/src/elements.js.map +1 -0
  62. package/public/src/elements.ts +33 -3
  63. package/public/src/formValues.d.ts +3 -0
  64. package/public/src/formValues.d.ts.map +1 -0
  65. package/public/src/formValues.js +162 -0
  66. package/public/src/helpers.d.ts +14 -0
  67. package/public/src/helpers.d.ts.map +1 -0
  68. package/public/src/helpers.js +113 -0
  69. package/public/src/microcomponents.d.ts +7 -0
  70. package/public/src/microcomponents.d.ts.map +1 -0
  71. package/public/src/microcomponents.js +8 -0
  72. package/public/src/observables.d.ts +11 -0
  73. package/public/src/observables.d.ts.map +1 -0
  74. package/public/src/observables.js +242 -0
  75. package/public/src/observables.js.map +1 -0
  76. package/public/src/observables.ts +54 -59
  77. package/public/src/selectors.d.ts +106 -0
  78. package/public/src/selectors.d.ts.map +1 -0
  79. package/public/src/selectors.js +759 -0
  80. package/public/src/selectors.js.map +1 -0
  81. package/public/src/selectors.ts +2 -367
  82. package/public/src/test/grandparent.css +11 -0
  83. package/public/src/test/test/child.d.ts +2 -0
  84. package/public/src/test/test/child.d.ts.map +1 -0
  85. package/public/src/test/test/child.js +15 -0
  86. package/public/src/test/test/child.js.map +1 -0
  87. package/public/src/test/test/child.ts +21 -0
  88. package/public/src/test/test/grandchild.d.ts +2 -0
  89. package/public/src/test/test/grandchild.d.ts.map +1 -0
  90. package/public/src/test/test/grandchild.js +15 -0
  91. package/public/src/test/test/grandchild.js.map +1 -0
  92. package/public/src/test/test/grandchild.ts +21 -0
  93. package/public/src/test/test/grandparent.d.ts +2 -0
  94. package/public/src/test/test/grandparent.d.ts.map +1 -0
  95. package/public/src/test/test/grandparent.js +1 -0
  96. package/public/src/test/test/grandparent.js.map +1 -0
  97. package/public/src/test/test/grandparent.ts +21 -0
  98. package/public/src/test/test/greatgrandchild.d.ts +2 -0
  99. package/public/src/test/test/greatgrandchild.d.ts.map +1 -0
  100. package/public/src/test/test/greatgrandchild.js +29 -0
  101. package/public/src/test/test/greatgrandchild.js.map +1 -0
  102. package/public/src/test/test/greatgrandchild.ts +42 -0
  103. package/public/src/test/test/parent.d.ts +2 -0
  104. package/public/src/test/test/parent.d.ts.map +1 -0
  105. package/public/src/test/test/parent.js +15 -0
  106. package/public/src/test/test/parent.js.map +1 -0
  107. package/public/src/test/test/parent.ts +21 -0
  108. package/public/src/test/test/testform.d.ts +2 -0
  109. package/public/src/test/test/testform.d.ts.map +1 -0
  110. package/public/src/test/test/testform.js +1 -0
  111. package/public/src/test/test/testform.js.map +1 -0
  112. package/public/src/test/test/testform.ts +155 -0
  113. package/public/src/test/test/testfunction.d.ts +3 -0
  114. package/public/src/test/test/testfunction.d.ts.map +1 -0
  115. package/public/src/test/test/testfunction.js +7 -0
  116. package/public/src/test/test/testfunction.js.map +1 -0
  117. package/public/src/test/test/testfunction.ts +12 -0
  118. package/public/src/test/test/testmc.d.ts +3 -0
  119. package/public/src/test/test/testmc.d.ts.map +1 -0
  120. package/public/src/test/test/testmc.js +10 -0
  121. package/public/src/test/test/testmc.js.map +1 -0
  122. package/public/src/test/test/testmc.ts +16 -0
  123. package/public/src/test/test/testsimpleclass.d.ts +3 -0
  124. package/public/src/test/test/testsimpleclass.d.ts.map +1 -0
  125. package/public/src/test/test/testsimpleclass.js +9 -0
  126. package/public/src/test/test/testsimpleclass.js.map +1 -0
  127. package/public/src/test/test/testsimpleclass.ts +15 -0
  128. package/public/src/test/test.d.ts +2 -0
  129. package/public/src/test/test.d.ts.map +1 -0
  130. package/public/src/test/test.js +79 -0
  131. package/public/src/test/test.js.map +1 -0
  132. package/public/src/test/test.ts +188 -0
  133. package/public/src/test/testform.css +47 -0
  134. package/public/src/test/testform.html +56 -0
  135. package/public/src/test/testform.json +27 -0
  136. package/public/test/MC.d.ts +3 -3
  137. package/public/test/MC.d.ts.map +1 -1
  138. package/public/test/MC.js +43 -74
  139. package/public/test/MC.min.js +485 -0
  140. package/public/test/MC.ts +67 -143
  141. package/public/test/elements.d.ts +1 -1
  142. package/public/test/elements.d.ts.map +1 -1
  143. package/public/test/elements.js +16 -2
  144. package/public/test/elements.min.js +1 -0
  145. package/public/test/elements.ts +33 -3
  146. package/public/test/formValues.min.js +1 -0
  147. package/public/test/grandparent.css +1 -3
  148. package/public/test/microcomponents.min.js +1 -1
  149. package/public/test/observables.d.ts.map +1 -1
  150. package/public/test/observables.js +40 -47
  151. package/public/test/observables.min.js +1 -0
  152. package/public/test/observables.ts +54 -59
  153. package/public/test/selectors.d.ts +2 -4
  154. package/public/test/selectors.d.ts.map +1 -1
  155. package/public/test/selectors.js +2 -214
  156. package/public/test/selectors.min.js +1 -0
  157. package/public/test/selectors.ts +2 -367
  158. package/public/test/test/child.ts +21 -0
  159. package/public/test/test/grandchild.ts +21 -0
  160. package/public/test/test/grandparent.js +1 -1
  161. package/public/test/test/grandparent.ts +21 -0
  162. package/public/test/test/greatgrandchild.ts +42 -0
  163. package/public/test/test/parent.ts +21 -0
  164. package/public/test/test/testform.js +1 -1
  165. package/public/test/test/testform.js.map +1 -1
  166. package/public/test/test/testform.ts +155 -0
  167. package/public/test/test/testfunction.d.ts +3 -0
  168. package/public/test/test/testfunction.d.ts.map +1 -0
  169. package/public/test/test/testfunction.js +7 -0
  170. package/public/test/test/testfunction.js.map +1 -0
  171. package/public/test/test/testfunction.ts +12 -0
  172. package/public/test/test/testmc.d.ts +2 -5
  173. package/public/test/test/testmc.d.ts.map +1 -1
  174. package/public/test/test/testmc.js +4 -4
  175. package/public/test/test/testmc.js.map +1 -1
  176. package/public/test/test/testmc.ts +16 -0
  177. package/public/test/test/testsimpleclass.d.ts +3 -0
  178. package/public/test/test/testsimpleclass.d.ts.map +1 -0
  179. package/public/test/test/testsimpleclass.js +9 -0
  180. package/public/test/test/testsimpleclass.js.map +1 -0
  181. package/public/test/test/testsimpleclass.ts +15 -0
  182. package/public/test/test.js +0 -2
  183. package/public/test/test.js.map +1 -1
  184. package/public/test/test.ts +188 -0
  185. package/public/test/testform.css +47 -0
  186. package/public/test/testform.html +56 -0
  187. package/public/test/testform.json +3 -3
  188. package/public/typedoc/assets/navigation.js +1 -1
  189. package/public/typedoc/assets/search.js +1 -1
  190. package/public/typedoc/classes/MC.DC.html +5 -5
  191. package/public/typedoc/classes/MC.MC.html +5 -5
  192. package/public/typedoc/classes/MC.McBase.html +4 -3
  193. package/public/typedoc/classes/MC.McEvent.html +2 -2
  194. package/public/typedoc/functions/MC.addListener.html +1 -1
  195. package/public/typedoc/functions/MC.autoload.html +1 -1
  196. package/public/typedoc/functions/MC.removeListener.html +1 -1
  197. package/public/typedoc/functions/elements.defineCE.html +1 -1
  198. package/public/typedoc/functions/elements.getCE.html +1 -1
  199. package/public/typedoc/functions/formValues.formValues.html +1 -1
  200. package/public/typedoc/functions/observables.observe.html +1 -1
  201. package/public/typedoc/functions/selectors._d.html +1 -0
  202. package/public/typedoc/functions/selectors._t.html +1 -0
  203. package/public/typedoc/interfaces/MC.HTMLMcElement.html +2 -2
  204. package/public/typedoc/interfaces/selectors.DSelector.html +48 -0
  205. package/public/typedoc/interfaces/selectors.TSelector.html +34 -0
  206. package/public/typedoc/modules/MC.html +1 -1
  207. package/public/typedoc/modules/elements.html +1 -1
  208. package/public/typedoc/modules/formValues.html +1 -1
  209. package/public/typedoc/modules/observables.html +1 -1
  210. package/public/typedoc/modules/selectors.html +7 -0
  211. package/public/typedoc/modules.html +1 -0
  212. package/public/typedoc/types/observables.Observable.html +1 -1
  213. package/public/typedoc/types/selectors.selection.html +1 -0
  214. package/public/typedoc/types/selectors.singleSelector.html +1 -0
  215. package/src/MC.ts +67 -143
  216. package/src/elements.ts +33 -3
  217. package/src/observables.ts +54 -59
  218. package/src/selectors.ts +2 -367
  219. package/src/test/test/testform.ts +7 -3
  220. package/src/test/test/testfunction.ts +12 -0
  221. package/src/test/test/testmc.ts +13 -9
  222. package/src/test/test/testsimpleclass.ts +15 -0
  223. package/src/test/test.ts +0 -12
  224. package/tasks.md +36 -0
  225. package/typedoc.json +1 -1
  226. package/public/test/MC.js.map +0 -1
  227. package/public/test/elements.js.map +0 -1
  228. package/public/test/observables.js.map +0 -1
  229. package/public/test/selectors.js.map +0 -1
  230. /package/public/{test → src}/McEvent.js.map +0 -0
  231. /package/public/{test → src}/formValues.js.map +0 -0
  232. /package/public/{test → src}/helpers.js.map +0 -0
  233. /package/public/{test → src}/microcomponents.js.map +0 -0
package/public/typedoc/modules/selectors.html ADDED
@@ -0,0 +1,7 @@
1
+ <!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>selectors | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="selectors.html">selectors</a></li></ul><h1>Module selectors</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/ccac2b590950e9a31c1189c5c494a10768bc260d/src/selectors.ts#L1">src/selectors.ts:1</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Interfaces</h3><div class="tsd-index-list"><a href="../interfaces/selectors.DSelector.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-256"></use></svg><span>DSelector</span></a>
2
+ <a href="../interfaces/selectors.TSelector.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-256"></use></svg><span>TSelector</span></a>
3
+ </div></section><section class="tsd-index-section"><h3 class="tsd-index-heading">Type Aliases</h3><div class="tsd-index-list"><a href="../types/selectors.selection.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2097152"></use></svg><span>selection</span></a>
4
+ <a href="../types/selectors.singleSelector.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2097152"></use></svg><span>single<wbr/>Selector</span></a>
5
+ </div></section><section class="tsd-index-section"><h3 class="tsd-index-heading">Functions</h3><div class="tsd-index-list"><a href="../functions/selectors._d.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-64"></use></svg><span>$d</span></a>
6
+ <a href="../functions/selectors._t.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-64"></use></svg><span>$t</span></a>
7
+ </div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
package/public/typedoc/modules.html CHANGED
@@ -2,4 +2,5 @@
2
2
  <a href="modules/formValues.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>form<wbr/>Values</span></a>
3
3
  <a href="modules/MC.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>MC</span></a>
4
4
  <a href="modules/observables.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>observables</span></a>
5
+ <a href="modules/selectors.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>selectors</span></a>
5
6
  </div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html" class="current"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base="."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
package/public/typedoc/types/observables.Observable.html CHANGED
@@ -1 +1 @@
1
- <!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>Observable | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="../modules/observables.html">observables</a></li><li><a href="observables.Observable.html">Observable</a></li></ul><h1>Type Alias Observable</h1></div><div class="tsd-signature"><span class="tsd-kind-type-alias">Observable</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span><br/><span>    </span><span class="tsd-kind-property">bind</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">target</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">DocumentFragment</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">ShadowRoot</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-kind-property">callbacks</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Function</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-kind-property">notify</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-kind-property">observe</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">cb</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Callback</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/2e5a4bb3e100a0118314c90071abedc3a21d9bfc/src/observables.ts#L194">src/observables.ts:194</a></li></ul></aside></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
1
+ <!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>Observable | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="../modules/observables.html">observables</a></li><li><a href="observables.Observable.html">Observable</a></li></ul><h1>Type Alias Observable</h1></div><div class="tsd-signature"><span class="tsd-kind-type-alias">Observable</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span><br/><span>    </span><span class="tsd-kind-property">bind</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">target</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">DocumentFragment</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">ShadowRoot</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-kind-property">callbacks</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Function</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-kind-property">notify</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-kind-property">observe</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">cb</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Callback</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> =&gt; </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/ccac2b590950e9a31c1189c5c494a10768bc260d/src/observables.ts#L191">src/observables.ts:191</a></li></ul></aside></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
package/public/typedoc/types/selectors.selection.html ADDED
@@ -0,0 +1 @@
1
+ <!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>selection | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="../modules/selectors.html">selectors</a></li><li><a href="selectors.selection.html">selection</a></li></ul><h1>Type Alias selection</h1></div><div class="tsd-signature"><span class="tsd-kind-type-alias">selection</span><span class="tsd-signature-symbol">:</span> <a href="selectors.singleSelector.html" class="tsd-signature-type tsd-kind-type-alias">singleSelector</a><span class="tsd-signature-symbol"> | </span><a href="selectors.singleSelector.html" class="tsd-signature-type tsd-kind-type-alias">singleSelector</a><span class="tsd-signature-symbol">[]</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/ccac2b590950e9a31c1189c5c494a10768bc260d/src/selectors.ts#L1269">src/selectors.ts:1269</a></li></ul></aside></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
package/public/typedoc/types/selectors.singleSelector.html ADDED
@@ -0,0 +1 @@
1
+ <!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>singleSelector | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="../modules/selectors.html">selectors</a></li><li><a href="selectors.singleSelector.html">singleSelector</a></li></ul><h1>Type Alias singleSelector</h1></div><div class="tsd-signature"><span class="tsd-kind-type-alias">single<wbr/>Selector</span><span class="tsd-signature-symbol">:</span> <br/><span>    </span><span class="tsd-signature-symbol">| </span><span class="tsd-signature-type">string</span><br/><span>    </span><span class="tsd-signature-symbol">| </span><span class="tsd-signature-type">ShadowRoot</span><br/><span>    </span><span class="tsd-signature-symbol">| </span><span class="tsd-signature-type">HTMLElement</span><br/><span>    </span><span class="tsd-signature-symbol">| </span><span class="tsd-signature-type">HTMLElement</span><span class="tsd-signature-symbol">[]</span><br/><span>    </span><span class="tsd-signature-symbol">| </span><span class="tsd-signature-type">HTMLCollection</span><br/><span>    </span><span class="tsd-signature-symbol">| </span><span class="tsd-signature-type">NodeList</span><br/><span>    </span><span class="tsd-signature-symbol">| </span><a href="../interfaces/selectors.DSelector.html" class="tsd-signature-type tsd-kind-interface">DSelector</a><br/><span>    </span><span class="tsd-signature-symbol">| </span><a href="../classes/MC.MC.html" class="tsd-signature-type tsd-kind-class">MC</a><br/><span>    </span><span class="tsd-signature-symbol">| </span><a href="../classes/MC.DC.html" class="tsd-signature-type tsd-kind-class">DC</a><br/><span>    </span><span class="tsd-signature-symbol">| </span><a href="../interfaces/selectors.TSelector.html" class="tsd-signature-type tsd-kind-interface">TSelector</a><br/><span>    </span><span class="tsd-signature-symbol">| </span><span class="tsd-signature-type">undefined</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/ccac2b590950e9a31c1189c5c494a10768bc260d/src/selectors.ts#L1267">src/selectors.ts:1267</a></li></ul></aside></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
package/src/MC.ts CHANGED
@@ -267,13 +267,14 @@ function bubbleEvent(target: HTMLElement, ev: McEvent) {
267
267
  }
268
268
 
269
269
  class McBase {
270
- #target: WeakRef<any>; // avoid circular reference
270
+ private _target: WeakRef<any>; // avoid circular reference
271
+ private __mc: LooseObject = {};
271
272
 
272
273
  constructor(target?: { [key: string]: any }, debug: boolean = false) {
273
274
  let that: unknown = this,
274
275
  element = that as MC | DC;
275
276
 
276
- this.#target = new WeakRef(target || {});
277
+ this._target = new WeakRef(target || {});
277
278
 
278
279
  init(element); // async lifecycle event
279
280
 
@@ -281,13 +282,15 @@ class McBase {
281
282
  }
282
283
 
283
284
  get target(): any {
284
- return this.#target.deref();
285
+ return this._target.deref();
286
+ }
287
+
288
+ get _mc(): any {
289
+ return this.__mc;
285
290
  }
286
291
  }
287
292
 
288
293
  class MC extends McBase {
289
- _mc?: LooseObject = {};
290
-
291
294
  constructor(target?: any) {
292
295
  super(target);
293
296
  }
@@ -364,8 +367,6 @@ class MC extends McBase {
364
367
  }
365
368
 
366
369
  class DC extends McBase {
367
- _mc?: LooseObject = {};
368
-
369
370
  constructor(target: HTMLElement, debug: boolean = false) {
370
371
  super(target);
371
372
  }
@@ -410,45 +411,15 @@ class DC extends McBase {
410
411
  }
411
412
  }
412
413
 
413
- /*
414
- unresolvedCEs (code below this comment):
415
-
416
- a repository (a hashmap) of undefined custom elements:
417
- the name is the tagname of the micro component (like "my-custom-component")
418
- if they are loading, the value is a script element
419
- if they are loaded, the entry is deleted and the browser instanciates it automatically
420
- if they cannot be loaded, the browser will throw an error
414
+ const loadingMCs = new Set<string>();
421
415
 
422
- If the custom element ( defined by its tagname, like "my-custom-component") is not defined, it will be on-demand loaded:
423
- The file name is assumed to be "/my/custom/component.js"
424
- The file must define a custom element via the defineCE() function included in the "elements" module.
425
- This function is a wrapper for customElementRegistry.define(), which you can also use directly in the imported code.
416
+ function makeLoadScript( element: string ) {
426
417
 
427
- In general this behaves like a custom runtime import for custom elements in the browser.
428
- The only difference is that the micro component is loaded only when needed, and not on page load.
429
- */
418
+ if ( loadingMCs.has( element ) ) return; // already loading
430
419
 
431
- const CEs = new Map();
432
-
433
- /*
434
- loadedMCs (code below this comment):
435
- a repository (a hashmap) of micro components:
436
- the name is the name of the micro component (like "my-mc")
437
- if they are loading, the value is a script element
438
- if they are loaded, the value is the micro component class itself
439
-
440
- This is mostly used for old style progressive enhancement:
441
- If the micro component ( defined in the HTMLElements "_mc" attribute, like "my-mc") is not defined, it will be on-demand loaded:
442
- The file name is assumed to be "/my/mc.js"
443
- The file needs to have a default export, and it should be a class that extends the DC class ( since it is in a HTMLElements attribute )
444
-
445
- In general this behaves like a custom runtime import for classes in the browser.
446
- The only difference is that the micro component is loaded only when needed, and not on page load.
447
- */
448
- const MCs = new Map();
449
-
450
- function makeLoadScript( element: string ): HTMLScriptElement {
420
+ loadingMCs.add( element );
451
421
 
422
+ //console.log( 'makeLoadScript:', element);
452
423
  const fileName: string = './' + element.split('-').join('/')+'.js';
453
424
 
454
425
  const se: HTMLScriptElement = document.createElement('script');
@@ -457,123 +428,76 @@ function makeLoadScript( element: string ): HTMLScriptElement {
457
428
  se.setAttribute('blocking', 'render');
458
429
  se.async = true;
459
430
  se.setAttribute('type', 'module');
460
- se.setAttribute( 'name', element);
431
+ se.setAttribute( 'data-name', element);
461
432
  se.setAttribute( 'loading', '');
462
433
 
463
- addListener( se, 'load', (ev) => {
464
- // console.info('loaded MC', elementName);
465
- se.removeAttribute( 'loading' );
466
- se.setAttribute( 'loaded', '');
467
- });
434
+ const loadedPromise = customElements.whenDefined( element );
468
435
 
469
- addListener( se, 'error', (ev) => {
470
- console.error('could not load Custom Element code from', fileName);
471
- });
436
+ loadedPromise.then( () => {
437
+ const elements: HTMLElement[] = Array
438
+ .from(document.querySelectorAll(`[_mc*="${element}"]`))
439
+ .filter( element => element instanceof HTMLElement );
472
440
 
473
- return se;
474
- }
441
+ if ( elements.length === 0 ) return;
475
442
 
476
- function onLoadCallback( script: HTMLScriptElement ) {
477
- // create callback script tag
478
- // it is essential to do this in a timeout and via another script tag,
479
- // to force it to be a top level module allowing for the use of "import"
480
- setTimeout( function(){
481
- // create callback script tag
482
- const importFileName = script.getAttribute('src');
483
- const elementName = script.getAttribute('name');
484
-
485
- const se: HTMLScriptElement = document.createElement('script');
486
-
487
- se.async = true;
488
- se.setAttribute( 'type', 'module');
489
-
490
- // --- autoload script
491
- const code = /*javascript*/`
492
-
493
- import _ from "${importFileName}";
494
- import { DC } from "./microcomponents.js";
495
-
496
- const elements = Array.from(document.querySelectorAll('[_mc*="${elementName}"]')).filter( element => element instanceof HTMLElement );
497
-
498
- elements.forEach((element) => {
499
- // add class to MCs repository
500
- autoload.state.MCs.set( '${elementName}', _ );
501
- // add instance to HTMLElement
502
- DC.add(element, _.name, new _(element));
503
- // remove instance name from elements "_mc" attribute
504
- element.setAttribute('_mc', element.getAttribute('_mc').replace('${elementName}', '').replace( /\w\w/g, ' ').trim());
505
- });
443
+ //console.log( 'loadedPromise elements', elements );
506
444
 
507
- setTimeout( () => {
508
- document.body.querySelector('script[name="${elementName}]"')?.remove();
509
- },0);
445
+ const klass = customElements.get( element );
510
446
 
511
- `;
512
- // --- end autoload script
447
+ elements.forEach((node: HTMLElement) => {
448
+ //console.log( 'add', klass!.name, 'to', node );
449
+ DC.add(node, klass!.name, new klass!(node));
513
450
 
514
- se.innerHTML = code;
515
- document.body.append(se);
516
- }, 0);
451
+ //@ts-ignore
452
+ const new_mc = node
453
+ .getAttribute( '_mc' )
454
+ .split(' ')
455
+ .filter( (name) => name !== element && name !== '' )
456
+ .join(' ');
457
+
458
+ //@ts-ignore
459
+ node.setAttribute(
460
+ '_mc',
461
+ //@ts-ignore
462
+ new_mc
463
+ )
464
+ });
465
+
466
+ document.head.querySelector('script[data-name="${elementName}]"')?.remove();
467
+ });
468
+
469
+ addListener( se, 'load', (ev) => {
470
+ loadingMCs.delete( element );
471
+ });
472
+
473
+ addListener( se, 'error', (ev) => {
474
+ console.error('could not load MC code from', fileName);
475
+ });
476
+
477
+ document.head.append(se);
517
478
  }
518
479
 
519
- function loadUndefinedMicroComponents() {
480
+ function loadUndefinedMCs() {
520
481
 
521
- // load unresolved custom eleents
522
- [ ...document.querySelectorAll(':not(:defined)') ] // undefined custom elements
482
+ // load unresolved custom elements
483
+ [ ...document.querySelectorAll(':not(:defined)') ]
523
484
  .filter( (element) => !!element
524
485
  && !customElements.get(element.tagName.toLowerCase()) // not in CustomElementsRegistry
525
- && !CEs.has(element.tagName.toLowerCase()) // not in loading list
486
+ && !loadingMCs.has(element.tagName.toLowerCase()) // not in loading list
526
487
  )
527
488
  .forEach((el) => {
528
- const elementName = el.tagName.toLowerCase(),
529
- fileName: string = './'+elementName.split('-').join('/')+'.js';
530
-
531
- const se: HTMLScriptElement = makeLoadScript( elementName );
532
-
533
- addListener( se, 'load', () => {
534
- CEs.set( elementName, customElements.get(el.tagName.toLowerCase()) );
535
- });
536
-
537
- CEs.set( elementName, 'loading');
538
- document.head.append(se);
539
-
540
- // instanciation of the micro component will be handled by the browser automatically
541
- // module code must define the micro component class and add it to the customElementRegistry
489
+ //console.log( 'detected CE', el.tagName.toLowerCase() );
490
+ makeLoadScript( el.tagName.toLowerCase() );
542
491
  });
543
492
 
544
- [ ...document.querySelectorAll('[_mc]:not([_mc=""]') ] // undefined DOM components
493
+ // load unresolved MCs defined in _mc attribute
494
+ [ ...document.querySelectorAll('[_mc]:not([_mc=""]') ]
545
495
  .filter( (element) => !!element )
546
496
  .forEach((el) => {
547
- const elements = el.getAttribute('_mc')?.split(' ').filter( m => !!m ) || [];
548
- const elementsToBeLoaded = elements.filter( m => !MCs.has( m ) );
549
-
550
- // load MC components that do not exist yet
551
- elementsToBeLoaded?.forEach( elementName => {
552
- const se: HTMLScriptElement = makeLoadScript( elementName );
553
-
554
- addListener( se, 'load', () => onLoadCallback( document.head.querySelector(`script[name="${elementName}"]`) as HTMLScriptElement) );
555
-
556
- MCs.set( elementName, 'loading');
557
-
558
- document.head.append(se);
559
- });
560
-
561
- // loading MC components already have callbacks attached
562
- const elementsAlreadyLoaded = elements.filter( m => MCs.has( m ) && !MCs.get( m )!.length);
563
-
564
- // MCs that are already loaded will trigger the onLoadCallback manually
565
- elementsAlreadyLoaded?.forEach( elementName => {
566
- setTimeout( ()=>{
567
- //console.log('attaching', elementName, (autoload as any).state.MCs.get(elementName));
568
- DC.add(el, elementName, new ( (autoload as any).state.MCs.get(elementName) as any)(el)); // add instance to DOM
569
-
570
- const newAttribute = (el as any).getAttribute('_mc')
571
- .replace('${elementName}', '')
572
- .replace( /\w\w/g, ' ')
573
- .trim() || '_mc';
574
-
575
- (el as any).setAttribute('_mc', ); // set new "_mc" attribute
576
- }, 5);
497
+ const _mc = el.getAttribute('_mc')?.split(' ').filter( name => name !== '' );
498
+ _mc?.forEach( dc => {
499
+ //console.log( 'detected DC', dc );
500
+ makeLoadScript( dc );
577
501
  });
578
502
  });
579
503
  }
@@ -590,11 +514,11 @@ function autoload(enable: boolean = true): boolean {
590
514
  }
591
515
 
592
516
  autoloadEnabled = enable;
593
- observer = new MutationObserver(loadUndefinedMicroComponents);
517
+ observer = new MutationObserver(loadUndefinedMCs);
594
518
 
595
519
  setTimeout(() => {
596
520
  observer!.observe(document.body, { childList: true, subtree: true });
597
- loadUndefinedMicroComponents();
521
+ loadUndefinedMCs();
598
522
  }, 5);
599
523
 
600
524
  (window as any).autoload = (window as any).autoload || autoload;
@@ -602,7 +526,7 @@ function autoload(enable: boolean = true): boolean {
602
526
  return autoloadEnabled;
603
527
  }
604
528
 
605
- (autoload as LooseObject).state = { CEs, MCs };
529
+ (autoload as LooseObject).state = { loadingMCs };
606
530
 
607
531
  export { addListener, removeListener, McBase, MC, DC, McEvent, autoload };
608
532
 
package/src/elements.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- import { DC } from './MC.js';
3
+ import { DC, McBase } from './MC.js';
4
4
  import { kebabToPascal } from './helpers.js';
5
5
 
6
6
  class CeBaseClass extends HTMLElement {
@@ -32,9 +32,14 @@ function createNamedClass(
32
32
  return Object.defineProperty(ClassBody, 'name', { value: name });
33
33
  }
34
34
 
35
+ function isClass(func: any) {
36
+ return typeof func === 'function'
37
+ && /^class\s/.test(Function.prototype.toString.call(func));
38
+ }
39
+
35
40
  export function defineCE(
36
41
  tagName: string,
37
- DefinitionClass: { new (...args: any[]): any },
42
+ DefinitionClass: { new (...args: any[]): any } | Function,
38
43
  observedAttributes: string[] = []
39
44
  ) {
40
45
  if (customElements.get(tagName)) {
@@ -50,6 +55,27 @@ export function defineCE(
50
55
 
51
56
  let name = kebabToPascal(tagName);
52
57
 
58
+ // not a class, but a function
59
+ if ( !isClass( DefinitionClass.prototype.constructor ) ){
60
+ customElements.define(
61
+ tagName,
62
+ // @ts-ignore
63
+ DefinitionClass
64
+ );
65
+ return;
66
+ }
67
+
68
+ // a class, but not a MC
69
+ if ( !( DefinitionClass.prototype instanceof McBase ) ){
70
+ customElements.define(
71
+ tagName,
72
+ // @ts-ignore
73
+ DefinitionClass
74
+ );
75
+ return;
76
+ }
77
+
78
+ // a MC
53
79
  customElements.define(
54
80
  tagName,
55
81
  createNamedClass(
@@ -59,7 +85,11 @@ export function defineCE(
59
85
 
60
86
  constructor(data?: any) {
61
87
  super();
62
- let instance = new DefinitionClass(this, data);
88
+ // @ts-ignore
89
+ const instance = isClass( DefinitionClass )
90
+ // @ts-ignore
91
+ ? new DefinitionClass(this, data)
92
+ : DefinitionClass;
63
93
  DC.add(this, name, instance);
64
94
  }
65
95