@milaboratories/miplots4 1.0.176 → 1.0.177

package/dist/bubble/components/Chart.js

@@ -1,112 +1,89 @@
-import { j as t } from "../../_virtual/jsx-runtime.js";
-import { r as H } from "../../_virtual/index.js";
-import { r as I } from "../../_virtual/index2.js";
-import { Tooltip as N } from "../../common/Tooltip.js";
-import { BLACK as P } from "../../constants.js";
-import { FONT_SIZE as R, FACET_TITLE_OFFSET as Z } from "../constants.js";
-import { AxisCaptions as q } from "./AxisCaptions.js";
-function D({
-  facetKey: d,
-  dimensions: r,
-  scales: l,
-  cells: h,
-  colorScale: V,
-  sizeScale: b,
-  chartSettings: m,
-  cellsMeta: j,
-  stepX: c,
-  stepY: u,
-  aes: E,
-  labelAngles: A,
-  chartSizes: x,
-  margins: a,
-  tooltipsContainer: L,
-  tooltipsData: e,
-  getTooltip: $
-}) {
-  const [g, F] = H.useState(), { xAxis: k, yAxis: B } = m, { width: W, height: _ } = r.inner, { padding: n, sideElementBBoxes: i } = r, { xLabels: w, yLabels: M } = j, p = l.x.domain(), C = l.y.domain(), O = {
-    left: a.left + r.left + n.left,
-    right: x.totalWidth - (a.left + r.left + n.left),
-    top: a.top + r.top + n.top,
-    bottom: x.totalHeight - (a.top + r.top + n.top)
-  }, T = !1, S = e.fixed && g;
-  return /* @__PURE__ */ t.jsxs("g", { transform: `translate(${r.left},${r.top})`, fontSize: R, children: [
-    /* @__PURE__ */ t.jsxs("g", { transform: `translate(${n.left},${n.top})`, children: [
-      i.top.facetTitle.isVisible && /* @__PURE__ */ t.jsx(
-        "text",
-        {
-          x: i.top.facetTitle.x,
-          y: i.top.facetTitle.y + i.top.facetTitle.height - Z,
-          fontWeight: "500",
-          fontSize: "20px",
-          children: j.facetKeyValues[d].join(", ")
-        }
-      ),
-      T,
-      p.map(
-        (f) => C.map((s) => {
-          var v;
-          const o = (v = h == null ? void 0 : h[f]) == null ? void 0 : v[s], z = S && o && e.selectedData === o, y = o ? /* @__PURE__ */ t.jsx(
-            "circle",
-            {
-              cx: l.x(f) + c / 2,
-              cy: l.y(s) + u / 2,
-              r: b(o.normalizedValue.sizeValue),
-              stroke: E.cellStrokeColor,
-              fill: o.value.colorValue === null ? E.emptyCellColor : V(o.normalizedValue.colorValue),
-              onMouseOver: () => e.onMouseEnter(o, d),
-              onMouseLeave: () => e.onMouseLeave()
-            },
-            o ? o.id : `${f}_${s}`
-          ) : null;
-          return z ? I.createPortal(y, g) : y;
-        })
-      ),
-      /* @__PURE__ */ t.jsx("g", { children: m.frame.type === "full" && /* @__PURE__ */ t.jsx("rect", { fill: "none", stroke: P, x: "0", y: "0", width: W, height: _ }) }),
-      /* @__PURE__ */ t.jsx("g", { fontWeight: "500", children: /* @__PURE__ */ t.jsx(
-        q,
-        {
-          sideElementBBoxes: i,
-          xKeys: p,
-          yKeys: C,
-          scales: l,
-          xAxis: k,
-          yAxis: B,
-          stepX: c,
-          stepY: u,
-          labelAngles: A,
-          xLabels: w,
-          yLabels: M,
-          debug: T
-        }
-      ) }),
-      e.fixed && /* @__PURE__ */ t.jsx("rect", { width: x.chartWidth, height: x.chartHeight, fill: "rgba(255,255,255,0.8)" }),
-      /* @__PURE__ */ t.jsx(
-        "g",
-        {
-          ref: (f) => {
-            f && !g && F(f);
-          }
-        }
-      )
-    ] }),
-    m.tooltips.show && e.selectedData && e.currentFacet === d && /* @__PURE__ */ t.jsx(
-      N,
-      {
-        content: $(e.selectedData),
-        x: l.x(String(e.selectedData.x)) + c / 2,
-        y: l.y(String(e.selectedData.y)) + u / 2,
-        offset: p.length > 1 ? c / 2 : 0,
-        active: !0,
-        sideDistances: O,
-        container: L,
-        onClose: e.onClose,
-        fixed: e.fixed
-      }
-    )
-  ] });
+import "../../constants.js";
+import { Tooltip as e } from "../../common/Tooltip.js";
+import { AxisCaptions as t } from "./AxisCaptions.js";
+import { useState as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { createPortal as a } from "react-dom";
+function o({ facetKey: o, dimensions: s, scales: c, cells: l, colorScale: u, sizeScale: d, chartSettings: f, cellsMeta: p, stepX: m, stepY: h, aes: g, labelAngles: _, chartSizes: v, margins: y, tooltipsContainer: b, tooltipsData: x, getTooltip: S }) {
+	let [C, w] = n(), { xAxis: T, yAxis: E } = f, { width: D, height: O } = s.inner, { padding: k, sideElementBBoxes: A } = s, { xLabels: j, yLabels: M } = p, N = c.x.domain(), P = c.y.domain(), F = {
+		left: y.left + s.left + k.left,
+		right: v.totalWidth - (y.left + s.left + k.left),
+		top: y.top + s.top + k.top,
+		bottom: v.totalHeight - (y.top + s.top + k.top)
+	}, I = x.fixed && C;
+	return /* @__PURE__ */ i("g", {
+		transform: `translate(${s.left},${s.top})`,
+		fontSize: 16,
+		children: [/* @__PURE__ */ i("g", {
+			transform: `translate(${k.left},${k.top})`,
+			children: [
+				A.top.facetTitle.isVisible && /* @__PURE__ */ r("text", {
+					x: A.top.facetTitle.x,
+					y: A.top.facetTitle.y + A.top.facetTitle.height - 24,
+					fontWeight: "500",
+					fontSize: "20px",
+					children: p.facetKeyValues[o].join(", ")
+				}),
+				!1,
+				N.map((e) => P.map((t) => {
+					let n = l?.[e]?.[t], i = I && n && x.selectedData === n, s = n ? /* @__PURE__ */ r("circle", {
+						cx: c.x(e) + m / 2,
+						cy: c.y(t) + h / 2,
+						r: d(n.normalizedValue.sizeValue),
+						stroke: g.cellStrokeColor,
+						fill: n.value.colorValue === null ? g.emptyCellColor : u(n.normalizedValue.colorValue),
+						onMouseOver: () => x.onMouseEnter(n, o),
+						onMouseLeave: () => x.onMouseLeave()
+					}, n ? n.id : `${e}_${t}`) : null;
+					return i ? a(s, C) : s;
+				})),
+				/* @__PURE__ */ r("g", { children: f.frame.type === "full" && /* @__PURE__ */ r("rect", {
+					fill: "none",
+					stroke: "#110529",
+					x: "0",
+					y: "0",
+					width: D,
+					height: O
+				}) }),
+				/* @__PURE__ */ r("g", {
+					fontWeight: "500",
+					children: /* @__PURE__ */ r(t, {
+						sideElementBBoxes: A,
+						xKeys: N,
+						yKeys: P,
+						scales: c,
+						xAxis: T,
+						yAxis: E,
+						stepX: m,
+						stepY: h,
+						labelAngles: _,
+						xLabels: j,
+						yLabels: M,
+						debug: !1
+					})
+				}),
+				x.fixed && /* @__PURE__ */ r("rect", {
+					width: v.chartWidth,
+					height: v.chartHeight,
+					fill: "rgba(255,255,255,0.8)"
+				}),
+				/* @__PURE__ */ r("g", { ref: (e) => {
+					e && !C && w(e);
+				} })
+			]
+		}), f.tooltips.show && x.selectedData && x.currentFacet === o && /* @__PURE__ */ r(e, {
+			content: S(x.selectedData),
+			x: c.x(String(x.selectedData.x)) + m / 2,
+			y: c.y(String(x.selectedData.y)) + h / 2,
+			offset: N.length > 1 ? m / 2 : 0,
+			active: !0,
+			sideDistances: F,
+			container: b,
+			onClose: x.onClose,
+			fixed: x.fixed
+		})]
+	});
 }
-export {
-  D as Chart
-};
-//# sourceMappingURL=Chart.js.map
+export { o as Chart };
+
+//# sourceMappingURL=Chart.js.map

package/dist/bubble/components/Chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chart.js","sources":["../../../src/bubble/components/Chart.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport type { TooltipsData } from '../../common/Tooltip';\nimport { Tooltip } from '../../common/Tooltip';\nimport { BLACK } from '../../constants';\nimport type { DataValue } from '../../types';\nimport type { BubbleSettingsImpl } from '../BubbleSettingsImpl';\nimport { FACET_TITLE_OFFSET, FONT_SIZE } from '../constants';\nimport type { CellBubble, GroupedCellsBubble } from '../getGroupedCellsData';\nimport { AxisCaptions } from './AxisCaptions';\nimport type { CaptionsSizes, ChartDimensionsData, ChartScales, ChartSizes, LabelAngles, Margins } from './types';\n\nexport function Chart({\n    facetKey,\n    dimensions,\n    scales,\n    cells,\n    colorScale,\n    sizeScale,\n    chartSettings,\n    cellsMeta,\n    stepX,\n    stepY,\n    aes,\n    labelAngles,\n    chartSizes,\n    margins,\n    tooltipsContainer,\n    tooltipsData,\n    getTooltip\n}: {\n    facetKey: string;\n    chartSizes: ChartSizes;\n    captionsSizes: CaptionsSizes;\n    dimensions: ChartDimensionsData;\n    scales: ChartScales;\n    cells: GroupedCellsBubble['facets'][keyof GroupedCellsBubble['facets']]['cells'];\n    colorScale: (value: DataValue) => string;\n    sizeScale: (value: DataValue) => number;\n    chartSettings: BubbleSettingsImpl['chartSettings'];\n    cellsMeta: GroupedCellsBubble['meta'];\n    stepX: number;\n    stepY: number;\n    aes: BubbleSettingsImpl['aes'];\n    labelAngles: LabelAngles;\n    margins: Margins;\n    tooltipsContainer?: Element;\n    tooltipsData: TooltipsData<CellBubble>\n    getTooltip: (cell: CellBubble) => string[],\n}) {\n    const [activeElementContainer, setActiveElementContainer] = useState<SVGGElement>();\n\n    const {xAxis, yAxis} = chartSettings;\n    const {width, height} = dimensions.inner;\n    const {padding, sideElementBBoxes} = dimensions;\n    const {xLabels, yLabels} = cellsMeta;\n\n    const xKeys = scales.x.domain();\n    const yKeys = scales.y.domain();\n\n    const sideDistances = {\n        left: margins.left + dimensions.left + padding.left,\n        right: chartSizes.totalWidth - (margins.left + dimensions.left + padding.left),\n        top: margins.top + dimensions.top + padding.top,\n        bottom: chartSizes.totalHeight - (margins.top + dimensions.top + padding.top),\n    };\n\n    const debug = false;\n\n    const dimmedBackground = tooltipsData.fixed && activeElementContainer;\n    return (\n        <g transform={`translate(${dimensions.left},${dimensions.top})`} fontSize={FONT_SIZE}>\n            <g transform={`translate(${padding.left},${padding.top})`}>\n                {/* facet title */}\n                {sideElementBBoxes.top.facetTitle.isVisible && (\n                    <text\n                        x={sideElementBBoxes.top.facetTitle.x}\n                        y={\n                            sideElementBBoxes.top.facetTitle.y +\n                            sideElementBBoxes.top.facetTitle.height -\n                            FACET_TITLE_OFFSET\n                        }\n                        fontWeight=\"500\"\n                        fontSize=\"20px\"\n                    >\n                        {cellsMeta.facetKeyValues[facetKey].join(', ')}\n                    </text>\n                )}\n                {debug && (\n                    <g fill=\"green\" opacity=\"0.2\">\n                        <rect\n                            x={-padding.left}\n                            y={-padding.top}\n                            width={dimensions.outer.width}\n                            height={dimensions.outer.height}\n                            fill=\"none\"\n                            stroke=\"red\"\n                        />\n                        <rect x={-padding.left} y=\"0\" width={padding.left} height={height} />\n                        <rect x={width} y=\"0\" width={padding.right} height={height} />\n                        <rect x=\"0\" y={-padding.top} width={width} height={padding.top} />\n                        <rect x=\"0\" y={height} width={width} height={padding.bottom} />\n                    </g>\n                )}\n                {/* cells */}\n                {xKeys.map(xKey =>\n                    yKeys.map(yKey => {\n                        const cell = cells?.[xKey]?.[yKey];\n                        const highlighted = dimmedBackground && cell && tooltipsData.selectedData === cell;\n                        const cellElement = cell ? (\n                            <circle\n                                key={cell ? cell.id : `${xKey}_${yKey}`}\n                                cx={scales.x(xKey) + stepX / 2}\n                                cy={scales.y(yKey) + stepY / 2}\n                                r={sizeScale(cell.normalizedValue.sizeValue as number)}\n                                stroke={aes.cellStrokeColor}\n                                fill={cell.value.colorValue === null ? aes.emptyCellColor : colorScale(cell.normalizedValue.colorValue)}\n                                onMouseOver={() => tooltipsData.onMouseEnter(cell, facetKey)}\n                                onMouseLeave={() => tooltipsData.onMouseLeave()}\n                            />\n                        ) : null;\n                        return highlighted ? createPortal(cellElement, activeElementContainer) : cellElement;\n                    })\n                )}\n                <g>\n                    {chartSettings.frame.type === 'full' && <rect fill=\"none\" stroke={BLACK} x=\"0\" y=\"0\" width={width} height={height} />}\n                </g>\n                <g fontWeight=\"500\">\n                    <AxisCaptions\n                        sideElementBBoxes={sideElementBBoxes}\n                        xKeys={xKeys}\n                        yKeys={yKeys}\n                        scales={scales}\n                        xAxis={xAxis}\n                        yAxis={yAxis}\n                        stepX={stepX}\n                        stepY={stepY}\n                        labelAngles={labelAngles}\n                        xLabels={xLabels}\n                        yLabels={yLabels}\n                        debug={debug}\n                    />\n                </g>\n                {tooltipsData.fixed && <rect width={chartSizes.chartWidth} height={chartSizes.chartHeight} fill=\"rgba(255,255,255,0.8)\"/>}\n                <g ref={node => {\n                    if (node && !activeElementContainer) {\n                        setActiveElementContainer(node);\n                    }\n                }}\n                />\n            </g>\n            {chartSettings.tooltips.show && tooltipsData.selectedData && tooltipsData.currentFacet === facetKey && (\n                <Tooltip\n                    content={getTooltip(tooltipsData.selectedData)}\n                    x={scales.x(String(tooltipsData.selectedData.x)) + stepX / 2}\n                    y={scales.y(String(tooltipsData.selectedData.y)) + stepY / 2}\n                    offset={xKeys.length > 1 ? stepX / 2 : 0}\n                    active\n                    sideDistances={sideDistances}\n                    container={tooltipsContainer}\n                    onClose={tooltipsData.onClose}\n                    fixed={tooltipsData.fixed}\n                />\n            )}\n        </g>\n    );\n}\n"],"names":["Chart","facetKey","dimensions","scales","cells","colorScale","sizeScale","chartSettings","cellsMeta","stepX","stepY","aes","labelAngles","chartSizes","margins","tooltipsContainer","tooltipsData","getTooltip","activeElementContainer","setActiveElementContainer","useState","xAxis","yAxis","width","height","padding","sideElementBBoxes","xLabels","yLabels","xKeys","yKeys","sideDistances","debug","dimmedBackground","jsxs","FONT_SIZE","jsx","FACET_TITLE_OFFSET","xKey","yKey","cell","_a","highlighted","cellElement","createPortal","BLACK","AxisCaptions","node","Tooltip"],"mappings":"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"}
+{"version":3,"file":"Chart.js","names":[],"sources":["../../../src/bubble/components/Chart.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport type { TooltipsData } from '../../common/Tooltip';\nimport { Tooltip } from '../../common/Tooltip';\nimport { BLACK } from '../../constants';\nimport type { DataValue } from '../../types';\nimport type { BubbleSettingsImpl } from '../BubbleSettingsImpl';\nimport { FACET_TITLE_OFFSET, FONT_SIZE } from '../constants';\nimport type { CellBubble, GroupedCellsBubble } from '../getGroupedCellsData';\nimport { AxisCaptions } from './AxisCaptions';\nimport type { CaptionsSizes, ChartDimensionsData, ChartScales, ChartSizes, LabelAngles, Margins } from './types';\n\nexport function Chart({\n    facetKey,\n    dimensions,\n    scales,\n    cells,\n    colorScale,\n    sizeScale,\n    chartSettings,\n    cellsMeta,\n    stepX,\n    stepY,\n    aes,\n    labelAngles,\n    chartSizes,\n    margins,\n    tooltipsContainer,\n    tooltipsData,\n    getTooltip\n}: {\n    facetKey: string;\n    chartSizes: ChartSizes;\n    captionsSizes: CaptionsSizes;\n    dimensions: ChartDimensionsData;\n    scales: ChartScales;\n    cells: GroupedCellsBubble['facets'][keyof GroupedCellsBubble['facets']]['cells'];\n    colorScale: (value: DataValue) => string;\n    sizeScale: (value: DataValue) => number;\n    chartSettings: BubbleSettingsImpl['chartSettings'];\n    cellsMeta: GroupedCellsBubble['meta'];\n    stepX: number;\n    stepY: number;\n    aes: BubbleSettingsImpl['aes'];\n    labelAngles: LabelAngles;\n    margins: Margins;\n    tooltipsContainer?: Element;\n    tooltipsData: TooltipsData<CellBubble>\n    getTooltip: (cell: CellBubble) => string[],\n}) {\n    const [activeElementContainer, setActiveElementContainer] = useState<SVGGElement>();\n\n    const {xAxis, yAxis} = chartSettings;\n    const {width, height} = dimensions.inner;\n    const {padding, sideElementBBoxes} = dimensions;\n    const {xLabels, yLabels} = cellsMeta;\n\n    const xKeys = scales.x.domain();\n    const yKeys = scales.y.domain();\n\n    const sideDistances = {\n        left: margins.left + dimensions.left + padding.left,\n        right: chartSizes.totalWidth - (margins.left + dimensions.left + padding.left),\n        top: margins.top + dimensions.top + padding.top,\n        bottom: chartSizes.totalHeight - (margins.top + dimensions.top + padding.top),\n    };\n\n    const debug = false;\n\n    const dimmedBackground = tooltipsData.fixed && activeElementContainer;\n    return (\n        <g transform={`translate(${dimensions.left},${dimensions.top})`} fontSize={FONT_SIZE}>\n            <g transform={`translate(${padding.left},${padding.top})`}>\n                {/* facet title */}\n                {sideElementBBoxes.top.facetTitle.isVisible && (\n                    <text\n                        x={sideElementBBoxes.top.facetTitle.x}\n                        y={\n                            sideElementBBoxes.top.facetTitle.y +\n                            sideElementBBoxes.top.facetTitle.height -\n                            FACET_TITLE_OFFSET\n                        }\n                        fontWeight=\"500\"\n                        fontSize=\"20px\"\n                    >\n                        {cellsMeta.facetKeyValues[facetKey].join(', ')}\n                    </text>\n                )}\n                {debug && (\n                    <g fill=\"green\" opacity=\"0.2\">\n                        <rect\n                            x={-padding.left}\n                            y={-padding.top}\n                            width={dimensions.outer.width}\n                            height={dimensions.outer.height}\n                            fill=\"none\"\n                            stroke=\"red\"\n                        />\n                        <rect x={-padding.left} y=\"0\" width={padding.left} height={height} />\n                        <rect x={width} y=\"0\" width={padding.right} height={height} />\n                        <rect x=\"0\" y={-padding.top} width={width} height={padding.top} />\n                        <rect x=\"0\" y={height} width={width} height={padding.bottom} />\n                    </g>\n                )}\n                {/* cells */}\n                {xKeys.map(xKey =>\n                    yKeys.map(yKey => {\n                        const cell = cells?.[xKey]?.[yKey];\n                        const highlighted = dimmedBackground && cell && tooltipsData.selectedData === cell;\n                        const cellElement = cell ? (\n                            <circle\n                                key={cell ? cell.id : `${xKey}_${yKey}`}\n                                cx={scales.x(xKey) + stepX / 2}\n                                cy={scales.y(yKey) + stepY / 2}\n                                r={sizeScale(cell.normalizedValue.sizeValue as number)}\n                                stroke={aes.cellStrokeColor}\n                                fill={cell.value.colorValue === null ? aes.emptyCellColor : colorScale(cell.normalizedValue.colorValue)}\n                                onMouseOver={() => tooltipsData.onMouseEnter(cell, facetKey)}\n                                onMouseLeave={() => tooltipsData.onMouseLeave()}\n                            />\n                        ) : null;\n                        return highlighted ? createPortal(cellElement, activeElementContainer) : cellElement;\n                    })\n                )}\n                <g>\n                    {chartSettings.frame.type === 'full' && <rect fill=\"none\" stroke={BLACK} x=\"0\" y=\"0\" width={width} height={height} />}\n                </g>\n                <g fontWeight=\"500\">\n                    <AxisCaptions\n                        sideElementBBoxes={sideElementBBoxes}\n                        xKeys={xKeys}\n                        yKeys={yKeys}\n                        scales={scales}\n                        xAxis={xAxis}\n                        yAxis={yAxis}\n                        stepX={stepX}\n                        stepY={stepY}\n                        labelAngles={labelAngles}\n                        xLabels={xLabels}\n                        yLabels={yLabels}\n                        debug={debug}\n                    />\n                </g>\n                {tooltipsData.fixed && <rect width={chartSizes.chartWidth} height={chartSizes.chartHeight} fill=\"rgba(255,255,255,0.8)\"/>}\n                <g ref={node => {\n                    if (node && !activeElementContainer) {\n                        setActiveElementContainer(node);\n                    }\n                }}\n                />\n            </g>\n            {chartSettings.tooltips.show && tooltipsData.selectedData && tooltipsData.currentFacet === facetKey && (\n                <Tooltip\n                    content={getTooltip(tooltipsData.selectedData)}\n                    x={scales.x(String(tooltipsData.selectedData.x)) + stepX / 2}\n                    y={scales.y(String(tooltipsData.selectedData.y)) + stepY / 2}\n                    offset={xKeys.length > 1 ? stepX / 2 : 0}\n                    active\n                    sideDistances={sideDistances}\n                    container={tooltipsContainer}\n                    onClose={tooltipsData.onClose}\n                    fixed={tooltipsData.fixed}\n                />\n            )}\n        </g>\n    );\n}\n"],"mappings":"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"}

package/dist/bubble/components/ChartsGroup.js

@@ -1,95 +1,72 @@
-import { j as t } from "../../_virtual/jsx-runtime.js";
-import { r as p } from "../../_virtual/index.js";
-import { ChartsTitle as G } from "../../common/ChartsTitle.js";
-import { ErrorBoundary as H } from "../../common/ErrorBoundary.js";
-import D from "../../common/fonts.js";
-import { Legend as I } from "../../common/Legend.js";
-import { useTooltip as M } from "../../common/Tooltip.js";
-import { LEGEND_OFFSET as N } from "../constants.js";
-import { Chart as O } from "./Chart.js";
-function U({
-  margins: r,
-  captionsSizes: a,
-  settingsId: m,
-  chartSettings: n,
-  chartSizes: o,
-  chartsDimensions: e,
-  facetKeys: l,
-  scales: h,
-  colorScale: g,
-  sizeScale: x,
-  groupedCells: u,
-  cellsMeta: j,
-  step: d,
-  legend: w,
-  aes: T,
-  columnsCount: C,
-  labelAngles: E,
-  getCellTooltip: c,
-  onTooltipHintSwitch: $
-}) {
-  const W = M($), [P, v] = p.useState(), s = p.useRef(null);
-  p.useEffect(() => {
-    s.current && v(s.current);
-  }, []);
-  const f = e[l[0]].padding, F = e[l[C - 1]].padding, L = r.left + o.chartsWidth + N, R = r.top + f.top;
-  return /* @__PURE__ */ t.jsx(H, { dataId: m, children: /* @__PURE__ */ t.jsxs(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: `0 0 ${o.totalWidth} ${o.totalHeight}`,
-      width: o.totalWidth,
-      height: o.totalHeight,
-      fontFamily: "Manrope",
-      children: [
-        /* @__PURE__ */ t.jsx("defs", { children: D }),
-        /* @__PURE__ */ t.jsxs("g", { transform: `translate(${r.left},${r.top})`, children: [
-          /* @__PURE__ */ t.jsx(
-            G,
-            {
-              title: [n.title.name],
-              show: n.title.show,
-              position: n.title.position,
-              leftPadding: f.left,
-              rightPadding: F.right,
-              chartsWidth: o.chartsWidth
-            }
-          ),
-          l.map((i) => {
-            const { cells: B } = u[i];
-            return /* @__PURE__ */ t.jsx(
-              O,
-              {
-                captionsSizes: a,
-                facetKey: i,
-                dimensions: e[i],
-                scales: h,
-                cells: B,
-                cellsMeta: j,
-                stepX: d.x,
-                stepY: d.y,
-                colorScale: g,
-                sizeScale: x,
-                chartSettings: n,
-                aes: T,
-                labelAngles: E,
-                margins: r,
-                chartSizes: o,
-                tooltipsData: W,
-                tooltipsContainer: P,
-                getTooltip: c
-              },
-              i
-            );
-          })
-        ] }),
-        /* @__PURE__ */ t.jsx("g", { transform: `translate(${L},${R})`, children: /* @__PURE__ */ t.jsx(I, { legendData: w }) }),
-        /* @__PURE__ */ t.jsx("g", { ref: s, style: { outline: "none" } })
-      ]
-    }
-  ) });
+import e from "../../common/fonts.js";
+import { useTooltip as t } from "../../common/Tooltip.js";
+import { ErrorBoundary as n } from "../../common/ErrorBoundary.js";
+import { ChartsTitle as r } from "../../common/ChartsTitle.js";
+import { Legend as i } from "../../common/Legend.js";
+import { Chart as a } from "./Chart.js";
+import { useEffect as o, useRef as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+function d({ margins: d, captionsSizes: f, settingsId: p, chartSettings: m, chartSizes: h, chartsDimensions: g, facetKeys: _, scales: v, colorScale: y, sizeScale: b, groupedCells: x, cellsMeta: S, step: C, legend: w, aes: T, columnsCount: E, labelAngles: D, getCellTooltip: O, onTooltipHintSwitch: k }) {
+	let A = t(k), [j, M] = c(), N = s(null);
+	o(() => {
+		N.current && M(N.current);
+	}, []);
+	let P = g[_[0]].padding, F = g[_[E - 1]].padding, I = d.left + h.chartsWidth + 20, L = d.top + P.top;
+	return /* @__PURE__ */ l(n, {
+		dataId: p,
+		children: /* @__PURE__ */ u("svg", {
+			xmlns: "http://www.w3.org/2000/svg",
+			viewBox: `0 0 ${h.totalWidth} ${h.totalHeight}`,
+			width: h.totalWidth,
+			height: h.totalHeight,
+			fontFamily: "Manrope",
+			children: [
+				/* @__PURE__ */ l("defs", { children: e }),
+				/* @__PURE__ */ u("g", {
+					transform: `translate(${d.left},${d.top})`,
+					children: [/* @__PURE__ */ l(r, {
+						title: [m.title.name],
+						show: m.title.show,
+						position: m.title.position,
+						leftPadding: P.left,
+						rightPadding: F.right,
+						chartsWidth: h.chartsWidth
+					}), _.map((e) => {
+						let { cells: t } = x[e];
+						return /* @__PURE__ */ l(a, {
+							captionsSizes: f,
+							facetKey: e,
+							dimensions: g[e],
+							scales: v,
+							cells: t,
+							cellsMeta: S,
+							stepX: C.x,
+							stepY: C.y,
+							colorScale: y,
+							sizeScale: b,
+							chartSettings: m,
+							aes: T,
+							labelAngles: D,
+							margins: d,
+							chartSizes: h,
+							tooltipsData: A,
+							tooltipsContainer: j,
+							getTooltip: O
+						}, e);
+					})]
+				}),
+				/* @__PURE__ */ l("g", {
+					transform: `translate(${I},${L})`,
+					children: /* @__PURE__ */ l(i, { legendData: w })
+				}),
+				/* @__PURE__ */ l("g", {
+					ref: N,
+					style: { outline: "none" }
+				})
+			]
+		})
+	});
 }
-export {
-  U as ChartsGroup
-};
-//# sourceMappingURL=ChartsGroup.js.map
+export { d as ChartsGroup };
+
+//# sourceMappingURL=ChartsGroup.js.map

package/dist/bubble/components/ChartsGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartsGroup.js","sources":["../../../src/bubble/components/ChartsGroup.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { ChartsTitle } from '../../common/ChartsTitle';\nimport { ErrorBoundary } from '../../common/ErrorBoundary';\nimport fonts from '../../common/fonts';\nimport { Legend } from '../../common/Legend';\nimport { useTooltip } from '../../common/Tooltip';\nimport type { LegendData } from '../../common/types';\nimport type { DataValue } from '../../types';\nimport type { BubbleSettingsImpl } from '../BubbleSettingsImpl';\nimport { LEGEND_OFFSET } from '../constants';\nimport type { CellBubble, GroupedCellsBubble } from '../getGroupedCellsData';\nimport { Chart } from './Chart';\nimport type {\n    CaptionsSizes,\n    ChartDimensionsData,\n    ChartScales,\n    ChartSizes, LabelAngles, Margins\n} from './types';\n\nexport function ChartsGroup({\n    margins,\n    captionsSizes,\n    settingsId,\n    chartSettings,\n    chartSizes,\n    chartsDimensions,\n    facetKeys,\n    scales,\n    colorScale,\n    sizeScale,\n    groupedCells,\n    cellsMeta,\n    step,\n    legend,\n    aes,\n    columnsCount,\n    labelAngles,\n    getCellTooltip,\n    onTooltipHintSwitch\n}: {\n    margins: Margins;\n    captionsSizes: CaptionsSizes;\n    chartSettings: BubbleSettingsImpl['chartSettings'];\n    facetSettings: BubbleSettingsImpl['facetSettings'];\n    chartSizes: ChartSizes;\n    chartsDimensions: Record<string, ChartDimensionsData>;\n    scales: ChartScales;\n    facetKeys: string[];\n    settingsId: string;\n    colorScale: (value: DataValue) => string;\n    sizeScale: (value: DataValue) => number;\n    groupedCells: GroupedCellsBubble['facets'];\n    cellsMeta: GroupedCellsBubble['meta'];\n    step: {x: number; y: number};\n    legend: LegendData;\n    aes: BubbleSettingsImpl['aes'];\n    columnsCount: number;\n    labelAngles: LabelAngles;\n    getCellTooltip: (cell: CellBubble) => string[],\n    onTooltipHintSwitch: (v: boolean) => void\n}) {\n    const tooltipsData = useTooltip<CellBubble>(onTooltipHintSwitch);\n    const [tooltipsContainer, setTooltipsContainer] = useState<SVGGElement>();\n    const tooltipsRef = useRef<SVGGElement>(null);\n    useEffect(() => {\n        if (tooltipsRef.current) {\n            setTooltipsContainer(tooltipsRef.current);\n        }\n    }, []);\n\n    const leftTopChartPadding = chartsDimensions[facetKeys[0]].padding;\n    const rightTopChartPadding = chartsDimensions[facetKeys[columnsCount - 1]].padding;\n\n    const legendLeft = margins.left + chartSizes.chartsWidth + LEGEND_OFFSET;\n    const legendTop = margins.top + leftTopChartPadding.top;\n\n    return (\n        <ErrorBoundary dataId={settingsId}>\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                fontFamily=\"Manrope\"\n            >\n                <defs>{fonts}</defs>\n                <g transform={`translate(${margins.left},${margins.top})`}>\n                    <ChartsTitle\n                        title={[chartSettings.title.name]}\n                        show={chartSettings.title.show}\n                        position={chartSettings.title.position}\n                        leftPadding={leftTopChartPadding.left}\n                        rightPadding={rightTopChartPadding.right}\n                        chartsWidth={chartSizes.chartsWidth}\n                    />\n                    {facetKeys.map(facetKey => {\n                        const {cells} = groupedCells[facetKey];\n                        return (\n                            <Chart\n                                captionsSizes={captionsSizes}\n                                key={facetKey}\n                                facetKey={facetKey}\n                                dimensions={chartsDimensions[facetKey]}\n                                scales={scales}\n                                cells={cells}\n                                cellsMeta={cellsMeta}\n                                stepX={step.x}\n                                stepY={step.y}\n                                colorScale={colorScale}\n                                sizeScale={sizeScale}\n                                chartSettings={chartSettings}\n                                aes={aes}\n                                labelAngles={labelAngles}\n                                margins={margins}\n                                chartSizes={chartSizes}\n                                tooltipsData={tooltipsData}\n                                tooltipsContainer={tooltipsContainer}\n                                getTooltip={getCellTooltip}\n                            />\n                        );\n                    })}\n                </g>\n                <g transform={`translate(${legendLeft},${legendTop})`}>\n                    <Legend legendData={legend} />\n                </g>\n                <g ref={tooltipsRef} style={{outline: 'none'}} />\n            </svg>\n        </ErrorBoundary>\n    );\n}\n"],"names":["ChartsGroup","margins","captionsSizes","settingsId","chartSettings","chartSizes","chartsDimensions","facetKeys","scales","colorScale","sizeScale","groupedCells","cellsMeta","step","legend","aes","columnsCount","labelAngles","getCellTooltip","onTooltipHintSwitch","tooltipsData","useTooltip","tooltipsContainer","setTooltipsContainer","useState","tooltipsRef","useRef","useEffect","leftTopChartPadding","rightTopChartPadding","legendLeft","LEGEND_OFFSET","legendTop","jsx","ErrorBoundary","jsxs","fonts","ChartsTitle","facetKey","cells","Chart","Legend"],"mappings":"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"}
+{"version":3,"file":"ChartsGroup.js","names":[],"sources":["../../../src/bubble/components/ChartsGroup.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { ChartsTitle } from '../../common/ChartsTitle';\nimport { ErrorBoundary } from '../../common/ErrorBoundary';\nimport fonts from '../../common/fonts';\nimport { Legend } from '../../common/Legend';\nimport { useTooltip } from '../../common/Tooltip';\nimport type { LegendData } from '../../common/types';\nimport type { DataValue } from '../../types';\nimport type { BubbleSettingsImpl } from '../BubbleSettingsImpl';\nimport { LEGEND_OFFSET } from '../constants';\nimport type { CellBubble, GroupedCellsBubble } from '../getGroupedCellsData';\nimport { Chart } from './Chart';\nimport type {\n    CaptionsSizes,\n    ChartDimensionsData,\n    ChartScales,\n    ChartSizes, LabelAngles, Margins\n} from './types';\n\nexport function ChartsGroup({\n    margins,\n    captionsSizes,\n    settingsId,\n    chartSettings,\n    chartSizes,\n    chartsDimensions,\n    facetKeys,\n    scales,\n    colorScale,\n    sizeScale,\n    groupedCells,\n    cellsMeta,\n    step,\n    legend,\n    aes,\n    columnsCount,\n    labelAngles,\n    getCellTooltip,\n    onTooltipHintSwitch\n}: {\n    margins: Margins;\n    captionsSizes: CaptionsSizes;\n    chartSettings: BubbleSettingsImpl['chartSettings'];\n    facetSettings: BubbleSettingsImpl['facetSettings'];\n    chartSizes: ChartSizes;\n    chartsDimensions: Record<string, ChartDimensionsData>;\n    scales: ChartScales;\n    facetKeys: string[];\n    settingsId: string;\n    colorScale: (value: DataValue) => string;\n    sizeScale: (value: DataValue) => number;\n    groupedCells: GroupedCellsBubble['facets'];\n    cellsMeta: GroupedCellsBubble['meta'];\n    step: {x: number; y: number};\n    legend: LegendData;\n    aes: BubbleSettingsImpl['aes'];\n    columnsCount: number;\n    labelAngles: LabelAngles;\n    getCellTooltip: (cell: CellBubble) => string[],\n    onTooltipHintSwitch: (v: boolean) => void\n}) {\n    const tooltipsData = useTooltip<CellBubble>(onTooltipHintSwitch);\n    const [tooltipsContainer, setTooltipsContainer] = useState<SVGGElement>();\n    const tooltipsRef = useRef<SVGGElement>(null);\n    useEffect(() => {\n        if (tooltipsRef.current) {\n            setTooltipsContainer(tooltipsRef.current);\n        }\n    }, []);\n\n    const leftTopChartPadding = chartsDimensions[facetKeys[0]].padding;\n    const rightTopChartPadding = chartsDimensions[facetKeys[columnsCount - 1]].padding;\n\n    const legendLeft = margins.left + chartSizes.chartsWidth + LEGEND_OFFSET;\n    const legendTop = margins.top + leftTopChartPadding.top;\n\n    return (\n        <ErrorBoundary dataId={settingsId}>\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                fontFamily=\"Manrope\"\n            >\n                <defs>{fonts}</defs>\n                <g transform={`translate(${margins.left},${margins.top})`}>\n                    <ChartsTitle\n                        title={[chartSettings.title.name]}\n                        show={chartSettings.title.show}\n                        position={chartSettings.title.position}\n                        leftPadding={leftTopChartPadding.left}\n                        rightPadding={rightTopChartPadding.right}\n                        chartsWidth={chartSizes.chartsWidth}\n                    />\n                    {facetKeys.map(facetKey => {\n                        const {cells} = groupedCells[facetKey];\n                        return (\n                            <Chart\n                                captionsSizes={captionsSizes}\n                                key={facetKey}\n                                facetKey={facetKey}\n                                dimensions={chartsDimensions[facetKey]}\n                                scales={scales}\n                                cells={cells}\n                                cellsMeta={cellsMeta}\n                                stepX={step.x}\n                                stepY={step.y}\n                                colorScale={colorScale}\n                                sizeScale={sizeScale}\n                                chartSettings={chartSettings}\n                                aes={aes}\n                                labelAngles={labelAngles}\n                                margins={margins}\n                                chartSizes={chartSizes}\n                                tooltipsData={tooltipsData}\n                                tooltipsContainer={tooltipsContainer}\n                                getTooltip={getCellTooltip}\n                            />\n                        );\n                    })}\n                </g>\n                <g transform={`translate(${legendLeft},${legendTop})`}>\n                    <Legend legendData={legend} />\n                </g>\n                <g ref={tooltipsRef} style={{outline: 'none'}} />\n            </svg>\n        </ErrorBoundary>\n    );\n}\n"],"mappings":";;;;;;;;AAmBA,SAAgB,EAAY,EACxB,YACA,kBACA,eACA,kBACA,eACA,qBACA,cACA,WACA,eACA,cACA,iBACA,cACA,SACA,WACA,QACA,iBACA,gBACA,mBACA,0BAsBD;CACC,IAAM,IAAe,EAAuB,EAAoB,EAC1D,CAAC,GAAmB,KAAwB,GAAuB,EACnE,IAAc,EAAoB,KAAK;AAC7C,SAAgB;AACZ,EAAI,EAAY,WACZ,EAAqB,EAAY,QAAQ;IAE9C,EAAE,CAAC;CAEN,IAAM,IAAsB,EAAiB,EAAU,IAAI,SACrD,IAAuB,EAAiB,EAAU,IAAe,IAAI,SAErE,IAAa,EAAQ,OAAO,EAAW,cAAA,IACvC,IAAY,EAAQ,MAAM,EAAoB;AAEpD,QACI,kBAAC,GAAD;EAAe,QAAQ;YACnB,kBAAC,OAAD;GACI,OAAM;GACN,SAAS,OAAO,EAAW,WAAW,GAAG,EAAW;GACpD,OAAO,EAAW;GAClB,QAAQ,EAAW;GACnB,YAAW;aALf;IAOI,kBAAC,QAAD,EAAA,UAAO,GAAa,CAAA;IACpB,kBAAC,KAAD;KAAG,WAAW,aAAa,EAAQ,KAAK,GAAG,EAAQ,IAAI;eAAvD,CACI,kBAAC,GAAD;MACI,OAAO,CAAC,EAAc,MAAM,KAAK;MACjC,MAAM,EAAc,MAAM;MAC1B,UAAU,EAAc,MAAM;MAC9B,aAAa,EAAoB;MACjC,cAAc,EAAqB;MACnC,aAAa,EAAW;MAC1B,CAAA,EACD,EAAU,KAAI,MAAY;MACvB,IAAM,EAAC,aAAS,EAAa;AAC7B,aACI,kBAAC,GAAD;OACmB;OAEL;OACV,YAAY,EAAiB;OACrB;OACD;OACI;OACX,OAAO,EAAK;OACZ,OAAO,EAAK;OACA;OACD;OACI;OACV;OACQ;OACJ;OACG;OACE;OACK;OACnB,YAAY;OACd,EAlBO,EAkBP;OAER,CACF;;IACJ,kBAAC,KAAD;KAAG,WAAW,aAAa,EAAW,GAAG,EAAU;eAC/C,kBAAC,GAAD,EAAQ,YAAY,GAAU,CAAA;KAC9B,CAAA;IACJ,kBAAC,KAAD;KAAG,KAAK;KAAa,OAAO,EAAC,SAAS,QAAO;KAAI,CAAA;IAC/C;;EACM,CAAA"}

package/dist/bubble/constants.js

@@ -1,20 +1,13 @@
-const t = 15, T = 8, E = 30, s = 48, _ = 24, I = 16, o = 4, i = 4, c = 20, n = 16, F = {
-  left: ["axis", "axisTitle"],
-  right: ["axis", "axisTitle"],
-  top: ["axis", "axisTitle", "facetTitle"],
-  bottom: ["axis", "axisTitle"]
+const e = {
+	left: ["axis", "axisTitle"],
+	right: ["axis", "axisTitle"],
+	top: [
+		"axis",
+		"axisTitle",
+		"facetTitle"
+	],
+	bottom: ["axis", "axisTitle"]
 };
-export {
-  F as CHART_SIDE_ELEMENTS,
-  i as DEFAULT_TICKS_SIZE,
-  s as FACET_TITLE_LINE,
-  _ as FACET_TITLE_OFFSET,
-  n as FONT_SIZE,
-  c as LEGEND_OFFSET,
-  T as MIN_MARGIN,
-  t as MIN_PADDING,
-  I as MIN_STEP_FOR_VISIBLE_LABELS,
-  o as TICK_OFFSET,
-  E as TITLE_LINE
-};
-//# sourceMappingURL=constants.js.map
+export { e as CHART_SIDE_ELEMENTS };
+
+//# sourceMappingURL=constants.js.map

package/dist/bubble/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../src/bubble/constants.ts"],"sourcesContent":["import {BLACK} from '../constants';\nimport type {AesItem} from '../types';\n\nexport const DEFAULT_CELL_SIZE = 30;\nexport const MIN_PADDING = 15;\nexport const MIN_MARGIN = 8;\n\nexport const TITLE_LINE = 30;\nexport const FACET_TITLE_LINE = 48;\nexport const FACET_TITLE_OFFSET = 24;\n\nexport const MIN_STEP_FOR_VISIBLE_LABELS = 16;\n\nexport const TICK_OFFSET = 4;\nexport const DEFAULT_TICKS_SIZE = 4;\n\nexport const LEGEND_OFFSET = 20;\nexport const FONT_SIZE = 16;\n\nexport const CHART_SIDE_ELEMENTS = {\n    left: ['axis', 'axisTitle'],\n    right: ['axis', 'axisTitle'],\n    top: ['axis', 'axisTitle','facetTitle'],\n    bottom: ['axis', 'axisTitle']\n};\n\nexport const DEFAULT_AES:AesItem = {\n    fillColor: 'white',\n    lineColor: BLACK,\n    lineWidth: 1,\n    lineShape: 'solid',\n    dotSize: 3,\n    dotFill: BLACK,\n    dotShape: '21',\n};\n"],"names":["MIN_PADDING","MIN_MARGIN","TITLE_LINE","FACET_TITLE_LINE","FACET_TITLE_OFFSET","MIN_STEP_FOR_VISIBLE_LABELS","TICK_OFFSET","DEFAULT_TICKS_SIZE","LEGEND_OFFSET","FONT_SIZE","CHART_SIDE_ELEMENTS"],"mappings":"AAIO,MAAMA,IAAc,IACdC,IAAa,GAEbC,IAAa,IACbC,IAAmB,IACnBC,IAAqB,IAErBC,IAA8B,IAE9BC,IAAc,GACdC,IAAqB,GAErBC,IAAgB,IAChBC,IAAY,IAEZC,IAAsB;AAAA,EAC/B,MAAM,CAAC,QAAQ,WAAW;AAAA,EAC1B,OAAO,CAAC,QAAQ,WAAW;AAAA,EAC3B,KAAK,CAAC,QAAQ,aAAY,YAAY;AAAA,EACtC,QAAQ,CAAC,QAAQ,WAAW;AAChC;"}
+{"version":3,"file":"constants.js","names":[],"sources":["../../src/bubble/constants.ts"],"sourcesContent":["import {BLACK} from '../constants';\nimport type {AesItem} from '../types';\n\nexport const DEFAULT_CELL_SIZE = 30;\nexport const MIN_PADDING = 15;\nexport const MIN_MARGIN = 8;\n\nexport const TITLE_LINE = 30;\nexport const FACET_TITLE_LINE = 48;\nexport const FACET_TITLE_OFFSET = 24;\n\nexport const MIN_STEP_FOR_VISIBLE_LABELS = 16;\n\nexport const TICK_OFFSET = 4;\nexport const DEFAULT_TICKS_SIZE = 4;\n\nexport const LEGEND_OFFSET = 20;\nexport const FONT_SIZE = 16;\n\nexport const CHART_SIDE_ELEMENTS = {\n    left: ['axis', 'axisTitle'],\n    right: ['axis', 'axisTitle'],\n    top: ['axis', 'axisTitle','facetTitle'],\n    bottom: ['axis', 'axisTitle']\n};\n\nexport const DEFAULT_AES:AesItem = {\n    fillColor: 'white',\n    lineColor: BLACK,\n    lineWidth: 1,\n    lineShape: 'solid',\n    dotSize: 3,\n    dotFill: BLACK,\n    dotShape: '21',\n};\n"],"mappings":"AAmBA,MAAa,IAAsB;CAC/B,MAAM,CAAC,QAAQ,YAAY;CAC3B,OAAO,CAAC,QAAQ,YAAY;CAC5B,KAAK;EAAC;EAAQ;EAAY;EAAa;CACvC,QAAQ,CAAC,QAAQ,YAAY;CAChC"}

package/dist/bubble/getCellTooltip.js

@@ -1,28 +1,26 @@
-function s(o, e, u, i = []) {
-  const n = [
-    `X: ${u.xLabels[e.x]}`,
-    `Y: ${u.yLabels[e.y]}`,
-    `Value (color): ${a(e.value.colorValue)}${e.value.colorValue !== e.normalizedValue.colorValue ? ` (${a(e.normalizedValue.colorValue)})` : ""}`,
-    `Value (size): ${a(e.value.sizeValue)}${e.value.sizeValue !== e.normalizedValue.sizeValue ? ` (${a(e.normalizedValue.sizeValue)})` : ""}`
-  ];
-  for (const l of i) {
-    const r = l.valueLabels ?? l.value;
-    if (r === void 0) continue;
-    const t = o.getColumnValue(r, e.idx);
-    n.push(`${l.label}: ${t}`);
-  }
-  return n;
+function e(e, n, r, i = []) {
+	let a = [
+		`X: ${r.xLabels[n.x]}`,
+		`Y: ${r.yLabels[n.y]}`,
+		`Value (color): ${t(n.value.colorValue)}${n.value.colorValue === n.normalizedValue.colorValue ? "" : ` (${t(n.normalizedValue.colorValue)})`}`,
+		`Value (size): ${t(n.value.sizeValue)}${n.value.sizeValue === n.normalizedValue.sizeValue ? "" : ` (${t(n.normalizedValue.sizeValue)})`}`
+	];
+	for (let t of i) {
+		let r = t.valueLabels ?? t.value;
+		if (r === void 0) continue;
+		let i = e.getColumnValue(r, n.idx);
+		a.push(`${t.label}: ${i}`);
+	}
+	return a;
 }
-function a(o) {
-  if (o === null)
-    return "null";
-  if (typeof o == "number") {
-    const e = o > 0 ? Math.floor(o) : Math.ceil(o), u = o - e;
-    return e + Number(u.toPrecision(2));
-  }
-  return o;
+function t(e) {
+	if (e === null) return "null";
+	if (typeof e == "number") {
+		let t = e > 0 ? Math.floor(e) : Math.ceil(e), n = e - t;
+		return t + Number(n.toPrecision(2));
+	}
+	return e;
 }
-export {
-  s as getCellTooltip
-};
-//# sourceMappingURL=getCellTooltip.js.map
+export { e as getCellTooltip };
+
+//# sourceMappingURL=getCellTooltip.js.map

package/dist/bubble/getCellTooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"getCellTooltip.js","sources":["../../src/bubble/getCellTooltip.ts"],"sourcesContent":["import type { DataFrame } from '../DataFrame';\nimport type { ColumnName, DataValue } from '../types';\nimport type { CellBubble, GroupedCellsBubble } from './getGroupedCellsData';\n\nexport function getCellTooltip(dataFrame: DataFrame, cell: CellBubble, cellsMeta: GroupedCellsBubble['meta'], columnsList: ColumnName[] = []) {\n    const lines = [\n        `X: ${cellsMeta.xLabels[cell.x as string]}`,\n        `Y: ${cellsMeta.yLabels[cell.y as string]}`,\n        `Value (color): ${formatCellValue(cell.value.colorValue)}${cell.value.colorValue !== cell.normalizedValue.colorValue ? ` (${formatCellValue(cell.normalizedValue.colorValue)})`: ''}`,\n        `Value (size): ${formatCellValue(cell.value.sizeValue)}${cell.value.sizeValue !== cell.normalizedValue.sizeValue ? ` (${formatCellValue(cell.normalizedValue.sizeValue)})`: ''}`,\n    ];\n    for (const column of columnsList) {\n        const labelColumn =column.valueLabels ?? column.value;\n        if (labelColumn === undefined) continue;\n        const valueLabel = dataFrame.getColumnValue(labelColumn, cell.idx);\n        lines.push(`${column.label}: ${valueLabel}`);\n    }\n    return lines;\n}\n\nfunction formatCellValue (v: DataValue): number | string {\n    if (v === null) {\n        return 'null';\n    }\n    if (typeof v === 'number') {\n        const whole = v > 0 ? Math.floor(v) : Math.ceil(v);\n        const decimal = v - whole;\n        return whole + Number(decimal.toPrecision(2));\n    }\n    return v;\n}"],"names":["getCellTooltip","dataFrame","cell","cellsMeta","columnsList","lines","formatCellValue","column","labelColumn","valueLabel","v","whole","decimal"],"mappings":"AAIO,SAASA,EAAeC,GAAsBC,GAAkBC,GAAuCC,IAA4B,CAAA,GAAI;AAC1I,QAAMC,IAAQ;AAAA,IACV,MAAMF,EAAU,QAAQD,EAAK,CAAW,CAAC;AAAA,IACzC,MAAMC,EAAU,QAAQD,EAAK,CAAW,CAAC;AAAA,IACzC,kBAAkBI,EAAgBJ,EAAK,MAAM,UAAU,CAAC,GAAGA,EAAK,MAAM,eAAeA,EAAK,gBAAgB,aAAa,KAAKI,EAAgBJ,EAAK,gBAAgB,UAAU,CAAC,MAAK,EAAE;AAAA,IACnL,iBAAiBI,EAAgBJ,EAAK,MAAM,SAAS,CAAC,GAAGA,EAAK,MAAM,cAAcA,EAAK,gBAAgB,YAAY,KAAKI,EAAgBJ,EAAK,gBAAgB,SAAS,CAAC,MAAK,EAAE;AAAA,EAAA;AAElL,aAAWK,KAAUH,GAAa;AAC9B,UAAMI,IAAaD,EAAO,eAAeA,EAAO;AAChD,QAAIC,MAAgB,OAAW;AAC/B,UAAMC,IAAaR,EAAU,eAAeO,GAAaN,EAAK,GAAG;AACjE,IAAAG,EAAM,KAAK,GAAGE,EAAO,KAAK,KAAKE,CAAU,EAAE;AAAA,EAC/C;AACA,SAAOJ;AACX;AAEA,SAASC,EAAiBI,GAA+B;AACrD,MAAIA,MAAM;AACN,WAAO;AAEX,MAAI,OAAOA,KAAM,UAAU;AACvB,UAAMC,IAAQD,IAAI,IAAI,KAAK,MAAMA,CAAC,IAAI,KAAK,KAAKA,CAAC,GAC3CE,IAAUF,IAAIC;AACpB,WAAOA,IAAQ,OAAOC,EAAQ,YAAY,CAAC,CAAC;AAAA,EAChD;AACA,SAAOF;AACX;"}
+{"version":3,"file":"getCellTooltip.js","names":[],"sources":["../../src/bubble/getCellTooltip.ts"],"sourcesContent":["import type { DataFrame } from '../DataFrame';\nimport type { ColumnName, DataValue } from '../types';\nimport type { CellBubble, GroupedCellsBubble } from './getGroupedCellsData';\n\nexport function getCellTooltip(dataFrame: DataFrame, cell: CellBubble, cellsMeta: GroupedCellsBubble['meta'], columnsList: ColumnName[] = []) {\n    const lines = [\n        `X: ${cellsMeta.xLabels[cell.x as string]}`,\n        `Y: ${cellsMeta.yLabels[cell.y as string]}`,\n        `Value (color): ${formatCellValue(cell.value.colorValue)}${cell.value.colorValue !== cell.normalizedValue.colorValue ? ` (${formatCellValue(cell.normalizedValue.colorValue)})`: ''}`,\n        `Value (size): ${formatCellValue(cell.value.sizeValue)}${cell.value.sizeValue !== cell.normalizedValue.sizeValue ? ` (${formatCellValue(cell.normalizedValue.sizeValue)})`: ''}`,\n    ];\n    for (const column of columnsList) {\n        const labelColumn =column.valueLabels ?? column.value;\n        if (labelColumn === undefined) continue;\n        const valueLabel = dataFrame.getColumnValue(labelColumn, cell.idx);\n        lines.push(`${column.label}: ${valueLabel}`);\n    }\n    return lines;\n}\n\nfunction formatCellValue (v: DataValue): number | string {\n    if (v === null) {\n        return 'null';\n    }\n    if (typeof v === 'number') {\n        const whole = v > 0 ? Math.floor(v) : Math.ceil(v);\n        const decimal = v - whole;\n        return whole + Number(decimal.toPrecision(2));\n    }\n    return v;\n}"],"mappings":"AAIA,SAAgB,EAAe,GAAsB,GAAkB,GAAuC,IAA4B,EAAE,EAAE;CAC1I,IAAM,IAAQ;EACV,MAAM,EAAU,QAAQ,EAAK;EAC7B,MAAM,EAAU,QAAQ,EAAK;EAC7B,kBAAkB,EAAgB,EAAK,MAAM,WAAW,GAAG,EAAK,MAAM,eAAe,EAAK,gBAAgB,aAAuE,KAA1D,KAAK,EAAgB,EAAK,gBAAgB,WAAW,CAAC;EAC7K,iBAAiB,EAAgB,EAAK,MAAM,UAAU,GAAG,EAAK,MAAM,cAAc,EAAK,gBAAgB,YAAqE,KAAzD,KAAK,EAAgB,EAAK,gBAAgB,UAAU,CAAC;EAC3K;AACD,MAAK,IAAM,KAAU,GAAa;EAC9B,IAAM,IAAa,EAAO,eAAe,EAAO;AAChD,MAAI,MAAgB,KAAA,EAAW;EAC/B,IAAM,IAAa,EAAU,eAAe,GAAa,EAAK,IAAI;AAClE,IAAM,KAAK,GAAG,EAAO,MAAM,IAAI,IAAa;;AAEhD,QAAO;;AAGX,SAAS,EAAiB,GAA+B;AACrD,KAAI,MAAM,KACN,QAAO;AAEX,KAAI,OAAO,KAAM,UAAU;EACvB,IAAM,IAAQ,IAAI,IAAI,KAAK,MAAM,EAAE,GAAG,KAAK,KAAK,EAAE,EAC5C,IAAU,IAAI;AACpB,SAAO,IAAQ,OAAO,EAAQ,YAAY,EAAE,CAAC;;AAEjD,QAAO"}