@carto/meridian-ds 1.4.5-alpha-external-link.2 → 1.4.5-alpha-external-link.3

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/CHANGELOG.md CHANGED
@@ -3,6 +3,7 @@
3
3
  ## Unreleased
4
4
 
5
5
  - New Link and ExternalLink components [#202](https://github.com/CartoDB/meridian-ds/pull/202)
6
+ - Fix tooltips in ChartLegend pagination buttons [201](https://github.com/CartoDB/meridian-ds/pull/201)
6
7
 
7
8
  ## 1.0
8
9
 
@@ -1,7 +1,65 @@
1
- import { jsxs, jsx } from "react/jsx-runtime";
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { forwardRef, useState } from "react";
3
- import { styled, Box, Link as Link$1, Alert as Alert$1, Fade, AlertTitle } from "@mui/material";
4
- import { b as ICON_SIZE_MEDIUM, T as Typography } from "./TablePaginationActions-KpTvhN4Y.js";
3
+ import { styled, IconButton as IconButton$1, Tooltip, CircularProgress, Box, Link as Link$1, Alert as Alert$1, Fade, AlertTitle } from "@mui/material";
4
+ import { b as ICON_SIZE_MEDIUM, T as Typography } from "./TablePaginationActions-b5wP_uRE.js";
5
+ const Option = styled("div")(({ theme }) => ({
6
+ position: "relative",
7
+ display: "inline-flex",
8
+ // TODO: Remove this once we have a better way to handle the spacing between icon buttons:
9
+ // https://app.shortcut.com/cartoteam/story/471284/create-iconbuttongroup-component-to-properly-group-several-icons
10
+ "& + &, & + .optionIconButton": {
11
+ marginLeft: theme.spacing(0.5)
12
+ }
13
+ }));
14
+ const StyledIconButton = styled(IconButton$1, {
15
+ shouldForwardProp: (prop) => !["active"].includes(prop)
16
+ })(({ active, theme }) => ({
17
+ ...active && {
18
+ color: theme.palette.primary.main,
19
+ backgroundColor: theme.palette.primary.background,
20
+ "& svg:not(.doNotFillIcon) path": {
21
+ fill: theme.palette.primary.main
22
+ }
23
+ }
24
+ }));
25
+ function _IconButton({
26
+ tooltip,
27
+ tooltipPlacement = "top",
28
+ icon,
29
+ size = "medium",
30
+ variant = "icon",
31
+ color = "default",
32
+ sx,
33
+ className,
34
+ loading,
35
+ disabled,
36
+ active,
37
+ ...props
38
+ }, ref) {
39
+ return /* @__PURE__ */ jsx(Tooltip, { placement: tooltipPlacement, title: tooltip ?? "", children: /* @__PURE__ */ jsx(
40
+ Option,
41
+ {
42
+ className: `optionIconButton ${className ?? ""}`,
43
+ sx,
44
+ "data-testid": "icon-button",
45
+ children: /* @__PURE__ */ jsx(
46
+ StyledIconButton,
47
+ {
48
+ ...props,
49
+ ref,
50
+ size,
51
+ variant,
52
+ color,
53
+ active,
54
+ disabled: disabled || loading,
55
+ role: "button",
56
+ children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 18, color: "inherit" }) : icon
57
+ }
58
+ )
59
+ }
60
+ ) });
61
+ }
62
+ const IconButton = forwardRef(_IconButton);
5
63
  const Icon = styled(Box)(({ theme }) => ({
6
64
  position: "relative",
7
65
  display: "inline-block",
@@ -9,12 +67,23 @@ const Icon = styled(Box)(({ theme }) => ({
9
67
  top: "calc(1em * 5.0/32)"
10
68
  // heuristic to align icon with true perceived baseline
11
69
  }));
12
- function _Link({ children, startIcon, endIcon, ...otherProps }, ref) {
13
- return /* @__PURE__ */ jsxs(Link$1, { ...otherProps, ref, children: [
14
- startIcon && /* @__PURE__ */ jsx(Icon, { children: startIcon }),
15
- children,
16
- endIcon && /* @__PURE__ */ jsx(Icon, { children: endIcon })
17
- ] });
70
+ function _Link({ children, startIcon, endIcon, color, ...otherProps }, ref) {
71
+ return /* @__PURE__ */ jsxs(
72
+ Link$1,
73
+ {
74
+ ...otherProps,
75
+ "data-color": color,
76
+ "data-name": "link",
77
+ role: "link",
78
+ color,
79
+ ref,
80
+ children: [
81
+ startIcon && /* @__PURE__ */ jsx(Icon, { children: startIcon }),
82
+ children,
83
+ endIcon && /* @__PURE__ */ jsx(Icon, { children: endIcon })
84
+ ]
85
+ }
86
+ );
18
87
  }
19
88
  const Link = forwardRef(_Link);
20
89
  const StyledAlert = styled(Alert$1, {
@@ -146,5 +215,6 @@ function _Alert({
146
215
  const Alert = forwardRef(_Alert);
147
216
  export {
148
217
  Alert as A,
218
+ IconButton as I,
149
219
  Link as L
150
220
  };
@@ -2,7 +2,65 @@
2
2
  const jsxRuntime = require("react/jsx-runtime");
3
3
  const React = require("react");
4
4
  const material = require("@mui/material");
5
- const TablePaginationActions = require("./TablePaginationActions-CFGXm44W.cjs");
5
+ const TablePaginationActions = require("./TablePaginationActions-CAmwcyTy.cjs");
6
+ const Option = material.styled("div")(({ theme }) => ({
7
+ position: "relative",
8
+ display: "inline-flex",
9
+ // TODO: Remove this once we have a better way to handle the spacing between icon buttons:
10
+ // https://app.shortcut.com/cartoteam/story/471284/create-iconbuttongroup-component-to-properly-group-several-icons
11
+ "& + &, & + .optionIconButton": {
12
+ marginLeft: theme.spacing(0.5)
13
+ }
14
+ }));
15
+ const StyledIconButton = material.styled(material.IconButton, {
16
+ shouldForwardProp: (prop) => !["active"].includes(prop)
17
+ })(({ active, theme }) => ({
18
+ ...active && {
19
+ color: theme.palette.primary.main,
20
+ backgroundColor: theme.palette.primary.background,
21
+ "& svg:not(.doNotFillIcon) path": {
22
+ fill: theme.palette.primary.main
23
+ }
24
+ }
25
+ }));
26
+ function _IconButton({
27
+ tooltip,
28
+ tooltipPlacement = "top",
29
+ icon,
30
+ size = "medium",
31
+ variant = "icon",
32
+ color = "default",
33
+ sx,
34
+ className,
35
+ loading,
36
+ disabled,
37
+ active,
38
+ ...props
39
+ }, ref) {
40
+ return /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { placement: tooltipPlacement, title: tooltip ?? "", children: /* @__PURE__ */ jsxRuntime.jsx(
41
+ Option,
42
+ {
43
+ className: `optionIconButton ${className ?? ""}`,
44
+ sx,
45
+ "data-testid": "icon-button",
46
+ children: /* @__PURE__ */ jsxRuntime.jsx(
47
+ StyledIconButton,
48
+ {
49
+ ...props,
50
+ ref,
51
+ size,
52
+ variant,
53
+ color,
54
+ active,
55
+ disabled: disabled || loading,
56
+ role: "button",
57
+ children: loading ? /* @__PURE__ */ jsxRuntime.jsx(material.CircularProgress, { size: 18, color: "inherit" }) : icon
58
+ }
59
+ )
60
+ }
61
+ ) });
62
+ }
63
+ const IconButton = React.forwardRef(_IconButton);
6
64
  const Icon = material.styled(material.Box)(({ theme }) => ({
7
65
  position: "relative",
8
66
  display: "inline-block",
@@ -10,12 +68,23 @@ const Icon = material.styled(material.Box)(({ theme }) => ({
10
68
  top: "calc(1em * 5.0/32)"
11
69
  // heuristic to align icon with true perceived baseline
12
70
  }));
13
- function _Link({ children, startIcon, endIcon, ...otherProps }, ref) {
14
- return /* @__PURE__ */ jsxRuntime.jsxs(material.Link, { ...otherProps, ref, children: [
15
- startIcon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { children: startIcon }),
16
- children,
17
- endIcon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { children: endIcon })
18
- ] });
71
+ function _Link({ children, startIcon, endIcon, color, ...otherProps }, ref) {
72
+ return /* @__PURE__ */ jsxRuntime.jsxs(
73
+ material.Link,
74
+ {
75
+ ...otherProps,
76
+ "data-color": color,
77
+ "data-name": "link",
78
+ role: "link",
79
+ color,
80
+ ref,
81
+ children: [
82
+ startIcon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { children: startIcon }),
83
+ children,
84
+ endIcon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { children: endIcon })
85
+ ]
86
+ }
87
+ );
19
88
  }
20
89
  const Link = React.forwardRef(_Link);
21
90
  const StyledAlert = material.styled(material.Alert, {
@@ -146,4 +215,5 @@ function _Alert({
146
215
  }
147
216
  const Alert = React.forwardRef(_Alert);
148
217
  exports.Alert = Alert;
218
+ exports.IconButton = IconButton;
149
219
  exports.Link = Link;
@@ -814,7 +814,8 @@ const en = {
814
814
  copy: "Copy",
815
815
  save: "Save",
816
816
  add: "Add",
817
- showOptions: "Show options"
817
+ showOptions: "Show options",
818
+ opensInNewTab: "Opens in new tab"
818
819
  },
819
820
  form: {
820
821
  selectAll: "Select all",
@@ -962,7 +963,8 @@ const es = {
962
963
  copy: "Copiar",
963
964
  save: "Guardar",
964
965
  add: "Añadir",
965
- showOptions: "Mostrar opciones"
966
+ showOptions: "Mostrar opciones",
967
+ opensInNewTab: "Abre en una nueva pestaña"
966
968
  },
967
969
  form: {
968
970
  selectAll: "Seleccionar todos",
@@ -1108,7 +1110,8 @@ const id = {
1108
1110
  copy: "Salin",
1109
1111
  save: "Simpan",
1110
1112
  add: "Tambah",
1111
- showOptions: "Tampilkan opsi"
1113
+ showOptions: "Tampilkan opsi",
1114
+ opensInNewTab: "Buka di tab baru"
1112
1115
  },
1113
1116
  form: {
1114
1117
  selectAll: "Select all",
@@ -813,7 +813,8 @@ const en = {
813
813
  copy: "Copy",
814
814
  save: "Save",
815
815
  add: "Add",
816
- showOptions: "Show options"
816
+ showOptions: "Show options",
817
+ opensInNewTab: "Opens in new tab"
817
818
  },
818
819
  form: {
819
820
  selectAll: "Select all",
@@ -961,7 +962,8 @@ const es = {
961
962
  copy: "Copiar",
962
963
  save: "Guardar",
963
964
  add: "Añadir",
964
- showOptions: "Mostrar opciones"
965
+ showOptions: "Mostrar opciones",
966
+ opensInNewTab: "Abre en una nueva pestaña"
965
967
  },
966
968
  form: {
967
969
  selectAll: "Seleccionar todos",
@@ -1107,7 +1109,8 @@ const id = {
1107
1109
  copy: "Salin",
1108
1110
  save: "Simpan",
1109
1111
  add: "Tambah",
1110
- showOptions: "Tampilkan opsi"
1112
+ showOptions: "Tampilkan opsi",
1113
+ opensInNewTab: "Buka di tab baru"
1111
1114
  },
1112
1115
  form: {
1113
1116
  selectAll: "Select all",
@@ -3,11 +3,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const jsxRuntime = require("react/jsx-runtime");
4
4
  const React = require("react");
5
5
  const material = require("@mui/material");
6
- const TablePaginationActions = require("../TablePaginationActions-CFGXm44W.cjs");
6
+ const TablePaginationActions = require("../TablePaginationActions-CAmwcyTy.cjs");
7
7
  const reactIntl = require("react-intl");
8
8
  const iconsMaterial = require("@mui/icons-material");
9
+ const Alert$1 = require("../Alert-hun6016k.cjs");
9
10
  const styles = require("@mui/material/styles");
10
- const Alert$1 = require("../Alert-CVfTyHiz.cjs");
11
11
  require("cartocolor");
12
12
  const MenuItem = require("../MenuItem-Br2jY2lt.cjs");
13
13
  const ArrowDown = require("../ArrowDown-8fLj23Ge.cjs");
@@ -382,71 +382,12 @@ function ToggleButtonGroup({
382
382
  }
383
383
  );
384
384
  }
385
- const Option = material.styled("div")(({ theme }) => ({
386
- position: "relative",
387
- display: "inline-flex",
388
- // TODO: Remove this once we have a better way to handle the spacing between icon buttons:
389
- // https://app.shortcut.com/cartoteam/story/471284/create-iconbuttongroup-component-to-properly-group-several-icons
390
- "& + &, & + .optionIconButton": {
391
- marginLeft: theme.spacing(0.5)
392
- }
393
- }));
394
- const StyledIconButton = material.styled(material.IconButton, {
395
- shouldForwardProp: (prop) => !["active"].includes(prop)
396
- })(({ active, theme }) => ({
397
- ...active && {
398
- color: theme.palette.primary.main,
399
- backgroundColor: theme.palette.primary.background,
400
- "& svg:not(.doNotFillIcon) path": {
401
- fill: theme.palette.primary.main
402
- }
403
- }
404
- }));
405
- function _IconButton({
406
- tooltip,
407
- tooltipPlacement = "top",
408
- icon,
409
- size = "medium",
410
- variant = "icon",
411
- color = "default",
412
- sx,
413
- className,
414
- loading,
415
- disabled,
416
- active,
417
- ...props
418
- }, ref) {
419
- return /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { placement: tooltipPlacement, title: tooltip ?? "", children: /* @__PURE__ */ jsxRuntime.jsx(
420
- Option,
421
- {
422
- className: `optionIconButton ${className ?? ""}`,
423
- sx,
424
- "data-testid": "icon-button",
425
- children: /* @__PURE__ */ jsxRuntime.jsx(
426
- StyledIconButton,
427
- {
428
- ...props,
429
- ref,
430
- size,
431
- variant,
432
- color,
433
- active,
434
- disabled: disabled || loading,
435
- role: "button",
436
- children: loading ? /* @__PURE__ */ jsxRuntime.jsx(material.CircularProgress, { size: 18, color: "inherit" }) : icon
437
- }
438
- )
439
- }
440
- ) });
441
- }
442
- const IconButton = React.forwardRef(_IconButton);
443
385
  const externalLinkProps = {
444
386
  target: "_blank",
445
387
  rel: "noopener noreferrer"
446
388
  };
447
389
  const IconOpenInNewOutlined = styles.styled(iconsMaterial.OpenInNewOutlined)(() => ({
448
390
  fontSize: "1em",
449
- // in some place, like alerts all svg/icon colors are overriden, so force color to link color
450
391
  color: "inherit !important",
451
392
  "> path": {
452
393
  color: "inherit !important"
@@ -457,9 +398,10 @@ function _ExternalLink({
457
398
  showIcon = true,
458
399
  useButton = false,
459
400
  icon = /* @__PURE__ */ jsxRuntime.jsx(IconOpenInNewOutlined, {}),
460
- fontWeight = "medium",
461
401
  ...props
462
402
  }, ref) {
403
+ const intl = reactIntl.useIntl();
404
+ const intlConfig = TablePaginationActions.useImperativeIntl(intl);
463
405
  if (useButton) {
464
406
  return /* @__PURE__ */ jsxRuntime.jsx(
465
407
  Button,
@@ -477,9 +419,11 @@ function _ExternalLink({
477
419
  {
478
420
  ...externalLinkProps,
479
421
  endIcon: showIcon && icon,
480
- fontWeight,
481
422
  ...props,
482
423
  ref,
424
+ "aria-label": `${children == null ? void 0 : children.toString()} (${intlConfig.formatMessage({
425
+ id: "c4r.button.opensInNewTab"
426
+ })})`,
483
427
  children
484
428
  }
485
429
  );
@@ -1527,7 +1471,7 @@ const _CopiableComponent = ({
1527
1471
  children: [
1528
1472
  children,
1529
1473
  button && /* @__PURE__ */ jsxRuntime.jsx(
1530
- IconButton,
1474
+ Alert$1.IconButton,
1531
1475
  {
1532
1476
  ...buttonProps,
1533
1477
  disabled,
@@ -1786,7 +1730,7 @@ function Snackbar({
1786
1730
  }
1787
1731
  ),
1788
1732
  closeable && /* @__PURE__ */ jsxRuntime.jsx(CloseButtonWrapper, { children: /* @__PURE__ */ jsxRuntime.jsx(
1789
- IconButton,
1733
+ Alert$1.IconButton,
1790
1734
  {
1791
1735
  color: "default",
1792
1736
  onClick: (e) => onClose(e, "timeout"),
@@ -3036,7 +2980,7 @@ function CodeAreaHeader({
3036
2980
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3037
2981
  /* @__PURE__ */ jsxRuntime.jsxs(Header, { size, "data-size": size, "data-name": "code-area-header", children: [
3038
2982
  /* @__PURE__ */ jsxRuntime.jsx(
3039
- IconButton,
2983
+ Alert$1.IconButton,
3040
2984
  {
3041
2985
  color: "default",
3042
2986
  size,
@@ -3100,7 +3044,7 @@ function CodeAreaHeader({
3100
3044
  }
3101
3045
  ),
3102
3046
  showExpandButton && /* @__PURE__ */ jsxRuntime.jsx(
3103
- IconButton,
3047
+ Alert$1.IconButton,
3104
3048
  {
3105
3049
  color: "default",
3106
3050
  size,
@@ -4590,6 +4534,7 @@ function CodeAreaDialog({
4590
4534
  exports.TablePaginationActions = TablePaginationActions.TablePaginationActions;
4591
4535
  exports.Typography = TablePaginationActions.Typography;
4592
4536
  exports.Alert = Alert$1.Alert;
4537
+ exports.IconButton = Alert$1.IconButton;
4593
4538
  exports.Link = Alert$1.Link;
4594
4539
  exports.MenuItem = MenuItem.MenuItem;
4595
4540
  exports.AccordionGroup = AccordionGroup;
@@ -4621,7 +4566,6 @@ exports.DialogHeader = DialogHeader;
4621
4566
  exports.DialogPaper = DialogPaper;
4622
4567
  exports.DialogStepper = DialogStepper;
4623
4568
  exports.ExternalLink = ExternalLink;
4624
- exports.IconButton = IconButton;
4625
4569
  exports.LabelWithIndicator = LabelWithIndicator;
4626
4570
  exports.Menu = Menu$1;
4627
4571
  exports.MenuItemFilter = MenuItemFilter;
@@ -1,12 +1,12 @@
1
1
  import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
2
  import { forwardRef, useState, useEffect, useMemo, useRef, Fragment as Fragment$1, useImperativeHandle, useCallback } from "react";
3
- import { styled, Box, Button as Button$1, CircularProgress, TextField, InputAdornment, IconButton as IconButton$1, Tooltip, Select, MenuItem, FormControl, InputLabel, FormHelperText, ToggleButtonGroup as ToggleButtonGroup$1, Menu as Menu$2, MenuList as MenuList$1, Link as Link$1, Checkbox, ListItemText, Autocomplete as Autocomplete$1, Divider, ListItemIcon, createFilterOptions, Accordion, AccordionSummary, AccordionDetails, Avatar as Avatar$1, Snackbar as Snackbar$1, Portal, Fade, Slide, alpha, useTheme, Toolbar, AppBar as AppBar$1, Paper, Dialog as Dialog$1, DialogTitle as DialogTitle$1, Chip, DialogContent as DialogContent$1, DialogActions as DialogActions$1 } from "@mui/material";
4
- import { T as Typography, c as ICON_SIZE_SMALL, u as useImperativeIntl, N as NOTIFICATION_DURATION_IN_MS, A as APPBAR_SIZE } from "../TablePaginationActions-KpTvhN4Y.js";
5
- import { a } from "../TablePaginationActions-KpTvhN4Y.js";
3
+ import { styled, Box, Button as Button$1, CircularProgress, TextField, InputAdornment, IconButton, Tooltip, Select, MenuItem, FormControl, InputLabel, FormHelperText, ToggleButtonGroup as ToggleButtonGroup$1, Menu as Menu$2, MenuList as MenuList$1, Link as Link$1, Checkbox, ListItemText, Autocomplete as Autocomplete$1, Divider, ListItemIcon, createFilterOptions, Accordion, AccordionSummary, AccordionDetails, Avatar as Avatar$1, Snackbar as Snackbar$1, Portal, Fade, Slide, alpha, useTheme, Toolbar, AppBar as AppBar$1, Paper, Dialog as Dialog$1, DialogTitle as DialogTitle$1, Chip, DialogContent as DialogContent$1, DialogActions as DialogActions$1 } from "@mui/material";
4
+ import { T as Typography, c as ICON_SIZE_SMALL, u as useImperativeIntl, N as NOTIFICATION_DURATION_IN_MS, A as APPBAR_SIZE } from "../TablePaginationActions-b5wP_uRE.js";
5
+ import { a } from "../TablePaginationActions-b5wP_uRE.js";
6
6
  import { useIntl } from "react-intl";
7
7
  import { VisibilityOffOutlined, VisibilityOutlined, OpenInNewOutlined, Cancel, AddCircleOutlineOutlined, ContentCopyOutlined, CloseOutlined, MenuOutlined, HelpOutline, TodayOutlined, MoreVertOutlined, ErrorOutline, Check } from "@mui/icons-material";
8
+ import { L as Link, I as IconButton$1, A as Alert$1 } from "../Alert-CETC14v2.js";
8
9
  import { styled as styled$1 } from "@mui/material/styles";
9
- import { L as Link, A as Alert$1 } from "../Alert-BcaaL6lM.js";
10
10
  import "cartocolor";
11
11
  import { M as MenuItem$1 } from "../MenuItem-CXnnE5lK.js";
12
12
  import { A as ArrowDown } from "../ArrowDown-CY_wMVJT.js";
@@ -159,7 +159,7 @@ function _PasswordField({ InputProps, size = "small", ...otherProps }, ref) {
159
159
  size,
160
160
  InputProps: {
161
161
  ...InputProps,
162
- endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(IconButton$1, { size, onClick: handleClickShowPassword, children: /* @__PURE__ */ jsx(
162
+ endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(IconButton, { size, onClick: handleClickShowPassword, children: /* @__PURE__ */ jsx(
163
163
  Tooltip,
164
164
  {
165
165
  title: intlConfig.formatMessage({
@@ -381,71 +381,12 @@ function ToggleButtonGroup({
381
381
  }
382
382
  );
383
383
  }
384
- const Option = styled("div")(({ theme }) => ({
385
- position: "relative",
386
- display: "inline-flex",
387
- // TODO: Remove this once we have a better way to handle the spacing between icon buttons:
388
- // https://app.shortcut.com/cartoteam/story/471284/create-iconbuttongroup-component-to-properly-group-several-icons
389
- "& + &, & + .optionIconButton": {
390
- marginLeft: theme.spacing(0.5)
391
- }
392
- }));
393
- const StyledIconButton = styled(IconButton$1, {
394
- shouldForwardProp: (prop) => !["active"].includes(prop)
395
- })(({ active, theme }) => ({
396
- ...active && {
397
- color: theme.palette.primary.main,
398
- backgroundColor: theme.palette.primary.background,
399
- "& svg:not(.doNotFillIcon) path": {
400
- fill: theme.palette.primary.main
401
- }
402
- }
403
- }));
404
- function _IconButton({
405
- tooltip,
406
- tooltipPlacement = "top",
407
- icon,
408
- size = "medium",
409
- variant = "icon",
410
- color = "default",
411
- sx,
412
- className,
413
- loading,
414
- disabled,
415
- active,
416
- ...props
417
- }, ref) {
418
- return /* @__PURE__ */ jsx(Tooltip, { placement: tooltipPlacement, title: tooltip ?? "", children: /* @__PURE__ */ jsx(
419
- Option,
420
- {
421
- className: `optionIconButton ${className ?? ""}`,
422
- sx,
423
- "data-testid": "icon-button",
424
- children: /* @__PURE__ */ jsx(
425
- StyledIconButton,
426
- {
427
- ...props,
428
- ref,
429
- size,
430
- variant,
431
- color,
432
- active,
433
- disabled: disabled || loading,
434
- role: "button",
435
- children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 18, color: "inherit" }) : icon
436
- }
437
- )
438
- }
439
- ) });
440
- }
441
- const IconButton = forwardRef(_IconButton);
442
384
  const externalLinkProps = {
443
385
  target: "_blank",
444
386
  rel: "noopener noreferrer"
445
387
  };
446
388
  const IconOpenInNewOutlined = styled$1(OpenInNewOutlined)(() => ({
447
389
  fontSize: "1em",
448
- // in some place, like alerts all svg/icon colors are overriden, so force color to link color
449
390
  color: "inherit !important",
450
391
  "> path": {
451
392
  color: "inherit !important"
@@ -456,9 +397,10 @@ function _ExternalLink({
456
397
  showIcon = true,
457
398
  useButton = false,
458
399
  icon = /* @__PURE__ */ jsx(IconOpenInNewOutlined, {}),
459
- fontWeight = "medium",
460
400
  ...props
461
401
  }, ref) {
402
+ const intl = useIntl();
403
+ const intlConfig = useImperativeIntl(intl);
462
404
  if (useButton) {
463
405
  return /* @__PURE__ */ jsx(
464
406
  Button,
@@ -476,9 +418,11 @@ function _ExternalLink({
476
418
  {
477
419
  ...externalLinkProps,
478
420
  endIcon: showIcon && icon,
479
- fontWeight,
480
421
  ...props,
481
422
  ref,
423
+ "aria-label": `${children == null ? void 0 : children.toString()} (${intlConfig.formatMessage({
424
+ id: "c4r.button.opensInNewTab"
425
+ })})`,
482
426
  children
483
427
  }
484
428
  );
@@ -792,7 +736,7 @@ function _MultipleSelectField({
792
736
  onChange: handleChange,
793
737
  size,
794
738
  variant,
795
- endAdornment: showFilters && areAnySelected && /* @__PURE__ */ jsx(UnselectButton, { position: "end", size, children: /* @__PURE__ */ jsx(IconButton$1, { onClick: unselectAll, size, children: /* @__PURE__ */ jsx(Cancel, {}) }) }),
739
+ endAdornment: showFilters && areAnySelected && /* @__PURE__ */ jsx(UnselectButton, { position: "end", size, children: /* @__PURE__ */ jsx(IconButton, { onClick: unselectAll, size, children: /* @__PURE__ */ jsx(Cancel, {}) }) }),
796
740
  menuProps: {
797
741
  PaperProps: {
798
742
  sx: {
@@ -886,7 +830,7 @@ function FilesAction({
886
830
  handleOpen,
887
831
  inProgress
888
832
  }) {
889
- return /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: inProgress ? /* @__PURE__ */ jsx(IconButton$1, { "aria-label": "Loading", disabled: true, size, children: /* @__PURE__ */ jsx(CircularProgress, { size: 18 }) }) : !hasFiles ? /* @__PURE__ */ jsx(
833
+ return /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: inProgress ? /* @__PURE__ */ jsx(IconButton, { "aria-label": "Loading", disabled: true, size, children: /* @__PURE__ */ jsx(CircularProgress, { size: 18 }) }) : !hasFiles ? /* @__PURE__ */ jsx(
890
834
  Button$1,
891
835
  {
892
836
  onClick: handleOpen,
@@ -897,7 +841,7 @@ function FilesAction({
897
841
  children: buttonText
898
842
  }
899
843
  ) : /* @__PURE__ */ jsx(
900
- IconButton$1,
844
+ IconButton,
901
845
  {
902
846
  onClick: handleReset,
903
847
  size,
@@ -1526,7 +1470,7 @@ const _CopiableComponent = ({
1526
1470
  children: [
1527
1471
  children,
1528
1472
  button && /* @__PURE__ */ jsx(
1529
- IconButton,
1473
+ IconButton$1,
1530
1474
  {
1531
1475
  ...buttonProps,
1532
1476
  disabled,
@@ -1785,7 +1729,7 @@ function Snackbar({
1785
1729
  }
1786
1730
  ),
1787
1731
  closeable && /* @__PURE__ */ jsx(CloseButtonWrapper, { children: /* @__PURE__ */ jsx(
1788
- IconButton,
1732
+ IconButton$1,
1789
1733
  {
1790
1734
  color: "default",
1791
1735
  onClick: (e) => onClose(e, "timeout"),
@@ -1996,7 +1940,7 @@ const Menu = styled("div")(({ theme }) => ({
1996
1940
  height: APPBAR_SIZE,
1997
1941
  marginRight: theme.spacing(1.5)
1998
1942
  }));
1999
- const MenuButton = styled(IconButton$1)(({ theme }) => ({
1943
+ const MenuButton = styled(IconButton)(({ theme }) => ({
2000
1944
  marginRight: theme.spacing(1),
2001
1945
  "&.MuiButtonBase-root svg path": {
2002
1946
  fill: theme.palette.brand.appBarContrastText
@@ -2148,7 +2092,7 @@ function ClearButton({
2148
2092
  const intl = useIntl();
2149
2093
  const intlConfig = useImperativeIntl(intl);
2150
2094
  return /* @__PURE__ */ jsx(Container, { size, variant, children: /* @__PURE__ */ jsx(
2151
- IconButton$1,
2095
+ IconButton,
2152
2096
  {
2153
2097
  ...props,
2154
2098
  size,
@@ -2265,7 +2209,7 @@ function DatePicker({
2265
2209
  slots: {
2266
2210
  clearButton: (props2) => /* @__PURE__ */ jsx(ClearButton, { ...props2, size, variant }),
2267
2211
  openPickerButton: (props2) => /* @__PURE__ */ jsx(
2268
- IconButton$1,
2212
+ IconButton,
2269
2213
  {
2270
2214
  ...props2,
2271
2215
  size,
@@ -2765,7 +2709,7 @@ function TimePicker({
2765
2709
  slots: {
2766
2710
  clearButton: (props2) => /* @__PURE__ */ jsx(ClearButton, { ...props2, size, variant }),
2767
2711
  openPickerButton: (props2) => /* @__PURE__ */ jsx(
2768
- IconButton$1,
2712
+ IconButton,
2769
2713
  {
2770
2714
  ...props2,
2771
2715
  size,
@@ -2851,7 +2795,7 @@ function DateTimePicker({
2851
2795
  slots: {
2852
2796
  clearButton: (props2) => /* @__PURE__ */ jsx(ClearButton, { ...props2, size, variant }),
2853
2797
  openPickerButton: (props2) => /* @__PURE__ */ jsx(
2854
- IconButton$1,
2798
+ IconButton,
2855
2799
  {
2856
2800
  ...props2,
2857
2801
  size,
@@ -3035,7 +2979,7 @@ function CodeAreaHeader({
3035
2979
  return /* @__PURE__ */ jsxs(Fragment, { children: [
3036
2980
  /* @__PURE__ */ jsxs(Header, { size, "data-size": size, "data-name": "code-area-header", children: [
3037
2981
  /* @__PURE__ */ jsx(
3038
- IconButton,
2982
+ IconButton$1,
3039
2983
  {
3040
2984
  color: "default",
3041
2985
  size,
@@ -3099,7 +3043,7 @@ function CodeAreaHeader({
3099
3043
  }
3100
3044
  ),
3101
3045
  showExpandButton && /* @__PURE__ */ jsx(
3102
- IconButton,
3046
+ IconButton$1,
3103
3047
  {
3104
3048
  color: "default",
3105
3049
  size,
@@ -4047,7 +3991,7 @@ function DialogHeader({
4047
3991
  {
4048
3992
  title: intlConfig.formatMessage({ id: "c4r.button.close" }),
4049
3993
  placement: "left",
4050
- children: /* @__PURE__ */ jsx(IconButton$1, { onClick: onClose, children: closeIcon || /* @__PURE__ */ jsx(CloseIcon, { "data-testid": "CloseIcon" }) })
3994
+ children: /* @__PURE__ */ jsx(IconButton, { onClick: onClose, children: closeIcon || /* @__PURE__ */ jsx(CloseIcon, { "data-testid": "CloseIcon" }) })
4051
3995
  }
4052
3996
  )
4053
3997
  ] })
@@ -4617,7 +4561,7 @@ export {
4617
4561
  DialogPaper,
4618
4562
  DialogStepper,
4619
4563
  ExternalLink,
4620
- IconButton,
4564
+ IconButton$1 as IconButton,
4621
4565
  LabelWithIndicator,
4622
4566
  Link,
4623
4567
  Menu$1 as Menu,
@@ -3,7 +3,7 @@ var _a, _b, _c, _d, _e, _f, _g, _h;
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
4
  const material = require("@mui/material");
5
5
  const jsxRuntime = require("react/jsx-runtime");
6
- const TablePaginationActions = require("../TablePaginationActions-CFGXm44W.cjs");
6
+ const TablePaginationActions = require("../TablePaginationActions-CAmwcyTy.cjs");
7
7
  const iconsMaterial = require("@mui/icons-material");
8
8
  const ArrowDown = require("../ArrowDown-8fLj23Ge.cjs");
9
9
  const xDatePickers = require("@mui/x-date-pickers");
@@ -1,8 +1,8 @@
1
1
  var _a, _b, _c, _d, _e, _f, _g, _h;
2
2
  import { alpha, Tooltip, responsiveFontSizes, createTheme } from "@mui/material";
3
3
  import { jsxs, Fragment, jsx } from "react/jsx-runtime";
4
- import { T as Typography, a as TablePaginationActions, I as ICON_SIZE_LARGE, b as ICON_SIZE_MEDIUM, c as ICON_SIZE_SMALL, g as getSpacing, A as APPBAR_SIZE, B as BREAKPOINTS, S as SPACING } from "../TablePaginationActions-KpTvhN4Y.js";
5
- import { N } from "../TablePaginationActions-KpTvhN4Y.js";
4
+ import { T as Typography, a as TablePaginationActions, I as ICON_SIZE_LARGE, b as ICON_SIZE_MEDIUM, c as ICON_SIZE_SMALL, g as getSpacing, A as APPBAR_SIZE, B as BREAKPOINTS, S as SPACING } from "../TablePaginationActions-b5wP_uRE.js";
5
+ import { N } from "../TablePaginationActions-b5wP_uRE.js";
6
6
  import { Cancel, EventOutlined, ChevronRightOutlined, ChevronLeftOutlined, ExpandMoreOutlined, CheckCircleOutlined } from "@mui/icons-material";
7
7
  import { A as ArrowDown } from "../ArrowDown-CY_wMVJT.js";
8
8
  import { renderDigitalClockTimeView } from "@mui/x-date-pickers";
@@ -1,4 +1,3 @@
1
- import { CartoFontWeight } from './Typography';
2
1
  declare const ExternalLink: import('react').ForwardRefExoticComponent<(Omit<import('@mui/material/Link').LinkOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
3
2
  ref?: ((instance: HTMLAnchorElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLAnchorElement> | null | undefined;
4
3
  }, "p" | "style" | "className" | "classes" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform" | "align" | "children" | "gutterBottom" | "noWrap" | "paragraph" | "sx" | "variant" | "variantMapping" | "underline" | "endIcon" | "startIcon" | "TypographyClasses"> & {
@@ -7,7 +6,6 @@ declare const ExternalLink: import('react').ForwardRefExoticComponent<(Omit<impo
7
6
  showIcon?: boolean;
8
7
  useButton?: boolean;
9
8
  icon?: JSX.Element;
10
- fontWeight?: CartoFontWeight;
11
9
  }, "ref"> | Omit<{
12
10
  target?: string;
13
11
  loading?: boolean;
@@ -18,7 +16,6 @@ declare const ExternalLink: import('react').ForwardRefExoticComponent<(Omit<impo
18
16
  showIcon?: boolean;
19
17
  useButton?: boolean;
20
18
  icon?: JSX.Element;
21
- fontWeight?: CartoFontWeight;
22
19
  }, "ref">) & import('react').RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
23
20
  export default ExternalLink;
24
21
  //# sourceMappingURL=ExternalLink.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ExternalLink.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/ExternalLink.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AA6D9C,QAAA,MAAM,YAAY;;;;;eAnCH,OAAO;gBACN,OAAO;WACZ,GAAG,CAAC,OAAO;iBACL,eAAe;;;;;;;;eAHjB,OAAO;gBACN,OAAO;WACZ,GAAG,CAAC,OAAO;iBACL,eAAe;kFAgCc,CAAA;AAC9C,eAAe,YAAY,CAAA"}
1
+ {"version":3,"file":"ExternalLink.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/ExternalLink.tsx"],"names":[],"mappings":"AAuEA,QAAA,MAAM,YAAY;;;;;eAvCH,OAAO;gBACN,OAAO;WACZ,GAAG,CAAC,OAAO;;;;;;;;eAFP,OAAO;gBACN,OAAO;WACZ,GAAG,CAAC,OAAO;kFAqCwB,CAAA;AAC9C,eAAe,YAAY,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,SAAS,EAA2B,MAAM,eAAe,CAAA;AAwBvE,QAAA,MAAM,IAAI,sHAAoB,CAAA;AAC9B,eAAe,IAAI,CAAA"}
1
+ {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,SAAS,EAA2B,MAAM,eAAe,CAAA;AA+BvE,QAAA,MAAM,IAAI,sHAAoB,CAAA;AAC9B,eAAe,IAAI,CAAA"}
@@ -10,6 +10,7 @@ declare const _default: {
10
10
  save: string;
11
11
  add: string;
12
12
  showOptions: string;
13
+ opensInNewTab: string;
13
14
  };
14
15
  form: {
15
16
  selectAll: string;
@@ -1 +1 @@
1
- {"version":3,"file":"en.d.ts","sourceRoot":"","sources":["../../../src/localization/en.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAsJ0B"}
1
+ {"version":3,"file":"en.d.ts","sourceRoot":"","sources":["../../../src/localization/en.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAuJ0B"}
@@ -10,6 +10,7 @@ declare const _default: {
10
10
  save: string;
11
11
  add: string;
12
12
  showOptions: string;
13
+ opensInNewTab: string;
13
14
  };
14
15
  form: {
15
16
  selectAll: string;
@@ -1 +1 @@
1
- {"version":3,"file":"es.d.ts","sourceRoot":"","sources":["../../../src/localization/es.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAwJ0B"}
1
+ {"version":3,"file":"es.d.ts","sourceRoot":"","sources":["../../../src/localization/es.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAyJ0B"}
@@ -10,6 +10,7 @@ declare const _default: {
10
10
  save: string;
11
11
  add: string;
12
12
  showOptions: string;
13
+ opensInNewTab: string;
13
14
  };
14
15
  form: {
15
16
  selectAll: string;
@@ -1 +1 @@
1
- {"version":3,"file":"id.d.ts","sourceRoot":"","sources":["../../../src/localization/id.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAsJ0B"}
1
+ {"version":3,"file":"id.d.ts","sourceRoot":"","sources":["../../../src/localization/id.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAuJ0B"}
@@ -11,6 +11,7 @@ export declare const messages: {
11
11
  save: string;
12
12
  add: string;
13
13
  showOptions: string;
14
+ opensInNewTab: string;
14
15
  };
15
16
  form: {
16
17
  selectAll: string;
@@ -159,6 +160,7 @@ export declare const messages: {
159
160
  save: string;
160
161
  add: string;
161
162
  showOptions: string;
163
+ opensInNewTab: string;
162
164
  };
163
165
  form: {
164
166
  selectAll: string;
@@ -305,6 +307,7 @@ export declare const messages: {
305
307
  save: string;
306
308
  add: string;
307
309
  showOptions: string;
310
+ opensInNewTab: string;
308
311
  };
309
312
  form: {
310
313
  selectAll: string;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/localization/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAiB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/localization/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAiB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../src/widgets/ChartLegend.tsx"],"names":[],"mappings":"AAiEA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,MAAM,EACN,kBAAkB,EAClB,eAAe,GAChB,EAAE;IACD,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACzD,kBAAkB,EAAE,MAAM,EAAE,CAAA;IAC5B,eAAe,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAA;CACjD,2CAqJA"}
1
+ {"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../src/widgets/ChartLegend.tsx"],"names":[],"mappings":"AAkEA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,MAAM,EACN,kBAAkB,EAClB,eAAe,GAChB,EAAE;IACD,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACzD,kBAAkB,EAAE,MAAM,EAAE,CAAA;IAC5B,eAAe,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAA;CACjD,2CA+IA"}
@@ -4,12 +4,12 @@ const jsxRuntime = require("react/jsx-runtime");
4
4
  const React = require("react");
5
5
  const material = require("@mui/material");
6
6
  const reactIntl = require("react-intl");
7
- const TablePaginationActions = require("../TablePaginationActions-CFGXm44W.cjs");
7
+ const TablePaginationActions = require("../TablePaginationActions-CAmwcyTy.cjs");
8
8
  const _ReactEcharts = require("echarts-for-react");
9
9
  const reactWindow = require("react-window");
10
10
  const SwatchSquare = require("../SwatchSquare-benaO55C.cjs");
11
11
  const iconsMaterial = require("@mui/icons-material");
12
- const Alert = require("../Alert-CVfTyHiz.cjs");
12
+ const Alert = require("../Alert-hun6016k.cjs");
13
13
  const paletteUtils = require("../paletteUtils-B9ybmwiI.cjs");
14
14
  function detectTouchscreen() {
15
15
  let result = false;
@@ -2171,37 +2171,29 @@ function ChartLegend({
2171
2171
  (overflowing || offset > 0) && /* @__PURE__ */ jsxRuntime.jsxs(ShowMoreButtons, { ref: showMoreButtonsRef, children: [
2172
2172
  /* @__PURE__ */ jsxRuntime.jsx(OverflowVeil, {}),
2173
2173
  /* @__PURE__ */ jsxRuntime.jsx(
2174
- material.Tooltip,
2174
+ Alert.IconButton,
2175
2175
  {
2176
- title: intlConfig.formatMessage({
2177
- id: "c4r.widgets.chartLegend.next"
2178
- }),
2179
- children: /* @__PURE__ */ jsxRuntime.jsx(
2180
- material.IconButton,
2181
- {
2182
- size: "small",
2183
- disabled: offset === 0,
2184
- onClick: handleClickLeft,
2185
- children: /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.ChevronLeft, {})
2186
- }
2187
- )
2176
+ icon: /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.ChevronLeft, {}),
2177
+ component: "span",
2178
+ size: "small",
2179
+ disabled: offset === 0,
2180
+ onClick: handleClickLeft,
2181
+ tooltip: intlConfig.formatMessage({
2182
+ id: "c4r.widgets.chartLegend.prev"
2183
+ })
2188
2184
  }
2189
2185
  ),
2190
2186
  /* @__PURE__ */ jsxRuntime.jsx(
2191
- material.Tooltip,
2187
+ Alert.IconButton,
2192
2188
  {
2193
- title: intlConfig.formatMessage({
2194
- id: "c4r.widgets.chartLegend.prev"
2195
- }),
2196
- children: /* @__PURE__ */ jsxRuntime.jsx(
2197
- material.IconButton,
2198
- {
2199
- size: "small",
2200
- disabled: !overflowing,
2201
- onClick: handleClickRight,
2202
- children: /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.ChevronRight, {})
2203
- }
2204
- )
2189
+ icon: /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.ChevronRight, {}),
2190
+ component: "span",
2191
+ size: "small",
2192
+ disabled: !overflowing,
2193
+ onClick: handleClickRight,
2194
+ tooltip: intlConfig.formatMessage({
2195
+ id: "c4r.widgets.chartLegend.next"
2196
+ })
2205
2197
  }
2206
2198
  )
2207
2199
  ] })
@@ -1,13 +1,13 @@
1
1
  import { jsxs, Fragment, jsx } from "react/jsx-runtime";
2
2
  import React, { useMemo, useState, useEffect, useCallback, useRef, forwardRef, createContext, useContext, useLayoutEffect, createRef } from "react";
3
- import { useTheme, styled, Box, Skeleton, Grid, Link, darken, Button, Divider, TextField, InputAdornment, Checkbox, Tooltip, IconButton, debounce, Slider, TableCell, Table, TableHead, TableRow, TableBody, TableContainer, TableSortLabel, TablePagination, Menu, MenuItem, SvgIcon, lighten, Typography as Typography$1, ClickAwayListener, ToggleButton, capitalize, ListItem, Chip, List, Paper, Popover, Select, ListItemText, Collapse, Drawer, Icon, LinearProgress } from "@mui/material";
3
+ import { useTheme, styled, Box, Skeleton, Grid, Link, darken, Button, Divider, TextField, InputAdornment, Checkbox, Tooltip, debounce, Slider, TableCell, Table, TableHead, TableRow, TableBody, TableContainer, TableSortLabel, TablePagination, IconButton as IconButton$1, Menu, MenuItem, SvgIcon, lighten, Typography as Typography$1, ClickAwayListener, ToggleButton, capitalize, ListItem, Chip, List, Paper, Popover, Select, ListItemText, Collapse, Drawer, Icon, LinearProgress } from "@mui/material";
4
4
  import { useIntl } from "react-intl";
5
- import { d as getDefaultExportFromCjs, u as useImperativeIntl, T as Typography, S as SPACING, B as BREAKPOINTS, a as TablePaginationActions, b as ICON_SIZE_MEDIUM } from "../TablePaginationActions-KpTvhN4Y.js";
5
+ import { d as getDefaultExportFromCjs, u as useImperativeIntl, T as Typography, S as SPACING, B as BREAKPOINTS, a as TablePaginationActions, b as ICON_SIZE_MEDIUM } from "../TablePaginationActions-b5wP_uRE.js";
6
6
  import _ReactEcharts from "echarts-for-react";
7
7
  import { FixedSizeList } from "react-window";
8
8
  import { S as Search, a as SwatchSquare } from "../SwatchSquare-DhaaXt53.js";
9
9
  import { ChevronLeft, ChevronRight, KeyboardArrowDown, ErrorOutline, Cancel, VisibilityOutlined, VisibilityOffOutlined, ExpandLess, ExpandMore, Close, LayersOutlined, MoreVert } from "@mui/icons-material";
10
- import { L as Link$1, A as Alert } from "../Alert-BcaaL6lM.js";
10
+ import { I as IconButton, L as Link$1, A as Alert } from "../Alert-CETC14v2.js";
11
11
  import { a as getColorByCategory, c as commonPalette, b as getPalette } from "../paletteUtils-BHqJlHm9.js";
12
12
  function detectTouchscreen() {
13
13
  let result = false;
@@ -2169,37 +2169,29 @@ function ChartLegend({
2169
2169
  (overflowing || offset > 0) && /* @__PURE__ */ jsxs(ShowMoreButtons, { ref: showMoreButtonsRef, children: [
2170
2170
  /* @__PURE__ */ jsx(OverflowVeil, {}),
2171
2171
  /* @__PURE__ */ jsx(
2172
- Tooltip,
2172
+ IconButton,
2173
2173
  {
2174
- title: intlConfig.formatMessage({
2175
- id: "c4r.widgets.chartLegend.next"
2176
- }),
2177
- children: /* @__PURE__ */ jsx(
2178
- IconButton,
2179
- {
2180
- size: "small",
2181
- disabled: offset === 0,
2182
- onClick: handleClickLeft,
2183
- children: /* @__PURE__ */ jsx(ChevronLeft, {})
2184
- }
2185
- )
2174
+ icon: /* @__PURE__ */ jsx(ChevronLeft, {}),
2175
+ component: "span",
2176
+ size: "small",
2177
+ disabled: offset === 0,
2178
+ onClick: handleClickLeft,
2179
+ tooltip: intlConfig.formatMessage({
2180
+ id: "c4r.widgets.chartLegend.prev"
2181
+ })
2186
2182
  }
2187
2183
  ),
2188
2184
  /* @__PURE__ */ jsx(
2189
- Tooltip,
2185
+ IconButton,
2190
2186
  {
2191
- title: intlConfig.formatMessage({
2192
- id: "c4r.widgets.chartLegend.prev"
2193
- }),
2194
- children: /* @__PURE__ */ jsx(
2195
- IconButton,
2196
- {
2197
- size: "small",
2198
- disabled: !overflowing,
2199
- onClick: handleClickRight,
2200
- children: /* @__PURE__ */ jsx(ChevronRight, {})
2201
- }
2202
- )
2187
+ icon: /* @__PURE__ */ jsx(ChevronRight, {}),
2188
+ component: "span",
2189
+ size: "small",
2190
+ disabled: !overflowing,
2191
+ onClick: handleClickRight,
2192
+ tooltip: intlConfig.formatMessage({
2193
+ id: "c4r.widgets.chartLegend.next"
2194
+ })
2203
2195
  }
2204
2196
  )
2205
2197
  ] })
@@ -4229,7 +4221,7 @@ function TimeSeriesControls({
4229
4221
  };
4230
4222
  return /* @__PURE__ */ jsxs(Fragment, { children: [
4231
4223
  /* @__PURE__ */ jsx(
4232
- IconButton,
4224
+ IconButton$1,
4233
4225
  {
4234
4226
  size: "small",
4235
4227
  color: "default",
@@ -4263,7 +4255,7 @@ function TimeSeriesControls({
4263
4255
  }
4264
4256
  ),
4265
4257
  /* @__PURE__ */ jsx(Box, { mt: 2, children: /* @__PURE__ */ jsx(
4266
- IconButton,
4258
+ IconButton$1,
4267
4259
  {
4268
4260
  size: "small",
4269
4261
  color: "primary",
@@ -4274,7 +4266,7 @@ function TimeSeriesControls({
4274
4266
  }
4275
4267
  ) }),
4276
4268
  /* @__PURE__ */ jsx(Box, { mt: 0.75, children: /* @__PURE__ */ jsx(
4277
- IconButton,
4269
+ IconButton$1,
4278
4270
  {
4279
4271
  "data-testid": "play-pause",
4280
4272
  size: "small",
@@ -5730,7 +5722,7 @@ function FeatureSelectionUIToggleButton({
5730
5722
  }
5731
5723
  ) });
5732
5724
  }
5733
- const ArrowButton = styled(IconButton, {
5725
+ const ArrowButton = styled(IconButton$1, {
5734
5726
  shouldForwardProp: (prop) => prop !== "isOpen"
5735
5727
  })(({ isOpen, theme }) => ({
5736
5728
  color: theme.palette.text.secondary,
@@ -6161,7 +6153,7 @@ function LegendOpacityControl({
6161
6153
  {
6162
6154
  title: intlConfig.formatMessage({ id: "c4r.widgets.legend.opacity" }),
6163
6155
  children: /* @__PURE__ */ jsx(
6164
- IconButton,
6156
+ IconButton$1,
6165
6157
  {
6166
6158
  size: "small",
6167
6159
  color: open ? "primary" : "default",
@@ -6742,7 +6734,7 @@ function LegendLayer({
6742
6734
  return /* @__PURE__ */ jsxs(LegendLayerWrapper, { "data-testid": "legend-layer", "aria-label": title, children: [
6743
6735
  /* @__PURE__ */ jsxs(LegendItemHeader, { ref: menuAnchorRef, children: [
6744
6736
  collapsible && /* @__PURE__ */ jsx(
6745
- IconButton,
6737
+ IconButton$1,
6746
6738
  {
6747
6739
  size: "small",
6748
6740
  "aria-label": intlConfig.formatMessage({
@@ -6798,7 +6790,7 @@ function LegendLayer({
6798
6790
  id: visible ? "c4r.widgets.legend.hideLayer" : "c4r.widgets.legend.showLayer"
6799
6791
  }),
6800
6792
  children: /* @__PURE__ */ jsx(
6801
- IconButton,
6793
+ IconButton$1,
6802
6794
  {
6803
6795
  size: "small",
6804
6796
  onClick: () => onChangeVisibility({
@@ -6888,7 +6880,7 @@ function LegendWidgetUI({
6888
6880
  Tooltip,
6889
6881
  {
6890
6882
  title: intlConfig.formatMessage({ id: "c4r.widgets.legend.close" }),
6891
- children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: () => onChangeCollapsed(true), children: /* @__PURE__ */ jsx(Close, {}) })
6883
+ children: /* @__PURE__ */ jsx(IconButton$1, { size: "small", onClick: () => onChangeCollapsed(true), children: /* @__PURE__ */ jsx(Close, {}) })
6892
6884
  }
6893
6885
  )
6894
6886
  ] });
@@ -6896,7 +6888,7 @@ function LegendWidgetUI({
6896
6888
  Tooltip,
6897
6889
  {
6898
6890
  title: intlConfig.formatMessage({ id: "c4r.widgets.legend.open" }),
6899
- children: /* @__PURE__ */ jsx(IconButton, { "aria-label": title, onClick: () => onChangeCollapsed(false), children: /* @__PURE__ */ jsx(LayersOutlined, {}) })
6891
+ children: /* @__PURE__ */ jsx(IconButton$1, { "aria-label": title, onClick: () => onChangeCollapsed(false), children: /* @__PURE__ */ jsx(LayersOutlined, {}) })
6900
6892
  }
6901
6893
  );
6902
6894
  return /* @__PURE__ */ jsx(LegendRoot, { sx, elevation: 3, collapsed: collapsed || !!isMobile, children: isMobile ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -7051,7 +7043,7 @@ const HeaderItems = styled(Grid)(({ theme }) => ({
7051
7043
  marginRight: theme.spacing(-0.5),
7052
7044
  marginLeft: theme.spacing(1)
7053
7045
  }));
7054
- const IconActionButton = styled(IconButton)(({ theme }) => ({
7046
+ const IconActionButton = styled(IconButton$1)(({ theme }) => ({
7055
7047
  color: theme.palette.text.secondary
7056
7048
  }));
7057
7049
  const PaperMenu = styled(Menu)(({ theme }) => ({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@carto/meridian-ds",
3
- "version": "1.4.5-alpha-external-link.2",
3
+ "version": "1.4.5-alpha-external-link.3",
4
4
  "description": "CARTO Meridian Design System",
5
5
  "type": "module",
6
6
  "scripts": {