@twobirds/microcomponents 0.0.82 → 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
@@ -0,0 +1,15 @@
1
+ interface McEvent {
2
+ data: any;
3
+ bubble: string;
4
+ }
5
+ declare class McEvent {
6
+ #private;
7
+ constructor(type: string, data?: any, bubble?: string);
8
+ get type(): string;
9
+ get stopped(): boolean;
10
+ get immediateStopped(): boolean;
11
+ stopPropagation(): void;
12
+ stopImmediatePropagation(): void;
13
+ }
14
+ export { McEvent };
15
+ //# sourceMappingURL=McEvent.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"McEvent.d.ts","sourceRoot":"","sources":["../src/McEvent.ts"],"names":[],"mappings":"AAeA,UAAU,OAAO;IAChB,IAAI,EAAE,GAAG,CAAC;IACV,MAAM,EAAE,MAAM,CAAC;CACf;AAED,cAAM,OAAO;;gBAMC,IAAI,EAAE,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,GAAE,MAAY;IAO/D,IAAI,IAAI,IAAI,MAAM,CAEjB;IAED,IAAI,OAAO,IAAI,OAAO,CAErB;IAED,IAAI,gBAAgB,IAAI,OAAO,CAE9B;IAED,eAAe;IAIf,wBAAwB;CAKxB;AAyCD,OAAO,EAAE,OAAO,EAAE,CAAC"}
@@ -0,0 +1,71 @@
1
+ "use strict";
2
+ var isBrowser = new Function("try {return this===window;}catch(e){ return false;}");
3
+ let nativeEventNames = new Set();
4
+ if (isBrowser()) {
5
+ Object.keys(HTMLElement.prototype).filter(key => /^on/.test(key)).forEach(eventName => nativeEventNames.add(eventName));
6
+ }
7
+ function isDOM(element) {
8
+ return element && element instanceof HTMLElement;
9
+ }
10
+ class McEvent {
11
+ #type;
12
+ #stopped = false;
13
+ #immediateStopped = false;
14
+ constructor(type, data = {}, bubble = 'l') {
15
+ this.#type = type;
16
+ this.data = data;
17
+ this.bubble = bubble;
18
+ }
19
+ get type() {
20
+ return this.#type;
21
+ }
22
+ get stopped() {
23
+ return this.#stopped;
24
+ }
25
+ get immediateStopped() {
26
+ return this.#immediateStopped;
27
+ }
28
+ stopPropagation() {
29
+ this.#stopped = true;
30
+ }
31
+ stopImmediatePropagation() {
32
+ this.stopPropagation();
33
+ this.#immediateStopped = true;
34
+ }
35
+ }
36
+ function getMicroComponents(elements, search) {
37
+ let mcValues = [];
38
+ elements.forEach(e => {
39
+ if (e) {
40
+ if (e instanceof HTMLElement) {
41
+ const _mc = e?._mc;
42
+ if (!search && _mc) {
43
+ mcValues = mcValues.concat(Object.values(e._mc));
44
+ }
45
+ else if (search && _mc && _mc[search]) {
46
+ mcValues.push(_mc[search]);
47
+ }
48
+ }
49
+ }
50
+ });
51
+ return mcValues;
52
+ }
53
+ function traverseNodes(node, search, firstonly = true) {
54
+ let mcValues = [];
55
+ while (node) {
56
+ if (node._mc) {
57
+ if (!search) {
58
+ mcValues = mcValues.concat(Object.values(node._mc));
59
+ }
60
+ else if (search && node._mc[search]) {
61
+ mcValues.push(node._mc[search]);
62
+ }
63
+ if (firstonly)
64
+ return mcValues;
65
+ }
66
+ node = node.parentNode;
67
+ }
68
+ return mcValues;
69
+ }
70
+ export { McEvent };
71
+ //# sourceMappingURL=McEvent.js.map
@@ -0,0 +1,5 @@
1
+ export declare function defineCE(tagName: string, DefinitionClass: {
2
+ new (...args: any[]): any;
3
+ } | Function, observedAttributes?: string[]): void;
4
+ export declare function getCE(tagName: string): CustomElementConstructor | undefined;
5
+ //# sourceMappingURL=elements.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAuCA,wBAAgB,QAAQ,CACvB,OAAO,EAAE,MAAM,EACf,eAAe,EAAE;IAAE,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAA;CAAE,GAAG,QAAQ,EACzD,kBAAkB,GAAE,MAAM,EAAO,QA2DjC;AAED,wBAAgB,KAAK,CAAC,OAAO,EAAE,MAAM,GAAG,wBAAwB,GAAG,SAAS,CAE3E"}
@@ -0,0 +1,62 @@
1
+ 'use strict';
2
+ import { DC, McBase } from './MC.js';
3
+ import { kebabToPascal } from './helpers.js';
4
+ class CeBaseClass extends HTMLElement {
5
+ constructor() {
6
+ super();
7
+ }
8
+ connectedCallback() {
9
+ DC.trigger(this, 'Connected');
10
+ }
11
+ disconnectedCallback() {
12
+ DC.trigger(this, 'Disconnected');
13
+ }
14
+ adoptedCallback() {
15
+ DC.trigger(this, 'Adopted');
16
+ }
17
+ attributeChangedCallback(name, oldValue, newValue) {
18
+ DC.trigger(this, 'AttributeChanged', { name, oldValue, newValue });
19
+ }
20
+ }
21
+ function createNamedClass(name, ClassBody) {
22
+ return Object.defineProperty(ClassBody, 'name', { value: name });
23
+ }
24
+ function isClass(func) {
25
+ return typeof func === 'function'
26
+ && /^class\s/.test(Function.prototype.toString.call(func));
27
+ }
28
+ export function defineCE(tagName, DefinitionClass, observedAttributes = []) {
29
+ if (customElements.get(tagName)) {
30
+ console.warn(`IGNORED: Custom element "${tagName}" is already defined!`);
31
+ return;
32
+ }
33
+ if (!tagName.includes('-')) {
34
+ throw new Error('createCustomElement: tagName must contain at least one hyphen ("-").');
35
+ }
36
+ let name = kebabToPascal(tagName);
37
+ if (!isClass(DefinitionClass.prototype.constructor)) {
38
+ customElements.define(tagName, DefinitionClass);
39
+ return;
40
+ }
41
+ if (!(DefinitionClass.prototype instanceof McBase)) {
42
+ customElements.define(tagName, DefinitionClass);
43
+ return;
44
+ }
45
+ customElements.define(tagName, createNamedClass(name, class extends CeBaseClass {
46
+ instance;
47
+ constructor(data) {
48
+ super();
49
+ const instance = isClass(DefinitionClass)
50
+ ? new DefinitionClass(this, data)
51
+ : DefinitionClass;
52
+ DC.add(this, name, instance);
53
+ }
54
+ static get observedAttributes() {
55
+ return observedAttributes;
56
+ }
57
+ }));
58
+ }
59
+ export function getCE(tagName) {
60
+ return customElements.get(tagName);
61
+ }
62
+ //# sourceMappingURL=elements.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"elements.js","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,MAAM,WAAY,SAAQ,WAAW;IACpC;QACC,KAAK,EAAE,CAAC;IACT,CAAC;IAED,iBAAiB;QACf,EAAU,CAAC,OAAO,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;IACxC,CAAC;IAED,oBAAoB;QAClB,EAAU,CAAC,OAAO,CAAC,IAAI,EAAE,cAAc,CAAC,CAAC;IAC3C,CAAC;IAED,eAAe;QACb,EAAU,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IACtC,CAAC;IAED,wBAAwB,CAAC,IAAY,EAAE,QAAa,EAAE,QAAa;QACjE,EAAU,CAAC,OAAO,CAAC,IAAI,EAAE,kBAAkB,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC7E,CAAC;CACD;AAED,SAAS,gBAAgB,CACxB,IAAY,EACZ,SAAwC;IAExC,OAAO,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;AAClE,CAAC;AAED,SAAS,OAAO,CAAC,IAAS;IACxB,OAAO,OAAO,IAAI,KAAK,UAAU;WAC5B,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;AAC/D,CAAC;AAED,MAAM,UAAU,QAAQ,CACvB,OAAe,EACf,eAAyD,EACzD,qBAA+B,EAAE;IAEjC,IAAI,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;QACjC,OAAO,CAAC,IAAI,CAAC,4BAA4B,OAAO,uBAAuB,CAAC,CAAC;QACzE,OAAO;IACR,CAAC;IAED,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;QAC5B,MAAM,IAAI,KAAK,CACd,sEAAsE,CACtE,CAAC;IACH,CAAC;IAED,IAAI,IAAI,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;IAGlC,IAAK,CAAC,OAAO,CAAE,eAAe,CAAC,SAAS,CAAC,WAAW,CAAE,EAAE,CAAC;QACxD,cAAc,CAAC,MAAM,CACpB,OAAO,EAEP,eAAe,CACf,CAAC;QACF,OAAO;IACR,CAAC;IAGD,IAAK,CAAC,CAAE,eAAe,CAAC,SAAS,YAAY,MAAM,CAAE,EAAE,CAAC;QACvD,cAAc,CAAC,MAAM,CACpB,OAAO,EAEP,eAAe,CACf,CAAC;QACF,OAAO;IACR,CAAC;IAGD,cAAc,CAAC,MAAM,CACpB,OAAO,EACP,gBAAgB,CACf,IAAI,EACJ,KAAM,SAAQ,WAAW;QACxB,QAAQ,CAAM;QAEd,YAAY,IAAU;YACrB,KAAK,EAAE,CAAC;YAER,MAAM,QAAQ,GAAG,OAAO,CAAE,eAAe,CAAE;gBAE1C,CAAC,CAAC,IAAI,eAAe,CAAC,IAAI,EAAE,IAAI,CAAC;gBACjC,CAAC,CAAC,eAAe,CAAC;YACnB,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,CAAC,CAAC;QAC9B,CAAC;QAED,MAAM,KAAK,kBAAkB;YAC5B,OAAO,kBAAkB,CAAC;QAC3B,CAAC;KACD,CACD,CACD,CAAC;AACH,CAAC;AAED,MAAM,UAAU,KAAK,CAAC,OAAe;IACpC,OAAO,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;AACpC,CAAC"}
@@ -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
 
@@ -0,0 +1,3 @@
1
+ import { LooseObject } from './helpers.js';
2
+ export declare function formValues(targetObject: LooseObject, propertyName: string, dom: HTMLElement | ShadowRoot): void;
3
+ //# sourceMappingURL=formValues.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"formValues.d.ts","sourceRoot":"","sources":["../src/formValues.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAsB,MAAM,cAAc,CAAC;AA0M/D,wBAAgB,UAAU,CACzB,YAAY,EAAE,WAAW,EACzB,YAAY,EAAE,MAAM,EACpB,GAAG,EAAE,WAAW,GAAG,UAAU,QAgB7B"}
@@ -0,0 +1,162 @@
1
+ 'use strict';
2
+ import { copyGettersSetters } from './helpers.js';
3
+ import { DC, addListener } from './MC.js';
4
+ import { observe } from './observables.js';
5
+ const getInputName = (e) => {
6
+ return e.tagName.toLowerCase();
7
+ };
8
+ class InputBase {
9
+ constructor(e) { }
10
+ }
11
+ class RadioHandler extends InputBase {
12
+ #e;
13
+ constructor(e) {
14
+ super(e);
15
+ this.#e = e;
16
+ }
17
+ get val() {
18
+ let ret = new FormData(this.#e.form).get(this.#e.name);
19
+ return ret;
20
+ }
21
+ set val(value) {
22
+ let arr = [
23
+ ...this.#e.form.querySelectorAll(`input[type="radio"][name="${this.#e.name}"]`),
24
+ ];
25
+ arr
26
+ .filter((e) => e.getAttribute('value') === value)
27
+ .shift().checked = true;
28
+ }
29
+ }
30
+ class CheckboxHandler extends InputBase {
31
+ #e;
32
+ constructor(e) {
33
+ super(e);
34
+ this.#e = e;
35
+ }
36
+ get val() {
37
+ return this.#e.checked;
38
+ }
39
+ set val(value) {
40
+ this.#e.checked = value;
41
+ }
42
+ }
43
+ class InputHandler extends InputBase {
44
+ #e;
45
+ constructor(e) {
46
+ super(e);
47
+ this.#e = e;
48
+ }
49
+ get val() {
50
+ return this.#e.value;
51
+ }
52
+ set val(value) {
53
+ this.#e.value = value;
54
+ }
55
+ }
56
+ class SelectHandler extends InputBase {
57
+ #e;
58
+ #multi = false;
59
+ constructor(e) {
60
+ super(e);
61
+ this.#e = e;
62
+ this.#multi = e.multiple;
63
+ }
64
+ get val() {
65
+ const that = this, ret = [];
66
+ [...that.#e.querySelectorAll('option')]
67
+ .filter((o) => o.selected)
68
+ .forEach((o) => {
69
+ ret.push(o.value);
70
+ });
71
+ if (this.#multi)
72
+ return ret;
73
+ return ret.length ? ret[0] : '';
74
+ }
75
+ set val(value) {
76
+ const that = this;
77
+ value = typeof value === 'string' ? [value] : value;
78
+ [...that.#e.querySelectorAll('option')].forEach((o) => {
79
+ if (value.indexOf(o.value) > -1) {
80
+ o.selected = true;
81
+ }
82
+ else {
83
+ o.selected = false;
84
+ }
85
+ });
86
+ }
87
+ }
88
+ class TextAreaHandler extends InputBase {
89
+ #e;
90
+ constructor(e) {
91
+ super(e);
92
+ this.#e = e;
93
+ }
94
+ get val() {
95
+ return this.#e.value || '';
96
+ }
97
+ set val(value) {
98
+ this.#e.value = value;
99
+ }
100
+ }
101
+ const getInputHandlers = (e) => {
102
+ let inputList = [
103
+ ...(e || document).querySelectorAll('input,select,textarea'),
104
+ ], handlers = {};
105
+ inputList.forEach((i) => {
106
+ const name = i.getAttribute('name');
107
+ if (name) {
108
+ let handler = false;
109
+ switch (getInputName(i)) {
110
+ case 'input':
111
+ switch (i.type) {
112
+ case 'radio':
113
+ handler = new RadioHandler(i);
114
+ break;
115
+ case 'checkbox':
116
+ handler = new CheckboxHandler(i);
117
+ break;
118
+ default:
119
+ handler = new InputHandler(i);
120
+ }
121
+ break;
122
+ case 'select':
123
+ handler = new SelectHandler(i);
124
+ break;
125
+ case 'textarea':
126
+ handler = new TextAreaHandler(i);
127
+ break;
128
+ default:
129
+ console.warn('handler missing:', name, 'for', i.tagName.toLowerCase(), i);
130
+ break;
131
+ }
132
+ if (handler) {
133
+ DC.add(i, name, handler);
134
+ Object.defineProperty(handlers, name, {
135
+ enumerable: true,
136
+ configurable: true,
137
+ get: () => {
138
+ return handler.val;
139
+ },
140
+ set: (value) => {
141
+ if (handler.val !== value) {
142
+ handler.val = value;
143
+ }
144
+ },
145
+ });
146
+ }
147
+ }
148
+ });
149
+ return handlers;
150
+ };
151
+ export function formValues(targetObject, propertyName, dom) {
152
+ let handlers = getInputHandlers(dom);
153
+ targetObject[propertyName] = Object.assign({}, handlers);
154
+ observe(targetObject, propertyName);
155
+ copyGettersSetters(handlers, targetObject[propertyName]);
156
+ [...dom.querySelectorAll('input, textarea, select')].forEach((input) => {
157
+ addListener(input, 'input', (ev) => {
158
+ targetObject[propertyName].notify();
159
+ });
160
+ });
161
+ }
162
+ //# sourceMappingURL=formValues.js.map
@@ -0,0 +1,14 @@
1
+ export interface LooseObject {
2
+ [key: string | symbol]: any;
3
+ }
4
+ export declare function isNativeObject(value: any): boolean;
5
+ export declare function sortObject(o: LooseObject): LooseObject;
6
+ export declare function flattenObject(o: LooseObject, doSort?: boolean): LooseObject;
7
+ export declare function deepEqual(o1: LooseObject, o2: LooseObject): boolean;
8
+ export declare function nameSpace(ns: string | string[], obj?: LooseObject): any;
9
+ export declare function parse(what: string | Object | any[], parseThis: Object): any;
10
+ export declare function kebabToPascal(str: string): string;
11
+ export declare function debounce(func: Function, milliseconds: number): Function;
12
+ export declare function htmlToElements(html: string): HTMLElement[];
13
+ export declare function copyGettersSetters(source: LooseObject, target: LooseObject): void;
14
+ //# sourceMappingURL=helpers.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../src/helpers.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,WAAW;IAC3B,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC;CAC5B;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,GAAG,GAAG,OAAO,CAElD;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,WAAW,GAAG,WAAW,CAatD;AAED,wBAAgB,aAAa,CAC5B,CAAC,EAAE,WAAW,EACd,MAAM,GAAE,OAAc,GACpB,WAAW,CAmBb;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,WAAW,GAAG,OAAO,CAInE;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,GAAG,GAAE,WAAgB,GAAG,GAAG,CAW3E;AAED,wBAAgB,KAAK,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,EAAE,EAAE,SAAS,EAAE,MAAM,OAyCrE;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,UAKxC;AAED,wBAAgB,QAAQ,CAAC,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,GAAG,QAAQ,CASvE;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,EAAE,CAU1D;AAED,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,QAO1E"}
@@ -0,0 +1,113 @@
1
+ 'use strict';
2
+ export function isNativeObject(value) {
3
+ return value && value['constructor'] && value.constructor === Object;
4
+ }
5
+ export function sortObject(o) {
6
+ let result = {}, keys = [...Object.keys(o)].sort();
7
+ keys.forEach((key) => {
8
+ if (isNativeObject(o[key])) {
9
+ result[key] = sortObject(o[key]);
10
+ }
11
+ else {
12
+ result[key] = o[key];
13
+ }
14
+ });
15
+ return result;
16
+ }
17
+ export function flattenObject(o, doSort = true) {
18
+ let result = {};
19
+ [...Object.getOwnPropertyNames(o)].forEach((propName) => {
20
+ if (o[propName] &&
21
+ o[propName]['constructor'] &&
22
+ o[propName].constructor === Object) {
23
+ const temp = flattenObject(o[propName], false);
24
+ for (const j in temp) {
25
+ result[propName + '.' + j] = temp[j];
26
+ }
27
+ }
28
+ else {
29
+ result[propName] = o[propName];
30
+ }
31
+ });
32
+ return doSort ? sortObject(result) : result;
33
+ }
34
+ export function deepEqual(o1, o2) {
35
+ return (JSON.stringify(flattenObject(o1)) === JSON.stringify(flattenObject(o2)));
36
+ }
37
+ export function nameSpace(ns, obj = {}) {
38
+ let nsa = ns.constructor === String ? ns.split('.') : ns;
39
+ if (!obj || !nsa[0] || !obj[nsa[0]]) {
40
+ console.warn('ns', nsa[0], 'not in', obj);
41
+ return;
42
+ }
43
+ if (obj[nsa[0]].constructor === Object && nsa.length > 1) {
44
+ return nameSpace(nsa.splice(1), obj[nsa[0]]);
45
+ }
46
+ return obj[nsa[0]];
47
+ }
48
+ export function parse(what, parseThis) {
49
+ var args = Array.from(arguments);
50
+ if (args.length > 2) {
51
+ while (args.length > 1) {
52
+ args[0] = parse(args[0], args[1]);
53
+ args.splice(1, 1);
54
+ }
55
+ return args[0];
56
+ }
57
+ if (typeof what === 'string') {
58
+ what.match(/\{[^\{\}]*\}/g)?.forEach(function (pPropname) {
59
+ var propname = pPropname.substring(1, pPropname.length - 1), value = nameSpace(propname, parseThis);
60
+ if (typeof value !== 'undefined') {
61
+ what = what.replace(pPropname, value);
62
+ }
63
+ });
64
+ }
65
+ else if (isNativeObject(what)) {
66
+ switch (what.constructor) {
67
+ case Object:
68
+ Object.keys(what).forEach(function (pKey) {
69
+ if (what.hasOwnProperty(pKey)) {
70
+ what[pKey] = parse(what[pKey], parseThis);
71
+ }
72
+ });
73
+ break;
74
+ case Array:
75
+ what.forEach(function (pValue, pKey, original) {
76
+ original[pKey] = parse(what[pKey], parseThis);
77
+ });
78
+ break;
79
+ }
80
+ }
81
+ return what;
82
+ }
83
+ export function kebabToPascal(str) {
84
+ return str
85
+ .split('-')
86
+ .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
87
+ .join('');
88
+ }
89
+ export function debounce(func, milliseconds) {
90
+ let timeout;
91
+ return () => {
92
+ clearTimeout(timeout);
93
+ timeout = setTimeout(function () {
94
+ func(...arguments);
95
+ }, milliseconds);
96
+ };
97
+ }
98
+ export function htmlToElements(html) {
99
+ let template = document.createElement('template');
100
+ html = html.replace(/<([A-Za-z0-9\-]*)([^>\/]*)(\/>)/gi, '<$1$2></$1>');
101
+ template.innerHTML = html;
102
+ template.content.normalize();
103
+ return Array.from(template.content.childNodes);
104
+ }
105
+ export function copyGettersSetters(source, target) {
106
+ const descriptors = Object.getOwnPropertyDescriptors(source);
107
+ for (const [key, descriptor] of Object.entries(descriptors)) {
108
+ if ('get' in descriptor || 'set' in descriptor) {
109
+ Object.defineProperty(target, key, descriptor);
110
+ }
111
+ }
112
+ }
113
+ //# sourceMappingURL=helpers.js.map
@@ -0,0 +1,7 @@
1
+ export * from './helpers.js';
2
+ export * from './MC.js';
3
+ export * from './McEvent.js';
4
+ export * from './elements.js';
5
+ export * from './observables.js';
6
+ export * from './formValues.js';
7
+ //# sourceMappingURL=microcomponents.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"microcomponents.d.ts","sourceRoot":"","sources":["../src/microcomponents.ts"],"names":[],"mappings":"AACA,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AAEjC,cAAc,iBAAiB,CAAC"}
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ export * from './helpers.js';
3
+ export * from './MC.js';
4
+ export * from './McEvent.js';
5
+ export * from './elements.js';
6
+ export * from './observables.js';
7
+ export * from './formValues.js';
8
+ //# sourceMappingURL=microcomponents.js.map
@@ -0,0 +1,11 @@
1
+ import { LooseObject } from './helpers.js';
2
+ type Callback = (value: any) => void;
3
+ export type Observable = {
4
+ observe: (cb: Callback) => void;
5
+ notify: () => void;
6
+ bind: (target: HTMLElement | DocumentFragment | ShadowRoot) => void;
7
+ callbacks: Array<Function>;
8
+ };
9
+ export declare const observe: (target: LooseObject, propertyName?: string) => LooseObject;
10
+ export {};
11
+ //# sourceMappingURL=observables.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"observables.d.ts","sourceRoot":"","sources":["../src/observables.ts"],"names":[],"mappings":"AAEA,OAAO,EACN,WAAW,EAKX,MAAM,cAAc,CAAC;AAQtB,KAAK,QAAQ,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;AA8KrC,MAAM,MAAM,UAAU,GAAG;IACxB,OAAO,EAAE,CAAC,EAAE,EAAE,QAAQ,KAAK,IAAI,CAAC;IAChC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,EAAE,CAAC,MAAM,EAAE,WAAW,GAAG,gBAAgB,GAAG,UAAU,KAAM,IAAI,CAAC;IACrE,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;CAC3B,CAAC;AAkHF,eAAO,MAAM,OAAO,WACX,WAAW,iBACJ,MAAM,KACnB,WAuGF,CAAC"}