@carto/meridian-ds 2.4.0 → 2.5.0

package/dist/widgets/index.cjs

@@ -4,12 +4,12 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const material = require("@mui/material");
 const reactIntl = require("react-intl");
-const TablePaginationActions = require("../TablePaginationActions-D2K26kdR.cjs");
+const TablePaginationActions = require("../TablePaginationActions-DAMGtIub.cjs");
 const _ReactEcharts = require("echarts-for-react");
 const reactWindow = require("react-window");
 const SwatchSquare = require("../SwatchSquare-B8PIY3Rd.cjs");
+const Link = require("../Link-CrGCrul0.cjs");
 const iconsMaterial = require("@mui/icons-material");
-const Link = require("../Link-_lzRY1Ay.cjs");
 const paletteUtils = require("../paletteUtils-B9ybmwiI.cjs");
 function detectTouchscreen() {
   let result = false;
@@ -1806,6 +1806,32 @@ function formatData(data, ticks, min, max) {
     ]
   );
 }
+function AlertBody({
+  color = void 0,
+  children
+}) {
+  return children ? /* @__PURE__ */ jsxRuntime.jsx(material.Box, { mt: 0.5, children: /* @__PURE__ */ jsxRuntime.jsx(
+    TablePaginationActions.Typography,
+    {
+      component: "div",
+      variant: "caption",
+      color: color ?? "inherit",
+      style: { fontWeight: "normal" },
+      children
+    }
+  ) }) : /* @__PURE__ */ jsxRuntime.jsx(material.Box, { mt: -1 });
+}
+function NoDataAlert({
+  title = "No data available",
+  body = "There are no results for the combination of filters applied to your data. Try tweaking your filters, or zoom and pan the map to adjust the Map View.",
+  severity = void 0,
+  ...otherProps
+}) {
+  return severity ? /* @__PURE__ */ jsxRuntime.jsx(Link.Alert, { title, severity, ...otherProps, children: /* @__PURE__ */ jsxRuntime.jsx(AlertBody, { children: body }) }) : /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { ...otherProps, children: [
+    title && /* @__PURE__ */ jsxRuntime.jsx(TablePaginationActions.Typography, { variant: "body2", children: title }),
+    /* @__PURE__ */ jsxRuntime.jsx(AlertBody, { color: "textSecondary", children: body })
+  ] });
+}
 function usePieCategories(data, order, maxItems, colors, othersValue) {
   const theme = material.useTheme();
   const orderedData = React.useMemo(() => {
@@ -4826,6 +4852,223 @@ function TimeSeriesWidgetUIContent({
     }
   );
 }
+const Root = material.styled(material.Box, {
+  shouldForwardProp: (prop) => prop !== "margin"
+})(({ theme, margin }) => {
+  return {
+    margin: 0,
+    position: "relative",
+    maxWidth: "100%",
+    padding: margin ?? theme.spacing(2, 2.5)
+  };
+});
+const LoadingBar = material.styled(material.LinearProgress)(({ theme }) => ({
+  position: "absolute",
+  top: 0,
+  left: 0,
+  width: "100%",
+  height: theme.spacing(0.25)
+}));
+const Header = material.styled(material.Grid, {
+  shouldForwardProp: (prop) => prop !== "expanded"
+})(({ theme, expanded = true }) => ({
+  display: "flex",
+  flexDirection: "row",
+  alignItems: "flex-start",
+  justifyContent: "space-between",
+  width: "100%",
+  ...expanded ? { minHeight: theme.spacing(3) } : { height: theme.spacing(3) },
+  padding: 0
+}));
+const HeaderButton = material.styled(material.Button, {
+  shouldForwardProp: (prop) => prop !== "expandable"
+})(({ theme, expandable = true }) => ({
+  flex: 1,
+  padding: 0,
+  alignItems: "flex-start",
+  justifyContent: "flex-start",
+  height: "auto",
+  minHeight: "auto",
+  marginBottom: theme.spacing(1),
+  cursor: expandable ? "pointer" : "default",
+  "& .MuiButton-startIcon": {
+    marginTop: "3px",
+    marginRight: theme.spacing(1)
+  },
+  "&:hover": {
+    background: "none"
+  }
+}));
+const ParentIcon = ({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  width: theme.spacing(3),
+  height: theme.spacing(3),
+  color: theme.palette.text.secondary
+});
+const HideButton = material.styled(iconsMaterial.ExpandLess)(({ theme }) => ParentIcon({ theme }));
+const ShowButton = material.styled(iconsMaterial.ExpandMore)(({ theme }) => ParentIcon({ theme }));
+const Text = material.styled(material.Typography, {
+  shouldForwardProp: (prop) => prop !== "expanded"
+})(({ expanded = true }) => ({
+  wordBreak: "break-word",
+  overflow: "hidden",
+  ...expanded && {
+    display: "-webkit-box",
+    WebkitLineClamp: 2,
+    WebkitBoxOrient: "vertical"
+  },
+  ...!expanded && {
+    whiteSpace: "nowrap",
+    textOverflow: "ellipsis"
+  }
+}));
+const HeaderItems = material.styled(material.Grid)(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  gap: theme.spacing(1),
+  marginRight: theme.spacing(-0.5),
+  marginLeft: theme.spacing(1)
+}));
+const IconActionButton = material.styled(material.IconButton)(({ theme }) => ({
+  color: theme.palette.text.secondary
+}));
+const PaperMenu = material.styled(material.Menu)(({ theme }) => ({
+  ".MuiPaper-root": {
+    marginTop: theme.spacing(5),
+    maxHeight: theme.spacing(21),
+    minWidth: theme.spacing(16)
+  }
+}));
+const EMPTY_ARR$2 = [];
+const defaultOptionsIcon = /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.MoreVert, {});
+function WrapperWidgetUI({
+  title,
+  actions = EMPTY_ARR$2,
+  options = EMPTY_ARR$2,
+  optionsIcon = defaultOptionsIcon,
+  children,
+  contentProps,
+  disabled = false,
+  expandable = true,
+  expanded: _expanded = true,
+  onExpandedChange,
+  footer,
+  headerItems,
+  isLoading = false,
+  margin
+}) {
+  const wrapper = React.createRef();
+  const [expandedInt, setExpandedInt] = React.useState(true);
+  const externalExpanded = _expanded !== void 0 && onExpandedChange !== void 0;
+  const expanded = expandable !== false ? externalExpanded ? _expanded : expandedInt : true;
+  const setExpanded = externalExpanded ? onExpandedChange : setExpandedInt;
+  const [anchorEl, setAnchorEl] = React.useState(null);
+  const open = Boolean(anchorEl);
+  const handleExpandClick = () => {
+    if (expandable) {
+      setExpanded(!expanded);
+    }
+  };
+  const handleClick = (ev) => setAnchorEl(ev.currentTarget);
+  const handleClose = () => setAnchorEl(null);
+  function handleOptionAction(action) {
+    if (action) {
+      action();
+    }
+    handleClose();
+  }
+  const iconButtonTooltip = (action) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      IconActionButton,
+      {
+        "aria-label": action.label,
+        onClick: action.action,
+        size: "small",
+        children: action.icon
+      },
+      action.id
+    );
+  };
+  if (disabled) {
+    return children ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children }) : null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(Root, { margin, component: "section", "aria-label": title, children: [
+    isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LoadingBar, {}) : null,
+    /* @__PURE__ */ jsxRuntime.jsxs(Header, { container: true, expanded: _expanded, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        HeaderButton,
+        {
+          expandable,
+          startIcon: expandable && /* @__PURE__ */ jsxRuntime.jsx(material.Icon, { children: expanded ? /* @__PURE__ */ jsxRuntime.jsx(HideButton, {}) : /* @__PURE__ */ jsxRuntime.jsx(ShowButton, {}) }),
+          onClick: handleExpandClick,
+          tabIndex: expandable ? 0 : -1,
+          children: /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { title, children: /* @__PURE__ */ jsxRuntime.jsx(Text, { expanded: _expanded, align: "left", variant: "subtitle1", children: title }) })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(HeaderItems, { item: true, children: [
+        headerItems,
+        actions.length > 0 && actions.map((action) => {
+          return action.tooltip ? /* @__PURE__ */ jsxRuntime.jsx(
+            material.Tooltip,
+            {
+              title: action.tooltip.text,
+              placement: action.tooltip.placement ?? "top",
+              children: iconButtonTooltip(action)
+            },
+            action.id
+          ) : iconButtonTooltip(action);
+        }),
+        options.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            IconActionButton,
+            {
+              "aria-label": "Options",
+              "aria-controls": "options-menu",
+              "aria-haspopup": "true",
+              onClick: handleClick,
+              size: "small",
+              children: optionsIcon
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            PaperMenu,
+            {
+              id: "options-menu",
+              elevation: 8,
+              anchorOrigin: {
+                vertical: "top",
+                horizontal: "right"
+              },
+              transformOrigin: {
+                vertical: "top",
+                horizontal: "right"
+              },
+              anchorEl,
+              keepMounted: true,
+              open,
+              onClose: handleClose,
+              children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
+                material.MenuItem,
+                {
+                  selected: option.selected,
+                  onClick: () => handleOptionAction(option.action),
+                  children: option.name
+                },
+                option.id
+              ))
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(material.Collapse, { ref: wrapper, in: expanded, timeout: "auto", unmountOnExit: true, children: /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { ...contentProps, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(material.Box, { pt: 1, children }),
+      footer ?? /* @__PURE__ */ jsxRuntime.jsx(material.Box, { children: footer })
+    ] }) })
+  ] });
+}
 const Wrapper = material.styled("div")(({ theme }) => ({
   padding: theme.spacing(2, 0),
   ...theme.typography.body2
@@ -5931,10 +6174,10 @@ const StylesWrapper = material.styled(material.Paper)(({ theme }) => ({
   maxHeight: theme.spacing(5),
   padding: theme.spacing(0.5)
 }));
-const EMPTY_ARR$2 = [];
+const EMPTY_ARR$1 = [];
 function FeatureSelectionWidgetUI({
   selectionModes,
-  editModes = EMPTY_ARR$2,
+  editModes = EMPTY_ARR$1,
   selectedMode,
   onSelectMode,
   enabled = false,
@@ -6861,10 +7104,10 @@ function getZoomHelperText({
 }
 const EMPTY_OBJ = {};
 const EMPTY_FN = () => void 0;
-const EMPTY_ARR$1 = [];
+const EMPTY_ARR = [];
 function LegendWidgetUI({
   customLegendTypes = EMPTY_OBJ,
-  layers = EMPTY_ARR$1,
+  layers = EMPTY_ARR,
   collapsed = false,
   onChangeCollapsed = EMPTY_FN,
   onChangeVisibility = EMPTY_FN,
@@ -6944,249 +7187,6 @@ function LegendWidgetUI({
     )) }) })
   ] }) });
 }
-function AlertBody({
-  color = void 0,
-  children
-}) {
-  return children ? /* @__PURE__ */ jsxRuntime.jsx(material.Box, { mt: 0.5, children: /* @__PURE__ */ jsxRuntime.jsx(
-    TablePaginationActions.Typography,
-    {
-      component: "div",
-      variant: "caption",
-      color: color ?? "inherit",
-      style: { fontWeight: "normal" },
-      children
-    }
-  ) }) : /* @__PURE__ */ jsxRuntime.jsx(material.Box, { mt: -1 });
-}
-function NoDataAlert({
-  title = "No data available",
-  body = "There are no results for the combination of filters applied to your data. Try tweaking your filters, or zoom and pan the map to adjust the Map View.",
-  severity = void 0,
-  ...otherProps
-}) {
-  return severity ? /* @__PURE__ */ jsxRuntime.jsx(Link.Alert, { title, severity, ...otherProps, children: /* @__PURE__ */ jsxRuntime.jsx(AlertBody, { children: body }) }) : /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { ...otherProps, children: [
-    title && /* @__PURE__ */ jsxRuntime.jsx(TablePaginationActions.Typography, { variant: "body2", children: title }),
-    /* @__PURE__ */ jsxRuntime.jsx(AlertBody, { color: "textSecondary", children: body })
-  ] });
-}
-const Root = material.styled(material.Box, {
-  shouldForwardProp: (prop) => prop !== "margin"
-})(({ theme, margin }) => {
-  return {
-    margin: 0,
-    position: "relative",
-    maxWidth: "100%",
-    padding: margin ?? theme.spacing(2, 2.5)
-  };
-});
-const LoadingBar = material.styled(material.LinearProgress)(({ theme }) => ({
-  position: "absolute",
-  top: 0,
-  left: 0,
-  width: "100%",
-  height: theme.spacing(0.25)
-}));
-const Header = material.styled(material.Grid, {
-  shouldForwardProp: (prop) => prop !== "expanded"
-})(({ theme, expanded = true }) => ({
-  display: "flex",
-  flexDirection: "row",
-  alignItems: "flex-start",
-  justifyContent: "space-between",
-  width: "100%",
-  ...expanded ? { minHeight: theme.spacing(3) } : { height: theme.spacing(3) },
-  padding: 0
-}));
-const HeaderButton = material.styled(material.Button, {
-  shouldForwardProp: (prop) => prop !== "expandable"
-})(({ theme, expandable = true }) => ({
-  flex: 1,
-  padding: 0,
-  alignItems: "flex-start",
-  justifyContent: "flex-start",
-  height: "auto",
-  minHeight: "auto",
-  marginBottom: theme.spacing(1),
-  cursor: expandable ? "pointer" : "default",
-  "& .MuiButton-startIcon": {
-    marginTop: "3px",
-    marginRight: theme.spacing(1)
-  },
-  "&:hover": {
-    background: "none"
-  }
-}));
-const ParentIcon = ({ theme }) => ({
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  width: theme.spacing(3),
-  height: theme.spacing(3),
-  color: theme.palette.text.secondary
-});
-const HideButton = material.styled(iconsMaterial.ExpandLess)(({ theme }) => ParentIcon({ theme }));
-const ShowButton = material.styled(iconsMaterial.ExpandMore)(({ theme }) => ParentIcon({ theme }));
-const Text = material.styled(material.Typography, {
-  shouldForwardProp: (prop) => prop !== "expanded"
-})(({ expanded = true }) => ({
-  wordBreak: "break-word",
-  overflow: "hidden",
-  ...expanded && {
-    display: "-webkit-box",
-    WebkitLineClamp: 2,
-    WebkitBoxOrient: "vertical"
-  },
-  ...!expanded && {
-    whiteSpace: "nowrap",
-    textOverflow: "ellipsis"
-  }
-}));
-const HeaderItems = material.styled(material.Grid)(({ theme }) => ({
-  display: "flex",
-  alignItems: "center",
-  gap: theme.spacing(1),
-  marginRight: theme.spacing(-0.5),
-  marginLeft: theme.spacing(1)
-}));
-const IconActionButton = material.styled(material.IconButton)(({ theme }) => ({
-  color: theme.palette.text.secondary
-}));
-const PaperMenu = material.styled(material.Menu)(({ theme }) => ({
-  ".MuiPaper-root": {
-    marginTop: theme.spacing(5),
-    maxHeight: theme.spacing(21),
-    minWidth: theme.spacing(16)
-  }
-}));
-const EMPTY_ARR = [];
-const defaultOptionsIcon = /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.MoreVert, {});
-function WrapperWidgetUI({
-  title,
-  actions = EMPTY_ARR,
-  options = EMPTY_ARR,
-  optionsIcon = defaultOptionsIcon,
-  children,
-  contentProps,
-  disabled = false,
-  expandable = true,
-  expanded: _expanded = true,
-  onExpandedChange,
-  footer,
-  headerItems,
-  isLoading = false,
-  margin
-}) {
-  const wrapper = React.createRef();
-  const [expandedInt, setExpandedInt] = React.useState(true);
-  const externalExpanded = _expanded !== void 0 && onExpandedChange !== void 0;
-  const expanded = expandable !== false ? externalExpanded ? _expanded : expandedInt : true;
-  const setExpanded = externalExpanded ? onExpandedChange : setExpandedInt;
-  const [anchorEl, setAnchorEl] = React.useState(null);
-  const open = Boolean(anchorEl);
-  const handleExpandClick = () => {
-    if (expandable) {
-      setExpanded(!expanded);
-    }
-  };
-  const handleClick = (ev) => setAnchorEl(ev.currentTarget);
-  const handleClose = () => setAnchorEl(null);
-  function handleOptionAction(action) {
-    if (action) {
-      action();
-    }
-    handleClose();
-  }
-  const iconButtonTooltip = (action) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      IconActionButton,
-      {
-        "aria-label": action.label,
-        onClick: action.action,
-        size: "small",
-        children: action.icon
-      },
-      action.id
-    );
-  };
-  if (disabled) {
-    return children ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children }) : null;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(Root, { margin, component: "section", "aria-label": title, children: [
-    isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LoadingBar, {}) : null,
-    /* @__PURE__ */ jsxRuntime.jsxs(Header, { container: true, expanded: _expanded, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        HeaderButton,
-        {
-          expandable,
-          startIcon: expandable && /* @__PURE__ */ jsxRuntime.jsx(material.Icon, { children: expanded ? /* @__PURE__ */ jsxRuntime.jsx(HideButton, {}) : /* @__PURE__ */ jsxRuntime.jsx(ShowButton, {}) }),
-          onClick: handleExpandClick,
-          tabIndex: expandable ? 0 : -1,
-          children: /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { title, children: /* @__PURE__ */ jsxRuntime.jsx(Text, { expanded: _expanded, align: "left", variant: "subtitle1", children: title }) })
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs(HeaderItems, { item: true, children: [
-        headerItems,
-        actions.length > 0 && actions.map((action) => {
-          return action.tooltip ? /* @__PURE__ */ jsxRuntime.jsx(
-            material.Tooltip,
-            {
-              title: action.tooltip.text,
-              placement: action.tooltip.placement ?? "top",
-              children: iconButtonTooltip(action)
-            },
-            action.id
-          ) : iconButtonTooltip(action);
-        }),
-        options.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            IconActionButton,
-            {
-              "aria-label": "Options",
-              "aria-controls": "options-menu",
-              "aria-haspopup": "true",
-              onClick: handleClick,
-              size: "small",
-              children: optionsIcon
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            PaperMenu,
-            {
-              id: "options-menu",
-              elevation: 8,
-              anchorOrigin: {
-                vertical: "top",
-                horizontal: "right"
-              },
-              transformOrigin: {
-                vertical: "top",
-                horizontal: "right"
-              },
-              anchorEl,
-              keepMounted: true,
-              open,
-              onClose: handleClose,
-              children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
-                material.MenuItem,
-                {
-                  selected: option.selected,
-                  onClick: () => handleOptionAction(option.action),
-                  children: option.name
-                },
-                option.id
-              ))
-            }
-          )
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(material.Collapse, { ref: wrapper, in: expanded, timeout: "auto", unmountOnExit: true, children: /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { ...contentProps, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(material.Box, { pt: 1, children }),
-      footer ?? /* @__PURE__ */ jsxRuntime.jsx(material.Box, { children: footer })
-    ] }) })
-  ] });
-}
 exports.BarWidgetUI = BarWidgetUI;
 exports.CategoryWidgetUI = CategoryWidgetUI;
 exports.ComparativeCategoryWidgetUI = ComparativeCategoryWidgetUI;
@@ -7215,5 +7215,6 @@ exports.TableWidgetUI = TableWidgetUI;
 exports.TimeSeriesProvider = TimeSeriesProvider;
 exports.TimeSeriesWidgetUI = TimeSeriesWidgetUI;
 exports.WrapperWidgetUI = WrapperWidgetUI;
+exports.areChartPropsEqual = areChartPropsEqual;
 exports.useTimeSeriesContext = useTimeSeriesContext;
 exports.useTimeSeriesInteractivity = useTimeSeriesInteractivity;