@twobirds/microcomponents 0.1.1 → 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 (324) hide show
  1. package/dist/MC.min.js +33 -52
  2. package/dist/elements.min.js +1 -1
  3. package/dist/formValues.min.js +1 -1
  4. package/dist/microcomponents.min.js +1 -1
  5. package/dist/observables.min.js +1 -1
  6. package/package.json +11 -2
  7. package/.gitlab-ci.yml +0 -18
  8. package/.vscode/settings.json +0 -3
  9. package/MicroComponents.svg +0 -15
  10. package/assets/documentation/MC.md +0 -547
  11. package/assets/documentation/MicroComponents.svg +0 -15
  12. package/assets/documentation/ajaxian-1.png +0 -0
  13. package/assets/documentation/ajaxian-2.png +0 -0
  14. package/assets/documentation/ajaxian-3.png +0 -0
  15. package/assets/documentation/elements.md +0 -277
  16. package/assets/documentation/formvalues.md +0 -25
  17. package/assets/documentation/functional_requirements.md +0 -8
  18. package/assets/documentation/history.md +0 -436
  19. package/assets/documentation/klemmstein.png +0 -0
  20. package/assets/documentation/magic.md +0 -29
  21. package/assets/documentation/observables.md +0 -187
  22. package/assets/documentation/rnd0023-1.jpg +0 -0
  23. package/assets/documentation/rnd0023-2.jpg +0 -0
  24. package/assets/documentation/rnd0023-3.jpg +0 -0
  25. package/assets/documentation/tB_react.md +0 -207
  26. package/assets/documentation/usage.md +0 -142
  27. package/assets/documentation/why.md +0 -25
  28. package/assets/fiddle/MicroComponents.svg +0 -15
  29. package/assets/fiddle/fiddle.css +0 -0
  30. package/assets/fiddle/fiddle.js +0 -0
  31. package/assets/fiddle/index.html +0 -0
  32. package/assets/test/MicroComponents.svg +0 -15
  33. package/assets/test/grandparent.css +0 -16
  34. package/assets/test/myButton.css +0 -19
  35. package/assets/test/style.css +0 -8
  36. package/assets/test/test.html +0 -29
  37. package/assets/test/testform.json +0 -27
  38. package/public/.nojekyll +0 -1
  39. package/public/MC.d.ts +0 -39
  40. package/public/MC.d.ts.map +0 -1
  41. package/public/MC.js +0 -287
  42. package/public/MC.js.map +0 -1
  43. package/public/MC.min.js +0 -348
  44. package/public/MC.ts +0 -431
  45. package/public/MicroComponents.svg +0 -15
  46. package/public/documentation/MC.md +0 -547
  47. package/public/documentation/MicroComponents.svg +0 -15
  48. package/public/documentation/ajaxian-1.png +0 -0
  49. package/public/documentation/ajaxian-2.png +0 -0
  50. package/public/documentation/ajaxian-3.png +0 -0
  51. package/public/documentation/elements.md +0 -277
  52. package/public/documentation/formvalues.md +0 -25
  53. package/public/documentation/functional_requirements.md +0 -8
  54. package/public/documentation/history.md +0 -436
  55. package/public/documentation/klemmstein.png +0 -0
  56. package/public/documentation/magic.md +0 -29
  57. package/public/documentation/observables.md +0 -187
  58. package/public/documentation/rnd0023-1.jpg +0 -0
  59. package/public/documentation/rnd0023-2.jpg +0 -0
  60. package/public/documentation/rnd0023-3.jpg +0 -0
  61. package/public/documentation/tB_react.md +0 -207
  62. package/public/documentation/usage.md +0 -142
  63. package/public/documentation/why.md +0 -25
  64. package/public/elements.d.ts +0 -5
  65. package/public/elements.d.ts.map +0 -1
  66. package/public/elements.js +0 -68
  67. package/public/elements.js.map +0 -1
  68. package/public/elements.min.js +0 -1
  69. package/public/elements.ts +0 -119
  70. package/public/fiddle/MicroComponents.svg +0 -15
  71. package/public/fiddle/fiddle.css +0 -0
  72. package/public/fiddle/fiddle.js +0 -0
  73. package/public/fiddle/index.html +0 -0
  74. package/public/formValues.d.ts +0 -3
  75. package/public/formValues.d.ts.map +0 -1
  76. package/public/formValues.js +0 -162
  77. package/public/formValues.js.map +0 -1
  78. package/public/formValues.min.js +0 -1
  79. package/public/formValues.ts +0 -225
  80. package/public/helpers.d.ts +0 -14
  81. package/public/helpers.d.ts.map +0 -1
  82. package/public/helpers.js +0 -113
  83. package/public/helpers.js.map +0 -1
  84. package/public/helpers.ts +0 -149
  85. package/public/microcomponents.d.ts +0 -6
  86. package/public/microcomponents.d.ts.map +0 -1
  87. package/public/microcomponents.js +0 -7
  88. package/public/microcomponents.js.map +0 -1
  89. package/public/microcomponents.min.js +0 -1
  90. package/public/microcomponents.ts +0 -8
  91. package/public/observables.d.ts +0 -11
  92. package/public/observables.d.ts.map +0 -1
  93. package/public/observables.js +0 -244
  94. package/public/observables.js.map +0 -1
  95. package/public/observables.min.js +0 -1
  96. package/public/observables.ts +0 -416
  97. package/public/selectors._ts +0 -1269
  98. package/public/src/MC.d.ts +0 -39
  99. package/public/src/MC.d.ts.map +0 -1
  100. package/public/src/MC.js +0 -287
  101. package/public/src/MC.js.map +0 -1
  102. package/public/src/MC.ts +0 -431
  103. package/public/src/elements.d.ts +0 -5
  104. package/public/src/elements.d.ts.map +0 -1
  105. package/public/src/elements.js +0 -68
  106. package/public/src/elements.js.map +0 -1
  107. package/public/src/elements.ts +0 -119
  108. package/public/src/formValues.d.ts +0 -3
  109. package/public/src/formValues.d.ts.map +0 -1
  110. package/public/src/formValues.js +0 -162
  111. package/public/src/formValues.js.map +0 -1
  112. package/public/src/formValues.ts +0 -225
  113. package/public/src/helpers.d.ts +0 -14
  114. package/public/src/helpers.d.ts.map +0 -1
  115. package/public/src/helpers.js +0 -113
  116. package/public/src/helpers.js.map +0 -1
  117. package/public/src/helpers.ts +0 -149
  118. package/public/src/microcomponents.d.ts +0 -6
  119. package/public/src/microcomponents.d.ts.map +0 -1
  120. package/public/src/microcomponents.js +0 -7
  121. package/public/src/microcomponents.js.map +0 -1
  122. package/public/src/microcomponents.ts +0 -8
  123. package/public/src/observables.d.ts +0 -11
  124. package/public/src/observables.d.ts.map +0 -1
  125. package/public/src/observables.js +0 -244
  126. package/public/src/observables.js.map +0 -1
  127. package/public/src/observables.ts +0 -416
  128. package/public/src/selectors._ts +0 -1269
  129. package/public/src/test/grandparent.css +0 -14
  130. package/public/src/test/test/child.d.ts +0 -2
  131. package/public/src/test/test/child.d.ts.map +0 -1
  132. package/public/src/test/test/child.js +0 -26
  133. package/public/src/test/test/child.js.map +0 -1
  134. package/public/src/test/test/child.ts +0 -36
  135. package/public/src/test/test/grandchild.d.ts +0 -2
  136. package/public/src/test/test/grandchild.d.ts.map +0 -1
  137. package/public/src/test/test/grandchild.js +0 -22
  138. package/public/src/test/test/grandchild.js.map +0 -1
  139. package/public/src/test/test/grandchild.ts +0 -31
  140. package/public/src/test/test/grandparent.d.ts +0 -2
  141. package/public/src/test/test/grandparent.d.ts.map +0 -1
  142. package/public/src/test/test/grandparent.js +0 -1
  143. package/public/src/test/test/grandparent.js.map +0 -1
  144. package/public/src/test/test/grandparent.ts +0 -43
  145. package/public/src/test/test/greatgrandchild.d.ts +0 -2
  146. package/public/src/test/test/greatgrandchild.d.ts.map +0 -1
  147. package/public/src/test/test/greatgrandchild.js +0 -36
  148. package/public/src/test/test/greatgrandchild.js.map +0 -1
  149. package/public/src/test/test/greatgrandchild.ts +0 -51
  150. package/public/src/test/test/parent.d.ts +0 -2
  151. package/public/src/test/test/parent.d.ts.map +0 -1
  152. package/public/src/test/test/parent.js +0 -25
  153. package/public/src/test/test/parent.js.map +0 -1
  154. package/public/src/test/test/parent.ts +0 -35
  155. package/public/src/test/test/testform.d.ts +0 -2
  156. package/public/src/test/test/testform.d.ts.map +0 -1
  157. package/public/src/test/test/testform.js +0 -1
  158. package/public/src/test/test/testform.js.map +0 -1
  159. package/public/src/test/test/testform.ts +0 -153
  160. package/public/src/test/test/testfunction.d.ts +0 -3
  161. package/public/src/test/test/testfunction.d.ts.map +0 -1
  162. package/public/src/test/test/testfunction.js +0 -7
  163. package/public/src/test/test/testfunction.js.map +0 -1
  164. package/public/src/test/test/testfunction.ts +0 -12
  165. package/public/src/test/test/testmc.d.ts +0 -3
  166. package/public/src/test/test/testmc.d.ts.map +0 -1
  167. package/public/src/test/test/testmc.js +0 -10
  168. package/public/src/test/test/testmc.js.map +0 -1
  169. package/public/src/test/test/testmc.ts +0 -16
  170. package/public/src/test/test/testsimpleclass.d.ts +0 -3
  171. package/public/src/test/test/testsimpleclass.d.ts.map +0 -1
  172. package/public/src/test/test/testsimpleclass.js +0 -9
  173. package/public/src/test/test/testsimpleclass.js.map +0 -1
  174. package/public/src/test/test/testsimpleclass.ts +0 -15
  175. package/public/src/test/test.d.ts +0 -2
  176. package/public/src/test/test.d.ts.map +0 -1
  177. package/public/src/test/test.js +0 -72
  178. package/public/src/test/test.js.map +0 -1
  179. package/public/src/test/test.ts +0 -176
  180. package/public/src/test/testform.css +0 -47
  181. package/public/src/test/testform.html +0 -56
  182. package/public/src/test/testform.json +0 -27
  183. package/public/test/MC.d.ts +0 -39
  184. package/public/test/MC.d.ts.map +0 -1
  185. package/public/test/MC.js +0 -287
  186. package/public/test/MC.min.js +0 -348
  187. package/public/test/MC.ts +0 -431
  188. package/public/test/MicroComponents.svg +0 -15
  189. package/public/test/elements.d.ts +0 -5
  190. package/public/test/elements.d.ts.map +0 -1
  191. package/public/test/elements.js +0 -68
  192. package/public/test/elements.min.js +0 -1
  193. package/public/test/elements.ts +0 -119
  194. package/public/test/formValues.d.ts +0 -3
  195. package/public/test/formValues.d.ts.map +0 -1
  196. package/public/test/formValues.js +0 -162
  197. package/public/test/formValues.min.js +0 -1
  198. package/public/test/formValues.ts +0 -225
  199. package/public/test/grandparent.css +0 -14
  200. package/public/test/helpers.d.ts +0 -14
  201. package/public/test/helpers.d.ts.map +0 -1
  202. package/public/test/helpers.js +0 -113
  203. package/public/test/helpers.ts +0 -149
  204. package/public/test/microcomponents.d.ts +0 -6
  205. package/public/test/microcomponents.d.ts.map +0 -1
  206. package/public/test/microcomponents.js +0 -7
  207. package/public/test/microcomponents.min.js +0 -1
  208. package/public/test/microcomponents.ts +0 -8
  209. package/public/test/myButton.css +0 -19
  210. package/public/test/observables.d.ts +0 -11
  211. package/public/test/observables.d.ts.map +0 -1
  212. package/public/test/observables.js +0 -244
  213. package/public/test/observables.min.js +0 -1
  214. package/public/test/observables.ts +0 -416
  215. package/public/test/style.css +0 -8
  216. package/public/test/test/child.d.ts +0 -2
  217. package/public/test/test/child.d.ts.map +0 -1
  218. package/public/test/test/child.js +0 -26
  219. package/public/test/test/child.js.map +0 -1
  220. package/public/test/test/child.ts +0 -36
  221. package/public/test/test/grandchild.d.ts +0 -2
  222. package/public/test/test/grandchild.d.ts.map +0 -1
  223. package/public/test/test/grandchild.js +0 -22
  224. package/public/test/test/grandchild.js.map +0 -1
  225. package/public/test/test/grandchild.ts +0 -31
  226. package/public/test/test/grandparent.d.ts +0 -2
  227. package/public/test/test/grandparent.d.ts.map +0 -1
  228. package/public/test/test/grandparent.js +0 -1
  229. package/public/test/test/grandparent.js.map +0 -1
  230. package/public/test/test/grandparent.ts +0 -43
  231. package/public/test/test/greatgrandchild.d.ts +0 -2
  232. package/public/test/test/greatgrandchild.d.ts.map +0 -1
  233. package/public/test/test/greatgrandchild.js +0 -36
  234. package/public/test/test/greatgrandchild.js.map +0 -1
  235. package/public/test/test/greatgrandchild.ts +0 -51
  236. package/public/test/test/parent.d.ts +0 -2
  237. package/public/test/test/parent.d.ts.map +0 -1
  238. package/public/test/test/parent.js +0 -25
  239. package/public/test/test/parent.js.map +0 -1
  240. package/public/test/test/parent.ts +0 -35
  241. package/public/test/test/testform.d.ts +0 -2
  242. package/public/test/test/testform.d.ts.map +0 -1
  243. package/public/test/test/testform.js +0 -1
  244. package/public/test/test/testform.js.map +0 -1
  245. package/public/test/test/testform.ts +0 -153
  246. package/public/test/test/testfunction.d.ts +0 -3
  247. package/public/test/test/testfunction.d.ts.map +0 -1
  248. package/public/test/test/testfunction.js +0 -7
  249. package/public/test/test/testfunction.js.map +0 -1
  250. package/public/test/test/testfunction.ts +0 -12
  251. package/public/test/test/testmc.d.ts +0 -3
  252. package/public/test/test/testmc.d.ts.map +0 -1
  253. package/public/test/test/testmc.js +0 -10
  254. package/public/test/test/testmc.js.map +0 -1
  255. package/public/test/test/testmc.ts +0 -16
  256. package/public/test/test/testsimpleclass.d.ts +0 -3
  257. package/public/test/test/testsimpleclass.d.ts.map +0 -1
  258. package/public/test/test/testsimpleclass.js +0 -9
  259. package/public/test/test/testsimpleclass.js.map +0 -1
  260. package/public/test/test/testsimpleclass.ts +0 -15
  261. package/public/test/test.d.ts +0 -2
  262. package/public/test/test.d.ts.map +0 -1
  263. package/public/test/test.html +0 -29
  264. package/public/test/test.js +0 -72
  265. package/public/test/test.js.map +0 -1
  266. package/public/test/test.ts +0 -176
  267. package/public/test/testform.css +0 -47
  268. package/public/test/testform.html +0 -56
  269. package/public/test/testform.json +0 -27
  270. package/public/typedoc/.nojekyll +0 -1
  271. package/public/typedoc/assets/highlight.css +0 -106
  272. package/public/typedoc/assets/icons.js +0 -18
  273. package/public/typedoc/assets/icons.svg +0 -1
  274. package/public/typedoc/assets/main.js +0 -60
  275. package/public/typedoc/assets/navigation.js +0 -1
  276. package/public/typedoc/assets/search.js +0 -1
  277. package/public/typedoc/assets/style.css +0 -1493
  278. package/public/typedoc/classes/MC.DC.html +0 -13
  279. package/public/typedoc/classes/MC.MC.html +0 -3
  280. package/public/typedoc/classes/MC.McBase.html +0 -3
  281. package/public/typedoc/functions/MC.autoload.html +0 -1
  282. package/public/typedoc/functions/MC.off.html +0 -1
  283. package/public/typedoc/functions/MC.on.html +0 -1
  284. package/public/typedoc/functions/MC.one.html +0 -1
  285. package/public/typedoc/functions/MC.trigger.html +0 -1
  286. package/public/typedoc/functions/elements.defineCE.html +0 -1
  287. package/public/typedoc/functions/elements.getCE.html +0 -1
  288. package/public/typedoc/functions/formValues.formValues.html +0 -1
  289. package/public/typedoc/functions/observables.observe.html +0 -1
  290. package/public/typedoc/hierarchy.html +0 -1
  291. package/public/typedoc/index.html +0 -122
  292. package/public/typedoc/interfaces/MC.HTMLMcElement.html +0 -758
  293. package/public/typedoc/media/MicroComponents.svg +0 -15
  294. package/public/typedoc/modules/MC.html +0 -10
  295. package/public/typedoc/modules/elements.html +0 -3
  296. package/public/typedoc/modules/formValues.html +0 -2
  297. package/public/typedoc/modules/observables.html +0 -3
  298. package/public/typedoc/modules.html +0 -5
  299. package/public/typedoc/types/observables.Observable.html +0 -1
  300. package/src/MC.ts +0 -431
  301. package/src/elements.ts +0 -119
  302. package/src/formValues.ts +0 -225
  303. package/src/helpers.ts +0 -149
  304. package/src/microcomponents.ts +0 -8
  305. package/src/observables.ts +0 -416
  306. package/src/selectors._ts +0 -1269
  307. package/src/test/grandparent.css +0 -14
  308. package/src/test/test/child.ts +0 -36
  309. package/src/test/test/grandchild.ts +0 -31
  310. package/src/test/test/grandparent.ts +0 -43
  311. package/src/test/test/greatgrandchild.ts +0 -51
  312. package/src/test/test/parent.ts +0 -35
  313. package/src/test/test/testform.ts +0 -153
  314. package/src/test/test/testfunction.ts +0 -12
  315. package/src/test/test/testmc.ts +0 -16
  316. package/src/test/test/testsimpleclass.ts +0 -15
  317. package/src/test/test.ts +0 -176
  318. package/src/test/testform.css +0 -47
  319. package/src/test/testform.html +0 -56
  320. package/src/test/testform.json +0 -27
  321. package/tasks.md +0 -36
  322. package/tsconfig.json +0 -107
  323. package/typedoc.json +0 -7
  324. 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)))}}),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