@gridsuite/commons-ui 0.56.0 → 0.57.0

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 (29) hide show
  1. package/dist/chunks/{criteria-based-filter-edition-dialog.DxqH-mLe.js → criteria-based-filter-edition-dialog.BEXoNmzz.js} +1 -1
  2. package/dist/components/TopBar/TopBar.js +371 -429
  3. package/dist/components/filter/constants/expert-filter-constants.d.ts +5 -0
  4. package/dist/components/filter/constants/expert-filter-constants.js +5 -0
  5. package/dist/components/filter/criteria-based/criteria-based-filter-edition-dialog.js +1 -1
  6. package/dist/components/filter/expert/expert-filter-edition-dialog.js +1 -1
  7. package/dist/components/filter/expert/expert-filter-form.js +1 -1
  8. package/dist/components/filter/expert/expert-filter-utils.d.ts +73 -1
  9. package/dist/components/filter/expert/expert-filter-utils.js +7 -5
  10. package/dist/components/filter/expert/expert-filter.type.d.ts +1 -0
  11. package/dist/components/filter/expert/expert-filter.type.js +1 -0
  12. package/dist/components/filter/explicit-naming/explicit-naming-filter-edition-dialog.js +1 -1
  13. package/dist/components/filter/explicit-naming/explicit-naming-filter-form.js +1 -1
  14. package/dist/components/filter/filter-creation-dialog.js +1 -1
  15. package/dist/components/filter/filter-form.js +1 -1
  16. package/dist/components/react-hook-form/ag-grid-table-rhf/bottom-right-buttons.js +1 -1
  17. package/dist/components/react-hook-form/ag-grid-table-rhf/csv-uploader/csv-uploader.js +1 -1
  18. package/dist/components/react-hook-form/ag-grid-table-rhf/custom-ag-grid-table.js +1 -1
  19. package/dist/components/react-query-builder-inputs/custom-react-query-builder.js +1 -1
  20. package/dist/components/react-query-builder-inputs/element-value-editor.js +1 -1
  21. package/dist/components/react-query-builder-inputs/remove-button.js +1 -1
  22. package/dist/components/react-query-builder-inputs/value-editor.js +1 -1
  23. package/dist/components/translations/filter-en.d.ts +22 -0
  24. package/dist/components/translations/filter-en.js +23 -0
  25. package/dist/components/translations/filter-fr.d.ts +22 -0
  26. package/dist/components/translations/filter-fr.js +23 -0
  27. package/dist/index.d.ts +2 -0
  28. package/dist/index.js +77 -73
  29. package/package.json +4 -5
@@ -1,11 +1,10 @@
1
- import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
- import { useState, useRef, useMemo } from "react";
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { useState, useMemo } from "react";
3
3
  import { FormattedMessage } from "react-intl";
4
4
  import { Menu, MenuItem, ListItemIcon, AppBar, Toolbar, Box, IconButton, ListItemText, Button, Popper, Paper, ClickAwayListener, MenuList, Typography, ToggleButtonGroup, ToggleButton, darken } from "@mui/material";
5
- import { Apps, ArrowDropUp, ArrowDropDown, Person, WbSunny, Brightness3, Computer, Settings, HelpOutline, FullscreenExit, Fullscreen, ExitToApp } from "@mui/icons-material";
5
+ import { Apps, ArrowDropUp, ArrowDropDown, Person, WbSunny, Brightness3, Computer, Settings, HelpOutline, ExitToApp } from "@mui/icons-material";
6
6
  import { styled } from "@mui/system";
7
7
  import PropTypes from "prop-types";
8
- import FullScreen, { fullScreenSupported } from "react-request-fullscreen";
9
8
  import GridLogo from "./GridLogo.js";
10
9
  import AboutDialog from "./AboutDialog.js";
11
10
  const styles = {
@@ -132,8 +131,6 @@ const TopBar = ({
132
131
  }) => {
133
132
  const [anchorElSettingsMenu, setAnchorElSettingsMenu] = useState(null);
134
133
  const [anchorElAppsMenu, setAnchorElAppsMenu] = useState(null);
135
- const fullScreenRef = useRef(null);
136
- const [isFullScreen, setIsFullScreen] = useState(false);
137
134
  const handleToggleSettingsMenu = (event) => {
138
135
  setAnchorElSettingsMenu(event.currentTarget);
139
136
  };
@@ -152,14 +149,6 @@ const TopBar = ({
152
149
  onParametersClick();
153
150
  }
154
151
  };
155
- function onFullScreenChange(isFullScreenValue) {
156
- setAnchorElSettingsMenu(null);
157
- setIsFullScreen(isFullScreen);
158
- }
159
- function requestOrExitFullScreen() {
160
- setAnchorElSettingsMenu(null);
161
- fullScreenRef.current.fullScreen();
162
- }
163
152
  const abbreviationFromUserName = (name) => {
164
153
  const tab = name.split(" ").map((x) => x.charAt(0));
165
154
  if (tab.length === 1) {
@@ -204,448 +193,401 @@ const TopBar = ({
204
193
  ),
205
194
  [onLogoClick, appLogo, appName, appColor]
206
195
  );
207
- return /* @__PURE__ */ jsxs(AppBar, { position: "static", color: "default", sx: styles.appBar, children: [
208
- /* @__PURE__ */ jsx(
209
- FullScreen,
210
- {
211
- ref: fullScreenRef,
212
- onFullScreenChange,
213
- onFullScreenError: (e) => console.debug("full screen error : " + e.message)
214
- }
215
- ),
216
- /* @__PURE__ */ jsxs(Toolbar, { children: [
217
- logo_clickable,
218
- /* @__PURE__ */ jsx(Box, { sx: styles.grow, children }),
219
- user && /* @__PURE__ */ jsxs(Box, { children: [
220
- /* @__PURE__ */ jsx(
221
- IconButton,
222
- {
223
- "aria-label": "apps",
224
- "aria-controls": "apps-menu",
225
- "aria-haspopup": "true",
226
- onClick: handleClickAppsMenu,
227
- color: "inherit",
228
- children: /* @__PURE__ */ jsx(Apps, {})
229
- }
230
- ),
231
- /* @__PURE__ */ jsx(
232
- StyledMenu,
233
- {
234
- id: "apps-menu",
235
- anchorEl: anchorElAppsMenu,
236
- keepMounted: true,
237
- open: Boolean(anchorElAppsMenu),
238
- onClose: handleCloseAppsMenu,
239
- children: appsAndUrls && appsAndUrls.filter((item) => !item.hiddenInAppsMenu).map((item) => /* @__PURE__ */ jsx(
240
- Box,
241
- {
242
- component: "a",
243
- href: item.url,
244
- sx: styles.link,
245
- target: "_blank",
246
- rel: "noopener noreferrer",
247
- children: /* @__PURE__ */ jsx(
196
+ return /* @__PURE__ */ jsx(AppBar, { position: "static", color: "default", sx: styles.appBar, children: /* @__PURE__ */ jsxs(Toolbar, { children: [
197
+ logo_clickable,
198
+ /* @__PURE__ */ jsx(Box, { sx: styles.grow, children }),
199
+ user && /* @__PURE__ */ jsxs(Box, { children: [
200
+ /* @__PURE__ */ jsx(
201
+ IconButton,
202
+ {
203
+ "aria-label": "apps",
204
+ "aria-controls": "apps-menu",
205
+ "aria-haspopup": "true",
206
+ onClick: handleClickAppsMenu,
207
+ color: "inherit",
208
+ children: /* @__PURE__ */ jsx(Apps, {})
209
+ }
210
+ ),
211
+ /* @__PURE__ */ jsx(
212
+ StyledMenu,
213
+ {
214
+ id: "apps-menu",
215
+ anchorEl: anchorElAppsMenu,
216
+ keepMounted: true,
217
+ open: Boolean(anchorElAppsMenu),
218
+ onClose: handleCloseAppsMenu,
219
+ children: appsAndUrls && appsAndUrls.filter((item) => !item.hiddenInAppsMenu).map((item) => /* @__PURE__ */ jsx(
220
+ Box,
221
+ {
222
+ component: "a",
223
+ href: item.url,
224
+ sx: styles.link,
225
+ target: "_blank",
226
+ rel: "noopener noreferrer",
227
+ children: /* @__PURE__ */ jsx(
228
+ StyledMenuItem,
229
+ {
230
+ onClick: handleCloseAppsMenu,
231
+ children: /* @__PURE__ */ jsxs(ListItemText, { children: [
232
+ /* @__PURE__ */ jsx(
233
+ "span",
234
+ {
235
+ style: {
236
+ fontWeight: "bold"
237
+ },
238
+ children: "Grid"
239
+ }
240
+ ),
241
+ /* @__PURE__ */ jsx(
242
+ "span",
243
+ {
244
+ style: {
245
+ color: item.appColor === void 0 ? "grey" : item.appColor,
246
+ fontWeight: "bold"
247
+ },
248
+ children: item.name
249
+ }
250
+ )
251
+ ] })
252
+ }
253
+ )
254
+ },
255
+ item.name
256
+ ))
257
+ }
258
+ )
259
+ ] }),
260
+ user && /* @__PURE__ */ jsxs(Box, { sx: styles.menuContainerg, children: [
261
+ /* @__PURE__ */ jsxs(
262
+ Button,
263
+ {
264
+ "aria-controls": "settings-menu",
265
+ "aria-haspopup": "true",
266
+ sx: styles.showHideMenu,
267
+ onClick: handleToggleSettingsMenu,
268
+ color: "inherit",
269
+ style: Boolean(anchorElSettingsMenu) ? { cursor: "initial" } : { cursor: "pointer" },
270
+ children: [
271
+ /* @__PURE__ */ jsx(Box, { component: "span", sx: styles.name, children: user !== null ? abbreviationFromUserName(
272
+ user.profile.name
273
+ ) : "" }),
274
+ anchorElSettingsMenu ? /* @__PURE__ */ jsx(ArrowDropUp, { sx: styles.arrowIcon }) : /* @__PURE__ */ jsx(ArrowDropDown, { sx: styles.arrowIcon })
275
+ ]
276
+ }
277
+ ),
278
+ /* @__PURE__ */ jsx(
279
+ Popper,
280
+ {
281
+ sx: styles.settingsMenu,
282
+ open: Boolean(anchorElSettingsMenu),
283
+ anchorEl: anchorElSettingsMenu,
284
+ children: /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(
285
+ ClickAwayListener,
286
+ {
287
+ onClickAway: handleCloseSettingsMenu,
288
+ children: /* @__PURE__ */ jsxs(MenuList, { id: "settings-menu", children: [
289
+ /* @__PURE__ */ jsxs(
248
290
  StyledMenuItem,
249
291
  {
250
- onClick: handleCloseAppsMenu,
251
- children: /* @__PURE__ */ jsxs(ListItemText, { children: [
252
- /* @__PURE__ */ jsx(
253
- "span",
292
+ sx: styles.borderBottom,
293
+ disabled: true,
294
+ style: { opacity: "1" },
295
+ children: [
296
+ /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(Person, { fontSize: "small" }) }),
297
+ /* @__PURE__ */ jsx(ListItemText, { disabled: false, children: user !== null && /* @__PURE__ */ jsxs(
298
+ Box,
254
299
  {
255
- style: {
256
- fontWeight: "bold"
257
- },
258
- children: "Grid"
300
+ component: "span",
301
+ sx: styles.sizeLabel,
302
+ children: [
303
+ user.profile.name,
304
+ " ",
305
+ /* @__PURE__ */ jsx("br", {}),
306
+ /* @__PURE__ */ jsx(
307
+ Box,
308
+ {
309
+ component: "span",
310
+ sx: styles.userMail,
311
+ children: user.profile.email
312
+ }
313
+ )
314
+ ]
259
315
  }
260
- ),
261
- /* @__PURE__ */ jsx(
262
- "span",
316
+ ) })
317
+ ]
318
+ }
319
+ ),
320
+ /* @__PURE__ */ jsxs(
321
+ StyledMenuItem,
322
+ {
323
+ disabled: true,
324
+ style: {
325
+ opacity: "1",
326
+ paddingTop: "10px",
327
+ paddingBottom: "10px",
328
+ backgroundColor: "transparent"
329
+ },
330
+ children: [
331
+ /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
332
+ Typography,
263
333
  {
264
- style: {
265
- color: item.appColor === void 0 ? "grey" : item.appColor,
266
- fontWeight: "bold"
267
- },
268
- children: item.name
334
+ sx: styles.sizeLabel,
335
+ children: /* @__PURE__ */ jsx(
336
+ FormattedMessage,
337
+ {
338
+ id: "top-bar/displayMode",
339
+ defaultMessage: "Display mode"
340
+ }
341
+ )
269
342
  }
270
- )
271
- ] })
272
- }
273
- )
274
- },
275
- item.name
276
- ))
277
- }
278
- )
279
- ] }),
280
- user && /* @__PURE__ */ jsxs(Box, { sx: styles.menuContainerg, children: [
281
- /* @__PURE__ */ jsxs(
282
- Button,
283
- {
284
- "aria-controls": "settings-menu",
285
- "aria-haspopup": "true",
286
- sx: styles.showHideMenu,
287
- onClick: handleToggleSettingsMenu,
288
- color: "inherit",
289
- style: Boolean(anchorElSettingsMenu) ? { cursor: "initial" } : { cursor: "pointer" },
290
- children: [
291
- /* @__PURE__ */ jsx(Box, { component: "span", sx: styles.name, children: user !== null ? abbreviationFromUserName(
292
- user.profile.name
293
- ) : "" }),
294
- anchorElSettingsMenu ? /* @__PURE__ */ jsx(ArrowDropUp, { sx: styles.arrowIcon }) : /* @__PURE__ */ jsx(ArrowDropDown, { sx: styles.arrowIcon })
295
- ]
296
- }
297
- ),
298
- /* @__PURE__ */ jsx(
299
- Popper,
300
- {
301
- sx: styles.settingsMenu,
302
- open: Boolean(anchorElSettingsMenu),
303
- anchorEl: anchorElSettingsMenu,
304
- children: /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(
305
- ClickAwayListener,
306
- {
307
- onClickAway: handleCloseSettingsMenu,
308
- children: /* @__PURE__ */ jsxs(MenuList, { id: "settings-menu", children: [
309
- /* @__PURE__ */ jsxs(
310
- StyledMenuItem,
311
- {
312
- sx: styles.borderBottom,
313
- disabled: true,
314
- style: { opacity: "1" },
315
- children: [
316
- /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(Person, { fontSize: "small" }) }),
317
- /* @__PURE__ */ jsx(ListItemText, { disabled: false, children: user !== null && /* @__PURE__ */ jsxs(
318
- Box,
319
- {
320
- component: "span",
321
- sx: styles.sizeLabel,
322
- children: [
323
- user.profile.name,
324
- " ",
325
- /* @__PURE__ */ jsx("br", {}),
326
- /* @__PURE__ */ jsx(
327
- Box,
328
- {
329
- component: "span",
330
- sx: styles.userMail,
331
- children: user.profile.email
332
- }
333
- )
334
- ]
335
- }
336
- ) })
337
- ]
338
- }
339
- ),
340
- /* @__PURE__ */ jsxs(
341
- StyledMenuItem,
342
- {
343
- disabled: true,
344
- style: {
345
- opacity: "1",
346
- paddingTop: "10px",
347
- paddingBottom: "10px",
348
- backgroundColor: "transparent"
349
- },
350
- children: [
351
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
352
- Typography,
353
- {
354
- sx: styles.sizeLabel,
355
- children: /* @__PURE__ */ jsx(
356
- FormattedMessage,
343
+ ) }),
344
+ /* @__PURE__ */ jsxs(
345
+ ToggleButtonGroup,
346
+ {
347
+ exclusive: true,
348
+ value: theme,
349
+ size: "large",
350
+ sx: styles.toggleButtonGroup,
351
+ onChange: changeTheme,
352
+ children: [
353
+ /* @__PURE__ */ jsx(
354
+ ToggleButton,
357
355
  {
358
- id: "top-bar/displayMode",
359
- defaultMessage: "Display mode"
356
+ value: LIGHT_THEME,
357
+ "aria-label": LIGHT_THEME,
358
+ sx: styles.toggleButton,
359
+ children: /* @__PURE__ */ jsx(WbSunny, { fontSize: "small" })
360
360
  }
361
- )
362
- }
363
- ) }),
364
- /* @__PURE__ */ jsxs(
365
- ToggleButtonGroup,
366
- {
367
- exclusive: true,
368
- value: theme,
369
- size: "large",
370
- sx: styles.toggleButtonGroup,
371
- onChange: changeTheme,
372
- children: [
373
- /* @__PURE__ */ jsx(
374
- ToggleButton,
375
- {
376
- value: LIGHT_THEME,
377
- "aria-label": LIGHT_THEME,
378
- sx: styles.toggleButton,
379
- children: /* @__PURE__ */ jsx(WbSunny, { fontSize: "small" })
380
- }
381
- ),
382
- /* @__PURE__ */ jsx(
383
- ToggleButton,
384
- {
385
- value: DARK_THEME,
386
- "aria-label": DARK_THEME,
387
- sx: styles.toggleButton,
388
- children: /* @__PURE__ */ jsx(Brightness3, { fontSize: "small" })
389
- }
390
- )
391
- ]
392
- }
393
- )
394
- ]
395
- }
396
- ),
397
- onEquipmentLabellingClick && /* @__PURE__ */ jsxs(
398
- StyledMenuItem,
399
- {
400
- disabled: true,
401
- style: {
402
- opacity: "1",
403
- // padding: '0',
404
- paddingTop: "10px",
405
- paddingBottom: "10px",
406
- backgroundColor: "transparent"
407
- },
408
- children: [
409
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
410
- Typography,
411
- {
412
- sx: styles.sizeLabel,
413
- children: /* @__PURE__ */ jsx(
414
- FormattedMessage,
361
+ ),
362
+ /* @__PURE__ */ jsx(
363
+ ToggleButton,
415
364
  {
416
- id: "top-bar/equipmentLabel",
417
- defaultMessage: "Equipment label"
365
+ value: DARK_THEME,
366
+ "aria-label": DARK_THEME,
367
+ sx: styles.toggleButton,
368
+ children: /* @__PURE__ */ jsx(Brightness3, { fontSize: "small" })
418
369
  }
419
370
  )
420
- }
421
- ) }),
422
- /* @__PURE__ */ jsxs(
423
- ToggleButtonGroup,
424
- {
425
- exclusive: true,
426
- value: equipmentLabelling,
427
- sx: styles.toggleButtonGroup,
428
- onChange: changeEquipmentLabelling,
429
- children: [
430
- /* @__PURE__ */ jsx(
431
- ToggleButton,
432
- {
433
- value: false,
434
- sx: styles.toggleButton,
435
- children: /* @__PURE__ */ jsx(
436
- FormattedMessage,
437
- {
438
- id: "top-bar/id",
439
- defaultMessage: "Id"
440
- }
441
- )
442
- }
443
- ),
444
- /* @__PURE__ */ jsx(
445
- ToggleButton,
446
- {
447
- value: true,
448
- sx: styles.toggleButton,
449
- children: /* @__PURE__ */ jsx(
450
- FormattedMessage,
451
- {
452
- id: "top-bar/name",
453
- defaultMessage: "Name"
454
- }
455
- )
456
- }
457
- )
458
- ]
459
- }
460
- )
461
- ]
462
- }
463
- ),
464
- /* @__PURE__ */ jsxs(
465
- StyledMenuItem,
466
- {
467
- disabled: true,
468
- style: {
469
- opacity: "1",
470
- paddingTop: "10px",
471
- paddingBottom: "10px",
472
- backgroundColor: "transparent"
473
- },
474
- children: [
475
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
476
- Typography,
477
- {
478
- sx: styles.sizeLabel,
479
- children: /* @__PURE__ */ jsx(
480
- FormattedMessage,
371
+ ]
372
+ }
373
+ )
374
+ ]
375
+ }
376
+ ),
377
+ onEquipmentLabellingClick && /* @__PURE__ */ jsxs(
378
+ StyledMenuItem,
379
+ {
380
+ disabled: true,
381
+ style: {
382
+ opacity: "1",
383
+ // padding: '0',
384
+ paddingTop: "10px",
385
+ paddingBottom: "10px",
386
+ backgroundColor: "transparent"
387
+ },
388
+ children: [
389
+ /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
390
+ Typography,
391
+ {
392
+ sx: styles.sizeLabel,
393
+ children: /* @__PURE__ */ jsx(
394
+ FormattedMessage,
395
+ {
396
+ id: "top-bar/equipmentLabel",
397
+ defaultMessage: "Equipment label"
398
+ }
399
+ )
400
+ }
401
+ ) }),
402
+ /* @__PURE__ */ jsxs(
403
+ ToggleButtonGroup,
404
+ {
405
+ exclusive: true,
406
+ value: equipmentLabelling,
407
+ sx: styles.toggleButtonGroup,
408
+ onChange: changeEquipmentLabelling,
409
+ children: [
410
+ /* @__PURE__ */ jsx(
411
+ ToggleButton,
481
412
  {
482
- id: "top-bar/language",
483
- defaultMessage: "Language"
413
+ value: false,
414
+ sx: styles.toggleButton,
415
+ children: /* @__PURE__ */ jsx(
416
+ FormattedMessage,
417
+ {
418
+ id: "top-bar/id",
419
+ defaultMessage: "Id"
420
+ }
421
+ )
484
422
  }
485
- )
486
- }
487
- ) }),
488
- /* @__PURE__ */ jsxs(
489
- ToggleButtonGroup,
490
- {
491
- exclusive: true,
492
- value: language,
493
- sx: styles.toggleButtonGroup,
494
- onChange: changeLanguage,
495
- children: [
496
- /* @__PURE__ */ jsx(
497
- ToggleButton,
498
- {
499
- value: LANG_SYSTEM,
500
- "aria-label": LANG_SYSTEM,
501
- sx: styles.languageToggleButton,
502
- children: /* @__PURE__ */ jsx(Computer, {})
503
- }
504
- ),
505
- /* @__PURE__ */ jsx(
506
- ToggleButton,
507
- {
508
- value: LANG_ENGLISH,
509
- "aria-label": LANG_ENGLISH,
510
- sx: styles.languageToggleButton,
511
- children: EN
512
- }
513
- ),
514
- /* @__PURE__ */ jsx(
515
- ToggleButton,
516
- {
517
- value: LANG_FRENCH,
518
- "aria-label": LANG_FRENCH,
519
- sx: styles.toggleButton,
520
- children: FR
521
- }
522
- )
523
- ]
524
- }
525
- )
526
- ]
527
- }
528
- ),
529
- onParametersClick && /* @__PURE__ */ jsxs(
530
- StyledMenuItem,
531
- {
532
- onClick: onParametersClicked,
533
- sx: styles.borderTop,
534
- children: [
535
- /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(Settings, { fontSize: "small" }) }),
536
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
537
- Typography,
538
- {
539
- sx: styles.sizeLabel,
540
- children: /* @__PURE__ */ jsx(
541
- FormattedMessage,
423
+ ),
424
+ /* @__PURE__ */ jsx(
425
+ ToggleButton,
542
426
  {
543
- id: "top-bar/settings",
544
- defaultMessage: "Settings"
427
+ value: true,
428
+ sx: styles.toggleButton,
429
+ children: /* @__PURE__ */ jsx(
430
+ FormattedMessage,
431
+ {
432
+ id: "top-bar/name",
433
+ defaultMessage: "Name"
434
+ }
435
+ )
545
436
  }
546
437
  )
547
- }
548
- ) })
549
- ]
550
- }
551
- ),
552
- /* @__PURE__ */ jsxs(
553
- StyledMenuItem,
554
- {
555
- sx: styles.borderBottom,
556
- style: { opacity: "1" },
557
- onClick: onAboutClicked,
558
- children: [
559
- /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(HelpOutline, { fontSize: "small" }) }),
560
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
561
- Typography,
562
- {
563
- sx: styles.sizeLabel,
564
- children: /* @__PURE__ */ jsx(
565
- FormattedMessage,
438
+ ]
439
+ }
440
+ )
441
+ ]
442
+ }
443
+ ),
444
+ /* @__PURE__ */ jsxs(
445
+ StyledMenuItem,
446
+ {
447
+ disabled: true,
448
+ style: {
449
+ opacity: "1",
450
+ paddingTop: "10px",
451
+ paddingBottom: "10px",
452
+ backgroundColor: "transparent"
453
+ },
454
+ children: [
455
+ /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
456
+ Typography,
457
+ {
458
+ sx: styles.sizeLabel,
459
+ children: /* @__PURE__ */ jsx(
460
+ FormattedMessage,
461
+ {
462
+ id: "top-bar/language",
463
+ defaultMessage: "Language"
464
+ }
465
+ )
466
+ }
467
+ ) }),
468
+ /* @__PURE__ */ jsxs(
469
+ ToggleButtonGroup,
470
+ {
471
+ exclusive: true,
472
+ value: language,
473
+ sx: styles.toggleButtonGroup,
474
+ onChange: changeLanguage,
475
+ children: [
476
+ /* @__PURE__ */ jsx(
477
+ ToggleButton,
566
478
  {
567
- id: "top-bar/about",
568
- defaultMessage: "About"
479
+ value: LANG_SYSTEM,
480
+ "aria-label": LANG_SYSTEM,
481
+ sx: styles.languageToggleButton,
482
+ children: /* @__PURE__ */ jsx(Computer, {})
569
483
  }
570
- )
571
- }
572
- ) })
573
- ]
574
- }
575
- ),
576
- fullScreenSupported() && /* @__PURE__ */ jsx(
577
- StyledMenuItem,
578
- {
579
- onClick: requestOrExitFullScreen,
580
- children: isFullScreen ? /* @__PURE__ */ jsxs(Fragment, { children: [
581
- /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(FullscreenExit, { fontSize: "small" }) }),
582
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
583
- Typography,
584
- {
585
- sx: styles.sizeLabel,
586
- children: /* @__PURE__ */ jsx(
587
- FormattedMessage,
484
+ ),
485
+ /* @__PURE__ */ jsx(
486
+ ToggleButton,
588
487
  {
589
- id: "top-bar/exitFullScreen",
590
- defaultMessage: "Exit full screen mode"
488
+ value: LANG_ENGLISH,
489
+ "aria-label": LANG_ENGLISH,
490
+ sx: styles.languageToggleButton,
491
+ children: EN
591
492
  }
592
- )
593
- }
594
- ) })
595
- ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
596
- /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(Fullscreen, { fontSize: "small" }) }),
597
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
598
- Typography,
599
- {
600
- sx: styles.sizeLabel,
601
- children: /* @__PURE__ */ jsx(
602
- FormattedMessage,
493
+ ),
494
+ /* @__PURE__ */ jsx(
495
+ ToggleButton,
603
496
  {
604
- id: "top-bar/goFullScreen",
605
- defaultMessage: "Full screen"
497
+ value: LANG_FRENCH,
498
+ "aria-label": LANG_FRENCH,
499
+ sx: styles.toggleButton,
500
+ children: FR
606
501
  }
607
502
  )
608
- }
609
- ) })
610
- ] })
503
+ ]
504
+ }
505
+ )
506
+ ]
507
+ }
508
+ ),
509
+ onParametersClick && /* @__PURE__ */ jsxs(
510
+ StyledMenuItem,
511
+ {
512
+ onClick: onParametersClicked,
513
+ sx: styles.borderTop,
514
+ children: [
515
+ /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(Settings, { fontSize: "small" }) }),
516
+ /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
517
+ Typography,
518
+ {
519
+ sx: styles.sizeLabel,
520
+ children: /* @__PURE__ */ jsx(
521
+ FormattedMessage,
522
+ {
523
+ id: "top-bar/settings",
524
+ defaultMessage: "Settings"
525
+ }
526
+ )
527
+ }
528
+ ) })
529
+ ]
530
+ }
531
+ ),
532
+ /* @__PURE__ */ jsxs(
533
+ StyledMenuItem,
534
+ {
535
+ sx: styles.borderBottom,
536
+ style: { opacity: "1" },
537
+ onClick: onAboutClicked,
538
+ children: [
539
+ /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(HelpOutline, { fontSize: "small" }) }),
540
+ /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
541
+ Typography,
542
+ {
543
+ sx: styles.sizeLabel,
544
+ children: /* @__PURE__ */ jsx(
545
+ FormattedMessage,
546
+ {
547
+ id: "top-bar/about",
548
+ defaultMessage: "About"
549
+ }
550
+ )
551
+ }
552
+ ) })
553
+ ]
554
+ }
555
+ ),
556
+ /* @__PURE__ */ jsxs(StyledMenuItem, { onClick: onLogoutClick, children: [
557
+ /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(ExitToApp, { fontSize: "small" }) }),
558
+ /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
559
+ Typography,
560
+ {
561
+ sx: styles.sizeLabel,
562
+ children: /* @__PURE__ */ jsx(
563
+ FormattedMessage,
564
+ {
565
+ id: "top-bar/logout",
566
+ defaultMessage: "Logout"
567
+ }
568
+ )
611
569
  }
612
- ),
613
- /* @__PURE__ */ jsxs(StyledMenuItem, { onClick: onLogoutClick, children: [
614
- /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(ExitToApp, { fontSize: "small" }) }),
615
- /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(
616
- Typography,
617
- {
618
- sx: styles.sizeLabel,
619
- children: /* @__PURE__ */ jsx(
620
- FormattedMessage,
621
- {
622
- id: "top-bar/logout",
623
- defaultMessage: "Logout"
624
- }
625
- )
626
- }
627
- ) })
628
- ] })
570
+ ) })
629
571
  ] })
630
- }
631
- ) })
632
- }
633
- )
634
- ] }),
635
- /* @__PURE__ */ jsx(
636
- AboutDialog,
637
- {
638
- open: isAboutDialogOpen,
639
- onClose: () => setAboutDialogOpen(false),
640
- appName,
641
- appVersion,
642
- appLicense,
643
- globalVersionPromise,
644
- additionalModulesPromise
572
+ ] })
573
+ }
574
+ ) })
645
575
  }
646
576
  )
647
- ] })
648
- ] });
577
+ ] }),
578
+ /* @__PURE__ */ jsx(
579
+ AboutDialog,
580
+ {
581
+ open: isAboutDialogOpen,
582
+ onClose: () => setAboutDialogOpen(false),
583
+ appName,
584
+ appVersion,
585
+ appLicense,
586
+ globalVersionPromise,
587
+ additionalModulesPromise
588
+ }
589
+ )
590
+ ] }) });
649
591
  };
650
592
  TopBar.propTypes = {
651
593
  onParametersClick: PropTypes.func,