x4js 2.0.11 → 2.0.13

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 (109) hide show
  1. package/README.md +15 -15
  2. package/lib/README.txt +15 -15
  3. package/lib/cjs/x4.css +1 -1
  4. package/lib/cjs/x4.js +1 -1
  5. package/lib/esm/x4.css +1 -1
  6. package/lib/esm/x4.mjs +1 -1
  7. package/lib/src/components/base.scss +25 -26
  8. package/lib/src/components/boxes/boxes.module.scss +37 -37
  9. package/lib/src/components/boxes/boxes.ts +129 -125
  10. package/lib/src/components/breadcrumb/breadcrumb.scss +28 -0
  11. package/lib/src/components/breadcrumb/breadcrumb.ts +84 -0
  12. package/lib/src/components/breadcrumb/chevron-right.svg +1 -0
  13. package/lib/src/components/btngroup/btngroup.module.scss +28 -28
  14. package/lib/src/components/btngroup/btngroup.ts +119 -101
  15. package/lib/src/components/button/button.module.scss +154 -153
  16. package/lib/src/components/button/button.ts +117 -117
  17. package/lib/src/components/calendar/calendar.module.scss +162 -162
  18. package/lib/src/components/calendar/calendar.ts +326 -325
  19. package/lib/src/components/checkbox/check.svg +3 -3
  20. package/lib/src/components/checkbox/checkbox.module.scss +141 -141
  21. package/lib/src/components/checkbox/checkbox.ts +125 -124
  22. package/lib/src/components/colorinput/colorinput.module.scss +64 -64
  23. package/lib/src/components/colorinput/colorinput.ts +90 -87
  24. package/lib/src/components/colorpicker/colorpicker.module.scss +132 -132
  25. package/lib/src/components/colorpicker/colorpicker.ts +481 -476
  26. package/lib/src/components/combobox/combobox.module.scss +123 -120
  27. package/lib/src/components/combobox/combobox.ts +192 -190
  28. package/lib/src/components/combobox/updown.svg +3 -3
  29. package/lib/src/components/components.ts +34 -0
  30. package/lib/src/components/dialog/dialog.module.scss +71 -71
  31. package/lib/src/components/dialog/dialog.ts +94 -92
  32. package/lib/src/components/form/form.module.scss +34 -34
  33. package/lib/src/components/form/form.ts +41 -36
  34. package/lib/src/components/grid/datastore.ts +1298 -0
  35. package/lib/src/components/grid/gridview.ts +1108 -0
  36. package/lib/src/components/grid/memdb.ts +325 -0
  37. package/lib/src/components/header/header.module.scss +39 -39
  38. package/lib/src/components/header/header.ts +129 -123
  39. package/lib/src/components/icon/icon.module.scss +29 -29
  40. package/lib/src/components/icon/icon.ts +136 -134
  41. package/lib/src/components/image/image.module.scss +20 -20
  42. package/lib/src/components/image/image.ts +68 -66
  43. package/lib/src/components/input/input.module.scss +69 -69
  44. package/lib/src/components/input/input.ts +275 -274
  45. package/lib/src/components/label/label.module.scss +58 -52
  46. package/lib/src/components/label/label.ts +64 -55
  47. package/lib/src/components/link/link.ts +78 -0
  48. package/lib/src/components/listbox/listbox.module.scss +103 -103
  49. package/lib/src/components/listbox/listbox.ts +431 -427
  50. package/lib/src/components/menu/menu.module.scss +107 -107
  51. package/lib/src/components/menu/menu.ts +171 -168
  52. package/lib/src/components/messages/messages.module.scss +48 -47
  53. package/lib/src/components/messages/messages.ts +68 -63
  54. package/lib/src/components/normalize.scss +386 -386
  55. package/lib/src/components/notification/notification.module.scss +81 -81
  56. package/lib/src/components/notification/notification.ts +109 -108
  57. package/lib/src/components/panel/panel.module.scss +47 -47
  58. package/lib/src/components/panel/panel.ts +57 -56
  59. package/lib/src/components/popup/popup.module.scss +43 -43
  60. package/lib/src/components/popup/popup.ts +396 -395
  61. package/lib/src/components/progress/progress.module.scss +56 -56
  62. package/lib/src/components/progress/progress.ts +43 -42
  63. package/lib/src/components/rating/rating.module.scss +22 -22
  64. package/lib/src/components/rating/rating.ts +131 -125
  65. package/lib/src/components/shared.scss +90 -76
  66. package/lib/src/components/sizers/sizer.module.scss +89 -89
  67. package/lib/src/components/sizers/sizer.ts +123 -119
  68. package/lib/src/components/slider/slider.module.scss +70 -70
  69. package/lib/src/components/slider/slider.ts +147 -142
  70. package/lib/src/components/switch/switch.module.scss +126 -126
  71. package/lib/src/components/switch/switch.ts +61 -55
  72. package/lib/src/components/tabs/tabs.module.scss +46 -46
  73. package/lib/src/components/tabs/tabs.ts +168 -157
  74. package/lib/src/components/textarea/textarea.module.scss +59 -59
  75. package/lib/src/components/textarea/textarea.ts +60 -54
  76. package/lib/src/components/textedit/textedit.module.scss +113 -113
  77. package/lib/src/components/textedit/textedit.ts +83 -82
  78. package/lib/src/components/themes.scss +81 -77
  79. package/lib/src/components/tooltips/tooltips.scss +50 -50
  80. package/lib/src/components/tooltips/tooltips.ts +103 -102
  81. package/lib/src/components/treeview/treeview.module.scss +115 -115
  82. package/lib/src/components/treeview/treeview.ts +410 -403
  83. package/lib/src/components/viewport/viewport.module.scss +24 -24
  84. package/lib/src/components/viewport/viewport.ts +41 -38
  85. package/lib/src/core/component.ts +1002 -979
  86. package/lib/src/core/core_application.ts +44 -0
  87. package/lib/src/core/core_colors.ts +249 -249
  88. package/lib/src/core/core_dom.ts +471 -471
  89. package/lib/src/core/core_dragdrop.ts +200 -200
  90. package/lib/src/core/core_element.ts +97 -97
  91. package/lib/src/core/core_events.ts +149 -149
  92. package/lib/src/core/core_i18n.ts +377 -377
  93. package/lib/src/core/core_router.ts +221 -221
  94. package/lib/src/core/core_styles.ts +214 -214
  95. package/lib/src/core/core_svg.ts +550 -550
  96. package/lib/src/core/core_tools.ts +688 -673
  97. package/lib/src/demo/assets/radio.svg +3 -3
  98. package/lib/src/demo/index.html +11 -11
  99. package/lib/src/demo/main.scss +21 -21
  100. package/lib/src/demo/main.tsx +323 -323
  101. package/lib/src/types/scss.d.ts +4 -4
  102. package/lib/src/types/x4react.d.ts +8 -8
  103. package/lib/src/x4.scss +18 -18
  104. package/lib/src/x4.ts +31 -60
  105. package/lib/styles/x4.css +1 -1
  106. package/lib/types/x4js.d.ts +100 -49
  107. package/package.json +2 -3
  108. package/src/x4.ts +31 -60
  109. package/lib/output.d.ts +0 -1472
@@ -1,221 +1,221 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file core_router.ts
9
- * @author Etienne Cochard
10
- *
11
- * @copyright (c) 2024 R-libre ingenierie
12
- *
13
- * Use of this source code is governed by an MIT-style license
14
- * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
15
- **/
16
-
17
- import { EvError } from './component.js';
18
- import { EventMap, EventSource } from './core_events.js';
19
-
20
- type RouteHandler = ( params: any, path: string ) => void;
21
-
22
- interface Segment {
23
- keys: string[],
24
- pattern: RegExp;
25
- }
26
-
27
- interface Route {
28
- keys: string[],
29
- pattern: RegExp;
30
- handler: RouteHandler;
31
- }
32
-
33
- function parseRoute(str: string | RegExp, loose = false): Segment {
34
-
35
- if (str instanceof RegExp) {
36
- return {
37
- keys: null,
38
- pattern: str
39
- };
40
- }
41
-
42
- const arr = str.split('/');
43
-
44
- let keys = [];
45
- let pattern = '';
46
-
47
- if( arr[0]=='' ) {
48
- arr.shift();
49
- }
50
-
51
- for (const tmp of arr) {
52
- const c = tmp[0];
53
-
54
- if (c === '*') {
55
- keys.push('wild');
56
- pattern += '/(.*)';
57
- }
58
- else if (c === ':') {
59
- const o = tmp.indexOf('?', 1);
60
- const ext = tmp.indexOf('.', 1);
61
-
62
- keys.push(tmp.substring(1, o >= 0 ? o : ext >= 0 ? ext : tmp.length));
63
- pattern += o >= 0 && ext < 0 ? '(?:/([^\/]+?))?' : '/([^\/]+?)';
64
- if (ext >= 0) {
65
- pattern += (o >= 0 ? '?' : '') + '\\' + tmp.substring(ext);
66
- }
67
- }
68
- else {
69
- pattern += '/' + tmp;
70
- }
71
- }
72
-
73
- return {
74
- keys,
75
- pattern: new RegExp( `^${pattern}${loose ? '(?=$|\/)' : '\/?$'}`, 'i' )
76
- };
77
- }
78
-
79
- interface RouterEvents extends EventMap {
80
- error: EvError;
81
- }
82
-
83
-
84
- /**
85
- * micro router
86
- *
87
- * ```
88
- * const router = new Router( );
89
- *
90
- * router.get( "/detail/:id", ( params: any ) => {
91
- * this._showDetail( detail );
92
- * } );
93
- *
94
- * router.get( "/:id", ( params: any ) => {
95
- * if( params.id==0 )
96
- * router.navigate( '/home' );
97
- * }
98
- * });
99
- *
100
- * router.on( "error", ( ) => {
101
- * router.navigate( '/home' );
102
- * })
103
- *
104
- * router.init( );
105
- * ```
106
- */
107
-
108
-
109
- export class Router extends EventSource< RouterEvents > {
110
-
111
- private m_routes: Route[];
112
- private m_useHash: boolean;
113
-
114
- constructor( useHash = true ) {
115
- super( );
116
-
117
- this.m_routes = [];
118
- this.m_useHash = useHash;
119
-
120
- window.addEventListener('popstate', (event) => {
121
- const url = this._getLocation( );
122
- const found = this._find(url);
123
-
124
- found.handlers.forEach(h => {
125
- h(found.params,url);
126
- });
127
- });
128
- }
129
-
130
- get(uri: string | RegExp, handler: RouteHandler ) {
131
- let { keys, pattern } = parseRoute(uri);
132
- this.m_routes.push({ keys, pattern, handler });
133
- }
134
-
135
- init() {
136
- this.navigate( this._getLocation() );
137
- }
138
-
139
- private _getLocation( ) {
140
- return this.m_useHash ? '/'+document.location.hash.substring(1) : document.location.pathname;
141
- }
142
-
143
- navigate( uri: string, notify = true, replace = false ) {
144
-
145
- if( !uri.startsWith('/') ) {
146
- uri = '/'+uri;
147
- }
148
-
149
- const found = this._find( uri );
150
-
151
- if( !found || found.handlers.length==0 ) {
152
- //window.history.pushState({}, '', 'error')
153
- console.log( 'route not found: '+uri );
154
- this.fire( "error", {code: 404, message: "route not found" } );
155
- return;
156
- }
157
-
158
- if( this.m_useHash ) {
159
- while( uri.at(0)=='/' ) {
160
- uri = uri.substring( 1 );
161
- }
162
-
163
- uri = '#'+uri;
164
- }
165
-
166
- if( replace ) {
167
- window.history.replaceState({}, '', uri );
168
- }
169
- else {
170
- window.history.pushState({}, '', uri );
171
- }
172
-
173
- if( notify ) {
174
- found.handlers.forEach( h => {
175
- h( found.params, uri );
176
- } );
177
- }
178
- }
179
-
180
- private _find( url: string ): { params: Record<string,any>, handlers: RouteHandler[] } {
181
-
182
- let matches = [];
183
- let params: Record<string,any> = {};
184
- let handlers: RouteHandler[] = [];
185
-
186
- for (const tmp of this.m_routes ) {
187
- if (!tmp.keys ) {
188
- matches = tmp.pattern.exec(url);
189
- if (!matches) {
190
- continue;
191
- }
192
-
193
- if (matches['groups']) {
194
- for (const k in matches['groups']) {
195
- params[k] = matches['groups'][k];
196
- }
197
- }
198
-
199
- handlers = [...handlers, tmp.handler];
200
- }
201
- else if (tmp.keys.length > 0) {
202
- matches = tmp.pattern.exec(url);
203
- if (matches === null) {
204
- continue;
205
- }
206
-
207
- for ( let j = 0; j < tmp.keys.length;) {
208
- params[tmp.keys[j]] = matches[++j];
209
- }
210
-
211
- handlers = [...handlers, tmp.handler];
212
- }
213
- else if (tmp.pattern.test(url)) {
214
- handlers = [...handlers, tmp.handler];
215
- }
216
- }
217
-
218
- return { params, handlers };
219
- }
220
- }
221
-
1
+ /**
2
+ * ___ ___ __
3
+ * \ \/ / / _
4
+ * \ / /_| |_
5
+ * / \____ _|
6
+ * /__/\__\ |_|
7
+ *
8
+ * @file core_router.ts
9
+ * @author Etienne Cochard
10
+ *
11
+ * @copyright (c) 2024 R-libre ingenierie
12
+ *
13
+ * Use of this source code is governed by an MIT-style license
14
+ * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
15
+ **/
16
+
17
+ import { EvError } from './component.js';
18
+ import { EventMap, EventSource } from './core_events.js';
19
+
20
+ type RouteHandler = ( params: any, path: string ) => void;
21
+
22
+ interface Segment {
23
+ keys: string[],
24
+ pattern: RegExp;
25
+ }
26
+
27
+ interface Route {
28
+ keys: string[],
29
+ pattern: RegExp;
30
+ handler: RouteHandler;
31
+ }
32
+
33
+ function parseRoute(str: string | RegExp, loose = false): Segment {
34
+
35
+ if (str instanceof RegExp) {
36
+ return {
37
+ keys: null,
38
+ pattern: str
39
+ };
40
+ }
41
+
42
+ const arr = str.split('/');
43
+
44
+ let keys = [];
45
+ let pattern = '';
46
+
47
+ if( arr[0]=='' ) {
48
+ arr.shift();
49
+ }
50
+
51
+ for (const tmp of arr) {
52
+ const c = tmp[0];
53
+
54
+ if (c === '*') {
55
+ keys.push('wild');
56
+ pattern += '/(.*)';
57
+ }
58
+ else if (c === ':') {
59
+ const o = tmp.indexOf('?', 1);
60
+ const ext = tmp.indexOf('.', 1);
61
+
62
+ keys.push(tmp.substring(1, o >= 0 ? o : ext >= 0 ? ext : tmp.length));
63
+ pattern += o >= 0 && ext < 0 ? '(?:/([^\/]+?))?' : '/([^\/]+?)';
64
+ if (ext >= 0) {
65
+ pattern += (o >= 0 ? '?' : '') + '\\' + tmp.substring(ext);
66
+ }
67
+ }
68
+ else {
69
+ pattern += '/' + tmp;
70
+ }
71
+ }
72
+
73
+ return {
74
+ keys,
75
+ pattern: new RegExp( `^${pattern}${loose ? '(?=$|\/)' : '\/?$'}`, 'i' )
76
+ };
77
+ }
78
+
79
+ interface RouterEvents extends EventMap {
80
+ error: EvError;
81
+ }
82
+
83
+
84
+ /**
85
+ * micro router
86
+ *
87
+ * ```
88
+ * const router = new Router( );
89
+ *
90
+ * router.get( "/detail/:id", ( params: any ) => {
91
+ * this._showDetail( detail );
92
+ * } );
93
+ *
94
+ * router.get( "/:id", ( params: any ) => {
95
+ * if( params.id==0 )
96
+ * router.navigate( '/home' );
97
+ * }
98
+ * });
99
+ *
100
+ * router.on( "error", ( ) => {
101
+ * router.navigate( '/home' );
102
+ * })
103
+ *
104
+ * router.init( );
105
+ * ```
106
+ */
107
+
108
+
109
+ export class Router extends EventSource< RouterEvents > {
110
+
111
+ private m_routes: Route[];
112
+ private m_useHash: boolean;
113
+
114
+ constructor( useHash = true ) {
115
+ super( );
116
+
117
+ this.m_routes = [];
118
+ this.m_useHash = useHash;
119
+
120
+ window.addEventListener('popstate', (event) => {
121
+ const url = this._getLocation( );
122
+ const found = this._find(url);
123
+
124
+ found.handlers.forEach(h => {
125
+ h(found.params,url);
126
+ });
127
+ });
128
+ }
129
+
130
+ get(uri: string | RegExp, handler: RouteHandler ) {
131
+ let { keys, pattern } = parseRoute(uri);
132
+ this.m_routes.push({ keys, pattern, handler });
133
+ }
134
+
135
+ init() {
136
+ this.navigate( this._getLocation() );
137
+ }
138
+
139
+ private _getLocation( ) {
140
+ return this.m_useHash ? '/'+document.location.hash.substring(1) : document.location.pathname;
141
+ }
142
+
143
+ navigate( uri: string, notify = true, replace = false ) {
144
+
145
+ if( !uri.startsWith('/') ) {
146
+ uri = '/'+uri;
147
+ }
148
+
149
+ const found = this._find( uri );
150
+
151
+ if( !found || found.handlers.length==0 ) {
152
+ //window.history.pushState({}, '', 'error')
153
+ console.log( 'route not found: '+uri );
154
+ this.fire( "error", {code: 404, message: "route not found" } );
155
+ return;
156
+ }
157
+
158
+ if( this.m_useHash ) {
159
+ while( uri.at(0)=='/' ) {
160
+ uri = uri.substring( 1 );
161
+ }
162
+
163
+ uri = '#'+uri;
164
+ }
165
+
166
+ if( replace ) {
167
+ window.history.replaceState({}, '', uri );
168
+ }
169
+ else {
170
+ window.history.pushState({}, '', uri );
171
+ }
172
+
173
+ if( notify ) {
174
+ found.handlers.forEach( h => {
175
+ h( found.params, uri );
176
+ } );
177
+ }
178
+ }
179
+
180
+ private _find( url: string ): { params: Record<string,any>, handlers: RouteHandler[] } {
181
+
182
+ let matches = [];
183
+ let params: Record<string,any> = {};
184
+ let handlers: RouteHandler[] = [];
185
+
186
+ for (const tmp of this.m_routes ) {
187
+ if (!tmp.keys ) {
188
+ matches = tmp.pattern.exec(url);
189
+ if (!matches) {
190
+ continue;
191
+ }
192
+
193
+ if (matches['groups']) {
194
+ for (const k in matches['groups']) {
195
+ params[k] = matches['groups'][k];
196
+ }
197
+ }
198
+
199
+ handlers = [...handlers, tmp.handler];
200
+ }
201
+ else if (tmp.keys.length > 0) {
202
+ matches = tmp.pattern.exec(url);
203
+ if (matches === null) {
204
+ continue;
205
+ }
206
+
207
+ for ( let j = 0; j < tmp.keys.length;) {
208
+ params[tmp.keys[j]] = matches[++j];
209
+ }
210
+
211
+ handlers = [...handlers, tmp.handler];
212
+ }
213
+ else if (tmp.pattern.test(url)) {
214
+ handlers = [...handlers, tmp.handler];
215
+ }
216
+ }
217
+
218
+ return { params, handlers };
219
+ }
220
+ }
221
+