@twobirds/microcomponents 0.1.0 → 0.1.2

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 (326) hide show
  1. package/dist/MC.js +1 -1
  2. package/dist/MC.min.js +34 -53
  3. package/dist/MC.ts +3 -3
  4. package/dist/elements.min.js +1 -1
  5. package/dist/formValues.min.js +1 -1
  6. package/dist/microcomponents.min.js +1 -1
  7. package/dist/observables.min.js +1 -1
  8. package/package.json +11 -2
  9. package/.gitlab-ci.yml +0 -18
  10. package/.vscode/settings.json +0 -3
  11. package/MicroComponents.svg +0 -15
  12. package/assets/documentation/MC.md +0 -547
  13. package/assets/documentation/MicroComponents.svg +0 -15
  14. package/assets/documentation/ajaxian-1.png +0 -0
  15. package/assets/documentation/ajaxian-2.png +0 -0
  16. package/assets/documentation/ajaxian-3.png +0 -0
  17. package/assets/documentation/elements.md +0 -277
  18. package/assets/documentation/formvalues.md +0 -25
  19. package/assets/documentation/functional_requirements.md +0 -8
  20. package/assets/documentation/history.md +0 -436
  21. package/assets/documentation/klemmstein.png +0 -0
  22. package/assets/documentation/magic.md +0 -29
  23. package/assets/documentation/observables.md +0 -187
  24. package/assets/documentation/rnd0023-1.jpg +0 -0
  25. package/assets/documentation/rnd0023-2.jpg +0 -0
  26. package/assets/documentation/rnd0023-3.jpg +0 -0
  27. package/assets/documentation/tB_react.md +0 -207
  28. package/assets/documentation/usage.md +0 -142
  29. package/assets/documentation/why.md +0 -25
  30. package/assets/fiddle/MicroComponents.svg +0 -15
  31. package/assets/fiddle/fiddle.css +0 -0
  32. package/assets/fiddle/fiddle.js +0 -0
  33. package/assets/fiddle/index.html +0 -0
  34. package/assets/test/MicroComponents.svg +0 -15
  35. package/assets/test/grandparent.css +0 -16
  36. package/assets/test/myButton.css +0 -19
  37. package/assets/test/style.css +0 -8
  38. package/assets/test/test.html +0 -29
  39. package/assets/test/testform.json +0 -27
  40. package/public/.nojekyll +0 -1
  41. package/public/MC.d.ts +0 -39
  42. package/public/MC.d.ts.map +0 -1
  43. package/public/MC.js +0 -287
  44. package/public/MC.js.map +0 -1
  45. package/public/MC.min.js +0 -348
  46. package/public/MC.ts +0 -431
  47. package/public/MicroComponents.svg +0 -15
  48. package/public/documentation/MC.md +0 -547
  49. package/public/documentation/MicroComponents.svg +0 -15
  50. package/public/documentation/ajaxian-1.png +0 -0
  51. package/public/documentation/ajaxian-2.png +0 -0
  52. package/public/documentation/ajaxian-3.png +0 -0
  53. package/public/documentation/elements.md +0 -277
  54. package/public/documentation/formvalues.md +0 -25
  55. package/public/documentation/functional_requirements.md +0 -8
  56. package/public/documentation/history.md +0 -436
  57. package/public/documentation/klemmstein.png +0 -0
  58. package/public/documentation/magic.md +0 -29
  59. package/public/documentation/observables.md +0 -187
  60. package/public/documentation/rnd0023-1.jpg +0 -0
  61. package/public/documentation/rnd0023-2.jpg +0 -0
  62. package/public/documentation/rnd0023-3.jpg +0 -0
  63. package/public/documentation/tB_react.md +0 -207
  64. package/public/documentation/usage.md +0 -142
  65. package/public/documentation/why.md +0 -25
  66. package/public/elements.d.ts +0 -5
  67. package/public/elements.d.ts.map +0 -1
  68. package/public/elements.js +0 -68
  69. package/public/elements.js.map +0 -1
  70. package/public/elements.min.js +0 -1
  71. package/public/elements.ts +0 -119
  72. package/public/fiddle/MicroComponents.svg +0 -15
  73. package/public/fiddle/fiddle.css +0 -0
  74. package/public/fiddle/fiddle.js +0 -0
  75. package/public/fiddle/index.html +0 -0
  76. package/public/formValues.d.ts +0 -3
  77. package/public/formValues.d.ts.map +0 -1
  78. package/public/formValues.js +0 -162
  79. package/public/formValues.js.map +0 -1
  80. package/public/formValues.min.js +0 -1
  81. package/public/formValues.ts +0 -225
  82. package/public/helpers.d.ts +0 -14
  83. package/public/helpers.d.ts.map +0 -1
  84. package/public/helpers.js +0 -113
  85. package/public/helpers.js.map +0 -1
  86. package/public/helpers.ts +0 -149
  87. package/public/microcomponents.d.ts +0 -6
  88. package/public/microcomponents.d.ts.map +0 -1
  89. package/public/microcomponents.js +0 -7
  90. package/public/microcomponents.js.map +0 -1
  91. package/public/microcomponents.min.js +0 -1
  92. package/public/microcomponents.ts +0 -8
  93. package/public/observables.d.ts +0 -11
  94. package/public/observables.d.ts.map +0 -1
  95. package/public/observables.js +0 -244
  96. package/public/observables.js.map +0 -1
  97. package/public/observables.min.js +0 -1
  98. package/public/observables.ts +0 -416
  99. package/public/selectors._ts +0 -1269
  100. package/public/src/MC.d.ts +0 -39
  101. package/public/src/MC.d.ts.map +0 -1
  102. package/public/src/MC.js +0 -287
  103. package/public/src/MC.js.map +0 -1
  104. package/public/src/MC.ts +0 -431
  105. package/public/src/elements.d.ts +0 -5
  106. package/public/src/elements.d.ts.map +0 -1
  107. package/public/src/elements.js +0 -68
  108. package/public/src/elements.js.map +0 -1
  109. package/public/src/elements.ts +0 -119
  110. package/public/src/formValues.d.ts +0 -3
  111. package/public/src/formValues.d.ts.map +0 -1
  112. package/public/src/formValues.js +0 -162
  113. package/public/src/formValues.js.map +0 -1
  114. package/public/src/formValues.ts +0 -225
  115. package/public/src/helpers.d.ts +0 -14
  116. package/public/src/helpers.d.ts.map +0 -1
  117. package/public/src/helpers.js +0 -113
  118. package/public/src/helpers.js.map +0 -1
  119. package/public/src/helpers.ts +0 -149
  120. package/public/src/microcomponents.d.ts +0 -6
  121. package/public/src/microcomponents.d.ts.map +0 -1
  122. package/public/src/microcomponents.js +0 -7
  123. package/public/src/microcomponents.js.map +0 -1
  124. package/public/src/microcomponents.ts +0 -8
  125. package/public/src/observables.d.ts +0 -11
  126. package/public/src/observables.d.ts.map +0 -1
  127. package/public/src/observables.js +0 -244
  128. package/public/src/observables.js.map +0 -1
  129. package/public/src/observables.ts +0 -416
  130. package/public/src/selectors._ts +0 -1269
  131. package/public/src/test/grandparent.css +0 -14
  132. package/public/src/test/test/child.d.ts +0 -2
  133. package/public/src/test/test/child.d.ts.map +0 -1
  134. package/public/src/test/test/child.js +0 -26
  135. package/public/src/test/test/child.js.map +0 -1
  136. package/public/src/test/test/child.ts +0 -36
  137. package/public/src/test/test/grandchild.d.ts +0 -2
  138. package/public/src/test/test/grandchild.d.ts.map +0 -1
  139. package/public/src/test/test/grandchild.js +0 -22
  140. package/public/src/test/test/grandchild.js.map +0 -1
  141. package/public/src/test/test/grandchild.ts +0 -31
  142. package/public/src/test/test/grandparent.d.ts +0 -2
  143. package/public/src/test/test/grandparent.d.ts.map +0 -1
  144. package/public/src/test/test/grandparent.js +0 -1
  145. package/public/src/test/test/grandparent.js.map +0 -1
  146. package/public/src/test/test/grandparent.ts +0 -43
  147. package/public/src/test/test/greatgrandchild.d.ts +0 -2
  148. package/public/src/test/test/greatgrandchild.d.ts.map +0 -1
  149. package/public/src/test/test/greatgrandchild.js +0 -36
  150. package/public/src/test/test/greatgrandchild.js.map +0 -1
  151. package/public/src/test/test/greatgrandchild.ts +0 -51
  152. package/public/src/test/test/parent.d.ts +0 -2
  153. package/public/src/test/test/parent.d.ts.map +0 -1
  154. package/public/src/test/test/parent.js +0 -25
  155. package/public/src/test/test/parent.js.map +0 -1
  156. package/public/src/test/test/parent.ts +0 -35
  157. package/public/src/test/test/testform.d.ts +0 -2
  158. package/public/src/test/test/testform.d.ts.map +0 -1
  159. package/public/src/test/test/testform.js +0 -1
  160. package/public/src/test/test/testform.js.map +0 -1
  161. package/public/src/test/test/testform.ts +0 -153
  162. package/public/src/test/test/testfunction.d.ts +0 -3
  163. package/public/src/test/test/testfunction.d.ts.map +0 -1
  164. package/public/src/test/test/testfunction.js +0 -7
  165. package/public/src/test/test/testfunction.js.map +0 -1
  166. package/public/src/test/test/testfunction.ts +0 -12
  167. package/public/src/test/test/testmc.d.ts +0 -3
  168. package/public/src/test/test/testmc.d.ts.map +0 -1
  169. package/public/src/test/test/testmc.js +0 -10
  170. package/public/src/test/test/testmc.js.map +0 -1
  171. package/public/src/test/test/testmc.ts +0 -16
  172. package/public/src/test/test/testsimpleclass.d.ts +0 -3
  173. package/public/src/test/test/testsimpleclass.d.ts.map +0 -1
  174. package/public/src/test/test/testsimpleclass.js +0 -9
  175. package/public/src/test/test/testsimpleclass.js.map +0 -1
  176. package/public/src/test/test/testsimpleclass.ts +0 -15
  177. package/public/src/test/test.d.ts +0 -2
  178. package/public/src/test/test.d.ts.map +0 -1
  179. package/public/src/test/test.js +0 -72
  180. package/public/src/test/test.js.map +0 -1
  181. package/public/src/test/test.ts +0 -176
  182. package/public/src/test/testform.css +0 -47
  183. package/public/src/test/testform.html +0 -56
  184. package/public/src/test/testform.json +0 -27
  185. package/public/test/MC.d.ts +0 -39
  186. package/public/test/MC.d.ts.map +0 -1
  187. package/public/test/MC.js +0 -287
  188. package/public/test/MC.min.js +0 -348
  189. package/public/test/MC.ts +0 -431
  190. package/public/test/MicroComponents.svg +0 -15
  191. package/public/test/elements.d.ts +0 -5
  192. package/public/test/elements.d.ts.map +0 -1
  193. package/public/test/elements.js +0 -68
  194. package/public/test/elements.min.js +0 -1
  195. package/public/test/elements.ts +0 -119
  196. package/public/test/formValues.d.ts +0 -3
  197. package/public/test/formValues.d.ts.map +0 -1
  198. package/public/test/formValues.js +0 -162
  199. package/public/test/formValues.min.js +0 -1
  200. package/public/test/formValues.ts +0 -225
  201. package/public/test/grandparent.css +0 -14
  202. package/public/test/helpers.d.ts +0 -14
  203. package/public/test/helpers.d.ts.map +0 -1
  204. package/public/test/helpers.js +0 -113
  205. package/public/test/helpers.ts +0 -149
  206. package/public/test/microcomponents.d.ts +0 -6
  207. package/public/test/microcomponents.d.ts.map +0 -1
  208. package/public/test/microcomponents.js +0 -7
  209. package/public/test/microcomponents.min.js +0 -1
  210. package/public/test/microcomponents.ts +0 -8
  211. package/public/test/myButton.css +0 -19
  212. package/public/test/observables.d.ts +0 -11
  213. package/public/test/observables.d.ts.map +0 -1
  214. package/public/test/observables.js +0 -244
  215. package/public/test/observables.min.js +0 -1
  216. package/public/test/observables.ts +0 -416
  217. package/public/test/style.css +0 -8
  218. package/public/test/test/child.d.ts +0 -2
  219. package/public/test/test/child.d.ts.map +0 -1
  220. package/public/test/test/child.js +0 -26
  221. package/public/test/test/child.js.map +0 -1
  222. package/public/test/test/child.ts +0 -36
  223. package/public/test/test/grandchild.d.ts +0 -2
  224. package/public/test/test/grandchild.d.ts.map +0 -1
  225. package/public/test/test/grandchild.js +0 -22
  226. package/public/test/test/grandchild.js.map +0 -1
  227. package/public/test/test/grandchild.ts +0 -31
  228. package/public/test/test/grandparent.d.ts +0 -2
  229. package/public/test/test/grandparent.d.ts.map +0 -1
  230. package/public/test/test/grandparent.js +0 -1
  231. package/public/test/test/grandparent.js.map +0 -1
  232. package/public/test/test/grandparent.ts +0 -43
  233. package/public/test/test/greatgrandchild.d.ts +0 -2
  234. package/public/test/test/greatgrandchild.d.ts.map +0 -1
  235. package/public/test/test/greatgrandchild.js +0 -36
  236. package/public/test/test/greatgrandchild.js.map +0 -1
  237. package/public/test/test/greatgrandchild.ts +0 -51
  238. package/public/test/test/parent.d.ts +0 -2
  239. package/public/test/test/parent.d.ts.map +0 -1
  240. package/public/test/test/parent.js +0 -25
  241. package/public/test/test/parent.js.map +0 -1
  242. package/public/test/test/parent.ts +0 -35
  243. package/public/test/test/testform.d.ts +0 -2
  244. package/public/test/test/testform.d.ts.map +0 -1
  245. package/public/test/test/testform.js +0 -1
  246. package/public/test/test/testform.js.map +0 -1
  247. package/public/test/test/testform.ts +0 -153
  248. package/public/test/test/testfunction.d.ts +0 -3
  249. package/public/test/test/testfunction.d.ts.map +0 -1
  250. package/public/test/test/testfunction.js +0 -7
  251. package/public/test/test/testfunction.js.map +0 -1
  252. package/public/test/test/testfunction.ts +0 -12
  253. package/public/test/test/testmc.d.ts +0 -3
  254. package/public/test/test/testmc.d.ts.map +0 -1
  255. package/public/test/test/testmc.js +0 -10
  256. package/public/test/test/testmc.js.map +0 -1
  257. package/public/test/test/testmc.ts +0 -16
  258. package/public/test/test/testsimpleclass.d.ts +0 -3
  259. package/public/test/test/testsimpleclass.d.ts.map +0 -1
  260. package/public/test/test/testsimpleclass.js +0 -9
  261. package/public/test/test/testsimpleclass.js.map +0 -1
  262. package/public/test/test/testsimpleclass.ts +0 -15
  263. package/public/test/test.d.ts +0 -2
  264. package/public/test/test.d.ts.map +0 -1
  265. package/public/test/test.html +0 -29
  266. package/public/test/test.js +0 -72
  267. package/public/test/test.js.map +0 -1
  268. package/public/test/test.ts +0 -176
  269. package/public/test/testform.css +0 -47
  270. package/public/test/testform.html +0 -56
  271. package/public/test/testform.json +0 -27
  272. package/public/typedoc/.nojekyll +0 -1
  273. package/public/typedoc/assets/highlight.css +0 -106
  274. package/public/typedoc/assets/icons.js +0 -18
  275. package/public/typedoc/assets/icons.svg +0 -1
  276. package/public/typedoc/assets/main.js +0 -60
  277. package/public/typedoc/assets/navigation.js +0 -1
  278. package/public/typedoc/assets/search.js +0 -1
  279. package/public/typedoc/assets/style.css +0 -1493
  280. package/public/typedoc/classes/MC.DC.html +0 -13
  281. package/public/typedoc/classes/MC.MC.html +0 -3
  282. package/public/typedoc/classes/MC.McBase.html +0 -3
  283. package/public/typedoc/functions/MC.autoload.html +0 -1
  284. package/public/typedoc/functions/MC.off.html +0 -1
  285. package/public/typedoc/functions/MC.on.html +0 -1
  286. package/public/typedoc/functions/MC.one.html +0 -1
  287. package/public/typedoc/functions/MC.trigger.html +0 -1
  288. package/public/typedoc/functions/elements.defineCE.html +0 -1
  289. package/public/typedoc/functions/elements.getCE.html +0 -1
  290. package/public/typedoc/functions/formValues.formValues.html +0 -1
  291. package/public/typedoc/functions/observables.observe.html +0 -1
  292. package/public/typedoc/hierarchy.html +0 -1
  293. package/public/typedoc/index.html +0 -122
  294. package/public/typedoc/interfaces/MC.HTMLMcElement.html +0 -758
  295. package/public/typedoc/media/MicroComponents.svg +0 -15
  296. package/public/typedoc/modules/MC.html +0 -10
  297. package/public/typedoc/modules/elements.html +0 -3
  298. package/public/typedoc/modules/formValues.html +0 -2
  299. package/public/typedoc/modules/observables.html +0 -3
  300. package/public/typedoc/modules.html +0 -5
  301. package/public/typedoc/types/observables.Observable.html +0 -1
  302. package/src/MC.ts +0 -431
  303. package/src/elements.ts +0 -119
  304. package/src/formValues.ts +0 -225
  305. package/src/helpers.ts +0 -149
  306. package/src/microcomponents.ts +0 -8
  307. package/src/observables.ts +0 -416
  308. package/src/selectors._ts +0 -1269
  309. package/src/test/grandparent.css +0 -14
  310. package/src/test/test/child.ts +0 -36
  311. package/src/test/test/grandchild.ts +0 -31
  312. package/src/test/test/grandparent.ts +0 -43
  313. package/src/test/test/greatgrandchild.ts +0 -51
  314. package/src/test/test/parent.ts +0 -35
  315. package/src/test/test/testform.ts +0 -153
  316. package/src/test/test/testfunction.ts +0 -12
  317. package/src/test/test/testmc.ts +0 -16
  318. package/src/test/test/testsimpleclass.ts +0 -15
  319. package/src/test/test.ts +0 -176
  320. package/src/test/testform.css +0 -47
  321. package/src/test/testform.html +0 -56
  322. package/src/test/testform.json +0 -27
  323. package/tasks.md +0 -36
  324. package/tsconfig.json +0 -107
  325. package/typedoc.json +0 -7
  326. package/webpack.config.js +0 -346
@@ -1,162 +0,0 @@
1
- 'use strict';
2
- import { copyGettersSetters } from './helpers.js';
3
- import { DC } 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((input) => {
106
- const name = input.getAttribute('name');
107
- if (name) {
108
- let handler = false;
109
- switch (getInputName(input)) {
110
- case 'input':
111
- switch (input.type) {
112
- case 'radio':
113
- handler = new RadioHandler(input);
114
- break;
115
- case 'checkbox':
116
- handler = new CheckboxHandler(input);
117
- break;
118
- default:
119
- handler = new InputHandler(input);
120
- }
121
- break;
122
- case 'select':
123
- handler = new SelectHandler(input);
124
- break;
125
- case 'textarea':
126
- handler = new TextAreaHandler(input);
127
- break;
128
- default:
129
- console.warn('handler missing:', name, 'for', input.tagName.toLowerCase(), input);
130
- break;
131
- }
132
- if (handler) {
133
- DC.add(input, 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
- input.addEventListener('input', (ev) => {
158
- targetObject[propertyName].notify();
159
- });
160
- });
161
- }
162
- //# sourceMappingURL=formValues.js.map
@@ -1 +0,0 @@
1
- !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.formValues=e():t.formValues=e()}(this,(()=>(()=>{"use strict";var t={d:(e,r)=>{for(var n in r)t.o(r,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:r[n]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function r(t){let e={};return[...Object.keys(t)].sort().forEach((n=>{var s;(s=t[n])&&s.constructor&&s.constructor===Object?e[n]=r(t[n]):e[n]=t[n]})),e}function n(t,e=!0){let s={};return[...Object.getOwnPropertyNames(t)].forEach((e=>{if(t[e]&&t[e].constructor&&t[e].constructor===Object){const r=n(t[e],!1);for(const t in r)s[e+"."+t]=r[t]}else s[e]=t[e]})),e?r(s):s}function s(t,e){return JSON.stringify(n(t))===JSON.stringify(n(e))}function o(t,e){let r;return()=>{clearTimeout(r),r=setTimeout((function(){t(...arguments)}),e)}}function a(t,e){const r=Object.getOwnPropertyDescriptors(t);for(const[t,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(e,t,n)}t.r(e),t.d(e,{formValues:()=>x});const c=new Function("try {return this===window;}catch(e){ return false;}");function l(t){return t&&t instanceof HTMLElement}function i(t){return"_mc"+t[0].toUpperCase()+t.substring(1)}function u(t,e,r,n=!1){return t.addEventListener(i(e),r,{capture:!1,once:n}),r}class f{stopped=!1;constructor(){}stop(){this.stopped=!0}}function d(t,e,r={},n="l",s){const o=/^_mc/.test(e)?e:i(e),a=s||new f,c=new CustomEvent(o,{detail:{data:r,control:a},bubbles:!1});a.stopped||(t.dispatchEvent(c),c.stopImmediatePropagation(),a.stopped||/[ud]/.test(n)&&(-1===n.indexOf("l")&&(n+="l"),setTimeout((()=>{if(n.indexOf("u")>-1){let e=t.parentElement?.closest("[data-mc]");e&&e?._mc.trigger(o,r,n,a)}if(n.indexOf("d")>-1){let e=t._mc.children();e&&e.forEach((t=>t.trigger(o,r,n,a)))}}),0)))}class h{_target;constructor(t){var e;this._target=new WeakRef(t||{}),e=this,setTimeout((()=>{e.constructor!==p&&e.trigger("Init")}),0),function(t){if(!c()||t.constructor===p)return;const e=t.target;if(e instanceof HTMLElement){let r=t;Object.getOwnPropertyNames(r.constructor.prototype).filter((t=>/^on[A-Z]|one[A-Z]/.test(t)&&"function"==typeof r.constructor.prototype[t])).forEach((t=>{let n=/^one/.test(t),s=t.replace(/^on[e]{0,1}/,""),o=s.toLowerCase();if("on"+o in e){let n=e=>{r[t](e)};e.addEventListener(o,n)}else u(e,s,(e=>{r[t](e)}),n)}))}}(this)}get target(){return this._target.deref()}}class p extends h{constructor(t){super(t)}static add(t,e,r={}){return function(t,e,r={}){let n=t;n._mc||(n._mc=new p(t));const s=n._mc;return e.length&&!s[e]&&(s[e]=r,t instanceof HTMLElement&&!t.getAttribute("data-mc")&&t.setAttribute("data-mc","")),n}(t,e,r)}static remove(t,e){!function(t,e){if(!e)return;const r=t?._mc||{};r&&r[e]&&delete r[e],!Object.keys(r).length&&t instanceof HTMLElement&&t.hasAttribute("data-mc")&&t.removeAttribute("data-mc")}(t,e)}off(t,e){!function(t,e,r){t.removeEventListener(i(e),r)}(this.target,t,e)}on(t,e){return u(this.target,t,e)}one(t,e){return function(t,e,r){return u(t,e,r,!0),r}(this.target,t,e)}trigger(t,e={},r="l",n){d(this.target,t,e,r,n)}ancestors(){let t=this?.target,e=[];if(!l(t))return[];for(;t=t.closest("[data-mc]");)t?._mc&&e.push(t?._mc);return e.length?e:null}closest(){let t=this.target;return l(t)&&t.closest("[data-mc]")?._mc||null}children(){let t=this?.target;return l(t)?function(t){const e=Math.random().toString().replace(".",""),r='[data-mc]:not([temp_id="'+e+'"] [data-mc] [data-mc])';t.setAttribute("temp_id",e);const n=[...t.querySelectorAll(r)].filter((t=>!!t._mc)).map((t=>t._mc));return t.removeAttribute("temp_id"),n.length?n:null}(t):null}descendants(){const t=this?.target;if(!l(t))return[];const e=[...t.querySelectorAll("[data-mc]")].filter((t=>!!t._mc)).map((t=>t._mc));return e.length?e:null}}function m(t){return null!=t&&"object"==typeof t}function g(t){let e=new Set,r=/\{[^\{\}]*\}/g;return(t.getAttributeNames?t.getAttributeNames():[]).filter((e=>t.getAttribute(e)?.match(r))).forEach((e=>{let n=new Set(t.getAttribute(e)?.match(r));n.forEach((t=>n.add(t.replace(/[\{\}]/g,""))))})),[...t.childNodes].filter((t=>3===t.nodeType&&(t.nodeValue||"").match(r))).forEach((t=>{(t.nodeValue||"").match(r).forEach((t=>{e.add(t.replace(/[\{\}]/g,""))}))})),[...e].map((t=>t.replace(/[\{\}]/g,"")))}new Set;const b=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class y extends p{data={};oldDisplay="";constructor(t){super(t),g(t).forEach((t=>this.data[t]="")),E(this),this.#t()}#t(){let t=this.target,e=!1;(t.getAttributeNames?t.getAttributeNames():[]).filter((e=>t.getAttribute(e)?.match(/\{[^\{\}]*\}/g))).forEach((e=>{let r=new Set(t.getAttribute(e)?.match(/\{[^\{\}]*\}/g));var n;this.data.observe((n=t.getAttribute(e),s=>{let o=n;r.forEach((t=>{o=o.replace(t,s[t.replace(/[\{\}]/g,"")])})),t.setAttribute(e,o)}))})),[...t.childNodes].filter((t=>3===t.nodeType&&(t.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((r=>{e=!0;let n=new Set(r.nodeValue.match(/\{[^\{\}]*\}/g));this.data.observe((e=>s=>{let o=e;n.forEach((t=>{o=o.replace(t,s[t.replace(/[\{\}]/g,"")])})),this.oldDisplay?t.style=this.oldDisplay:t.removeAttribute("style"),delete this.oldDisplay,r.nodeValue=o})(r.nodeValue)),this.oldDisplay=t.getAttribute("style")||"",e&&!b.includes(t.constructor)&&"FIELDSET"!==t.tagName&&(t.style.display="none")}))}onData(t){let e={};Object.keys(t.detail.data).forEach((r=>{this.data.hasOwnProperty(r)&&(e[r]=t.detail.data[r])})),JSON.stringify(e)!==JSON.stringify(this.data)&&Object.assign(this.data,e)}}const v={};function O(t){let e=t.constructor.name;return v[e]||function(t){const e=t.constructor,r=e.name;let s=class extends e{#e=!0;#r=[];constructor(t){super(t),this.constructor.callbacks=[],m(t)&&Object.getOwnPropertyNames(t).forEach((e=>{this[e]=t[e]}))}get callbacks(){return this.#r}set callbacks(t){this.#r=t}observe(t){return this.#r.push(t),this}bind(t){if(m(this.valueOf())){!function(t){var e;(e=t,[e].concat([...e.querySelectorAll("*")]).filter((t=>!!g(t).length)).filter((t=>"STYLE"!==t?.tagName)).reverse()).forEach((t=>{t?._mc?._placeholders||p.add(t,"_placeholders",new y(t))}))}(t);const e=[t,...t.querySelectorAll("[data-mc]")].filter((t=>!!t?._mc?._placeholders)),r=function(t){let r=n(t);e.forEach((t=>{t&&d(t,"data",r)}))};this.#r.push(r),this.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof this.valueOf(),this);return this}notify(t){let e=m(this.valueOf())&&this.valueOf()instanceof Array==0?structuredClone(Object.assign({},this)):this.valueOf();return void 0!==t&&(this.#e=t),this.#r.forEach((t=>{t(e)})),this}};return v[r]=s,s}(t)}const E=(t,e)=>((e?[e]:[...Object.getOwnPropertyNames(t)]).forEach((e=>{if(t.hasOwnProperty(e)&&"function"!=typeof t[e]&&!t?.[e]?.constructor?.prototype?.observe){if("_"===e[0]||void 0===t?.[e])return t;let r=t[e],n=new(O(r))(r);Object.defineProperty(t,e,{enumerable:!0,get(){if(m(n.valueOf())){let t=structuredClone(Object.assign({},n));setTimeout(o((function(){s(structuredClone(Object.assign({},n)),t)||n.notify()}),0),0)}return n},set(t){if(typeof t==typeof n.valueOf())if(m(n.valueOf())&&n.valueOf()instanceof Array==0){let e=structuredClone(Object.assign({},n));void 0===n?.constructor?.prototype?.observe&&(n=new(O(t))(structuredClone(Object.assign({},t))),a(t,n),n.seal()),Object.assign(n,t),setTimeout(o((function(){s(structuredClone(Object.assign({},n)),e)||n.notify()}),0),0)}else{let e=n.valueOf(),r=n.callbacks;t!==e&&(n=new(O(t))(t),n.callbacks=r,n.notify())}else console.warn("IGNORED - cannot change observable types, IS:",typeof n.valueOf(),n,"- CANNOT BECOME:",typeof t)}}),t[e]=r}})),t);class w{constructor(t){}}class A extends w{#n;constructor(t){super(t),this.#n=t}get val(){return new FormData(this.#n.form).get(this.#n.name)}set val(t){[...this.#n.form.querySelectorAll(`input[type="radio"][name="${this.#n.name}"]`)].filter((e=>e.getAttribute("value")===t)).shift().checked=!0}}class j extends w{#n;constructor(t){super(t),this.#n=t}get val(){return this.#n.checked}set val(t){this.#n.checked=t}}class S extends w{#n;constructor(t){super(t),this.#n=t}get val(){return this.#n.value}set val(t){this.#n.value=t}}class _ extends w{#n;#s=!1;constructor(t){super(t),this.#n=t,this.#s=t.multiple}get val(){const t=[];return[...this.#n.querySelectorAll("option")].filter((t=>t.selected)).forEach((e=>{t.push(e.value)})),this.#s?t:t.length?t[0]:""}set val(t){t="string"==typeof t?[t]:t,[...this.#n.querySelectorAll("option")].forEach((e=>{t.indexOf(e.value)>-1?e.selected=!0:e.selected=!1}))}}class k extends w{#n;constructor(t){super(t),this.#n=t}get val(){return this.#n.value||""}set val(t){this.#n.value=t}}const N=t=>{let e=[...(t||document).querySelectorAll("input,select,textarea")],r={};return e.forEach((t=>{const e=t.getAttribute("name");if(e){let n=!1;switch((t=>t.tagName.toLowerCase())(t)){case"input":switch(t.type){case"radio":n=new A(t);break;case"checkbox":n=new j(t);break;default:n=new S(t)}break;case"select":n=new _(t);break;case"textarea":n=new k(t);break;default:console.warn("handler missing:",e,"for",t.tagName.toLowerCase(),t)}n&&(p.add(t,e,n),Object.defineProperty(r,e,{enumerable:!0,configurable:!0,get:()=>n.val,set:t=>{n.val!==t&&(n.val=t)}}))}})),r};function x(t,e,r){let n=N(r);t[e]=Object.assign({},n),E(t,e),a(n,t[e]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{r.addEventListener("input",(r=>{t[e].notify()}))}))}return e})()));
@@ -1,225 +0,0 @@
1
- 'use strict';
2
-
3
- import { LooseObject, copyGettersSetters } from './helpers.js';
4
- import { DC, on } from './MC.js';
5
- import { observe } from './observables.js';
6
-
7
- type inputTypes = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
8
-
9
- const getInputName = (
10
- e: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement
11
- ): string => {
12
- return e.tagName.toLowerCase();
13
- };
14
-
15
- abstract class InputBase {
16
- constructor(e: inputTypes) {}
17
-
18
- abstract get val(): any;
19
-
20
- abstract set val(value: any);
21
- }
22
-
23
- class RadioHandler extends InputBase {
24
- #e: HTMLInputElement;
25
-
26
- constructor(e: HTMLInputElement) {
27
- super(e);
28
- this.#e = e;
29
- }
30
-
31
- get val(): string {
32
- let ret = new FormData(this.#e.form as HTMLFormElement).get(this.#e.name);
33
-
34
- //console.log('radio[', this.#e.name, '] = "' + ret + '"');
35
- return ret as string;
36
- }
37
-
38
- set val(value: string) {
39
- let arr = [
40
- ...(this.#e.form as HTMLFormElement).querySelectorAll(
41
- `input[type="radio"][name="${this.#e.name}"]`
42
- ),
43
- ] as HTMLInputElement[];
44
-
45
- (
46
- arr
47
- .filter((e) => e.getAttribute('value') === value)
48
- .shift() as HTMLInputElement
49
- ).checked = true;
50
- }
51
- }
52
-
53
- class CheckboxHandler extends InputBase {
54
- #e: HTMLInputElement;
55
-
56
- constructor(e: HTMLInputElement) {
57
- super(e);
58
- this.#e = e;
59
- }
60
-
61
- get val(): boolean {
62
- return this.#e.checked;
63
- }
64
-
65
- set val(value: boolean) {
66
- this.#e.checked = value;
67
- }
68
- }
69
-
70
- class InputHandler extends InputBase {
71
- #e: HTMLInputElement;
72
-
73
- constructor(e: HTMLInputElement) {
74
- super(e);
75
- this.#e = e;
76
- }
77
-
78
- get val(): string {
79
- return this.#e.value;
80
- }
81
-
82
- set val(value: string) {
83
- this.#e.value = value;
84
- }
85
- }
86
-
87
- class SelectHandler extends InputBase {
88
- #e: HTMLSelectElement;
89
- #multi: boolean = false;
90
-
91
- constructor(e: HTMLSelectElement) {
92
- super(e);
93
- this.#e = e;
94
- this.#multi = e.multiple;
95
- }
96
-
97
- get val(): string[] | string {
98
- const that = this,
99
- ret: string[] = [];
100
-
101
- // get all options
102
- [...that.#e.querySelectorAll('option')]
103
- .filter((o) => o.selected)
104
- .forEach((o) => {
105
- ret.push(o.value);
106
- });
107
-
108
- if (this.#multi) return ret;
109
- return ret.length ? ret[0] : '';
110
- }
111
-
112
- set val(value: string[] | string) {
113
- const that = this;
114
-
115
- value = typeof value === 'string' ? [value] : value;
116
-
117
- // set all options
118
- [...that.#e.querySelectorAll('option')].forEach((o) => {
119
- if (value.indexOf(o.value) > -1) {
120
- o.selected = true;
121
- } else {
122
- o.selected = false;
123
- }
124
- });
125
- }
126
- }
127
-
128
- class TextAreaHandler extends InputBase {
129
- #e: HTMLTextAreaElement;
130
- constructor(e: HTMLTextAreaElement) {
131
- super(e);
132
- this.#e = e;
133
- }
134
-
135
- get val(): string {
136
- return this.#e.value || '';
137
- }
138
-
139
- set val(value: string) {
140
- this.#e.value = value;
141
- }
142
- }
143
-
144
- const getInputHandlers = (e: HTMLElement | ShadowRoot): LooseObject => {
145
- let inputList = [
146
- ...(e || document).querySelectorAll('input,select,textarea'),
147
- ],
148
- handlers: LooseObject = {};
149
-
150
- inputList.forEach((input) => {
151
- const name: string | null = (input as inputTypes).getAttribute('name');
152
- if (name) {
153
- let handler: any = false;
154
- switch (getInputName(input as inputTypes)) {
155
- case 'input':
156
- switch ((input as HTMLInputElement).type) {
157
- case 'radio':
158
- handler = new RadioHandler(input as HTMLInputElement);
159
- break;
160
- case 'checkbox':
161
- handler = new CheckboxHandler(input as HTMLInputElement);
162
- break;
163
- default:
164
- handler = new InputHandler(input as HTMLInputElement);
165
- }
166
- break;
167
- case 'select':
168
- handler = new SelectHandler(input as HTMLSelectElement);
169
- break;
170
- case 'textarea':
171
- handler = new TextAreaHandler(input as HTMLTextAreaElement);
172
- break;
173
- default:
174
- console.warn(
175
- 'handler missing:',
176
- name,
177
- 'for',
178
- input.tagName.toLowerCase(),
179
- input
180
- );
181
- break;
182
- }
183
-
184
- if (handler) {
185
- DC.add(input as HTMLElement, name, handler);
186
- Object.defineProperty(handlers, name, {
187
- enumerable: true,
188
- configurable: true,
189
- get: (): any => {
190
- return handler.val;
191
- },
192
- set: (value: any) => {
193
- if (handler.val !== value) {
194
- handler.val = value;
195
- }
196
- },
197
- });
198
- }
199
- }
200
- });
201
-
202
- return handlers;
203
- };
204
-
205
- export function formValues(
206
- targetObject: LooseObject,
207
- propertyName: string,
208
- dom: HTMLElement | ShadowRoot
209
- ) {
210
- let handlers = getInputHandlers(dom);
211
-
212
- targetObject[propertyName] = Object.assign({}, handlers);
213
-
214
- observe(targetObject, propertyName);
215
-
216
- copyGettersSetters(handlers, targetObject[propertyName]);
217
-
218
- [...dom.querySelectorAll('input, textarea, select')].forEach((input) => {
219
- input.addEventListener('input', (ev) => {
220
- //console.log('input event', input, ev);
221
- targetObject[propertyName].notify();
222
- });
223
- });
224
- }
225
-
@@ -1,14 +0,0 @@
1
- test-grandparent,
2
- test-parent,
3
- test-child,
4
- test-grandchild,
5
- test-greatgrandchild {
6
- user-select: none;
7
- caret-color: transparent;
8
-
9
- display: inline-block;
10
- padding: 1px;
11
- margin: 1px;
12
- border: 1px solid darkslategray;
13
- border-radius: 2px;
14
- }
@@ -1,14 +0,0 @@
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
@@ -1 +0,0 @@
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"}
@@ -1,113 +0,0 @@
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