x4js 2.0.6 → 2.0.8

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 (112) hide show
  1. package/lib/types/x4.d.ts +12110 -178
  2. package/package.json +6 -2
  3. package/build/x4.css +0 -1
  4. package/build/x4.js +0 -1
  5. package/scripts/build.mjs +0 -362
  6. package/scripts/prepack.mjs +0 -51
  7. package/src/components/base.scss +0 -26
  8. package/src/components/boxes/boxes.module.scss +0 -37
  9. package/src/components/boxes/boxes.ts +0 -125
  10. package/src/components/btngroup/btngroup.module.scss +0 -29
  11. package/src/components/btngroup/btngroup.ts +0 -106
  12. package/src/components/button/button.module.scss +0 -154
  13. package/src/components/button/button.ts +0 -117
  14. package/src/components/calendar/calendar-check-sharp-light.svg +0 -1
  15. package/src/components/calendar/calendar.module.scss +0 -163
  16. package/src/components/calendar/calendar.ts +0 -326
  17. package/src/components/calendar/chevron-left-sharp-light.svg +0 -1
  18. package/src/components/calendar/chevron-right-sharp-light.svg +0 -1
  19. package/src/components/checkbox/check.svg +0 -4
  20. package/src/components/checkbox/checkbox.module.scss +0 -142
  21. package/src/components/checkbox/checkbox.ts +0 -125
  22. package/src/components/colorinput/colorinput.module.scss +0 -65
  23. package/src/components/colorinput/colorinput.ts +0 -88
  24. package/src/components/colorinput/crosshairs-simple-sharp-light.svg +0 -1
  25. package/src/components/colorpicker/colorpicker.module.scss +0 -133
  26. package/src/components/colorpicker/colorpicker.ts +0 -477
  27. package/src/components/combobox/combobox.module.scss +0 -121
  28. package/src/components/combobox/combobox.ts +0 -190
  29. package/src/components/combobox/updown.svg +0 -4
  30. package/src/components/dialog/dialog.module.scss +0 -71
  31. package/src/components/dialog/dialog.ts +0 -91
  32. package/src/components/dialog/xmark-sharp-light.svg +0 -1
  33. package/src/components/form/form.module.scss +0 -34
  34. package/src/components/form/form.ts +0 -36
  35. package/src/components/header/header.module.scss +0 -40
  36. package/src/components/header/header.ts +0 -124
  37. package/src/components/icon/icon.module.scss +0 -30
  38. package/src/components/icon/icon.ts +0 -134
  39. package/src/components/image/image.module.scss +0 -21
  40. package/src/components/image/image.ts +0 -67
  41. package/src/components/input/input.module.scss +0 -69
  42. package/src/components/input/input.ts +0 -274
  43. package/src/components/label/label.module.scss +0 -52
  44. package/src/components/label/label.ts +0 -55
  45. package/src/components/listbox/listbox.module.scss +0 -103
  46. package/src/components/listbox/listbox.ts +0 -427
  47. package/src/components/menu/caret-right-solid.svg +0 -1
  48. package/src/components/menu/menu.module.scss +0 -108
  49. package/src/components/menu/menu.ts +0 -168
  50. package/src/components/messages/circle-exclamation.svg +0 -1
  51. package/src/components/messages/messages.module.scss +0 -47
  52. package/src/components/messages/messages.ts +0 -64
  53. package/src/components/normalize.scss +0 -386
  54. package/src/components/notification/circle-check-solid.svg +0 -1
  55. package/src/components/notification/circle-exclamation-solid.svg +0 -1
  56. package/src/components/notification/circle-notch-light.svg +0 -1
  57. package/src/components/notification/notification.module.scss +0 -82
  58. package/src/components/notification/notification.ts +0 -108
  59. package/src/components/notification/xmark-sharp-light.svg +0 -1
  60. package/src/components/panel/panel.module.scss +0 -48
  61. package/src/components/panel/panel.ts +0 -57
  62. package/src/components/popup/popup.module.scss +0 -43
  63. package/src/components/popup/popup.ts +0 -395
  64. package/src/components/progress/progress.module.scss +0 -57
  65. package/src/components/progress/progress.ts +0 -43
  66. package/src/components/rating/rating.module.scss +0 -23
  67. package/src/components/rating/rating.ts +0 -125
  68. package/src/components/rating/star-sharp-light.svg +0 -1
  69. package/src/components/rating/star-sharp-solid.svg +0 -1
  70. package/src/components/shared.scss +0 -76
  71. package/src/components/sizers/sizer.module.scss +0 -90
  72. package/src/components/sizers/sizer.ts +0 -120
  73. package/src/components/slider/slider.module.scss +0 -71
  74. package/src/components/slider/slider.ts +0 -143
  75. package/src/components/switch/switch.module.scss +0 -127
  76. package/src/components/switch/switch.ts +0 -56
  77. package/src/components/tabs/tabs.module.scss +0 -46
  78. package/src/components/tabs/tabs.ts +0 -157
  79. package/src/components/textarea/textarea.module.scss +0 -59
  80. package/src/components/textarea/textarea.ts +0 -54
  81. package/src/components/textedit/textedit.module.scss +0 -114
  82. package/src/components/textedit/textedit.ts +0 -82
  83. package/src/components/themes.scss +0 -77
  84. package/src/components/tooltips/circle-info-sharp-light.svg +0 -1
  85. package/src/components/tooltips/tooltips.scss +0 -51
  86. package/src/components/tooltips/tooltips.ts +0 -103
  87. package/src/components/treeview/chevron-down-light.svg +0 -1
  88. package/src/components/treeview/treeview.module.scss +0 -116
  89. package/src/components/treeview/treeview.ts +0 -403
  90. package/src/components/viewport/viewport.module.scss +0 -25
  91. package/src/components/viewport/viewport.ts +0 -38
  92. package/src/core/component.ts +0 -979
  93. package/src/core/core_colors.ts +0 -250
  94. package/src/core/core_dom.ts +0 -471
  95. package/src/core/core_dragdrop.ts +0 -201
  96. package/src/core/core_element.ts +0 -98
  97. package/src/core/core_events.ts +0 -149
  98. package/src/core/core_i18n.ts +0 -377
  99. package/src/core/core_router.ts +0 -221
  100. package/src/core/core_styles.ts +0 -215
  101. package/src/core/core_svg.ts +0 -550
  102. package/src/core/core_tools.ts +0 -673
  103. package/src/demo/assets/house-light.svg +0 -1
  104. package/src/demo/assets/radio.svg +0 -4
  105. package/src/demo/index.html +0 -12
  106. package/src/demo/main.scss +0 -21
  107. package/src/demo/main.tsx +0 -323
  108. package/src/x4.scss +0 -19
  109. package/tsconfig.json +0 -14
  110. package/types/scss.d.ts +0 -4
  111. package/types/svg.d.ts +0 -4
  112. package/types/x4react.d.ts +0 -9
@@ -1,377 +0,0 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file core_i18n.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
-
18
- /**
19
- * language definition
20
- */
21
-
22
- interface Language {
23
- name: string;
24
- base: string;
25
- src_translations: any;
26
- translations: any;
27
- }
28
-
29
- const sym_lang = Symbol( "i18n" );
30
-
31
- let languages: Record<string,Language> = {
32
- };
33
-
34
- /**
35
- * create a new language
36
- * @param name language name (code)
37
- * @param base base language (code)
38
- * @example:
39
- * ```js
40
- * createLanguage( 'en', 'fr' );
41
- * ```
42
- */
43
-
44
- export function createLanguage( name: string, base: string ) {
45
- languages[name] = {
46
- name,
47
- base,
48
- src_translations: {},
49
- translations: {}
50
- };
51
- }
52
-
53
- /**
54
- * check if the given language is known
55
- * @param name language name (code)
56
- */
57
-
58
- export function isLanguage( name: string ): boolean {
59
- return languages[name]!==undefined;
60
- }
61
-
62
- /**
63
- * build the language with given fragments
64
- * @param name language name (code)
65
- * @param parts misc elements that make the language
66
- * @example:
67
- * ```js
68
- * createLanguage( 'en', 'fr' );
69
- * const app = {
70
- * clients: {
71
- * translation1: "hello",
72
- * }
73
- * }
74
- * addTranslation( 'en', app );
75
- * ```
76
- */
77
-
78
- export function addTranslation( name: string, ...parts: any[] ) {
79
-
80
- if( !isLanguage(name) ) {
81
- return;
82
- }
83
-
84
- const lang = languages[name];
85
-
86
- parts.forEach( p => {
87
- _patch( lang.src_translations, p );
88
- } );
89
-
90
- lang.translations = _proxyfy( lang.src_translations, lang.base, true );
91
- }
92
-
93
- /**
94
- * patch the base object with the given object
95
- * (real patch)
96
- */
97
-
98
- function _patch( obj: any, by: any ) {
99
-
100
- for( let n in by ) {
101
- const src = by[n];
102
- if( typeof src === "string" ) {
103
- obj[n] = src;
104
- }
105
- else {
106
- if( Array.isArray(src) && (!obj[n] || !Array.isArray(obj[n])) ) {
107
- obj[n] = [...src];
108
- }
109
- else if( !obj[n] || (typeof obj[n] !== "object") ) {
110
- obj[n] = { ...src };
111
- }
112
- else {
113
- _patch( obj[n], by[n] );
114
- }
115
- }
116
- }
117
- }
118
-
119
- /**
120
- * create a proxy for all sub objects
121
- * (deep traverse)
122
- */
123
-
124
- function _proxyfy( obj: any, base: any, root: any ) {
125
-
126
- const result: any = {}
127
-
128
- for( const n in obj ) {
129
- if( typeof obj[n]!=="string" && !Array.isArray(obj[n])) {
130
- result[n] = _proxyfy( obj[n], base, false );
131
- }
132
- else {
133
- result[n] = obj[n];
134
- }
135
- }
136
-
137
- return _mk_proxy( result, base, root );
138
- }
139
-
140
-
141
- /**
142
- * create a proxy for the given object
143
- */
144
-
145
- function _mk_proxy( obj: any, base: string, root: boolean ) : any {
146
- return new Proxy( obj, {
147
- get: (target, prop) => {
148
- if( root ) {
149
- req_path = [prop];
150
- }
151
- else {
152
- req_path.push( prop );
153
- }
154
-
155
- let value = target[prop];
156
- if( value===undefined ) {
157
- if( base ) {
158
- value = _findBaseTrans( base );
159
- }
160
-
161
- if( value===undefined ) {
162
- console.error( "I18N error: unable to find", '_tr.'+req_path.join('.') );
163
- }
164
- }
165
-
166
- return value;
167
- }
168
- });
169
- }
170
-
171
-
172
- /**
173
- * when we ask for _tr.xxx
174
- * reqpath is set to [xxx]
175
- *
176
- * then when we try to get _tr.xxx.yyy
177
- * reqpath is [xxx,yyy]
178
- * if yyy is not found, we try with base langage for the full reqpath
179
- * until no base found
180
- */
181
-
182
- let req_path: (string | symbol)[];
183
-
184
- /**
185
- *
186
- */
187
-
188
- function _findBaseTrans( base: any ) {
189
-
190
- while( base ) {
191
- const lang = languages[base];
192
- let trans = lang.translations;
193
- let value;
194
-
195
- for( const p of req_path ) {
196
- value = trans[p];
197
- if( value===undefined ) {
198
- break;
199
- }
200
-
201
- trans = value;
202
- }
203
-
204
- if( value!==undefined ) {
205
- return trans;
206
- }
207
-
208
- base = lang.base;
209
- }
210
-
211
- return undefined;
212
- }
213
-
214
- export let _tr: Partial<typeof fr> = {};
215
-
216
- /**
217
- * select the given language as current
218
- * @param name laguage name (code)
219
- */
220
-
221
- export function selectLanguage( name: string ) {
222
-
223
- if( !isLanguage(name) ) {
224
- return;
225
- }
226
-
227
- _tr = languages[name].translations;
228
- (_tr as any)[sym_lang] = name;
229
- return _tr;
230
- }
231
-
232
- /**
233
- *
234
- */
235
-
236
- export function getCurrentLanguage( ): string {
237
- return (_tr as any)[sym_lang];
238
- }
239
-
240
- /**
241
- *
242
- */
243
-
244
- export function getAvailableLanguages( ): string[] {
245
- return Object.keys( languages );
246
- }
247
-
248
-
249
-
250
-
251
- /**
252
- * language definition
253
- * x4 specific strings
254
- */
255
-
256
- let fr = {
257
- global: {
258
- ok: 'OK',
259
- cancel: 'Annuler',
260
- ignore: 'Ignorer',
261
- yes: 'Oui',
262
- no: 'Non',
263
- abort: "Abandonner",
264
- retry: "Réessayer",
265
-
266
- error: "Erreur",
267
- today: "Aujourd'hui",
268
-
269
- open: 'Ouvrir',
270
- new: 'Nouveau',
271
- delete: 'Supprimer',
272
- close: 'Fermer',
273
- save: 'Enregistrer',
274
-
275
- search: 'Rechercher',
276
- search_tip: 'Saisissez le texte à rechercher. <b>Enter</b> pour lancer la recherche. <b>Esc</b> pour annuler.',
277
-
278
- required_field: "information requise",
279
- invalid_format: "format invalide",
280
- invalid_email: 'adresse mail invalide',
281
- invalid_number: 'valeur numérique invalide',
282
-
283
- diff_date_seconds: '{0} secondes',
284
- diff_date_minutes: '{0} minutes',
285
- diff_date_hours: '{0} heures',
286
-
287
- invalid_date: 'Date non reconnue ({0})',
288
- empty_list: 'Liste vide',
289
-
290
- date_input_formats: 'd/m/y|d.m.y|d m y|d-m-y|dmy',
291
- date_format: 'D/M/Y',
292
-
293
- day_short: [ 'dim', 'lun', 'mar', 'mer', 'jeu', 'ven', 'sam' ],
294
- day_long: [ 'dimanche', 'lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi' ],
295
-
296
- month_short: [ 'jan', 'fév', 'mar', 'avr', 'mai', 'jun', 'jui', 'aoû', 'sep', 'oct', 'nov', 'déc' ],
297
- month_long: [ 'janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre' ],
298
-
299
- property: 'Propriété',
300
- value: 'Valeur',
301
-
302
- err_403: `Vous n'avez pas les droits suffisants pour effectuer cette action`,
303
-
304
- copy: 'Copier',
305
- cut: 'Couper',
306
- paste: 'Coller'
307
- }
308
- };
309
-
310
- /** @ignore */
311
-
312
- let en = {
313
- global: {
314
- ok: 'OK',
315
- cancel: 'Cancel',
316
- ignore: 'Ignore',
317
- yes: 'Yes',
318
- no: 'No',
319
- abort: "Abort",
320
- retry: "Retry",
321
-
322
- error: "Error",
323
- today: "Today",
324
-
325
- open: 'Open',
326
- new: 'New',
327
- delete: 'Delete',
328
- close: 'Close',
329
- save: 'Save',
330
-
331
- search: 'Search',
332
- search_tip: 'Type in the text to search. <b>Enter</b> to start the search. <b>Esc</b> to cancel.',
333
-
334
- required_field: "missing information",
335
- invalid_format: "invalid format",
336
- invalid_email: 'invalid email address',
337
- invalid_number: 'bad numeric value',
338
-
339
- diff_date_seconds: '{0} seconds',
340
- diff_date_minutes: '{0} minutes',
341
- diff_date_hours: '{0} hours',
342
-
343
- invalid_date: 'Unrecognized date({0})',
344
- empty_list: 'Empty list',
345
-
346
- date_input_formats: 'm/d/y|m.d.y|m d y|m-d-y|mdy',
347
- date_format: 'M/D/Y',
348
-
349
- day_short: [ 'sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat' ],
350
- day_long: [ 'sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday' ],
351
-
352
- month_short: [ 'jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jui', 'aug', 'sep', 'oct', 'nov', 'dec' ],
353
- month_long: [ 'january', 'february', 'march', 'april', 'mau', 'june', 'jully', 'august', 'september', 'october', 'november', 'december' ],
354
-
355
- property: 'Property',
356
- value: 'Value',
357
-
358
- err_403: `You do not have sufficient rights to do that action`,
359
-
360
- copy: 'Copy',
361
- cut: 'Cut',
362
- paste: 'Paste'
363
- }
364
- };
365
-
366
- createLanguage( 'fr', null );
367
- addTranslation( 'fr', fr );
368
-
369
- createLanguage( 'en', 'fr' );
370
- addTranslation( 'en', en );
371
-
372
- selectLanguage( 'fr' ); // by default
373
-
374
-
375
-
376
-
377
-
@@ -1,221 +0,0 @@
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
-