x4js 1.5.33 → 1.5.35
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.
- package/lib/cjs/index.js +7 -7
- package/lib/cjs/index.js.map +3 -3
- package/lib/esm/index.mjs +64 -29
- package/lib/esm/index.mjs.map +2 -2
- package/lib/src/i18n.ts +63 -34
- package/lib/src/i18n.ts.bak +347 -0
- package/lib/src/label.ts +25 -1
- package/lib/src/version.ts +1 -1
- package/lib/types/label.d.ts +9 -0
- package/lib/types/version.d.ts +1 -1
- package/package.json +1 -1
package/lib/src/i18n.ts
CHANGED
|
@@ -99,30 +99,84 @@ export function addTranslation( name, ...parts ) {
|
|
|
99
99
|
const lang = languages[name];
|
|
100
100
|
|
|
101
101
|
parts.forEach( p => {
|
|
102
|
-
_patch( lang.src_translations, p
|
|
102
|
+
_patch( lang.src_translations, p );
|
|
103
103
|
} );
|
|
104
104
|
|
|
105
|
-
lang.translations =
|
|
105
|
+
lang.translations = _proxyfy( lang.src_translations, lang.base, true );
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
/**
|
|
109
|
-
*
|
|
109
|
+
* patch the base object with the given object
|
|
110
|
+
* (real patch)
|
|
110
111
|
*/
|
|
111
112
|
|
|
112
|
-
function _patch( obj: any, by: any
|
|
113
|
+
function _patch( obj: any, by: any ) {
|
|
114
|
+
|
|
113
115
|
for( let n in by ) {
|
|
114
|
-
|
|
115
|
-
|
|
116
|
+
const src = by[n];
|
|
117
|
+
if( typeof src === "string" ) {
|
|
118
|
+
obj[n] = src;
|
|
119
|
+
}
|
|
120
|
+
else {
|
|
121
|
+
if( Array.isArray(src) && (!obj[n] || !Array.isArray(obj[n])) ) {
|
|
122
|
+
obj[n] = [...src];
|
|
123
|
+
}
|
|
124
|
+
else if( !obj[n] || (typeof obj[n] !== "object") ) {
|
|
125
|
+
obj[n] = { ...src };
|
|
126
|
+
}
|
|
127
|
+
else {
|
|
128
|
+
_patch( obj[n], by[n] );
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
/**
|
|
135
|
+
* create a proxy for all sub objects
|
|
136
|
+
* (deep traverse)
|
|
137
|
+
*/
|
|
138
|
+
|
|
139
|
+
function _proxyfy( obj: any, base: any, root ) {
|
|
140
|
+
|
|
141
|
+
const result = {}
|
|
142
|
+
|
|
143
|
+
for( const n in obj ) {
|
|
144
|
+
if( typeof obj[n]!=="string" && !Array.isArray(obj[n])) {
|
|
145
|
+
result[n] = _proxyfy( obj[n], base, false );
|
|
116
146
|
}
|
|
117
147
|
else {
|
|
118
|
-
|
|
119
|
-
|
|
148
|
+
result[n] = obj[n];
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
return _mk_proxy( result, base, root );
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
|
|
156
|
+
/**
|
|
157
|
+
* create a proxy for the given object
|
|
158
|
+
*/
|
|
159
|
+
|
|
160
|
+
function _mk_proxy( obj: any, base: string, root: boolean ) : any {
|
|
161
|
+
return new Proxy( obj, {
|
|
162
|
+
get: (target, prop) => {
|
|
163
|
+
if( root ) {
|
|
164
|
+
req_path = [prop];
|
|
120
165
|
}
|
|
166
|
+
else {
|
|
167
|
+
req_path.push( prop );
|
|
121
168
|
}
|
|
122
169
|
|
|
123
|
-
|
|
170
|
+
let value = target[prop];
|
|
171
|
+
if( value===undefined && base ) {
|
|
172
|
+
value = _findBaseTrans( base );
|
|
173
|
+
}
|
|
174
|
+
return value;
|
|
175
|
+
}
|
|
176
|
+
});
|
|
124
177
|
}
|
|
125
178
|
|
|
179
|
+
|
|
126
180
|
/**
|
|
127
181
|
* when we ask for _tr.xxx
|
|
128
182
|
* reqpath is set to [xxx]
|
|
@@ -166,31 +220,6 @@ function _findBaseTrans( base ) {
|
|
|
166
220
|
return undefined;
|
|
167
221
|
}
|
|
168
222
|
|
|
169
|
-
/**
|
|
170
|
-
*
|
|
171
|
-
*/
|
|
172
|
-
|
|
173
|
-
function _mk_proxy( obj: any, base: string, root: boolean ) : any {
|
|
174
|
-
return new Proxy( obj, {
|
|
175
|
-
get: (target, prop) => {
|
|
176
|
-
if( root ) {
|
|
177
|
-
req_path = [prop];
|
|
178
|
-
}
|
|
179
|
-
else {
|
|
180
|
-
req_path.push( prop );
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
let value = target[prop];
|
|
184
|
-
if( value===undefined && base ) {
|
|
185
|
-
value = _findBaseTrans( base );
|
|
186
|
-
// keep it for later
|
|
187
|
-
target[prop] = value;
|
|
188
|
-
}
|
|
189
|
-
return value;
|
|
190
|
-
}
|
|
191
|
-
});
|
|
192
|
-
}
|
|
193
|
-
|
|
194
223
|
export let _tr: any = {};
|
|
195
224
|
|
|
196
225
|
/**
|
|
@@ -0,0 +1,347 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ___ ___ __
|
|
3
|
+
* \ \/ / / _
|
|
4
|
+
* \ / /_| |_
|
|
5
|
+
* / \____ _|
|
|
6
|
+
* /__/\__\ |_|
|
|
7
|
+
*
|
|
8
|
+
* @file i18n.ts
|
|
9
|
+
* @author Etienne Cochard
|
|
10
|
+
*
|
|
11
|
+
* Copyright (c) 2019-2022 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
|
+
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* language definition
|
|
35
|
+
*/
|
|
36
|
+
|
|
37
|
+
interface Language {
|
|
38
|
+
name: string;
|
|
39
|
+
base: string;
|
|
40
|
+
src_translations: any;
|
|
41
|
+
translations: any;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
const sym_lang = Symbol( "i18n" );
|
|
45
|
+
|
|
46
|
+
let languages: Record<string,Language> = {
|
|
47
|
+
};
|
|
48
|
+
|
|
49
|
+
/**
|
|
50
|
+
* create a new language
|
|
51
|
+
* @param name language name (code)
|
|
52
|
+
* @param base base language (code)
|
|
53
|
+
* @example:
|
|
54
|
+
* ```js
|
|
55
|
+
* createLanguage( 'en', 'fr' );
|
|
56
|
+
* ```
|
|
57
|
+
*/
|
|
58
|
+
|
|
59
|
+
export function createLanguage( name: string, base: string ) {
|
|
60
|
+
languages[name] = {
|
|
61
|
+
name,
|
|
62
|
+
base,
|
|
63
|
+
src_translations: {},
|
|
64
|
+
translations: {}
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
/**
|
|
69
|
+
* check if the given language is known
|
|
70
|
+
* @param name language name (code)
|
|
71
|
+
*/
|
|
72
|
+
|
|
73
|
+
export function isLanguage( name: string ): boolean {
|
|
74
|
+
return languages[name]!==undefined;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
/**
|
|
78
|
+
* build the language with given fragments
|
|
79
|
+
* @param name language name (code)
|
|
80
|
+
* @param parts misc elements that make the language
|
|
81
|
+
* @example:
|
|
82
|
+
* ```js
|
|
83
|
+
* createLanguage( 'en', 'fr' );
|
|
84
|
+
* const app = {
|
|
85
|
+
* clients: {
|
|
86
|
+
* translation1: "hello",
|
|
87
|
+
* }
|
|
88
|
+
* }
|
|
89
|
+
* addTranslation( 'en', app );
|
|
90
|
+
* ```
|
|
91
|
+
*/
|
|
92
|
+
|
|
93
|
+
export function addTranslation( name, ...parts ) {
|
|
94
|
+
|
|
95
|
+
if( !isLanguage(name) ) {
|
|
96
|
+
return;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
const lang = languages[name];
|
|
100
|
+
|
|
101
|
+
parts.forEach( p => {
|
|
102
|
+
_patch( lang.src_translations, p, lang.base );
|
|
103
|
+
} );
|
|
104
|
+
|
|
105
|
+
lang.translations = _mk_proxy( lang.src_translations, lang.base, true );
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
/**
|
|
109
|
+
*
|
|
110
|
+
*/
|
|
111
|
+
|
|
112
|
+
function _patch( obj: any, by: any, def: string ) {
|
|
113
|
+
for( let n in by ) {
|
|
114
|
+
if( obj[n] instanceof Object ) {
|
|
115
|
+
_patch( obj[n], by[n], def );
|
|
116
|
+
}
|
|
117
|
+
else {
|
|
118
|
+
obj[n] = by[n];
|
|
119
|
+
obj[n] = _mk_proxy( obj[n], def, false );
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
return obj;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
/**
|
|
127
|
+
* when we ask for _tr.xxx
|
|
128
|
+
* reqpath is set to [xxx]
|
|
129
|
+
*
|
|
130
|
+
* then when we try to get _tr.xxx.yyy
|
|
131
|
+
* reqpath is [xxx,yyy]
|
|
132
|
+
* if yyy is not found, we try with base langage for the full reqpath
|
|
133
|
+
* until no base found
|
|
134
|
+
*/
|
|
135
|
+
|
|
136
|
+
let req_path: (string | symbol)[];
|
|
137
|
+
|
|
138
|
+
/**
|
|
139
|
+
*
|
|
140
|
+
*/
|
|
141
|
+
|
|
142
|
+
function _findBaseTrans( base ) {
|
|
143
|
+
|
|
144
|
+
while( base ) {
|
|
145
|
+
const lang = languages[base];
|
|
146
|
+
let trans = lang.translations;
|
|
147
|
+
let value;
|
|
148
|
+
|
|
149
|
+
for( const p of req_path ) {
|
|
150
|
+
value = trans[p];
|
|
151
|
+
if( value===undefined ) {
|
|
152
|
+
break;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
trans = value;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
if( value!==undefined ) {
|
|
159
|
+
return trans;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
base = lang.base;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
console.error( "I18N error: unable to find", '_tr.'+req_path.join('.') );
|
|
166
|
+
return undefined;
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
/**
|
|
170
|
+
*
|
|
171
|
+
*/
|
|
172
|
+
|
|
173
|
+
function _mk_proxy( obj: any, base: string, root: boolean ) : any {
|
|
174
|
+
return new Proxy( obj, {
|
|
175
|
+
get: (target, prop) => {
|
|
176
|
+
if( root ) {
|
|
177
|
+
req_path = [prop];
|
|
178
|
+
}
|
|
179
|
+
else {
|
|
180
|
+
req_path.push( prop );
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
let value = target[prop];
|
|
184
|
+
if( value===undefined && base ) {
|
|
185
|
+
value = _findBaseTrans( base );
|
|
186
|
+
// keep it for later
|
|
187
|
+
target[prop] = value;
|
|
188
|
+
}
|
|
189
|
+
return value;
|
|
190
|
+
}
|
|
191
|
+
});
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
export let _tr: any = {};
|
|
195
|
+
|
|
196
|
+
/**
|
|
197
|
+
* select the given language as current
|
|
198
|
+
* @param name language name (code)
|
|
199
|
+
*/
|
|
200
|
+
|
|
201
|
+
export function selectLanguage( name: string ) {
|
|
202
|
+
|
|
203
|
+
if( !isLanguage(name) ) {
|
|
204
|
+
return;
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
_tr = languages[name].translations;
|
|
208
|
+
_tr[sym_lang] = name;
|
|
209
|
+
return _tr;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
/**
|
|
213
|
+
*
|
|
214
|
+
*/
|
|
215
|
+
|
|
216
|
+
export function getCurrentLanguage( ): string {
|
|
217
|
+
return _tr[sym_lang];
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
/**
|
|
221
|
+
*
|
|
222
|
+
*/
|
|
223
|
+
|
|
224
|
+
export function getAvailableLanguages( ): string[] {
|
|
225
|
+
return Object.keys( languages );
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
|
|
229
|
+
|
|
230
|
+
|
|
231
|
+
/**
|
|
232
|
+
* language definition
|
|
233
|
+
* x4 specific strings
|
|
234
|
+
*/
|
|
235
|
+
|
|
236
|
+
let fr = {
|
|
237
|
+
global: {
|
|
238
|
+
ok: 'OK',
|
|
239
|
+
cancel: 'Annuler',
|
|
240
|
+
ignore: 'Ignorer',
|
|
241
|
+
yes: 'Oui',
|
|
242
|
+
no: 'Non',
|
|
243
|
+
|
|
244
|
+
open: 'Ouvrir',
|
|
245
|
+
new: 'Nouveau',
|
|
246
|
+
delete: 'Supprimer',
|
|
247
|
+
close: 'Fermer',
|
|
248
|
+
save: 'Enregistrer',
|
|
249
|
+
|
|
250
|
+
search: 'Rechercher',
|
|
251
|
+
search_tip: 'Saisissez le texte à rechercher. <b>Enter</b> pour lancer la recherche. <b>Esc</b> pour annuler.',
|
|
252
|
+
|
|
253
|
+
required_field: "information requise",
|
|
254
|
+
invalid_format: "format invalide",
|
|
255
|
+
invalid_email: 'adresse mail invalide',
|
|
256
|
+
invalid_number: 'valeur numérique invalide',
|
|
257
|
+
|
|
258
|
+
diff_date_seconds: '{0} secondes',
|
|
259
|
+
diff_date_minutes: '{0} minutes',
|
|
260
|
+
diff_date_hours: '{0} heures',
|
|
261
|
+
|
|
262
|
+
invalid_date: 'Date non reconnue ({0})',
|
|
263
|
+
empty_list: 'Liste vide',
|
|
264
|
+
|
|
265
|
+
date_input_formats: 'd/m/y|d.m.y|d m y|d-m-y|dmy',
|
|
266
|
+
date_format: 'D/M/Y',
|
|
267
|
+
|
|
268
|
+
day_short: [ 'dim', 'lun', 'mar', 'mer', 'jeu', 'ven', 'sam' ],
|
|
269
|
+
day_long: [ 'dimanche', 'lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi' ],
|
|
270
|
+
|
|
271
|
+
month_short: [ 'jan', 'fév', 'mar', 'avr', 'mai', 'jun', 'jui', 'aoû', 'sep', 'oct', 'nov', 'déc' ],
|
|
272
|
+
month_long: [ 'janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre' ],
|
|
273
|
+
|
|
274
|
+
property: 'Propriété',
|
|
275
|
+
value: 'Valeur',
|
|
276
|
+
|
|
277
|
+
err_403: `Vous n'avez pas les droits suffisants pour effectuer cette action`,
|
|
278
|
+
|
|
279
|
+
copy: 'Copier',
|
|
280
|
+
cut: 'Couper',
|
|
281
|
+
paste: 'Coller'
|
|
282
|
+
}
|
|
283
|
+
};
|
|
284
|
+
|
|
285
|
+
/** @ignore */
|
|
286
|
+
|
|
287
|
+
let en = {
|
|
288
|
+
global: {
|
|
289
|
+
ok: 'OK',
|
|
290
|
+
cancel: 'Cancel',
|
|
291
|
+
ignore: 'Ignore',
|
|
292
|
+
yes: 'Yes',
|
|
293
|
+
no: 'No',
|
|
294
|
+
|
|
295
|
+
open: 'Open',
|
|
296
|
+
new: 'New',
|
|
297
|
+
delete: 'Delete',
|
|
298
|
+
close: 'Close',
|
|
299
|
+
save: 'Save',
|
|
300
|
+
|
|
301
|
+
search: 'Search',
|
|
302
|
+
search_tip: 'Type in the text to search. <b>Enter</b> to start the search. <b>Esc</b> to cancel.',
|
|
303
|
+
|
|
304
|
+
required_field: "missing information",
|
|
305
|
+
invalid_format: "invalid format",
|
|
306
|
+
invalid_email: 'invalid email address',
|
|
307
|
+
invalid_number: 'bad numeric value',
|
|
308
|
+
|
|
309
|
+
diff_date_seconds: '{0} seconds',
|
|
310
|
+
diff_date_minutes: '{0} minutes',
|
|
311
|
+
diff_date_hours: '{0} hours',
|
|
312
|
+
|
|
313
|
+
invalid_date: 'Unrecognized date({0})',
|
|
314
|
+
empty_list: 'Empty list',
|
|
315
|
+
|
|
316
|
+
date_input_formats: 'm/d/y|m.d.y|m d y|m-d-y|mdy',
|
|
317
|
+
date_format: 'M/D/Y',
|
|
318
|
+
|
|
319
|
+
day_short: [ 'sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat' ],
|
|
320
|
+
day_long: [ 'sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday' ],
|
|
321
|
+
|
|
322
|
+
month_short: [ 'jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jui', 'aug', 'sep', 'oct', 'nov', 'dec' ],
|
|
323
|
+
month_long: [ 'january', 'february', 'march', 'april', 'mau', 'june', 'jully', 'august', 'september', 'october', 'november', 'december' ],
|
|
324
|
+
|
|
325
|
+
property: 'Property',
|
|
326
|
+
value: 'Value',
|
|
327
|
+
|
|
328
|
+
err_403: `You do not have sufficient rights to do that action`,
|
|
329
|
+
|
|
330
|
+
copy: 'Copy',
|
|
331
|
+
cut: 'Cut',
|
|
332
|
+
paste: 'Paste'
|
|
333
|
+
}
|
|
334
|
+
};
|
|
335
|
+
|
|
336
|
+
createLanguage( 'fr', null );
|
|
337
|
+
addTranslation( 'fr', fr );
|
|
338
|
+
|
|
339
|
+
createLanguage( 'en', 'fr' );
|
|
340
|
+
addTranslation( 'en', en );
|
|
341
|
+
|
|
342
|
+
selectLanguage( 'fr' ); // by default
|
|
343
|
+
|
|
344
|
+
|
|
345
|
+
|
|
346
|
+
|
|
347
|
+
|
package/lib/src/label.ts
CHANGED
|
@@ -80,7 +80,7 @@ export class Label extends Component<LabelProps>
|
|
|
80
80
|
this.addClass( '@hlayout' );
|
|
81
81
|
|
|
82
82
|
this.setContent( [
|
|
83
|
-
new Icon( { icon: props.icon } ),
|
|
83
|
+
new Icon( { id: 'l_icon', icon: props.icon } ),
|
|
84
84
|
new Component( { content: text, ref: 'text' } )
|
|
85
85
|
] );
|
|
86
86
|
}
|
|
@@ -124,5 +124,29 @@ export class Label extends Component<LabelProps>
|
|
|
124
124
|
public get text( ) : string | HtmlString {
|
|
125
125
|
return this.m_props.text;
|
|
126
126
|
}
|
|
127
|
+
|
|
128
|
+
/**
|
|
129
|
+
* change the displayed icon
|
|
130
|
+
* @param icon - new icon
|
|
131
|
+
*/
|
|
132
|
+
|
|
133
|
+
public set icon( icon: IconID ) {
|
|
134
|
+
let ico = this.itemWithRef<Icon>('l_icon');
|
|
135
|
+
if (ico) {
|
|
136
|
+
ico.icon = icon;
|
|
137
|
+
}
|
|
138
|
+
else {
|
|
139
|
+
this.update( 0 );
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
/**
|
|
144
|
+
*
|
|
145
|
+
*/
|
|
146
|
+
|
|
147
|
+
public get icon( ) : IconID {
|
|
148
|
+
let ico = this.itemWithRef<Icon>('l_icon');
|
|
149
|
+
return ico?.icon;
|
|
150
|
+
}
|
|
127
151
|
}
|
|
128
152
|
|
package/lib/src/version.ts
CHANGED
package/lib/types/label.d.ts
CHANGED
package/lib/types/version.d.ts
CHANGED