x4js 1.6.5 → 2.0.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 (292) hide show
  1. package/README.md +3 -14
  2. package/lib/README.txt +3 -14
  3. package/lib/esm/x4.css +1 -0
  4. package/lib/esm/x4.js +1 -0
  5. package/lib/src/assets/house-light.svg +1 -0
  6. package/lib/src/assets/radio.svg +4 -0
  7. package/lib/src/components/base.scss +26 -0
  8. package/lib/src/components/boxes/boxes.module.scss +37 -0
  9. package/lib/src/components/boxes/boxes.ts +125 -0
  10. package/lib/src/components/btngroup/btngroup.module.scss +29 -0
  11. package/lib/src/components/btngroup/btngroup.ts +106 -0
  12. package/lib/src/components/button/button.module.scss +154 -0
  13. package/lib/src/components/button/button.ts +117 -0
  14. package/lib/src/components/calendar/calendar-check-sharp-light.svg +1 -0
  15. package/lib/src/components/calendar/calendar.module.scss +163 -0
  16. package/lib/src/{calendar.ts → components/calendar/calendar.ts} +81 -83
  17. package/lib/src/components/calendar/chevron-left-sharp-light.svg +1 -0
  18. package/lib/src/components/calendar/chevron-right-sharp-light.svg +1 -0
  19. package/lib/src/components/checkbox/check.svg +4 -0
  20. package/lib/src/components/checkbox/checkbox.module.scss +142 -0
  21. package/lib/src/components/checkbox/checkbox.ts +125 -0
  22. package/lib/src/components/colorinput/colorinput.module.scss +65 -0
  23. package/lib/src/components/colorinput/colorinput.ts +88 -0
  24. package/lib/src/components/colorinput/crosshairs-simple-sharp-light.svg +1 -0
  25. package/lib/src/components/colorpicker/colorpicker.module.scss +133 -0
  26. package/lib/src/components/colorpicker/colorpicker.ts +477 -0
  27. package/lib/src/components/combobox/combobox.module.scss +121 -0
  28. package/lib/src/components/combobox/combobox.ts +190 -0
  29. package/lib/src/components/combobox/updown.svg +4 -0
  30. package/lib/src/components/dialog/dialog.module.scss +71 -0
  31. package/lib/src/components/dialog/dialog.ts +91 -0
  32. package/lib/src/components/dialog/xmark-sharp-light.svg +1 -0
  33. package/lib/src/components/form/form.module.scss +34 -0
  34. package/lib/src/components/form/form.ts +36 -0
  35. package/lib/src/components/header/header.module.scss +40 -0
  36. package/lib/src/components/header/header.ts +124 -0
  37. package/lib/src/components/icon/icon.module.scss +30 -0
  38. package/lib/src/components/icon/icon.ts +134 -0
  39. package/lib/src/components/image/image.module.scss +21 -0
  40. package/lib/src/components/image/image.ts +67 -0
  41. package/lib/src/components/input/input.module.scss +69 -0
  42. package/lib/src/components/input/input.ts +274 -0
  43. package/lib/src/components/label/label.module.scss +52 -0
  44. package/lib/src/components/label/label.ts +55 -0
  45. package/lib/src/components/listbox/listbox.module.scss +103 -0
  46. package/lib/src/components/listbox/listbox.ts +427 -0
  47. package/lib/src/components/menu/caret-right-solid.svg +1 -0
  48. package/lib/src/components/menu/menu.module.scss +108 -0
  49. package/lib/src/components/menu/menu.ts +168 -0
  50. package/lib/src/components/messages/circle-exclamation.svg +1 -0
  51. package/lib/src/components/messages/messages.module.scss +47 -0
  52. package/lib/src/components/messages/messages.ts +64 -0
  53. package/lib/src/components/normalize.scss +386 -0
  54. package/lib/src/components/notification/circle-check-solid.svg +1 -0
  55. package/lib/src/components/notification/circle-exclamation-solid.svg +1 -0
  56. package/lib/src/components/notification/circle-notch-light.svg +1 -0
  57. package/lib/src/components/notification/notification.module.scss +82 -0
  58. package/lib/src/components/notification/notification.ts +108 -0
  59. package/lib/src/components/notification/xmark-sharp-light.svg +1 -0
  60. package/lib/src/components/panel/panel.module.scss +48 -0
  61. package/lib/src/components/panel/panel.ts +57 -0
  62. package/lib/src/components/popup/popup.module.scss +43 -0
  63. package/lib/src/components/popup/popup.ts +395 -0
  64. package/lib/src/components/progress/progress.module.scss +57 -0
  65. package/lib/src/components/progress/progress.ts +43 -0
  66. package/lib/src/components/rating/rating.module.scss +23 -0
  67. package/lib/src/components/rating/rating.ts +125 -0
  68. package/lib/src/components/rating/star-sharp-light.svg +1 -0
  69. package/lib/src/components/rating/star-sharp-solid.svg +1 -0
  70. package/lib/src/components/shared.scss +76 -0
  71. package/lib/src/components/sizers/sizer.module.scss +90 -0
  72. package/lib/src/components/sizers/sizer.ts +120 -0
  73. package/lib/src/components/slider/slider.module.scss +71 -0
  74. package/lib/src/components/slider/slider.ts +143 -0
  75. package/lib/src/components/switch/switch.module.scss +127 -0
  76. package/lib/src/components/switch/switch.ts +56 -0
  77. package/lib/src/components/tabs/tabs.module.scss +46 -0
  78. package/lib/src/components/tabs/tabs.ts +157 -0
  79. package/lib/src/components/textarea/textarea.module.scss +59 -0
  80. package/lib/src/components/textarea/textarea.ts +54 -0
  81. package/lib/src/components/textedit/textedit.module.scss +114 -0
  82. package/lib/src/components/textedit/textedit.ts +82 -0
  83. package/lib/src/components/themes.scss +77 -0
  84. package/lib/src/components/tooltips/circle-info-sharp-light.svg +1 -0
  85. package/lib/src/components/tooltips/tooltips.scss +51 -0
  86. package/lib/src/components/tooltips/tooltips.ts +103 -0
  87. package/lib/src/components/treeview/chevron-down-light.svg +1 -0
  88. package/lib/src/components/treeview/treeview.module.scss +116 -0
  89. package/lib/src/components/treeview/treeview.ts +403 -0
  90. package/lib/src/components/viewport/viewport.module.scss +25 -0
  91. package/lib/src/components/viewport/viewport.ts +38 -0
  92. package/lib/src/core/component.ts +979 -0
  93. package/lib/src/core/core_colors.ts +250 -0
  94. package/lib/src/{dom_events.ts → core/core_dom.ts} +195 -39
  95. package/lib/src/{drag_manager.ts → core/core_dragdrop.ts} +29 -44
  96. package/lib/src/core/core_element.ts +98 -0
  97. package/lib/src/core/core_events.ts +149 -0
  98. package/lib/src/{i18n.ts → core/core_i18n.ts} +43 -42
  99. package/lib/src/{router.ts → core/core_router.ts} +27 -40
  100. package/lib/src/core/core_styles.ts +215 -0
  101. package/lib/src/core/core_svg.ts +550 -0
  102. package/lib/src/core/core_tools.ts +673 -0
  103. package/lib/src/demo/assets/house-light.svg +1 -0
  104. package/lib/src/demo/assets/radio.svg +4 -0
  105. package/lib/src/demo/index.html +12 -0
  106. package/lib/src/demo/main.scss +21 -0
  107. package/lib/src/demo/main.tsx +323 -0
  108. package/lib/src/main.scss +21 -0
  109. package/lib/src/main.tsx +323 -0
  110. package/lib/src/x4.scss +19 -0
  111. package/lib/src/x4.ts +60 -0
  112. package/lib/types/x4.d.ts +26548 -0
  113. package/package.json +68 -59
  114. package/scripts/build.mjs +351 -0
  115. package/scripts/prepack.mjs +43 -0
  116. package/src/components/base.scss +26 -0
  117. package/src/components/boxes/boxes.module.scss +37 -0
  118. package/src/components/boxes/boxes.ts +125 -0
  119. package/src/components/btngroup/btngroup.module.scss +29 -0
  120. package/src/components/btngroup/btngroup.ts +106 -0
  121. package/src/components/button/button.module.scss +154 -0
  122. package/src/components/button/button.ts +117 -0
  123. package/src/components/calendar/calendar-check-sharp-light.svg +1 -0
  124. package/src/components/calendar/calendar.module.scss +163 -0
  125. package/src/components/calendar/calendar.ts +326 -0
  126. package/src/components/calendar/chevron-left-sharp-light.svg +1 -0
  127. package/src/components/calendar/chevron-right-sharp-light.svg +1 -0
  128. package/src/components/checkbox/check.svg +4 -0
  129. package/src/components/checkbox/checkbox.module.scss +142 -0
  130. package/src/components/checkbox/checkbox.ts +125 -0
  131. package/src/components/colorinput/colorinput.module.scss +65 -0
  132. package/src/components/colorinput/colorinput.ts +88 -0
  133. package/src/components/colorinput/crosshairs-simple-sharp-light.svg +1 -0
  134. package/src/components/colorpicker/colorpicker.module.scss +133 -0
  135. package/src/components/colorpicker/colorpicker.ts +477 -0
  136. package/src/components/combobox/combobox.module.scss +121 -0
  137. package/src/components/combobox/combobox.ts +190 -0
  138. package/src/components/combobox/updown.svg +4 -0
  139. package/src/components/dialog/dialog.module.scss +71 -0
  140. package/src/components/dialog/dialog.ts +91 -0
  141. package/src/components/dialog/xmark-sharp-light.svg +1 -0
  142. package/src/components/form/form.module.scss +34 -0
  143. package/src/components/form/form.ts +36 -0
  144. package/src/components/header/header.module.scss +40 -0
  145. package/src/components/header/header.ts +124 -0
  146. package/src/components/icon/icon.module.scss +30 -0
  147. package/src/components/icon/icon.ts +134 -0
  148. package/src/components/image/image.module.scss +21 -0
  149. package/src/components/image/image.ts +67 -0
  150. package/src/components/input/input.module.scss +69 -0
  151. package/src/components/input/input.ts +274 -0
  152. package/src/components/label/label.module.scss +52 -0
  153. package/src/components/label/label.ts +55 -0
  154. package/src/components/listbox/listbox.module.scss +103 -0
  155. package/src/components/listbox/listbox.ts +427 -0
  156. package/src/components/menu/caret-right-solid.svg +1 -0
  157. package/src/components/menu/menu.module.scss +108 -0
  158. package/src/components/menu/menu.ts +168 -0
  159. package/src/components/messages/circle-exclamation.svg +1 -0
  160. package/src/components/messages/messages.module.scss +47 -0
  161. package/src/components/messages/messages.ts +64 -0
  162. package/src/components/normalize.scss +386 -0
  163. package/src/components/notification/circle-check-solid.svg +1 -0
  164. package/src/components/notification/circle-exclamation-solid.svg +1 -0
  165. package/src/components/notification/circle-notch-light.svg +1 -0
  166. package/src/components/notification/notification.module.scss +82 -0
  167. package/src/components/notification/notification.ts +108 -0
  168. package/src/components/notification/xmark-sharp-light.svg +1 -0
  169. package/src/components/panel/panel.module.scss +48 -0
  170. package/src/components/panel/panel.ts +57 -0
  171. package/src/components/popup/popup.module.scss +43 -0
  172. package/src/components/popup/popup.ts +395 -0
  173. package/src/components/progress/progress.module.scss +57 -0
  174. package/src/components/progress/progress.ts +43 -0
  175. package/src/components/rating/rating.module.scss +23 -0
  176. package/src/components/rating/rating.ts +125 -0
  177. package/src/components/rating/star-sharp-light.svg +1 -0
  178. package/src/components/rating/star-sharp-solid.svg +1 -0
  179. package/src/components/shared.scss +76 -0
  180. package/src/components/sizers/sizer.module.scss +90 -0
  181. package/src/components/sizers/sizer.ts +120 -0
  182. package/src/components/slider/slider.module.scss +71 -0
  183. package/src/components/slider/slider.ts +143 -0
  184. package/src/components/switch/switch.module.scss +127 -0
  185. package/src/components/switch/switch.ts +56 -0
  186. package/src/components/tabs/tabs.module.scss +46 -0
  187. package/src/components/tabs/tabs.ts +157 -0
  188. package/src/components/textarea/textarea.module.scss +59 -0
  189. package/src/components/textarea/textarea.ts +54 -0
  190. package/src/components/textedit/textedit.module.scss +114 -0
  191. package/src/components/textedit/textedit.ts +82 -0
  192. package/src/components/themes.scss +77 -0
  193. package/src/components/tooltips/circle-info-sharp-light.svg +1 -0
  194. package/src/components/tooltips/tooltips.scss +51 -0
  195. package/src/components/tooltips/tooltips.ts +103 -0
  196. package/src/components/treeview/chevron-down-light.svg +1 -0
  197. package/src/components/treeview/treeview.module.scss +116 -0
  198. package/src/components/treeview/treeview.ts +403 -0
  199. package/src/components/viewport/viewport.module.scss +25 -0
  200. package/src/components/viewport/viewport.ts +38 -0
  201. package/src/core/component.ts +979 -0
  202. package/src/core/core_colors.ts +250 -0
  203. package/src/core/core_dom.ts +471 -0
  204. package/src/core/core_dragdrop.ts +201 -0
  205. package/src/core/core_element.ts +98 -0
  206. package/src/core/core_events.ts +149 -0
  207. package/src/core/core_i18n.ts +377 -0
  208. package/src/core/core_router.ts +221 -0
  209. package/src/core/core_styles.ts +215 -0
  210. package/src/core/core_svg.ts +550 -0
  211. package/src/core/core_tools.ts +673 -0
  212. package/src/demo/assets/house-light.svg +1 -0
  213. package/src/demo/assets/radio.svg +4 -0
  214. package/src/demo/index.html +12 -0
  215. package/src/demo/main.scss +21 -0
  216. package/src/demo/main.tsx +323 -0
  217. package/src/x4.scss +19 -0
  218. package/src/x4.ts +60 -0
  219. package/tsconfig.json +14 -0
  220. package/types/scss.d.ts +4 -0
  221. package/types/svg.d.ts +4 -0
  222. package/types/x4react.d.ts +9 -0
  223. package/lib/changelog.txt +0 -23
  224. package/lib/cjs/x4js.js +0 -39
  225. package/lib/cjs/x4js.js.map +0 -7
  226. package/lib/esm/x4js.mjs +0 -15972
  227. package/lib/esm/x4js.mjs.map +0 -7
  228. package/lib/licence.md +0 -21
  229. package/lib/src/MIT-license.md +0 -14
  230. package/lib/src/action.ts +0 -88
  231. package/lib/src/alpha.jpg +0 -0
  232. package/lib/src/app_sockets.ts +0 -81
  233. package/lib/src/application.ts +0 -262
  234. package/lib/src/autocomplete.ts +0 -232
  235. package/lib/src/base64.ts +0 -166
  236. package/lib/src/base_component.ts +0 -152
  237. package/lib/src/button.ts +0 -355
  238. package/lib/src/canvas.ts +0 -510
  239. package/lib/src/cardview.ts +0 -228
  240. package/lib/src/checkbox.ts +0 -188
  241. package/lib/src/color.ts +0 -752
  242. package/lib/src/colorpicker.ts +0 -1649
  243. package/lib/src/combobox.ts +0 -512
  244. package/lib/src/component.ts +0 -2367
  245. package/lib/src/copyright.txt +0 -27
  246. package/lib/src/datastore.ts +0 -1302
  247. package/lib/src/dialog.ts +0 -656
  248. package/lib/src/drawtext.ts +0 -355
  249. package/lib/src/fileupload.ts +0 -213
  250. package/lib/src/form.ts +0 -413
  251. package/lib/src/formatters.ts +0 -105
  252. package/lib/src/gridview.ts +0 -1185
  253. package/lib/src/icon.ts +0 -362
  254. package/lib/src/image.ts +0 -225
  255. package/lib/src/index.ts +0 -89
  256. package/lib/src/input.ts +0 -297
  257. package/lib/src/label.ts +0 -153
  258. package/lib/src/layout.ts +0 -442
  259. package/lib/src/link.ts +0 -86
  260. package/lib/src/listview.ts +0 -765
  261. package/lib/src/md5.ts +0 -438
  262. package/lib/src/menu.ts +0 -425
  263. package/lib/src/messagebox.ts +0 -224
  264. package/lib/src/panel.ts +0 -86
  265. package/lib/src/popup.ts +0 -494
  266. package/lib/src/property_editor.ts +0 -337
  267. package/lib/src/radiobtn.ts +0 -197
  268. package/lib/src/rating.ts +0 -135
  269. package/lib/src/request.ts +0 -300
  270. package/lib/src/settings.ts +0 -77
  271. package/lib/src/sidebarview.ts +0 -108
  272. package/lib/src/spreadsheet.ts +0 -1449
  273. package/lib/src/styles.ts +0 -343
  274. package/lib/src/svgcomponent.ts +0 -592
  275. package/lib/src/tabbar.ts +0 -151
  276. package/lib/src/tabview.ts +0 -110
  277. package/lib/src/textarea.ts +0 -235
  278. package/lib/src/textedit.ts +0 -533
  279. package/lib/src/toaster.ts +0 -80
  280. package/lib/src/tools.ts +0 -1473
  281. package/lib/src/tooltips.ts +0 -191
  282. package/lib/src/treeview.ts +0 -716
  283. package/lib/src/version.ts +0 -30
  284. package/lib/src/x4.less +0 -2242
  285. package/lib/src/x4dom.ts +0 -57
  286. package/lib/src/x4events.ts +0 -585
  287. package/lib/src/x4js.ts +0 -89
  288. package/lib/src/x4react.ts +0 -90
  289. package/lib/styles/x4.css +0 -1785
  290. package/lib/styles/x4.less +0 -2242
  291. package/lib/types/x4js.d.ts +0 -6728
  292. package/license.md +0 -21
package/lib/src/base64.ts DELETED
@@ -1,166 +0,0 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file base64.ts
9
- * @author Etienne Cochard
10
- *
11
- * Copyright (c) 2019-2023 R-libre ingenierie
12
- *
13
- * Permission is hereby granted, free of charge, to any person obtaining a copy
14
- * of this software and associated documentation files (the "Software"), to deal
15
- * in the Software without restriction, including without limitation the rights
16
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
17
- * of the Software, and to permit persons to whom the Software is furnished to do so,
18
- * subject to the following conditions:
19
- * The above copyright notice and this permission notice shall be included in all copies
20
- * or substantial portions of the Software.
21
- *
22
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
23
- * INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
24
- * PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
25
- * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
26
- * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
27
- * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
28
- **/
29
-
30
- const _alphabet: string = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
31
- let _lookup: any = null;
32
-
33
-
34
- export class Base64 {
35
- lookup: any = null;
36
-
37
- static encode(s: string | Uint8Array ) {
38
- let buffer;
39
-
40
- if( s instanceof Uint8Array ) {
41
- buffer = []
42
- s.forEach( (v) => {
43
- buffer.push( v );
44
- });
45
- }
46
- else {
47
- buffer = Base64._toUtf8(s);
48
- }
49
-
50
- let position = -1;
51
- let len = buffer.length;
52
- let nan1, nan2;
53
- let enc = [, , ,];
54
-
55
- let result = '';
56
- while (++position < len) {
57
- nan1 = buffer[position + 1], nan2 = buffer[position + 2];
58
- enc[0] = buffer[position] >> 2;
59
- enc[1] = ((buffer[position] & 3) << 4) | (buffer[++position] >> 4);
60
-
61
- if (isNaN(nan1)) {
62
- enc[2] = enc[3] = 64;
63
- }
64
- else {
65
- enc[2] = ((buffer[position] & 15) << 2) | (buffer[++position] >> 6);
66
- enc[3] = (isNaN(nan2)) ? 64 : buffer[position] & 63;
67
- }
68
-
69
- result += _alphabet[enc[0]] + _alphabet[enc[1]] + _alphabet[enc[2]] + _alphabet[enc[3]];
70
- }
71
-
72
- return result;
73
- }
74
-
75
- static decode(s: string) {
76
- let buffer = Base64._fromUtf8(s);
77
-
78
- let position = 0;
79
- let len = buffer.length;
80
-
81
- let result = '';
82
- while (position < len) {
83
- if (buffer[position] < 128) {
84
- result += String.fromCharCode(buffer[position++]);
85
- }
86
- else if (buffer[position] > 191 && buffer[position] < 224) {
87
- result += String.fromCharCode(((buffer[position++] & 31) << 6) | (buffer[position++] & 63));
88
- }
89
- else {
90
- result += String.fromCharCode(((buffer[position++] & 15) << 12) | ((buffer[position++] & 63) << 6) | (buffer[position++] & 63));
91
- }
92
- }
93
-
94
- return result;
95
- }
96
-
97
- private static _toUtf8(s) {
98
- let position = -1;
99
- let len = s.length;
100
-
101
- let chr;
102
- let buffer = [];
103
-
104
- if (/^[\x00-\x7f]*$/.test(s)) {
105
- while (++position < len) {
106
- buffer.push(s.charCodeAt(position));
107
- }
108
- }
109
- else {
110
- while (++position < len) {
111
- chr = s.charCodeAt(position);
112
- if (chr < 128) {
113
- buffer.push(chr);
114
- }
115
- else if (chr < 2048) {
116
- buffer.push((chr >> 6) | 192, (chr & 63) | 128);
117
- }
118
- else {
119
- buffer.push((chr >> 12) | 224, ((chr >> 6) & 63) | 128, (chr & 63) | 128);
120
- }
121
- }
122
- }
123
-
124
- return buffer;
125
- }
126
-
127
- private static _fromUtf8(s) {
128
- let position = -1;
129
- let len;
130
- let buffer = [];
131
- let enc = [, , ,];
132
-
133
- if (!_lookup) {
134
- len = _alphabet.length;
135
- _lookup = {};
136
- while (++position < len) {
137
- _lookup[_alphabet[position]] = position;
138
- }
139
-
140
- position = -1;
141
- }
142
-
143
- len = s.length;
144
- while (position < len) {
145
- enc[0] = _lookup[s.charAt(++position)];
146
- enc[1] = _lookup[s.charAt(++position)];
147
- buffer.push((enc[0] << 2) | (enc[1] >> 4));
148
-
149
- enc[2] = _lookup[s.charAt(++position)];
150
- if (enc[2] == 64) {
151
- break;
152
- }
153
-
154
- buffer.push(((enc[1] & 15) << 4) | (enc[2] >> 2));
155
- enc[3] = _lookup[s.charAt(++position)];
156
-
157
- if (enc[3] == 64) {
158
- break;
159
- }
160
-
161
- buffer.push(((enc[2] & 3) << 6) | enc[3]);
162
- }
163
-
164
- return buffer;
165
- }
166
- }
@@ -1,152 +0,0 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file base_component.ts
9
- * @author Etienne Cochard
10
- *
11
- * Copyright (c) 2019-2023 R-libre ingenierie
12
- *
13
- * Permission is hereby granted, free of charge, to any person obtaining a copy
14
- * of this software and associated documentation files (the "Software"), to deal
15
- * in the Software without restriction, including without limitation the rights
16
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
17
- * of the Software, and to permit persons to whom the Software is furnished to do so,
18
- * subject to the following conditions:
19
- * The above copyright notice and this permission notice shall be included in all copies
20
- * or substantial portions of the Software.
21
- *
22
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
23
- * INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
24
- * PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
25
- * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
26
- * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
27
- * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
28
- *
29
- **/
30
-
31
- import { EventMap, MapEvents, EvSource, EvTimer } from './x4events';
32
-
33
- /**
34
- * Timer Callback
35
- * @see EvTimer, startTimer, stopTimer
36
- */
37
-
38
- interface TimerCallback {
39
- (name: string, time: number): void;
40
- }
41
-
42
- /**
43
- * BaseComponent EventMap
44
- */
45
-
46
- export interface BaseComponentEventMap extends EventMap {
47
- timer: EvTimer,
48
- }
49
-
50
- /**
51
- * BaseCompoment Properties
52
- */
53
-
54
- export interface BaseComponentProps<T = BaseComponentEventMap> {
55
- events?: MapEvents<T>; // basic component event map in base interface, should specialised in derived interfaces
56
- [key: string]: any; // added index signature to solve "Type 'X' has no properties with type 'Y'"
57
- }
58
-
59
- /**
60
- * BaseComponent class
61
- */
62
-
63
- export class BaseComponent< P extends BaseComponentProps<BaseComponentEventMap>, E extends BaseComponentEventMap >
64
- extends EvSource< E > {
65
-
66
- protected m_props: P;
67
- #m_timers: Map<string, Function>;
68
-
69
- constructor(props: P) {
70
- super();
71
-
72
- //this.m_props = { ...props };
73
- this.m_props = props;
74
-
75
- if (props.events) {
76
- this.listen(props.events as EventMap);
77
- }
78
- }
79
-
80
- /**
81
- * start a new timer
82
- * @param name timer name
83
- * @param timeout time out in ms
84
- * @param repeat if true this is an auto repeat timer
85
- * @param callback if !null, the callback to call else a EvTimer is fired
86
- */
87
-
88
- startTimer(name: string, timeout: number, repeat = true, callback: TimerCallback = null) {
89
- if (!this.#m_timers) {
90
- this.#m_timers = new Map();
91
- }
92
- else {
93
- this.stopTimer(name);
94
- }
95
-
96
- const id = (repeat ? setInterval : setTimeout)((tm: number) => {
97
- if (callback) {
98
- callback(name, tm);
99
- }
100
- else {
101
- this.emit('timer', EvTimer( name, tm ));
102
- }
103
- }, timeout);
104
-
105
- this.#m_timers.set(name, () => { (repeat ? clearInterval : clearTimeout)(id) });
106
- }
107
-
108
- /**
109
- * stop the given timer
110
- * @param name
111
- */
112
-
113
- stopTimer(name: string) {
114
- const clear = this.#m_timers.get(name);
115
- if (clear) { clear(); }
116
- }
117
-
118
- /**
119
- * stop all timers
120
- */
121
-
122
- disposeTimers( ) {
123
- this.#m_timers?.forEach( v => v() );
124
- this.#m_timers = undefined;
125
- }
126
-
127
- /**
128
- *
129
- * @param callback
130
- * @param timeout
131
- */
132
-
133
- singleShot( callback: TimerCallback, timeout = 0 ) {
134
- setTimeout( callback, timeout );
135
- }
136
-
137
- /**
138
- *
139
- * @param props
140
- * @param elements
141
- */
142
-
143
- public mapPropEvents<N extends keyof E>(props: P, ...elements: N[] ) {
144
- elements.forEach( name => {
145
- const n = name as string;
146
- if (props[n]) {
147
- this._on(n, props[n]);
148
- }
149
- })
150
- }
151
- }
152
-
package/lib/src/button.ts DELETED
@@ -1,355 +0,0 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file button.ts
9
- * @author Etienne Cochard
10
- *
11
- * Copyright (c) 2019-2023 R-libre ingenierie
12
- *
13
- * Permission is hereby granted, free of charge, to any person obtaining a copy
14
- * of this software and associated documentation files (the "Software"), to deal
15
- * in the Software without restriction, including without limitation the rights
16
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
17
- * of the Software, and to permit persons to whom the Software is furnished to do so,
18
- * subject to the following conditions:
19
- * The above copyright notice and this permission notice shall be included in all copies
20
- * or substantial portions of the Software.
21
- *
22
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
23
- * INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
24
- * PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
25
- * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
26
- * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
27
- * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
28
- **/
29
-
30
-
31
- import { Component, CProps, CEventMap, HtmlString } from './component'
32
- import { EventCallback, EvClick, EvChange } from './x4events'
33
-
34
- import { Action } from './action'
35
- import { Icon, IconID } from './icon'
36
- import { Label } from './label'
37
- import { Menu, MenuItem, MenuOrSep } from './menu'
38
- import { isFunction } from './tools'
39
-
40
- /**
41
- * Button events
42
- */
43
-
44
- interface ButtonEventMap extends CEventMap {
45
- click: EvClick;
46
- }
47
-
48
- type MenuCallBack = () => MenuOrSep[];
49
-
50
- /**
51
- * Button properties
52
- */
53
-
54
- interface ButtonProps<E extends ButtonEventMap = ButtonEventMap> extends CProps<E> {
55
- text?: string | HtmlString; // initial button text
56
- icon?: IconID; // optional icon id
57
- rightIcon?: IconID; // optional icon id
58
- align?: 'center' | 'left' | 'right'; // text alignment
59
- autoRepeat?: number; // time in ms or 0/undefined for none
60
- menu?: MenuOrSep[] | MenuCallBack;
61
- click?: EventCallback<EvClick>; // shortcut to events: { click: ... }
62
-
63
- action?: Action;
64
- }
65
-
66
-
67
- /**
68
- * Base button
69
- */
70
-
71
- export class BaseButton<P extends ButtonProps = ButtonProps, E extends ButtonEventMap = ButtonEventMap> extends Component<P, E> {
72
-
73
- constructor(props: P) {
74
- super(props);
75
-
76
- this.setTag( 'button');
77
-
78
- this.setDomEvent('click', (e) => this._handleClick(e));
79
- this.setDomEvent('mousedown', () => { this._startAutoRep(true) });
80
- this.setDomEvent('mouseup', () => { this._startAutoRep(false) });
81
- this.setDomEvent('keydown', (e) => this._handleKeyDown(e));
82
-
83
- this.mapPropEvents( props, 'click' );
84
- }
85
-
86
- render(props: ButtonProps) {
87
-
88
- const action = props.action;
89
-
90
- let icon = props.icon;
91
- let text = props.text;
92
-
93
- if( action ) {
94
- if( !icon && action.props.icon ) {
95
- icon = action.props.icon;
96
- }
97
-
98
- if( text===undefined && action.props.text ) {
99
- text = action.props.text;
100
- }
101
- }
102
-
103
- const ui_icon = icon ? new Icon({ icon, cls: 'left', ref: 'l_icon' }) : null;
104
- const ui_label = new Label({ flex: 1, text: text ?? '', align: props.align, ref: 'label' });
105
- const ui_ricon = props.rightIcon ? new Icon({ icon: props.rightIcon, cls: 'right', ref: 'r_icon' }) : null;
106
-
107
- if( text===undefined ) {
108
- ui_label.addClass( "@hidden" );
109
- }
110
-
111
- this.setContent([ui_icon, ui_label, ui_ricon]);
112
- this._setTabIndex(props.tabIndex);
113
- }
114
-
115
- /**
116
- * starts/stops the autorepeat
117
- */
118
-
119
- private _startAutoRep(start: boolean) {
120
-
121
- if (!this.m_props.autoRepeat) {
122
- return;
123
- }
124
-
125
- if (start) {
126
- // 1st timer 1s
127
- this.startTimer('repeat', 700, false, () => {
128
- // auto click
129
- this.startTimer('repeat', this.m_props.autoRepeat, true, this._sendClick);
130
- });
131
- }
132
- else {
133
- this.stopTimer('repeat');
134
- }
135
- }
136
-
137
- /**
138
- *
139
- */
140
-
141
- protected _handleKeyDown(ev: KeyboardEvent) {
142
- if (!ev.ctrlKey && !ev.shiftKey && !ev.altKey) {
143
- if (ev.key == 'Enter' || ev.key == ' ') {
144
- this._sendClick();
145
- ev.preventDefault();
146
- ev.stopPropagation();
147
- }
148
- }
149
- }
150
-
151
- /**
152
- * called by the system on click event
153
- */
154
-
155
- protected _handleClick(ev: MouseEvent) {
156
-
157
- if (this.m_props.menu) {
158
- let menu = new Menu({
159
- items: isFunction(this.m_props.menu) ? this.m_props.menu() : this.m_props.menu
160
- });
161
-
162
- let rc = this.getBoundingRect();
163
- menu.displayAt(rc.left, rc.bottom, 'tl');
164
- }
165
- else {
166
- this._sendClick();
167
- }
168
-
169
- ev.preventDefault();
170
- ev.stopPropagation();
171
- }
172
-
173
- /**
174
- * sends a click to the observers
175
- */
176
-
177
- protected _sendClick() {
178
- if (this.m_props.menu) {
179
- let menu = new Menu({
180
- items: isFunction(this.m_props.menu) ? this.m_props.menu() : this.m_props.menu
181
- });
182
-
183
- let rc = this.getBoundingRect();
184
- menu.displayAt(rc.left, rc.bottom, 'tl');
185
- }
186
- else {
187
- this.emit('click', EvClick());
188
- if( this.m_props.action ) {
189
- this.m_props.action.fire( );
190
- }
191
- }
192
- }
193
-
194
- /**
195
- * change the button text
196
- * @example
197
- * ```ts
198
- * let btn = new Button( {
199
- * text: 'hello'
200
- * });
201
- *
202
- * btn.text = 'world';
203
- * ```
204
- */
205
-
206
- public set text(text: string | HtmlString) {
207
- this.m_props.text = text;
208
-
209
- let label = this.itemWithRef<Label>('label');
210
- if (label) { label.text = text; label.removeClass("@hidden") }
211
- }
212
-
213
- public get text(): string | HtmlString {
214
- let label = this.itemWithRef<Label>('label');
215
- return label?.text;
216
- }
217
-
218
- /**
219
- * change the button icon
220
- * todo: do nothing if no icon defined at startup
221
- *
222
- * @example
223
- * ```ts
224
- * let btn = new Button( {
225
- * text: 'hello',
226
- * icon: 'close'
227
- * });
228
- * btn.setIcon( 'open' );
229
- * ```
230
- */
231
-
232
- public set icon(icon: IconID) {
233
- this.m_props.icon = icon;
234
-
235
- let ico = this.itemWithRef<Icon>('l_icon');
236
- if (ico) {
237
- ico.icon = icon;
238
- }
239
- else {
240
- this.update( );
241
- }
242
- }
243
-
244
- public get icon() {
245
- let ico = this.itemWithRef<Icon>('l_icon');
246
- return ico?.icon;
247
- }
248
-
249
- /**
250
- * change the button right icon
251
- * todo: do nothing if no icon defined at startup
252
- *
253
- * @example
254
- * ```ts
255
- * let btn = new Button( {
256
- * text: 'hello',
257
- * icon: 'close'
258
- * });
259
- * btn.setIcon( 'open' );
260
- * ```
261
- */
262
-
263
- public set rightIcon(icon: IconID) {
264
- this.m_props.rightIcon = icon;
265
- let ico = this.itemWithRef<Icon>('r_icon');
266
- if (ico) {
267
- ico.icon = icon;
268
- }
269
- }
270
-
271
- public get rightIcon() {
272
- let ico = this.itemWithRef<Icon>('l_icon');
273
- return ico?.icon;
274
- }
275
-
276
- /**
277
- *
278
- */
279
-
280
- set menu( items: MenuItem[] ) {
281
- this.m_props.menu = items;
282
- }
283
- }
284
-
285
- // :: BUTTON ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
286
-
287
- /**
288
- *
289
- */
290
-
291
- export class Button extends BaseButton<ButtonProps> {
292
- }
293
-
294
- // :: TOGGLE BUTTON ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
295
-
296
-
297
- interface ToggleButtonEventMap extends ButtonEventMap {
298
- change: EvChange;
299
- }
300
-
301
- interface ToggleButtonProps extends ButtonProps<ToggleButtonEventMap> {
302
- checked: boolean;
303
- checkedIcon?: IconID;
304
- }
305
-
306
- /**
307
- *
308
- */
309
-
310
- export class ToggleButton extends BaseButton<ToggleButtonProps, ToggleButtonEventMap> {
311
-
312
- constructor(props: ToggleButtonProps) {
313
- super(props);
314
- }
315
-
316
- /**
317
- *
318
- */
319
-
320
- render(props: ToggleButtonProps) {
321
- super.render(props);
322
-
323
- if (props.checked) {
324
- this.addClass('checked');
325
- this._updateIcon( );
326
- }
327
- }
328
-
329
- /**
330
- *
331
- */
332
-
333
- protected _sendClick() {
334
- super._sendClick();
335
-
336
- this.m_props.checked = !this.m_props.checked;
337
- this.setClass('checked', this.m_props.checked);
338
- this.emit('change', EvChange(this.m_props.checked));
339
-
340
- this._updateIcon( );
341
- }
342
-
343
- private _updateIcon( ) {
344
- if( this.m_props.checkedIcon ) {
345
- const ic = this.m_props.checked ? this.m_props.checkedIcon : this.m_props.icon;
346
- let ico = this.itemWithRef<Icon>('l_icon');
347
- if (ico) {
348
- ico.icon = ic;
349
- }
350
- }
351
- }
352
- }
353
-
354
-
355
-