@milaboratories/miplots4 1.0.130 → 1.0.131

package/dist/scatterplot-umap/components/LowerSVG.js

@@ -1,45 +1,47 @@
-import { j as i } from "../../node_modules/react/jsx-runtime.js";
-import O, { r as g } from "../../_virtual/index.js";
-import { ChartsTitle as R } from "../../common/ChartsTitle.js";
-import { ContinuousGrid as V } from "../../common/ContinuousGrid.js";
+import { j as o } from "../../node_modules/react/jsx-runtime.js";
+import N, { r as g } from "../../_virtual/index.js";
+import { ChartsTitle as O } from "../../common/ChartsTitle.js";
+import { ContinuousGrid as R } from "../../common/ContinuousGrid.js";
 import M from "../../common/fonts.js";
 import { Legend as U } from "../../common/Legend.js";
-import { Tooltip as Z } from "../../common/Tooltip.js";
-import { useDataFrame as q } from "../../common/useDataFrame.js";
-import { BLACK as G } from "../../constants.js";
-import { Axis as H } from "../../scatterplot/components/Axis.js";
-import { numberFormat as L } from "../../utils/numberFormat.js";
-import { DEFAULT_TICKS_SIZE as F, TITLE_LINE as u, LEGEND_OFFSET as J } from "../constants.js";
+import { Tooltip as V } from "../../common/Tooltip.js";
+import { useDataFrame as Z } from "../../common/useDataFrame.js";
+import { BLACK as q } from "../../constants.js";
+import { Axis as E } from "../../scatterplot/components/Axis.js";
+import { formatColumnValue as G } from "../../scatterplot/utils/formatColumnValue.js";
+import { DEFAULT_TICKS_SIZE as H, TITLE_LINE as u, LEGEND_OFFSET as J } from "../constants.js";
 import Q from "../../node_modules/d3-shape/src/line.js";
 import S from "../../node_modules/d3-shape/src/curve/basis.js";
-function z(e, s, h, c = []) {
-  const n = [`x: ${L(s.x)}`, `y: ${L(s.y)}`];
-  h != null && h.label && n.unshift(`${h.label}: ${e.getColumnValue(h.label, s.idx)}`);
-  for (const t of c)
-    n.push(`${t.label}: ${e.getColumnValue(t.valueLabels ?? t.value, s.idx)}`);
-  return n;
+import { format as z } from "../../node_modules/d3-format/src/defaultLocale.js";
+function tt(i, d, m = []) {
+  const a = [];
+  for (const e of m) {
+    const t = e != null && e.format ? z(e.format) : void 0;
+    a.push(`${e.label}: ${G(i, d.idx, e, t)}`);
+  }
+  return a;
 }
-function P(e) {
-  return typeof e == "string" ? e : e.label ?? e.value;
+function F(i) {
+  return typeof i == "string" ? i : i.label ?? i.value;
 }
-const k = Q().curve(S);
-function tt({
-  scales: e,
-  chartSettings: s,
-  mainTitle: h,
-  keyColumn: c,
-  margins: n,
+const L = Q().curve(S);
+function ot({
+  scales: i,
+  chartSettings: d,
+  mainTitle: m,
+  keyColumn: a,
+  margins: e,
   chartSizes: t,
   container: j,
   zoomStateKey: y,
-  legendData: A,
-  dotsByGrouping: C,
-  layers: D,
-  aesGetters: a,
-  tooltipData: d
+  legendData: P,
+  dotsByGrouping: b,
+  layers: A,
+  aesGetters: x,
+  tooltipData: h
 }) {
-  var E;
-  const B = q(), { title: w, xAxis: p, yAxis: m, frame: I, legend: _ } = s, X = p.showTicks ? F : 0, Y = m.showTicks ? F : 0, $ = p.title, T = m.title, K = {
+  var v;
+  const D = Z(), { title: w, xAxis: p, yAxis: c, frame: B, legend: I } = d, _ = p.showTicks ? H : 0, X = c.showTicks ? H : 0, T = p.title, W = c.title, Y = {
     left: 0,
     right: t.chartWidth,
     top: 0,
@@ -47,20 +49,20 @@ function tt({
   };
   if (!j)
     return null;
-  const o = D.find((r) => r.type === "curve"), [W, N] = g.useState([]);
-  function v() {
-    const f = Object.entries(C).map(([x, l]) => ({
-      key: x,
-      d: o != null && o.smoothing ? k(l) ?? "" : l.map((b) => `${e.x(b.x)},${e.y(b.y)}`).join(" "),
+  const n = A.find((r) => r.type === "curve"), [k, K] = g.useState([]);
+  function $() {
+    const f = Object.entries(b).map(([s, l]) => ({
+      key: s,
+      d: n != null && n.smoothing ? L(l) ?? "" : l.map((C) => `${i.x(C.x)},${i.y(C.y)}`).join(" "),
       dot: l[0]
     }));
-    N(f);
+    K(f);
   }
   return g.useEffect(() => {
-    o && (k.x((r) => e.x(r.x)).y((r) => e.y(r.y)), v());
+    n && (L.x((r) => i.x(r.x)).y((r) => i.y(r.y)), $());
   }, [y, t.chartWidth, t.chartHeight]), g.useEffect(() => {
-    o && v();
-  }, [o == null ? void 0 : o.smoothing]), /* @__PURE__ */ i.jsxs(
+    n && $();
+  }, [n == null ? void 0 : n.smoothing]), /* @__PURE__ */ o.jsxs(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -69,103 +71,103 @@ function tt({
       height: t.totalHeight,
       style: { pointerEvents: "none" },
       children: [
-        /* @__PURE__ */ i.jsx("defs", { children: M }),
-        /* @__PURE__ */ i.jsxs("g", { transform: `translate(${n.left},${n.top})`, fontFamily: "Manrope", children: [
-          /* @__PURE__ */ i.jsx("clipPath", { id: "viewportClipPath", children: /* @__PURE__ */ i.jsx("rect", { x: "0", y: "0", width: t.chartWidth, height: t.chartHeight }) }),
-          /* @__PURE__ */ i.jsx(
-            R,
+        /* @__PURE__ */ o.jsx("defs", { children: M }),
+        /* @__PURE__ */ o.jsxs("g", { transform: `translate(${e.left},${e.top})`, fontFamily: "Manrope", children: [
+          /* @__PURE__ */ o.jsx("clipPath", { id: "viewportClipPath", children: /* @__PURE__ */ o.jsx("rect", { x: "0", y: "0", width: t.chartWidth, height: t.chartHeight }) }),
+          /* @__PURE__ */ o.jsx(
+            O,
             {
-              title: h,
+              title: m,
               show: w.show,
               position: w.position,
-              leftPadding: n.left,
-              rightPadding: n.right,
+              leftPadding: e.left,
+              rightPadding: e.right,
               chartsWidth: t.chartWidth
             }
           ),
-          /* @__PURE__ */ i.jsxs("g", { dominantBaseline: "central", textAnchor: "middle", fontWeight: "500", fontSize: "14px", fill: G, children: [
-            $ && /* @__PURE__ */ i.jsx(
+          /* @__PURE__ */ o.jsxs("g", { dominantBaseline: "central", textAnchor: "middle", fontWeight: "500", fontSize: "14px", fill: q, children: [
+            T && /* @__PURE__ */ o.jsx(
               "text",
               {
                 x: t.chartWidth / 2,
-                y: t.chartHeight + n.bottom - u / 2,
-                children: P($)
+                y: t.chartHeight + e.bottom - u / 2,
+                children: F(T)
               }
             ),
-            T && /* @__PURE__ */ i.jsx(
+            W && /* @__PURE__ */ o.jsx(
               "text",
               {
-                x: -n.left + u / 2,
+                x: -e.left + u / 2,
                 y: t.chartHeight / 2,
-                transform: `rotate(-90,${-n.left + u / 2},${t.chartHeight / 2})`,
-                children: P(T)
+                transform: `rotate(-90,${-e.left + u / 2},${t.chartHeight / 2})`,
+                children: F(W)
               }
             )
           ] }),
-          /* @__PURE__ */ i.jsx(
-            V,
+          /* @__PURE__ */ o.jsx(
+            R,
             {
               width: t.chartWidth,
               height: t.chartHeight,
-              scaleX: e.x,
-              scaleY: e.y,
+              scaleX: i.x,
+              scaleY: i.y,
               axisX: p,
-              axisY: m,
+              axisY: c,
               updatingKey: y,
-              frameType: I.type
+              frameType: B.type
             }
           ),
-          /* @__PURE__ */ i.jsx("g", { transform: `translate(0,${t.chartHeight})`, children: /* @__PURE__ */ i.jsx(H, { scale: e.x, orient: "bottom", tickSize: X }) }),
-          /* @__PURE__ */ i.jsx("g", { children: /* @__PURE__ */ i.jsx(H, { scale: e.y, orient: "left", tickSize: Y }) }),
-          o && o.smoothing && /* @__PURE__ */ i.jsx("g", { clipPath: "url(#viewportClipPath)", children: W.map(({ key: r, d: f, dot: x }) => {
+          /* @__PURE__ */ o.jsx("g", { transform: `translate(0,${t.chartHeight})`, children: /* @__PURE__ */ o.jsx(E, { scale: i.x, orient: "bottom", tickSize: _ }) }),
+          /* @__PURE__ */ o.jsx("g", { children: /* @__PURE__ */ o.jsx(E, { scale: i.y, orient: "left", tickSize: X }) }),
+          n && n.smoothing && /* @__PURE__ */ o.jsx("g", { clipPath: "url(#viewportClipPath)", children: k.map(({ key: r, d: f, dot: s }) => {
             var l;
-            return /* @__PURE__ */ i.jsx(
+            return /* @__PURE__ */ o.jsx(
               "path",
               {
                 d: f,
                 fill: "none",
-                stroke: a.dotFill(x.idx),
-                strokeWidth: (l = o.aes) == null ? void 0 : l.lineWidth,
-                strokeDasharray: a.lineType(x.idx)
+                stroke: x.dotFill(s.idx),
+                strokeWidth: (l = n.aes) == null ? void 0 : l.lineWidth,
+                strokeDasharray: x.lineType(s.idx)
               },
               r
             );
           }) }),
-          o && !o.smoothing && /* @__PURE__ */ i.jsx("g", { clipPath: "url(#viewportClipPath)", children: W.map(({ key: r, d: f, dot: x }) => {
+          n && !n.smoothing && /* @__PURE__ */ o.jsx("g", { clipPath: "url(#viewportClipPath)", children: k.map(({ key: r, d: f, dot: s }) => {
             var l;
-            return /* @__PURE__ */ i.jsx(
+            return /* @__PURE__ */ o.jsx(
               "polyline",
               {
                 points: f,
                 fill: "none",
-                stroke: a.dotFill(x.idx),
-                strokeWidth: (l = o.aes) == null ? void 0 : l.lineWidth,
-                strokeDasharray: a.lineType(x.idx)
+                stroke: x.dotFill(s.idx),
+                strokeWidth: (l = n.aes) == null ? void 0 : l.lineWidth,
+                strokeDasharray: x.lineType(s.idx)
               },
               r
             );
           }) }),
-          d.selectedData && /* @__PURE__ */ i.jsx(
-            Z,
+          d.tooltips.show && h.selectedData && /* @__PURE__ */ o.jsx(
+            V,
             {
-              content: z(B, d.selectedData, c, (E = s.tooltips) == null ? void 0 : E.content),
-              x: e.x(d.selectedData.x),
-              y: e.y(d.selectedData.y),
+              content: tt(D, h.selectedData, (v = d.tooltips) == null ? void 0 : v.content),
+              x: i.x(h.selectedData.x),
+              y: i.y(h.selectedData.y),
               active: !0,
-              fixed: d.fixed,
-              sideDistances: K,
+              fixed: h.fixed,
+              sideDistances: Y,
               container: j,
-              onClose: d.onClose
+              onClose: h.onClose
             }
           ),
-          _.show && /* @__PURE__ */ i.jsx("g", { transform: `translate(${t.chartWidth + J},0)`, children: /* @__PURE__ */ i.jsx(U, { legendData: A }) })
+          I.show && /* @__PURE__ */ o.jsx("g", { transform: `translate(${t.chartWidth + J},0)`, children: /* @__PURE__ */ o.jsx(U, { legendData: P }) })
         ] })
       ]
     }
   );
 }
-const mt = O.memo(tt);
+const ut = N.memo(ot);
 export {
-  mt as default
+  ut as default
 };
 //# sourceMappingURL=LowerSVG.js.map

package/dist/scatterplot-umap/components/LowerSVG.js.map

@@ -1 +1 @@
-{"version":3,"file":"LowerSVG.js","sources":["../../../src/scatterplot-umap/components/LowerSVG.tsx"],"sourcesContent":["import { curveBasis, line } from 'd3-shape';\nimport React, { useEffect, useState } from 'react';\nimport { ChartsTitle } from '../../common/ChartsTitle';\nimport { ContinuousGrid } from '../../common/ContinuousGrid';\nimport fonts from '../../common/fonts';\nimport { Legend } from '../../common/Legend';\nimport type { TooltipsData } from '../../common/Tooltip';\nimport { Tooltip } from '../../common/Tooltip';\nimport type { LegendData } from '../../common/types';\nimport { useDataFrame } from '../../common/useDataFrame';\nimport { BLACK } from '../../constants';\nimport type { DataFrame } from '../../DataFrame';\nimport { Axis } from '../../scatterplot/components/Axis';\nimport type { ColumnName } from '../../types';\nimport type { CurveUmapLayer } from '../../types/scatterplot-umap';\nimport { numberFormat } from '../../utils/numberFormat';\nimport { DEFAULT_TICKS_SIZE, LEGEND_OFFSET, TITLE_LINE } from '../constants';\nimport type { ScatterplotUmapSettingsImpl } from '../SettingsImpl';\nimport type { CaptionsSizes, ChartScales, ChartSizes, Dot, DotInfo, Margins, SVGLayerProps } from '../types';\n\nfunction getTooltipContent(dataFrame: DataFrame, dot: DotInfo, keyColumn: ColumnName | null, columnsList: ColumnName[] = []) {\n    const lines = [`x: ${numberFormat(dot.x)}`, `y: ${numberFormat(dot.y)}`];\n    if (keyColumn?.label) {\n        lines.unshift(`${keyColumn.label}: ${dataFrame.getColumnValue(keyColumn.label, dot.idx)}`);\n    }\n    for (const column of columnsList) {\n        lines.push(`${column.label}: ${dataFrame.getColumnValue(column.valueLabels ?? column.value, dot.idx)}`);\n    }\n    return lines;\n}\n\nfunction getTitle(title: string | ColumnName): string {\n    if (typeof title === 'string') {\n        return title;\n    }\n    return title.label ?? title.value;\n}\n\nconst lineGenerator = line<Dot>().curve(curveBasis);\n\nfunction LowerSvg({\n    scales,\n    chartSettings,\n    mainTitle,\n    keyColumn,\n    margins,\n    chartSizes,\n    container,\n    zoomStateKey,\n    legendData,\n    dotsByGrouping,\n    layers,\n    aesGetters,\n    tooltipData\n}: {\n    aesGetters: SVGLayerProps['aesGetters'];\n    scales: ChartScales;\n    chartSettings: ScatterplotUmapSettingsImpl['chartSettings'];\n    mainTitle: string[];\n    keyColumn: ColumnName | null;\n    margins: Margins;\n    chartSizes: ChartSizes;\n    captionsSizes: CaptionsSizes;\n    selectedDot?: DotInfo | null;\n    container: SVGElement | null;\n    zoomStateKey: string;\n    legendData: LegendData;\n    dotsByGrouping: Record<string, Dot[]>;\n    layers: ScatterplotUmapSettingsImpl['layers'];\n    tooltipData: TooltipsData<DotInfo>;\n}) {\n    const dataFrame = useDataFrame();\n    const {title, xAxis, yAxis, frame, legend} = chartSettings;\n    const tickSizeX = xAxis.showTicks ? DEFAULT_TICKS_SIZE : 0;\n    const tickSizeY = yAxis.showTicks ? DEFAULT_TICKS_SIZE : 0;\n    const xTitle = xAxis.title;\n    const yTitle = yAxis.title;\n    const needLeftAxis = true;\n    const needBottomAxis = true;\n\n    const sideDistances = {\n        left: 0,\n        right: chartSizes.chartWidth,\n        top: 0,\n        bottom: chartSizes.chartHeight,\n    };\n\n    if (!container) {\n        return null;\n    }\n\n    const curveLayer = layers.find(layer => layer.type === 'curve') as CurveUmapLayer | undefined;\n    const [lines, setLines] = useState<{key: string, d:string, dot: Dot}[]>([]);\n\n    function updateLines() {\n        const data = Object.entries(dotsByGrouping);\n        const nextLines = data.map(([key, dots]) => ({\n            key,\n            d: curveLayer?.smoothing ? lineGenerator(dots) ?? '' : dots.map(d => `${scales.x(d.x)},${scales.y(d.y)}`).join(' '),\n            dot: dots[0]\n        }));\n        setLines(nextLines);\n    }\n    useEffect(() => {\n        if (!curveLayer) {\n            return;\n        }\n        lineGenerator\n            .x((d: Dot) => scales.x(d.x))\n            .y((d: Dot) => scales.y(d.y));\n        updateLines();\n    }, [zoomStateKey, chartSizes.chartWidth, chartSizes.chartHeight]);\n\n    useEffect(() => {\n        if (!curveLayer) {\n            return;\n        }\n        updateLines();\n    }, [curveLayer?.smoothing]);\n\n    return (\n        <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox={`0 0 ${chartSizes.totalWidth} ${chartSizes.totalHeight}`}\n            width={chartSizes.totalWidth}\n            height={chartSizes.totalHeight}\n            style={{pointerEvents: 'none'}}\n        >\n            <defs>{fonts}</defs>\n            <g transform={`translate(${margins.left},${margins.top})`} fontFamily=\"Manrope\">\n                <clipPath id=\"viewportClipPath\">\n                    <rect x=\"0\" y=\"0\" width={chartSizes.chartWidth} height={chartSizes.chartHeight}/>\n                </clipPath>\n                <ChartsTitle\n                    title={mainTitle}\n                    show={title.show}\n                    position={title.position}\n                    leftPadding={margins.left}\n                    rightPadding={margins.right}\n                    chartsWidth={chartSizes.chartWidth}\n                />\n                <g dominantBaseline=\"central\" textAnchor=\"middle\" fontWeight=\"500\" fontSize=\"14px\" fill={BLACK}>\n                    {xTitle && (\n                        <text\n                            x={chartSizes.chartWidth / 2}\n                            y={chartSizes.chartHeight + margins.bottom - TITLE_LINE / 2}\n                        >\n                            {getTitle(xTitle)}\n                        </text>\n                    )}\n                    {yTitle && (\n                        <text\n                            x={-margins.left + TITLE_LINE / 2}\n                            y={chartSizes.chartHeight / 2}\n                            transform={`rotate(-90,${-margins.left + TITLE_LINE / 2},${\n                                chartSizes.chartHeight / 2\n                            })`}\n                        >\n                            {getTitle(yTitle)}\n                        </text>\n                    )}\n                </g>\n                <ContinuousGrid\n                    width={chartSizes.chartWidth}\n                    height={chartSizes.chartHeight}\n                    scaleX={scales.x}\n                    scaleY={scales.y}\n                    axisX={xAxis}\n                    axisY={yAxis}\n                    updatingKey={zoomStateKey}\n                    frameType={frame.type}\n                />\n                {needBottomAxis && (\n                    <g transform={`translate(0,${chartSizes.chartHeight})`}>\n                        <Axis scale={scales.x} orient=\"bottom\" tickSize={tickSizeX} />\n                    </g>\n                )}\n                {needLeftAxis && (\n                    <g>\n                        <Axis scale={scales.y} orient=\"left\" tickSize={tickSizeY} />\n                    </g>\n                )}\n                {curveLayer && curveLayer.smoothing && (\n                    <g clipPath=\"url(#viewportClipPath)\">\n                        {lines.map(({key, d, dot}) => (\n                            <path\n                                key={key}\n                                d={d}\n                                fill=\"none\"\n                                stroke={aesGetters.dotFill(dot.idx)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.idx)}\n                            />\n                        ))}\n                    </g>\n                )}\n                {curveLayer && !curveLayer.smoothing && (\n                    <g clipPath=\"url(#viewportClipPath)\">\n                        {lines.map(({key, d, dot}) => (\n                            <polyline\n                                key={key}\n                                points={d}\n                                fill=\"none\"\n                                stroke={aesGetters.dotFill(dot.idx)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.idx)}\n                            />\n                        ))}\n                    </g>\n                )}\n                {tooltipData.selectedData && (\n                    <Tooltip\n                        content={getTooltipContent(dataFrame, tooltipData.selectedData, keyColumn, chartSettings.tooltips?.content)}\n                        x={scales.x(tooltipData.selectedData.x)}\n                        y={scales.y(tooltipData.selectedData.y)}\n                        active={true}\n                        fixed={tooltipData.fixed}\n                        sideDistances={sideDistances}\n                        container={container}\n                        onClose={tooltipData.onClose}\n                    />\n                )}\n                {legend.show && (\n                    <g transform={`translate(${chartSizes.chartWidth + LEGEND_OFFSET},0)`}>\n                        <Legend legendData={legendData} />\n                    </g>\n                )}\n            </g>\n        </svg>\n    );\n}\n\nexport default React.memo(LowerSvg);\n"],"names":["getTooltipContent","dataFrame","dot","keyColumn","columnsList","lines","numberFormat","column","getTitle","title","lineGenerator","line","curveBasis","LowerSvg","scales","chartSettings","mainTitle","margins","chartSizes","container","zoomStateKey","legendData","dotsByGrouping","layers","aesGetters","tooltipData","useDataFrame","xAxis","yAxis","frame","legend","tickSizeX","DEFAULT_TICKS_SIZE","tickSizeY","xTitle","yTitle","sideDistances","curveLayer","layer","setLines","useState","updateLines","nextLines","key","dots","d","useEffect","jsxs","jsx","fonts","ChartsTitle","BLACK","TITLE_LINE","ContinuousGrid","Axis","_a","Tooltip","LEGEND_OFFSET","Legend","LowerSvg$1","React"],"mappings":"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"}
+{"version":3,"file":"LowerSVG.js","sources":["../../../src/scatterplot-umap/components/LowerSVG.tsx"],"sourcesContent":["import {format} from 'd3-format';\nimport { curveBasis, line } from 'd3-shape';\nimport React, { useEffect, useState } from 'react';\nimport { ChartsTitle } from '../../common/ChartsTitle';\nimport { ContinuousGrid } from '../../common/ContinuousGrid';\nimport fonts from '../../common/fonts';\nimport { Legend } from '../../common/Legend';\nimport type { TooltipsData } from '../../common/Tooltip';\nimport { Tooltip } from '../../common/Tooltip';\nimport type { LegendData } from '../../common/types';\nimport { useDataFrame } from '../../common/useDataFrame';\nimport { BLACK } from '../../constants';\nimport type { DataFrame } from '../../DataFrame';\nimport { Axis } from '../../scatterplot/components/Axis';\nimport {formatColumnValue} from '../../scatterplot/utils/formatColumnValue';\nimport type { ColumnName } from '../../types';\nimport type { CurveUmapLayer } from '../../types/scatterplot-umap';\nimport { DEFAULT_TICKS_SIZE, LEGEND_OFFSET, TITLE_LINE } from '../constants';\nimport type { ScatterplotUmapSettingsImpl } from '../SettingsImpl';\nimport type { CaptionsSizes, ChartScales, ChartSizes, Dot, DotInfo, Margins, SVGLayerProps } from '../types';\n\nfunction getTooltipContent(dataFrame: DataFrame, dot: DotInfo, columnsList: ColumnName[] = [], ) {\n    const lines: string[] = [];\n    for (const column of columnsList) {\n        const columnFormatter = column?.format ? format(column.format) : undefined;\n        lines.push(`${column.label}: ${formatColumnValue(dataFrame, dot.idx, column, columnFormatter)}`);\n    }\n    return lines;\n}\n\nfunction getTitle(title: string | ColumnName): string {\n    if (typeof title === 'string') {\n        return title;\n    }\n    return title.label ?? title.value;\n}\n\nconst lineGenerator = line<Dot>().curve(curveBasis);\n\nfunction LowerSvg({\n    scales,\n    chartSettings,\n    mainTitle,\n    keyColumn,\n    margins,\n    chartSizes,\n    container,\n    zoomStateKey,\n    legendData,\n    dotsByGrouping,\n    layers,\n    aesGetters,\n    tooltipData\n}: {\n    aesGetters: SVGLayerProps['aesGetters'];\n    scales: ChartScales;\n    chartSettings: ScatterplotUmapSettingsImpl['chartSettings'];\n    mainTitle: string[];\n    keyColumn: ColumnName | null;\n    margins: Margins;\n    chartSizes: ChartSizes;\n    captionsSizes: CaptionsSizes;\n    selectedDot?: DotInfo | null;\n    container: SVGElement | null;\n    zoomStateKey: string;\n    legendData: LegendData;\n    dotsByGrouping: Record<string, Dot[]>;\n    layers: ScatterplotUmapSettingsImpl['layers'];\n    tooltipData: TooltipsData<DotInfo>;\n}) {\n    const dataFrame = useDataFrame();\n    const {title, xAxis, yAxis, frame, legend} = chartSettings;\n    const tickSizeX = xAxis.showTicks ? DEFAULT_TICKS_SIZE : 0;\n    const tickSizeY = yAxis.showTicks ? DEFAULT_TICKS_SIZE : 0;\n    const xTitle = xAxis.title;\n    const yTitle = yAxis.title;\n    const needLeftAxis = true;\n    const needBottomAxis = true;\n\n    const sideDistances = {\n        left: 0,\n        right: chartSizes.chartWidth,\n        top: 0,\n        bottom: chartSizes.chartHeight,\n    };\n\n    if (!container) {\n        return null;\n    }\n\n    const curveLayer = layers.find(layer => layer.type === 'curve') as CurveUmapLayer | undefined;\n    const [lines, setLines] = useState<{key: string, d:string, dot: Dot}[]>([]);\n\n    function updateLines() {\n        const data = Object.entries(dotsByGrouping);\n        const nextLines = data.map(([key, dots]) => ({\n            key,\n            d: curveLayer?.smoothing ? lineGenerator(dots) ?? '' : dots.map(d => `${scales.x(d.x)},${scales.y(d.y)}`).join(' '),\n            dot: dots[0]\n        }));\n        setLines(nextLines);\n    }\n    useEffect(() => {\n        if (!curveLayer) {\n            return;\n        }\n        lineGenerator\n            .x((d: Dot) => scales.x(d.x))\n            .y((d: Dot) => scales.y(d.y));\n        updateLines();\n    }, [zoomStateKey, chartSizes.chartWidth, chartSizes.chartHeight]);\n\n    useEffect(() => {\n        if (!curveLayer) {\n            return;\n        }\n        updateLines();\n    }, [curveLayer?.smoothing]);\n\n    return (\n        <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox={`0 0 ${chartSizes.totalWidth} ${chartSizes.totalHeight}`}\n            width={chartSizes.totalWidth}\n            height={chartSizes.totalHeight}\n            style={{pointerEvents: 'none'}}\n        >\n            <defs>{fonts}</defs>\n            <g transform={`translate(${margins.left},${margins.top})`} fontFamily=\"Manrope\">\n                <clipPath id=\"viewportClipPath\">\n                    <rect x=\"0\" y=\"0\" width={chartSizes.chartWidth} height={chartSizes.chartHeight}/>\n                </clipPath>\n                <ChartsTitle\n                    title={mainTitle}\n                    show={title.show}\n                    position={title.position}\n                    leftPadding={margins.left}\n                    rightPadding={margins.right}\n                    chartsWidth={chartSizes.chartWidth}\n                />\n                <g dominantBaseline=\"central\" textAnchor=\"middle\" fontWeight=\"500\" fontSize=\"14px\" fill={BLACK}>\n                    {xTitle && (\n                        <text\n                            x={chartSizes.chartWidth / 2}\n                            y={chartSizes.chartHeight + margins.bottom - TITLE_LINE / 2}\n                        >\n                            {getTitle(xTitle)}\n                        </text>\n                    )}\n                    {yTitle && (\n                        <text\n                            x={-margins.left + TITLE_LINE / 2}\n                            y={chartSizes.chartHeight / 2}\n                            transform={`rotate(-90,${-margins.left + TITLE_LINE / 2},${\n                                chartSizes.chartHeight / 2\n                            })`}\n                        >\n                            {getTitle(yTitle)}\n                        </text>\n                    )}\n                </g>\n                <ContinuousGrid\n                    width={chartSizes.chartWidth}\n                    height={chartSizes.chartHeight}\n                    scaleX={scales.x}\n                    scaleY={scales.y}\n                    axisX={xAxis}\n                    axisY={yAxis}\n                    updatingKey={zoomStateKey}\n                    frameType={frame.type}\n                />\n                {needBottomAxis && (\n                    <g transform={`translate(0,${chartSizes.chartHeight})`}>\n                        <Axis scale={scales.x} orient=\"bottom\" tickSize={tickSizeX} />\n                    </g>\n                )}\n                {needLeftAxis && (\n                    <g>\n                        <Axis scale={scales.y} orient=\"left\" tickSize={tickSizeY} />\n                    </g>\n                )}\n                {curveLayer && curveLayer.smoothing && (\n                    <g clipPath=\"url(#viewportClipPath)\">\n                        {lines.map(({key, d, dot}) => (\n                            <path\n                                key={key}\n                                d={d}\n                                fill=\"none\"\n                                stroke={aesGetters.dotFill(dot.idx)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.idx)}\n                            />\n                        ))}\n                    </g>\n                )}\n                {curveLayer && !curveLayer.smoothing && (\n                    <g clipPath=\"url(#viewportClipPath)\">\n                        {lines.map(({key, d, dot}) => (\n                            <polyline\n                                key={key}\n                                points={d}\n                                fill=\"none\"\n                                stroke={aesGetters.dotFill(dot.idx)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.idx)}\n                            />\n                        ))}\n                    </g>\n                )}\n                {chartSettings.tooltips.show && tooltipData.selectedData && (\n                    <Tooltip\n                        content={getTooltipContent(dataFrame, tooltipData.selectedData, chartSettings.tooltips?.content)}\n                        x={scales.x(tooltipData.selectedData.x)}\n                        y={scales.y(tooltipData.selectedData.y)}\n                        active={true}\n                        fixed={tooltipData.fixed}\n                        sideDistances={sideDistances}\n                        container={container}\n                        onClose={tooltipData.onClose}\n                    />\n                )}\n                {legend.show && (\n                    <g transform={`translate(${chartSizes.chartWidth + LEGEND_OFFSET},0)`}>\n                        <Legend legendData={legendData} />\n                    </g>\n                )}\n            </g>\n        </svg>\n    );\n}\n\nexport default React.memo(LowerSvg);\n"],"names":["getTooltipContent","dataFrame","dot","columnsList","lines","column","columnFormatter","format","formatColumnValue","getTitle","title","lineGenerator","line","curveBasis","LowerSvg","scales","chartSettings","mainTitle","keyColumn","margins","chartSizes","container","zoomStateKey","legendData","dotsByGrouping","layers","aesGetters","tooltipData","useDataFrame","xAxis","yAxis","frame","legend","tickSizeX","DEFAULT_TICKS_SIZE","tickSizeY","xTitle","yTitle","sideDistances","curveLayer","layer","setLines","useState","updateLines","nextLines","key","dots","d","useEffect","jsxs","jsx","fonts","ChartsTitle","BLACK","TITLE_LINE","ContinuousGrid","Axis","_a","Tooltip","LEGEND_OFFSET","Legend","LowerSvg$1","React"],"mappings":";;;;;;;;;;;;;;;AAqBA,SAASA,GAAkBC,GAAsBC,GAAcC,IAA4B,CAAA,GAAM;AAC7F,QAAMC,IAAkB,CAAA;AACxB,aAAWC,KAAUF,GAAa;AAC9B,UAAMG,IAAkBD,KAAA,QAAAA,EAAQ,SAASE,EAAOF,EAAO,MAAM,IAAI;AACjE,IAAAD,EAAM,KAAK,GAAGC,EAAO,KAAK,KAAKG,EAAkBP,GAAWC,EAAI,KAAKG,GAAQC,CAAe,CAAC,EAAE;AAAA,EACnG;AACA,SAAOF;AACX;AAEA,SAASK,EAASC,GAAoC;AAClD,SAAI,OAAOA,KAAU,WACVA,IAEJA,EAAM,SAASA,EAAM;AAChC;AAEA,MAAMC,IAAgBC,EAAA,EAAY,MAAMC,CAAU;AAElD,SAASC,GAAS;AAAA,EACd,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AACJ,GAgBG;;AACC,QAAM1B,IAAY2B,EAAA,GACZ,EAAC,OAAAlB,GAAO,OAAAmB,GAAO,OAAAC,GAAO,OAAAC,GAAO,QAAAC,MAAUhB,GACvCiB,IAAYJ,EAAM,YAAYK,IAAqB,GACnDC,IAAYL,EAAM,YAAYI,IAAqB,GACnDE,IAASP,EAAM,OACfQ,IAASP,EAAM,OAIfQ,IAAgB;AAAA,IAClB,MAAM;AAAA,IACN,OAAOlB,EAAW;AAAA,IAClB,KAAK;AAAA,IACL,QAAQA,EAAW;AAAA,EAAA;AAGvB,MAAI,CAACC;AACD,WAAO;AAGX,QAAMkB,IAAad,EAAO,KAAK,CAAAe,MAASA,EAAM,SAAS,OAAO,GACxD,CAACpC,GAAOqC,CAAQ,IAAIC,EAAAA,SAA8C,CAAA,CAAE;AAE1E,WAASC,IAAc;AAEnB,UAAMC,IADO,OAAO,QAAQpB,CAAc,EACnB,IAAI,CAAC,CAACqB,GAAKC,CAAI,OAAO;AAAA,MACzC,KAAAD;AAAA,MACA,GAAGN,KAAA,QAAAA,EAAY,YAAY5B,EAAcmC,CAAI,KAAK,KAAKA,EAAK,IAAI,CAAAC,MAAK,GAAGhC,EAAO,EAAEgC,EAAE,CAAC,CAAC,IAAIhC,EAAO,EAAEgC,EAAE,CAAC,CAAC,EAAE,EAAE,KAAK,GAAG;AAAA,MAClH,KAAKD,EAAK,CAAC;AAAA,IAAA,EACb;AACF,IAAAL,EAASG,CAAS;AAAA,EACtB;AACAI,SAAAA,EAAAA,UAAU,MAAM;AACZ,IAAKT,MAGL5B,EACK,EAAE,CAACoC,MAAWhC,EAAO,EAAEgC,EAAE,CAAC,CAAC,EAC3B,EAAE,CAACA,MAAWhC,EAAO,EAAEgC,EAAE,CAAC,CAAC,GAChCJ,EAAA;AAAA,EACJ,GAAG,CAACrB,GAAcF,EAAW,YAAYA,EAAW,WAAW,CAAC,GAEhE4B,EAAAA,UAAU,MAAM;AACZ,IAAKT,KAGLI,EAAA;AAAA,EACJ,GAAG,CAACJ,KAAA,gBAAAA,EAAY,SAAS,CAAC,GAGtBU,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACG,OAAM;AAAA,MACN,SAAS,OAAO7B,EAAW,UAAU,IAAIA,EAAW,WAAW;AAAA,MAC/D,OAAOA,EAAW;AAAA,MAClB,QAAQA,EAAW;AAAA,MACnB,OAAO,EAAC,eAAe,OAAA;AAAA,MAEvB,UAAA;AAAA,QAAA8B,gBAAAA,EAAAA,IAAC,UAAM,UAAAC,EAAA,CAAM;AAAA,QACbF,gBAAAA,EAAAA,KAAC,KAAA,EAAE,WAAW,aAAa9B,EAAQ,IAAI,IAAIA,EAAQ,GAAG,KAAK,YAAW,WAClE,UAAA;AAAA,UAAA+B,gBAAAA,MAAC,YAAA,EAAS,IAAG,oBACT,UAAAA,gBAAAA,EAAAA,IAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAO9B,EAAW,YAAY,QAAQA,EAAW,aAAY,GACnF;AAAA,UACA8B,gBAAAA,EAAAA;AAAAA,YAACE;AAAA,YAAA;AAAA,cACG,OAAOnC;AAAA,cACP,MAAMP,EAAM;AAAA,cACZ,UAAUA,EAAM;AAAA,cAChB,aAAaS,EAAQ;AAAA,cACrB,cAAcA,EAAQ;AAAA,cACtB,aAAaC,EAAW;AAAA,YAAA;AAAA,UAAA;AAAA,UAE5B6B,gBAAAA,EAAAA,KAAC,KAAA,EAAE,kBAAiB,WAAU,YAAW,UAAS,YAAW,OAAM,UAAS,QAAO,MAAMI,GACpF,UAAA;AAAA,YAAAjB,KACGc,gBAAAA,EAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACG,GAAG9B,EAAW,aAAa;AAAA,gBAC3B,GAAGA,EAAW,cAAcD,EAAQ,SAASmC,IAAa;AAAA,gBAEzD,YAASlB,CAAM;AAAA,cAAA;AAAA,YAAA;AAAA,YAGvBC,KACGa,gBAAAA,EAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACG,GAAG,CAAC/B,EAAQ,OAAOmC,IAAa;AAAA,gBAChC,GAAGlC,EAAW,cAAc;AAAA,gBAC5B,WAAW,cAAc,CAACD,EAAQ,OAAOmC,IAAa,CAAC,IACnDlC,EAAW,cAAc,CAC7B;AAAA,gBAEC,YAASiB,CAAM;AAAA,cAAA;AAAA,YAAA;AAAA,UACpB,GAER;AAAA,UACAa,gBAAAA,EAAAA;AAAAA,YAACK;AAAA,YAAA;AAAA,cACG,OAAOnC,EAAW;AAAA,cAClB,QAAQA,EAAW;AAAA,cACnB,QAAQL,EAAO;AAAA,cACf,QAAQA,EAAO;AAAA,cACf,OAAOc;AAAA,cACP,OAAOC;AAAA,cACP,aAAaR;AAAA,cACb,WAAWS,EAAM;AAAA,YAAA;AAAA,UAAA;AAAA,UAGjBmB,gBAAAA,EAAAA,IAAC,KAAA,EAAE,WAAW,eAAe9B,EAAW,WAAW,KAC/C,UAAA8B,gBAAAA,EAAAA,IAACM,GAAA,EAAK,OAAOzC,EAAO,GAAG,QAAO,UAAS,UAAUkB,GAAW,GAChE;AAAA,UAGAiB,gBAAAA,EAAAA,IAAC,KAAA,EACG,UAAAA,gBAAAA,EAAAA,IAACM,GAAA,EAAK,OAAOzC,EAAO,GAAG,QAAO,QAAO,UAAUoB,EAAA,CAAW,GAC9D;AAAA,UAEHI,KAAcA,EAAW,aACtBW,gBAAAA,EAAAA,IAAC,OAAE,UAAS,0BACP,UAAA9C,EAAM,IAAI,CAAC,EAAC,KAAAyC,GAAK,GAAAE,GAAG,KAAA7C;;AACjBgD,mCAAAA,EAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBAEG,GAAAH;AAAA,gBACA,MAAK;AAAA,gBACL,QAAQrB,EAAW,QAAQxB,EAAI,GAAG;AAAA,gBAClC,cAAauD,IAAAlB,EAAW,QAAX,gBAAAkB,EAAgB;AAAA,gBAC7B,iBAAiB/B,EAAW,SAASxB,EAAI,GAAG;AAAA,cAAA;AAAA,cALvC2C;AAAA,YAAA;AAAA,WAOZ,GACL;AAAA,UAEHN,KAAc,CAACA,EAAW,mCACtB,KAAA,EAAE,UAAS,0BACP,UAAAnC,EAAM,IAAI,CAAC,EAAC,KAAAyC,GAAK,GAAAE,GAAG,KAAA7C;;AACjBgD,mCAAAA,EAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBAEG,QAAQH;AAAA,gBACR,MAAK;AAAA,gBACL,QAAQrB,EAAW,QAAQxB,EAAI,GAAG;AAAA,gBAClC,cAAauD,IAAAlB,EAAW,QAAX,gBAAAkB,EAAgB;AAAA,gBAC7B,iBAAiB/B,EAAW,SAASxB,EAAI,GAAG;AAAA,cAAA;AAAA,cALvC2C;AAAA,YAAA;AAAA,WAOZ,GACL;AAAA,UAEH7B,EAAc,SAAS,QAAQW,EAAY,gBACxCuB,gBAAAA,EAAAA;AAAAA,YAACQ;AAAA,YAAA;AAAA,cACG,SAAS1D,GAAkBC,GAAW0B,EAAY,eAAc8B,IAAAzC,EAAc,aAAd,gBAAAyC,EAAwB,OAAO;AAAA,cAC/F,GAAG1C,EAAO,EAAEY,EAAY,aAAa,CAAC;AAAA,cACtC,GAAGZ,EAAO,EAAEY,EAAY,aAAa,CAAC;AAAA,cACtC,QAAQ;AAAA,cACR,OAAOA,EAAY;AAAA,cACnB,eAAAW;AAAA,cACA,WAAAjB;AAAA,cACA,SAASM,EAAY;AAAA,YAAA;AAAA,UAAA;AAAA,UAG5BK,EAAO,QACJkB,gBAAAA,MAAC,KAAA,EAAE,WAAW,aAAa9B,EAAW,aAAauC,CAAa,OAC5D,UAAAT,gBAAAA,EAAAA,IAACU,GAAA,EAAO,YAAArC,GAAwB,EAAA,CACpC;AAAA,QAAA,EAAA,CAER;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGZ;AAEA,MAAAsC,KAAeC,EAAM,KAAKhD,EAAQ;"}

package/dist/scatterplot-umap/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/scatterplot-umap/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAA2D,wBAAwB,EAAE,MAAM,UAAU,CAAC;AAClH,OAAO,KAAK,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpG,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAG5C,OAAO,EAAE,2BAA2B,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,GAAG,EAAE,WAAW,EAAE,kBAAkB,EAAa,OAAO,EAAE,MAAM,SAAS,CAAC;AAMxF,qBAAa,oBAAqB,SAAQ,aAAa;IACnD,QAAQ,EAAE,2BAA2B,CAAC;IACtC,aAAa,EAAE,aAAa,CAAC;IAE7B,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,IAAI,CAAmB;IACjF,mBAAmB,EAAE,CAAC,CAAC,EAAC,OAAO,KAAK,IAAI,CAAmB;IAC3D,0BAA0B,EAAE,CAAC,CAAC,EAAE,kBAAkB,KAAK,IAAI,CAAmB;IAE9E,cAAc,EAAE;QACZ,IAAI,EAAE,GAAG,EAAE,CAAC;QACZ,YAAY,EAAE,MAAM,EAAE,CAAC;QACvB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;QACtC,WAAW,EAAE,WAAW,CAAC;QACzB,YAAY,EAAE,yBAAyB,CAAA;KAC1C,GAAG,IAAI,CAAQ;gBAEJ,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,uBAAuB,EAAE,aAAa,CAAC,EAAE,wBAAwB;IAaxG,KAAK,CAAC,IAAI,EAAE,WAAW;IAcvB,OAAO;IAIP,qBAAqB,CAAC,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,uBAAuB;IA+BxE,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO;IA8B9C,MAAM,IAAI,MAAM;IAOhB,mCAAmC,CAAC,YAAY,EAAE,2BAA2B,EAAE,QAAQ,EAAE,2BAA2B;IAUpH,+BAA+B,CAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS;IAUpE,WAAW;IAsFX,gBAAgB;IA0BhB,YAAY;CAqBf"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/scatterplot-umap/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,EAA2D,wBAAwB,EAAE,MAAM,UAAU,CAAC;AAClH,OAAO,KAAK,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpG,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAG5C,OAAO,EAAE,2BAA2B,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,GAAG,EAAE,WAAW,EAAE,kBAAkB,EAAa,OAAO,EAAE,MAAM,SAAS,CAAC;AAMxF,qBAAa,oBAAqB,SAAQ,aAAa;IACnD,QAAQ,EAAE,2BAA2B,CAAC;IACtC,aAAa,EAAE,aAAa,CAAC;IAE7B,eAAe,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,IAAI,CAAmB;IACjF,mBAAmB,EAAE,CAAC,CAAC,EAAC,OAAO,KAAK,IAAI,CAAmB;IAC3D,0BAA0B,EAAE,CAAC,CAAC,EAAE,kBAAkB,KAAK,IAAI,CAAmB;IAE9E,cAAc,EAAE;QACZ,IAAI,EAAE,GAAG,EAAE,CAAC;QACZ,YAAY,EAAE,MAAM,EAAE,CAAC;QACvB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;QACtC,WAAW,EAAE,WAAW,CAAC;QACzB,YAAY,EAAE,yBAAyB,CAAA;KAC1C,GAAG,IAAI,CAAQ;gBAEJ,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,uBAAuB,EAAE,aAAa,CAAC,EAAE,wBAAwB;IAaxG,KAAK,CAAC,IAAI,EAAE,WAAW;IAcvB,OAAO;IAIP,qBAAqB,CAAC,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,uBAAuB;IA+BxE,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO;IA8B9C,MAAM,IAAI,MAAM;IAOhB,mCAAmC,CAAC,YAAY,EAAE,2BAA2B,EAAE,QAAQ,EAAE,2BAA2B;IAUpH,+BAA+B,CAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS;IAUpE,WAAW;IAmFX,gBAAgB;IA0BhB,YAAY;CAqBf"}

package/dist/scatterplot-umap/index.js

@@ -1,32 +1,34 @@
 var U = Object.defineProperty;
-var A = (c, u, e) => u in c ? U(c, u, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[u] = e;
-var f = (c, u, e) => A(c, typeof u != "symbol" ? u + "" : u, e);
-import { AbstractChart as R } from "../AbstractChart.js";
-import { createLegendInfo as I, addPalettesToAesMapping as T } from "../scatterplot/utils/createLegendInfo.js";
+var L = (c, u, t) => u in c ? U(c, u, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[u] = t;
+var g = (c, u, t) => L(c, typeof u != "symbol" ? u + "" : u, t);
+import { AbstractChart as A } from "../AbstractChart.js";
+import { createLegendInfo as R, addPalettesToAesMapping as I } from "../scatterplot/utils/createLegendInfo.js";
+import { formatColumnValue as T } from "../scatterplot/utils/formatColumnValue.js";
 import P from "./ChartRenderer.js";
 import { SCATTERPLOT_LASSO_EVENTS as m } from "./constants.js";
-import { ScatterplotUmapSettingsImpl as D } from "./SettingsImpl.js";
-function B(c) {
+import { ScatterplotUmapSettingsImpl as b } from "./SettingsImpl.js";
+import { format as B } from "../node_modules/d3-format/src/defaultLocale.js";
+function V(c) {
   return typeof c == "object" && "type" in c && c.type === "grouping";
 }
-class M extends R {
-  constructor(e, a, t) {
-    super(e, a);
-    f(this, "settings");
-    f(this, "chartRenderer");
-    f(this, "onPolygonUpdate", () => {
+class F extends A {
+  constructor(t, a, e) {
+    super(t, a);
+    g(this, "settings");
+    g(this, "chartRenderer");
+    g(this, "onPolygonUpdate", () => {
     });
     // dots indexes from input data
-    f(this, "onTooltipHintSwitch", () => {
+    g(this, "onTooltipHintSwitch", () => {
     });
-    f(this, "onLassoControlsStateUpdate", () => {
+    g(this, "onLassoControlsStateUpdate", () => {
     });
-    f(this, "calculatedData", null);
-    this.settings = new D(a), this.chartRenderer = new P(), t && (this.onPolygonUpdate = t.onPolygonUpdate, this.onTooltipHintSwitch = t.onTooltipHintSwitch, this.onLassoControlsStateUpdate = t.onLassoControlsStateUpdate);
+    g(this, "calculatedData", null);
+    this.settings = new b(a), this.chartRenderer = new P(), e && (this.onPolygonUpdate = e.onPolygonUpdate, this.onTooltipHintSwitch = e.onTooltipHintSwitch, this.onLassoControlsStateUpdate = e.onLassoControlsStateUpdate);
   }
-  mount(e) {
+  mount(t) {
     try {
-      this.chartRenderer.init(e), this._updateData(), this._updateChart();
+      this.chartRenderer.init(t), this._updateData(), this._updateChart();
     } catch (a) {
       console.error(a), a instanceof Error && (this.chartRenderer.renderError(a.message), console.error(a));
     }
@@ -34,113 +36,113 @@ class M extends R {
   unmount() {
     this.chartRenderer.clear();
   }
-  updateSettingsAndData(e, a) {
+  updateSettingsAndData(t, a) {
     try {
-      const t = this.settings, i = this.data;
-      this.settings = new D(a), this.data = e, this._needUpdateCalculatedDataBySettings(t, this.settings) || this._needUpdateCalculatedDataByData(i, this.data) ? this._updateData() : this._updateAesInData();
-      const n = t.layers.find((d) => d.type === "dots"), o = this.settings.layers.find((d) => d.type === "dots");
-      n && o && n.aes.dotSize !== o.aes.dotSize && typeof n.aes.dotSize == "number" && typeof o.aes.dotSize == "number" && this.chartRenderer.updatePointSize(), this._updateChart();
-    } catch (t) {
-      t instanceof Error && (this.chartRenderer.renderError(t.message), console.error(t));
+      const e = this.settings, i = this.data;
+      this.settings = new b(a), this.data = t, this._needUpdateCalculatedDataBySettings(e, this.settings) || this._needUpdateCalculatedDataByData(i, this.data) ? this._updateData() : this._updateAesInData();
+      const n = e.layers.find((d) => d.type === "dots"), s = this.settings.layers.find((d) => d.type === "dots");
+      n && s && n.aes.dotSize !== s.aes.dotSize && typeof n.aes.dotSize == "number" && typeof s.aes.dotSize == "number" && this.chartRenderer.updatePointSize(), this._updateChart();
+    } catch (e) {
+      e instanceof Error && (this.chartRenderer.renderError(e.message), console.error(e));
     }
   }
-  updateChartState(e, a) {
-    if (e === "polygon" && (this.chartRenderer.polygons = a, this._updateChart()), e === m.delete && document) {
-      const t = new CustomEvent(m.delete);
-      document.dispatchEvent(t);
+  updateChartState(t, a) {
+    if (t === "polygon" && (this.chartRenderer.polygons = a, this._updateChart()), t === m.delete && document) {
+      const e = new CustomEvent(m.delete);
+      document.dispatchEvent(e);
     }
-    if (e === m.selectMode && document) {
-      const t = new CustomEvent(m.selectMode, { detail: a });
-      document.dispatchEvent(t);
+    if (t === m.selectMode && document) {
+      const e = new CustomEvent(m.selectMode, { detail: a });
+      document.dispatchEvent(e);
     }
-    if (e === m.forward && document) {
-      const t = new CustomEvent(m.forward);
-      document.dispatchEvent(t);
+    if (t === m.forward && document) {
+      const e = new CustomEvent(m.forward);
+      document.dispatchEvent(e);
     }
-    if (e === m.back && document) {
-      const t = new CustomEvent(m.back);
-      document.dispatchEvent(t);
+    if (t === m.back && document) {
+      const e = new CustomEvent(m.back);
+      document.dispatchEvent(e);
     }
   }
   export() {
     return console.warn("export not implemented"), "";
   }
-  _needUpdateCalculatedDataBySettings(e, a) {
-    var t, i, n, o;
-    return e.grouping.length !== a.grouping.length || e.grouping.some((d, s) => {
+  _needUpdateCalculatedDataBySettings(t, a) {
+    var e, i, n, s;
+    return t.grouping.length !== a.grouping.length || t.grouping.some((d, o) => {
       var h;
-      return d.value !== ((h = a.grouping[s]) == null ? void 0 : h.value);
-    }) || e.layers.length !== a.layers.length || e.layers.some((d, s) => d.type !== a.layers[s].type) || (((t = e.label) == null ? void 0 : t.value) || ((i = a.label) == null ? void 0 : i.value)) && ((n = e.label) == null ? void 0 : n.value) !== ((o = a.label) == null ? void 0 : o.value);
+      return d.value !== ((h = a.grouping[o]) == null ? void 0 : h.value);
+    }) || t.layers.length !== a.layers.length || t.layers.some((d, o) => d.type !== a.layers[o].type) || (((e = t.label) == null ? void 0 : e.value) || ((i = a.label) == null ? void 0 : i.value)) && ((n = t.label) == null ? void 0 : n.value) !== ((s = a.label) == null ? void 0 : s.value);
   }
-  _needUpdateCalculatedDataByData(e, a) {
-    const t = Object.keys(e.data), i = Object.keys(a.data);
-    return e.id !== a.id || t.length !== i.length || t.some((n) => {
-      var o;
-      return e.data[n].length !== ((o = a.data[n]) == null ? void 0 : o.length);
+  _needUpdateCalculatedDataByData(t, a) {
+    const e = Object.keys(t.data), i = Object.keys(a.data);
+    return t.id !== a.id || e.length !== i.length || e.some((n) => {
+      var s;
+      return t.data[n].length !== ((s = a.data[n]) == null ? void 0 : s.length);
     });
   }
   _updateData() {
-    const { x: e, y: a, label: t, highlight: i, grouping: n, layers: o, inheritedAes: d } = this.settings, s = {
+    const { x: t, y: a, label: e, highlight: i, grouping: n, layers: s, inheritedAes: d } = this.settings, o = {
       minX: 1 / 0,
       maxX: -1 / 0,
       minY: 1 / 0,
       maxY: -1 / 0
-    }, h = o.some((r) => r.type === "curve"), g = /* @__PURE__ */ new Set(), y = {}, S = (t == null ? void 0 : t.valueLabels) ?? (t == null ? void 0 : t.value), v = [];
+    }, h = s.some((r) => r.type === "curve"), f = /* @__PURE__ */ new Set(), y = {}, S = [], D = e != null && e.format ? B(e.format) : void 0;
     for (let r = 0; r < this.data.rowsCount; r++) {
-      const l = this.data.getColumnValue(e.value, r), p = this.data.getColumnValue(a.value, r);
+      const l = this.data.getColumnValue(t.value, r), p = this.data.getColumnValue(a.value, r);
       if (typeof l != "number" || typeof p != "number")
         continue;
-      l < s.minX && (s.minX = l), l > s.maxX && (s.maxX = l), p < s.minY && (s.minY = p), p > s.maxY && (s.maxY = p);
-      const w = typeof S == "string" ? this.data.getColumnValue(S, r) : null, _ = i ? !this.data.getColumnValue(i.value, r) : !1, b = {
+      l < o.minX && (o.minX = l), l > o.maxX && (o.maxX = l), p < o.minY && (o.minY = p), p > o.maxY && (o.maxY = p);
+      const w = i ? !this.data.getColumnValue(i.value, r) : !1, E = {
         x: l,
         y: p,
         idx: r,
-        label: w,
-        dimmed: _
+        label: T(this.data, r, e, D),
+        dimmed: w
       };
       if (h) {
-        const C = n.map((L) => this.data.getColumnValue(L.value, r)).join("_");
-        g.add(C), y[C] || (y[C] = []), y[C].push(b);
+        const C = n.map((_) => this.data.getColumnValue(_.value, r)).join("_");
+        f.add(C), y[C] || (y[C] = []), y[C].push(E);
       }
-      v.push(b);
+      S.push(E);
     }
-    i && v.sort((r, l) => l.dimmed === r.dimmed ? 0 : l.dimmed ? 1 : -1);
-    const E = [...g];
-    h && E.forEach((r) => {
+    i && S.sort((r, l) => l.dimmed === r.dimmed ? 0 : l.dimmed ? 1 : -1);
+    const v = [...f];
+    h && v.forEach((r) => {
       y[r].sort((l, p) => l.x - p.x);
     });
-    const x = I(this.data, n, o, d);
+    const x = R(this.data, n, s, d);
     this.calculatedData = {
-      dots: v,
+      dots: S,
       dotsByGrouping: y,
-      groupingKeys: E,
-      dotsExtents: s,
+      groupingKeys: v,
+      dotsExtents: o,
       legendLabels: x
     };
   }
   _updateAesInData() {
-    const e = this.calculatedData;
-    if (!e)
+    const t = this.calculatedData;
+    if (!t)
       return;
-    const { layers: a, inheritedAes: t, grouping: i } = this.settings;
+    const { layers: a, inheritedAes: e, grouping: i } = this.settings;
     i.forEach((n) => {
-      const o = /* @__PURE__ */ new Set(), d = {};
-      a.forEach((s) => {
-        s.aes && Object.entries(s.aes).forEach(([h, g]) => {
-          B(g) && g.value === n.value && (o.add(h), g.palette && (d[h] = g.palette));
+      const s = /* @__PURE__ */ new Set(), d = {};
+      a.forEach((o) => {
+        o.aes && Object.entries(o.aes).forEach(([h, f]) => {
+          V(f) && f.value === n.value && (s.add(h), f.palette && (d[h] = f.palette));
         });
-      }), e.legendLabels[n.value].usedAes = [...o], e.legendLabels[n.value].aesMap = T(n, d, t[n.value]);
+      }), t.legendLabels[n.value].usedAes = [...s], t.legendLabels[n.value].aesMap = I(n, d, e[n.value]);
     });
   }
   _updateChart() {
     if (!this.calculatedData)
       return;
-    const { id: e, chartSettings: a, keyColumn: t, layers: i, grouping: n } = this.settings;
+    const { id: t, chartSettings: a, keyColumn: e, layers: i, grouping: n } = this.settings;
     this.chartRenderer.render(
       this.data,
-      e,
-      a,
       t,
+      a,
+      e,
       this.calculatedData.dots,
       this.calculatedData.dotsExtents,
       this.calculatedData.dotsByGrouping,
@@ -154,6 +156,6 @@ class M extends R {
   }
 }
 export {
-  M as ChartScatterplotUmap
+  F as ChartScatterplotUmap
 };
 //# sourceMappingURL=index.js.map