@carto/ps-react-ui 4.2.7 → 4.3.0-widgets.0

package/dist/const-BLV7Tvte.js

@@ -0,0 +1,758 @@
+import { jsx as d } from "react/jsx-runtime";
+import "react/compiler-runtime";
+import { SvgIcon as y } from "@mui/material";
+import "./widget-store-yDO2ul8g.js";
+import { ImageOutlined as w } from "@mui/icons-material";
+import { lazy as r } from "react";
+import "./lasso-tool-BC-rsMMW.js";
+import "./cjs-D9ro6BXv.js";
+import "react-markdown";
+import v from "html2canvas";
+function x(e) {
+  const t = e == null ? "" : typeof e == "object" ? JSON.stringify(e) : String(e);
+  return /[",\n]/.test(t) ? `"${t.replace(/"/g, '""')}"` : t;
+}
+async function S(e) {
+  const t = e.map((n) => n.map(x).join(",")).join(`
+`), o = new Blob([t], {
+    type: "text/csv;charset=utf-8;"
+  });
+  return Promise.resolve(URL.createObjectURL(o));
+}
+const l = {
+  id: "csv",
+  label: "CSV",
+  icon: /* @__PURE__ */ d(y, { children: /* @__PURE__ */ d("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", fill: "none", viewBox: "0 0 18 18", children: /* @__PURE__ */ d("path", { fill: "currentColor", d: "M4.313 11.25h2.25v-1.125H4.688v-2.25h1.875V6.75h-2.25a.726.726 0 0 0-.535.216.726.726 0 0 0-.216.534v3c0 .213.072.39.216.534a.726.726 0 0 0 .534.216Zm2.925 0h2.25c.212 0 .39-.072.534-.216a.726.726 0 0 0 .216-.534V9.375a.931.931 0 0 0-.216-.59.658.658 0 0 0-.534-.273H8.363v-.637h1.875V6.75h-2.25a.726.726 0 0 0-.535.216.726.726 0 0 0-.216.534v1.125c0 .213.072.403.216.572a.675.675 0 0 0 .534.253h1.126v.675H7.238v1.125Zm4.95 0h1.124l1.313-4.5H13.5l-.75 2.588L12 6.75h-1.125l1.313 4.5ZM3 15c-.413 0-.766-.147-1.06-.44a1.445 1.445 0 0 1-.44-1.06v-9c0-.412.147-.766.44-1.06C2.235 3.148 2.588 3 3 3h12c.412 0 .766.147 1.06.44.293.294.44.648.44 1.06v9c0 .412-.147.766-.44 1.06-.294.293-.647.44-1.06.44H3Zm0-1.5h12v-9H3v9Z" }) }) }),
+  modifier: S,
+  callback: (e) => {
+    URL.revokeObjectURL(e);
+  }
+};
+async function C(e) {
+  if (!e || typeof e == "function" || !e.current) {
+    console.warn("[CARTO downloadFileToPNG] Invalid ref passed to downloadFileToPNG. Expected a React ref object with a .current property pointing to an HTMLElement. Download aborted.");
+    return;
+  }
+  const o = e.current.cloneNode(!0);
+  o.querySelector(".widget-toolbar-container")?.remove(), o.querySelector(".widget-wrapper-actions")?.remove(), document.body.appendChild(o);
+  const n = o.getBoundingClientRect(), i = {
+    useCORS: !0,
+    scale: 2,
+    backgroundColor: "#fff",
+    width: n.width,
+    height: n.height
+  }, s = (await v(o, i)).toDataURL("image/png");
+  return document.body.removeChild(o), Promise.resolve(s);
+}
+const c = {
+  id: "png",
+  label: "PNG",
+  icon: /* @__PURE__ */ d(w, {}),
+  modifier: C
+};
+function L({
+  refUI: e,
+  data: t,
+  ...o
+}) {
+  return {
+    ...o,
+    data: t,
+    type: "markdown",
+    fullScreenConfig: {
+      enabled: !0,
+      isFullScreen: !1
+    },
+    downloadConfig: {
+      enabled: !0,
+      isDownloading: !1,
+      items: [{
+        ...c,
+        modifier: () => c.modifier(e)
+      }, {
+        ...l,
+        modifier: async (n) => {
+          const i = [[n?.content ?? ""]];
+          return l.modifier(i);
+        }
+      }]
+    }
+  };
+}
+function k({
+  refUI: e,
+  data: t,
+  ...o
+}) {
+  return {
+    ...o,
+    data: t,
+    type: "formula",
+    downloadConfig: {
+      enabled: !0,
+      isDownloading: !1,
+      items: [{
+        ...c,
+        modifier: () => c.modifier(e)
+      }, {
+        ...l,
+        modifier: async (n) => {
+          const i = [n?.map((a) => a.value) ?? []];
+          return l.modifier(i);
+        }
+      }]
+    }
+  };
+}
+function p({
+  type: e,
+  getOptions: t,
+  csvModifier: o
+}) {
+  return function(n) {
+    const {
+      refUI: i,
+      data: a,
+      ...s
+    } = n;
+    return {
+      ...s,
+      data: a,
+      option: t({
+        data: a,
+        ...s
+      }),
+      refUI: i,
+      // Static properties common to all chart widgets
+      type: e,
+      downloadConfig: {
+        enabled: !0,
+        isDownloading: !1,
+        items: [
+          // PNG export
+          {
+            ...c,
+            modifier: () => c.modifier(i)
+          },
+          // CSV export
+          {
+            ...l,
+            modifier: async (f) => {
+              const b = o(f);
+              return l.modifier(b);
+            }
+          }
+        ]
+      },
+      fullScreenConfig: {
+        enabled: !0,
+        isFullScreen: !1
+      }
+    };
+  };
+}
+function u(e) {
+  const t = [];
+  if (e.length > 0 && (e[0]?.length ?? 0) > 0) {
+    const o = e?.[0]?.[0] ?? {}, n = Object.keys(o);
+    t.push(n);
+  }
+  return e.forEach((o) => {
+    o.forEach((n) => {
+      const i = Object.values(n).map((a) => String(a));
+      t.push(i);
+    });
+  }), t;
+}
+function I(e) {
+  const t = [];
+  return t.push(["x", "y"]), e.forEach((o) => {
+    o.forEach((n) => {
+      t.push([String(n[0]), String(n[1])]);
+    });
+  }), t;
+}
+function g(e) {
+  return {
+    show: e,
+    icon: "circle",
+    left: 0,
+    bottom: 0
+  };
+}
+function m(e, t, o = {}) {
+  return {
+    ...!e && {
+      bottom: parseInt(t.spacing(1))
+    },
+    ...e && {
+      bottom: parseInt(t.spacing(5))
+    },
+    ...o
+  };
+}
+function h(e) {
+  return function(t, o, n, i, a) {
+    const s = {
+      top: parseInt(e.spacing(0.5))
+    };
+    return a.contentSize[0] < a.viewSize[0] - t[0] ? s.left = t[0] : s.right = a.viewSize[0] - t[0], s;
+  };
+}
+const M = p({
+  type: "bar",
+  getOptions: O,
+  csvModifier: (e) => u(e)
+});
+function O({
+  data: e = [],
+  theme: t
+}) {
+  const o = (e?.length ?? 0) > 1;
+  return {
+    legend: g(o),
+    grid: m(o, t),
+    xAxis: {
+      type: "category",
+      axisLine: {
+        show: !1
+      },
+      axisTick: {
+        show: !1
+      },
+      axisLabel: {
+        padding: [parseInt(t.spacing(0.5)), 0, 0, 0],
+        margin: 0
+      }
+    },
+    yAxis: {
+      type: "value",
+      axisLabel: {
+        ...t.typography.overlineDelicate,
+        margin: parseInt(t.spacing(1)),
+        show: !0,
+        showMaxLabel: !0,
+        showMinLabel: !1,
+        verticalAlign: "bottom"
+      },
+      axisLine: {
+        show: !1
+      },
+      axisTick: {
+        show: !1
+      },
+      splitLine: {
+        show: !0,
+        lineStyle: {
+          color: t.palette.black[4]
+        }
+      }
+    },
+    tooltip: {
+      position: h(t)
+    },
+    series: e.map((n, i) => ({
+      datasetIndex: i,
+      type: "bar",
+      barMaxWidth: 100,
+      emphasis: {
+        focus: "series"
+      }
+      // itemStyle: {
+      //   color(params) {
+      //     const color =
+      //       getColorBySchema({
+      //         colorSchema: config?.colorSchema,
+      //         value: params.value as ColorSchemaValue,
+      //       }) ?? params.color!
+      //     if (!selected?.length) {
+      //       return color
+      //     }
+      //     if (selected.map(String).includes(params.name)) {
+      //       return color
+      //     }
+      //     return theme.palette.black[25]
+      //   },
+      // },
+    })),
+    dataset: e.map((n) => ({
+      source: n
+    }))
+  };
+}
+const D = p({
+  type: "pie",
+  getOptions: T,
+  csvModifier: (e) => u(e)
+});
+function T({
+  data: e = [],
+  theme: t
+}) {
+  return (e?.length ?? 0) > 1 ? {
+    xAxis: {
+      type: "value",
+      show: !0
+    },
+    yAxis: {
+      type: "category",
+      show: !0
+    },
+    legend: {
+      show: !0,
+      bottom: 0
+    },
+    grid: {
+      bottom: parseInt(t.spacing(4)),
+      right: parseInt(t.spacing(4))
+    },
+    series: e.map((n, i) => ({
+      datasetIndex: i,
+      type: "bar",
+      barMaxWidth: 100,
+      emphasis: {
+        focus: "series"
+      }
+    }))
+  } : {
+    legend: {
+      show: !0,
+      icon: "circle",
+      left: 0,
+      bottom: 0,
+      orient: "horizontal"
+    },
+    grid: {
+      left: 0,
+      top: 0,
+      right: 0,
+      bottom: parseInt(t.spacing(5))
+    },
+    xAxis: {
+      show: !1
+    },
+    yAxis: {
+      show: !1
+    },
+    tooltip: {
+      trigger: "item"
+    },
+    color: Object.values(t.palette.qualitative.bold),
+    series: e.map((n, i) => ({
+      datasetIndex: i,
+      type: "pie",
+      colorBy: "data",
+      radius: ["74%", "90%"],
+      avoidLabelOverlap: !0,
+      selectedOffset: 0,
+      bottom: parseInt(t.spacing(4)),
+      label: {
+        show: !0,
+        position: "center",
+        formatter: (a) => {
+          const {
+            name: s
+          } = a, f = a.encode?.value?.[0];
+          return f === void 0 ? "" : `{c|${Object.values(a.data ?? {}).at(f) ?? ""}}
+
+{b|${s}}`;
+        },
+        rich: {
+          b: {
+            fontSize: 16,
+            fontWeight: "normal",
+            lineHeight: 20
+          },
+          c: {
+            fontSize: 28,
+            fontWeight: "bold",
+            lineHeight: 27
+          }
+        }
+      },
+      emphasis: {
+        disabled: !0
+      },
+      itemStyle: {
+        borderColor: t.palette.background.paper,
+        borderWidth: 1
+      }
+    })),
+    dataset: e.map((n) => ({
+      source: n
+    }))
+  };
+}
+const A = p({
+  type: "scatterplot",
+  getOptions: F,
+  csvModifier: (e) => I(e)
+});
+function F({
+  data: e = [],
+  theme: t
+}) {
+  const o = e.length > 1;
+  return {
+    legend: g(o),
+    grid: m(o, t),
+    xAxis: {
+      type: "value",
+      axisLine: {
+        show: !1
+      },
+      axisTick: {
+        show: !1
+      },
+      axisLabel: {
+        fontSize: t.typography.overlineDelicate.fontSize,
+        fontFamily: t.typography.overlineDelicate.fontFamily,
+        showMinLabel: !0,
+        showMaxLabel: !0,
+        hideOverlap: !0,
+        padding: [parseInt(t.spacing(0.5)), parseInt(t.spacing(0.5)), 0, parseInt(t.spacing(0.5))],
+        color: t.palette.black[60]
+      },
+      splitLine: {
+        show: !0,
+        lineStyle: {
+          color: t.palette.black[4]
+        }
+      }
+    },
+    yAxis: {
+      type: "value",
+      axisLabel: {
+        fontSize: t.typography.overlineDelicate.fontSize,
+        fontFamily: t.typography.overlineDelicate.fontFamily,
+        inside: !1,
+        padding: [0, 0, parseInt(t.spacing(1.25)), parseInt(t.spacing(3.25))],
+        margin: 0,
+        show: !0,
+        showMaxLabel: !0,
+        showMinLabel: !1,
+        align: "right",
+        verticalAlign: "bottom"
+      },
+      axisLine: {
+        show: !1
+      },
+      axisTick: {
+        show: !1
+      },
+      splitLine: {
+        show: !0,
+        lineStyle: {
+          color: t.palette.black[4]
+        }
+      }
+    },
+    tooltip: {
+      trigger: "item",
+      position: h(t)
+    },
+    color: Object.values(t.palette.qualitative.bold),
+    series: e.map((n, i) => ({
+      datasetIndex: i,
+      type: "scatter",
+      symbolSize: 8
+    })),
+    dataset: e.map((n) => ({
+      source: n
+    }))
+  };
+}
+const j = p({
+  type: "timeseries",
+  getOptions: z,
+  csvModifier: (e) => u(e)
+});
+function z({
+  data: e = [],
+  theme: t
+}) {
+  const o = (e?.length ?? 0) > 1;
+  return {
+    legend: g(o),
+    grid: m(o, t, {
+      outerBounds: {
+        left: parseInt(t.spacing(3)),
+        right: parseInt(t.spacing(1)),
+        top: parseInt(t.spacing(2))
+      }
+    }),
+    xAxis: {
+      type: "category",
+      axisTick: {
+        alignWithLabel: !0
+      },
+      axisLabel: {
+        show: !0,
+        showMaxLabel: !0,
+        showMinLabel: !0,
+        rotate: 45
+      }
+    },
+    yAxis: {
+      type: "value",
+      axisLabel: {
+        margin: 0,
+        padding: [0, parseInt(t.spacing(0.75)), parseInt(t.spacing(1.25)), -parseInt(t.spacing(1))],
+        show: !0,
+        showMaxLabel: !0,
+        showMinLabel: !1,
+        verticalAlign: "bottom"
+      },
+      axisLine: {
+        show: !1
+      },
+      axisTick: {
+        show: !1
+      },
+      splitLine: {
+        show: !0,
+        lineStyle: {
+          color: t.palette.black[4]
+        }
+      }
+    },
+    color: Object.values(t.palette.qualitative.bold),
+    series: e.map((n, i) => ({
+      datasetIndex: i,
+      type: "line",
+      smooth: !0,
+      emphasis: {
+        focus: "series"
+      }
+    })),
+    dataset: e.map((n) => ({
+      source: n
+    }))
+  };
+}
+const R = p({
+  type: "histogram",
+  getOptions: E,
+  csvModifier: (e) => u(e)
+});
+function E({
+  data: e = [],
+  theme: t
+}) {
+  const o = (e?.length ?? 0) > 1;
+  return {
+    legend: g(o),
+    grid: m(o, t),
+    xAxis: {
+      type: "category",
+      axisLine: {
+        show: !1
+      },
+      axisLabel: {
+        fontSize: t.typography.overlineDelicate.fontSize,
+        fontFamily: t.typography.overlineDelicate.fontFamily,
+        showMinLabel: !0,
+        showMaxLabel: !0,
+        hideOverlap: !0,
+        margin: 0,
+        padding: [parseInt(t.spacing(0.5)), parseInt(t.spacing(0.5)), 0, parseInt(t.spacing(0.5))],
+        color: t.palette.black[60]
+      },
+      axisTick: {
+        show: !1
+      },
+      splitLine: {
+        show: !0,
+        lineStyle: {
+          color: t.palette.black[4]
+        }
+      }
+    },
+    yAxis: {
+      type: "value",
+      axisLabel: {
+        fontSize: t.typography.overlineDelicate.fontSize,
+        fontFamily: t.typography.overlineDelicate.fontFamily,
+        margin: parseInt(t.spacing(1)),
+        show: !0,
+        showMaxLabel: !0,
+        showMinLabel: !1,
+        verticalAlign: "bottom"
+      },
+      axisLine: {
+        show: !1
+      },
+      axisTick: {
+        show: !1
+      },
+      splitLine: {
+        show: !0,
+        lineStyle: {
+          color: t.palette.black[4]
+        }
+      }
+    },
+    tooltip: {
+      position: h(t)
+    },
+    series: e.map((n, i) => ({
+      datasetIndex: i,
+      type: "bar",
+      barMaxWidth: 100,
+      barGap: "0%",
+      // No gap between bars in histogram
+      barCategoryGap: "0%",
+      // No gap between categories in histogram
+      emphasis: {
+        focus: "series"
+      }
+    })),
+    dataset: e.map((n) => ({
+      source: n
+    }))
+  };
+}
+function V({
+  refUI: e,
+  data: t,
+  ...o
+}) {
+  return {
+    ...o,
+    data: t,
+    type: "spread",
+    downloadConfig: {
+      enabled: !0,
+      isDownloading: !1,
+      items: [{
+        ...c,
+        modifier: () => c.modifier(e)
+      }, {
+        ...l,
+        modifier: async (n) => {
+          const i = [["Min", "Max"], ...n?.map((a) => [a.min, a.max]) ?? []];
+          return l.modifier(i);
+        }
+      }]
+    }
+  };
+}
+function _({
+  refUI: e,
+  data: t,
+  ...o
+}) {
+  return {
+    ...o,
+    data: t,
+    type: "range",
+    downloadConfig: {
+      enabled: !0,
+      isDownloading: !1,
+      items: [{
+        ...c,
+        modifier: () => c.modifier(e)
+      }, {
+        ...l,
+        modifier: async (n) => {
+          const i = [["Min Bound", "Max Bound", "Selected Min", "Selected Max", "Note"], ...n?.map((a) => [a.min, a.max, a.value?.[0] ?? a.min, a.value?.[1] ?? a.max]) ?? []];
+          return l.modifier(i);
+        }
+      }]
+    }
+  };
+}
+const Q = {
+  formula: {
+    component: r(() => import("./formula-ui-ChzvMEOG.js").then((e) => e.f).then((e) => ({
+      default: e.FormulaUI
+    }))),
+    skeleton: r(() => import("./skeleton-Dx3FCer0.js").then((e) => ({
+      default: e.FormulaSkeleton
+    }))),
+    defaultConfig: (e) => k(e)
+  },
+  bar: {
+    component: r(() => import("./echart-CqfROFu3.js").then((e) => e.e).then((e) => ({
+      default: e.Echart
+    }))),
+    skeleton: r(() => import("./skeleton-C9Jqc241.js").then((e) => ({
+      default: e.BarSkeleton
+    }))),
+    defaultConfig: (e) => M(e)
+  },
+  pie: {
+    component: r(() => import("./echart-CqfROFu3.js").then((e) => e.e).then((e) => ({
+      default: e.Echart
+    }))),
+    skeleton: r(() => import("./skeleton-DsZhv-AH.js").then((e) => ({
+      default: e.PieSkeleton
+    }))),
+    defaultConfig: (e) => D(e)
+  },
+  scatterplot: {
+    component: r(() => import("./echart-CqfROFu3.js").then((e) => e.e).then((e) => ({
+      default: e.Echart
+    }))),
+    skeleton: r(() => import("./skeleton-DMP-IwaJ.js").then((e) => ({
+      default: e.ScatterplotSkeleton
+    }))),
+    defaultConfig: (e) => A(e)
+  },
+  timeseries: {
+    component: r(() => import("./echart-CqfROFu3.js").then((e) => e.e).then((e) => ({
+      default: e.Echart
+    }))),
+    skeleton: r(() => import("./skeleton-C4rOYTy-.js").then((e) => ({
+      default: e.TimeseriesSkeleton
+    }))),
+    defaultConfig: (e) => j(e)
+  },
+  histogram: {
+    component: r(() => import("./echart-CqfROFu3.js").then((e) => e.e).then((e) => ({
+      default: e.Echart
+    }))),
+    skeleton: r(() => import("./skeleton-D-zHBBIw.js").then((e) => ({
+      default: e.HistogramSkeleton
+    }))),
+    defaultConfig: (e) => R(e)
+  },
+  spread: {
+    component: r(() => import("./spread-ui-BjzH190y.js").then((e) => e.s).then((e) => ({
+      default: e.SpreadUI
+    }))),
+    skeleton: r(() => import("./skeleton-DRorqowB.js").then((e) => ({
+      default: e.SpreadSkeleton
+    }))),
+    defaultConfig: (e) => V(e)
+  },
+  range: {
+    component: r(() => import("./range-ui-CtUX11Xm.js").then((e) => e.r).then((e) => ({
+      default: e.RangeUI
+    }))),
+    skeleton: r(() => import("./skeleton-QVDdb1c2.js").then((e) => ({
+      default: e.RangeSkeleton
+    }))),
+    defaultConfig: (e) => _(e)
+  },
+  markdown: {
+    component: r(() => import("./markdown-n_tOtoiT.js").then((e) => ({
+      default: e.Markdown
+    }))),
+    skeleton: r(() => import("./skeleton-BSPcEvfq.js").then((e) => ({
+      default: e.MarkdownSkeleton
+    }))),
+    defaultConfig: (e) => L(e)
+  }
+};
+export {
+  Q as W,
+  c as a,
+  M as b,
+  l as d,
+  R as h,
+  D as p,
+  A as s,
+  j as t
+};
+//# sourceMappingURL=const-BLV7Tvte.js.map