@milaboratories/miplots4 1.0.127 → 1.0.129

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

@@ -1 +1 @@
-{"version":3,"file":"Lasso.js","sources":["../../../src/scatterplot-umap/components/Lasso.tsx"],"sourcesContent":["import {SCATTERPLOT_LASSO_EVENTS} from '../constants';\nimport type {LassoControlsState, LassoMode} from '../types';\nimport type {Polygon} from '../types';\nimport type {Selection} from 'd3-selection';\nimport {select} from 'd3-selection';\nimport {BLACK} from '../../constants';\nimport type {ChartScales, ChartSizes, Point} from '../types';\nimport type {MouseEvent} from 'react';\nimport React, {useCallback, useEffect, useRef, useState} from 'react';\nimport {drag} from 'd3-drag';\n\nconst SELECTION_COLOR = '#845CFF';\nconst CLOSING_DISTANCE = 20;\nconst R = 3;\nconst MAX_HISTORY_LENGTH = 10;\n\ntype CircleData = { // moving point for editing\n    idx: number;\n    p: Point;\n};\ntype CirclesSelection = Selection<SVGCircleElement, CircleData, SVGGElement | null, CircleData>;\n\ntype HistoryFrame = {\n    newPolygonPoints: Point[],\n    closedPolygons: Polygon[]\n}\n\n// Mode = 'selection': creating new polygons, pan with button\n// Mode = 'pen': selecting polygon to edit or delete, any zooming actions\nexport function Lasso({\n    scales,\n    chartSizes,\n    zoomStateKey,\n    defaultPolygons,\n    onPolygonsApply,\n    onLassoControlsStateUpdate,\n}: {\n    scales: ChartScales;\n    chartSizes: ChartSizes;\n    zoomStateKey: string;\n    defaultPolygons: Polygon[];\n    onPolygonsApply: (data: Polygon[]) => void;\n    onLassoControlsStateUpdate: (v: LassoControlsState) => void;\n}) {\n    useEffect(() => {\n        // Events from outer controls\n        function onPolygonDelete() {\n            if (selectedPolygonRef.current === null) {\n                return;\n            }\n            updatePolygons([...closedPolygonsRef.current.filter((_p, idx) => idx !== selectedPolygonRef.current)]);\n            updateSelectedPolygon(null);\n            onPolygonsApply(closedPolygonsRef.current);\n        }\n\n        function onModeSelect(e: CustomEvent<LassoMode>) {\n            updateMode(e.detail);\n        }\n        function onClickBack() {\n            loadHistoryItem(historyIndexRef.current - 1);\n        }\n        function onClickForward() {\n            loadHistoryItem(historyIndexRef.current + 1);\n        }\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.delete, onPolygonDelete);\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.selectMode, onModeSelect as EventListener);\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.back, onClickBack);\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.forward, onClickForward);\n        return () => {\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.delete, onPolygonDelete);\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.selectMode, onModeSelect as EventListener);\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.back, onClickBack);\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.forward, onClickForward);\n        };\n    }, []);\n\n    // inner state\n    const [lassoMode, setLassoMode] = useState<LassoMode>('pen');\n\n    const [closedPolygons, setClosedPolygons] = useState<Polygon[]>(defaultPolygons);\n    const closedPolygonsRef = useRef<Polygon[]>(defaultPolygons);\n\n    const [hoveredPolygon, setHoveredPolygon] = useState<number | null>(null);\n\n    const [selectedPolygon, setSelectedPolygon] = useState<number | null>(null);\n    const selectedPolygonRef = useRef<number | null>(null);\n\n    const [newPolygonPoints, setNewPolygonPoints] = useState<Point[]>([]);\n    const newPolygonPointsRef = useRef(newPolygonPoints);\n\n    const [history, setHistory] = useState<HistoryFrame[]>([{newPolygonPoints, closedPolygons}]);\n    const [historyIndex, setHistoryIndex] = useState(0);\n    const historyRef = useRef(history);\n    const historyIndexRef = useRef(historyIndex);\n\n    const [movingPoint, setMovingPoint] = useState<null | Point>(null);\n    const movingPointRef = useRef<null | Point>(null);\n\n    const [closeToStartPoint, setCloseToStartPoint] = useState(false);\n\n    const selectedCirclesContainerRef = useRef<SVGGElement | null>(null);\n    const selectedCirclesSelectionRef = useRef<CirclesSelection | null>(null);\n\n    const saveCurrentStateToHistory = useCallback(function () {\n        const newHistoryItem = {\n            newPolygonPoints: [...newPolygonPointsRef.current],\n            closedPolygons: [...closedPolygonsRef.current]\n        };\n        const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);\n        newHistory.push(newHistoryItem);\n        if (newHistory.length > MAX_HISTORY_LENGTH) {\n            newHistory.shift();\n        }\n        setHistory(newHistory);\n        setHistoryIndex(newHistory.length - 1);\n        historyRef.current = newHistory;\n        historyIndexRef.current = newHistory.length - 1;\n    }, []);\n\n   const loadHistoryItem = useCallback(function (index:number) {\n        if (index > historyRef.current.length - 1 || index < 0) {\n            return;\n        }\n        updateMode('selection');\n        const historyState = historyRef.current[index];\n        updatePolygons(historyState.closedPolygons, false);\n        updateNewPolygon(historyState.newPolygonPoints, false);\n        setHistoryIndex(index);\n        historyIndexRef.current = index;\n    }, []);\n    function updatePolygons(p: Polygon[], saveToHistory = true) {\n        setClosedPolygons(p);\n        closedPolygonsRef.current = p;\n        if (saveToHistory) {\n            saveCurrentStateToHistory();\n        }\n    }\n\n    function updateNewPolygon(points:Point[], saveToHistory = true) {\n        newPolygonPointsRef.current = points;\n        setNewPolygonPoints(points);\n        if (saveToHistory) {\n            saveCurrentStateToHistory();\n        }\n    }\n\n    function updateSelectedPolygon(idx: number | null) {\n        setSelectedPolygon(idx);\n        selectedPolygonRef.current = idx;\n    }\n\n    function updateMode(v: LassoMode) {\n        setLassoMode(v);\n        if (v === 'selection') {\n            updateSelectedPolygon(null);\n            selectedCirclesSelectionRef.current = null;\n            selectedCirclesContainerRef.current = null;\n        }\n        if (v === 'pen') {\n            if (newPolygonPointsRef.current.length > 2) {\n                const polygon:Polygon = {points: newPolygonPointsRef.current, closed: true};\n                updatePolygons([...closedPolygonsRef.current, polygon]);\n                onPolygonsApply([...closedPolygonsRef.current, polygon]);\n            }\n            clearNotFinishedPolygon();\n        }\n    }\n    function clearNotFinishedPolygon(saveToHistory = true) {\n        movingPointRef.current = null;\n        updateNewPolygon([], saveToHistory);\n    }\n\n    function onKeyDown(e: KeyboardEvent) {\n        const escape = e.key === 'Escape';\n        if (!escape) {\n            return;\n        }\n        clearNotFinishedPolygon();\n    }\n\n    useEffect(() => {\n        document.addEventListener('keydown', onKeyDown);\n        return () => document.removeEventListener('keydown', onKeyDown);\n    }, []);\n\n    useEffect(() => {\n        selectedCirclesSelectionRef.current?.attr('cx', d => scales.x(d.p[0])).attr('cy', d => scales.y(d.p[1]));\n    }, [zoomStateKey]);\n\n    const onNewPointAddByClick = useCallback(function () {\n        setCloseToStartPoint(false);\n        if (!movingPointRef.current || lassoMode === 'pen') {\n            return;\n        }\n        const currentCoords = [...movingPointRef.current] as Point;\n        const x = scales.x.invert(currentCoords[0]);\n        const y = scales.y.invert(currentCoords[1]);\n\n        if (!newPolygonPointsRef.current.length) {\n            updateNewPolygon([[x, y]]);\n            return;\n        }\n\n        const points = newPolygonPointsRef.current;\n        const tooFar = !closeToStartPoint;\n        if (tooFar || points.length < 3) {\n            updateNewPolygon([...points, [x, y]]);\n        } else {\n            const polygon:Polygon = {points: [...points], closed: true};\n            clearNotFinishedPolygon(false);\n            updatePolygons([...closedPolygons, polygon]);\n            // to avoid freezing of ui updating in case of big amount of points to apply polygons and change opacity\n            setTimeout(() => onPolygonsApply([...closedPolygons, polygon]), 0);\n        }\n    }, [lassoMode, closeToStartPoint]);\n\n    const onMouseMove = useCallback(function(e: MouseEvent<SVGRectElement>) {\n        const p: Point = [e.nativeEvent.offsetX, e.nativeEvent.offsetY];\n        const points = newPolygonPointsRef.current;\n        const startPoint = newPolygonPointsRef.current[0];\n        if (startPoint) {\n            const startX = scales.x(startPoint[0]);\n            const startY = scales.y(startPoint[1]);\n            const distance = points.length > 1\n                ? Math.sqrt((p[0] - startX) ** 2 + (p[1] - startY) ** 2)\n                : Infinity;\n            setCloseToStartPoint(distance < CLOSING_DISTANCE);\n        } else {\n            setCloseToStartPoint(false);\n        }\n\n        setMovingPoint(p);\n        movingPointRef.current = p;\n    }, []);\n\n    function clearSelectedCircles() {\n        if (selectedCirclesContainerRef.current) {\n            select(selectedCirclesContainerRef.current).data([]).exit().remove();\n        }\n    }\n\n    function updateSelectedCircles(el: SVGGElement | null) {\n        if (el !== selectedCirclesContainerRef.current && el) {\n            clearSelectedCircles();\n            selectedCirclesContainerRef.current = el;\n            onPolygonSelect(selectedPolygon);\n        }\n    }\n\n    const onPolygonSelect = useCallback(function (idx: number | null) {\n        if (lassoMode === 'selection') {\n            return;\n        }\n        if (idx !== null) {\n            const d = drag<SVGCircleElement, CircleData, SVGGElement | null>()\n                .on('drag', function (e) {\n                    const el = select<SVGCircleElement, CircleData>(this);\n                    const d = el.data()[0] as number[] & CircleData;\n                    d[0] = e.x;\n                    d[1] = e.y;\n                    d.p = [scales.x.invert(d[0]), scales.y.invert(d[1])];\n                    el.attr('cx', d[0]).attr('cy', d[1]);\n                    const editedPolygons = closedPolygonsRef.current.map((polygon, polygonIdx) => {\n                        return idx !== polygonIdx ? polygon : {\n                            ...polygon,\n                            points: polygon.points.map((el, pointIdx) =>\n                                pointIdx === d.idx ? ([scales.x.invert(d[0]), scales.y.invert(d[1])] as Point) : el\n                            ),\n                        };\n                    });\n                    updatePolygons(editedPolygons, false);\n                })\n                .on('end', function () {\n                    saveCurrentStateToHistory();\n                    onPolygonsApply(closedPolygonsRef.current);\n                });\n            const draggablePointsData = closedPolygonsRef.current[idx].points.map((p, idx) => ({idx, p}));\n            const selectedCircles = select(selectedCirclesContainerRef.current)\n                .selectAll<SVGCircleElement, CircleData>('circle')\n                .data(draggablePointsData, (d) => d.idx)\n                .join('circle');\n            selectedCirclesSelectionRef.current = selectedCircles;\n\n            selectedCircles\n                .attr('cx', d => scales.x(d.p[0]))\n                .attr('cy', d => scales.y(d.p[1]))\n                .attr('r', R)\n                .attr('fill', 'white')\n                .attr('stroke', SELECTION_COLOR);\n            selectedCircles.call(d);\n        }\n    }, []);\n\n    useEffect(() => {\n        if (lassoMode === 'pen') {\n            onLassoControlsStateUpdate({\n                mode: lassoMode,\n                backEnabled: historyIndex > 0,\n                forwardEnabled: historyIndex < history.length - 1,\n                deleteEnabled: selectedPolygon !== null,\n            });\n        } else {\n            onLassoControlsStateUpdate({\n                mode: lassoMode,\n                backEnabled: historyIndex > 0,\n                forwardEnabled: historyIndex < history.length - 1,\n                deleteEnabled: false,\n            });\n        }\n    }, [lassoMode, selectedPolygon, historyIndex, history]);\n\n    return (\n        <>\n            <g>\n                <defs>\n                    <pattern\n                        id=\"diagonalStripes\"\n                        width=\"5\"\n                        height=\"5\"\n                        patternTransform=\"rotate(45 0 0)\"\n                        patternUnits=\"userSpaceOnUse\"\n                    >\n                        <line x1=\"0\" y1=\"0\" x2=\"0\" y2=\"10\" stroke={SELECTION_COLOR} strokeWidth=\"1\" />\n                    </pattern>\n                </defs>\n                <rect\n                    fill=\"transparent\"\n                    width={chartSizes.chartWidth}\n                    height={chartSizes.chartHeight}\n                    onMouseMove={onMouseMove}\n                    onClick={onNewPointAddByClick}\n                />\n                {closedPolygons.map((p, idx) => {\n                    const isHovered = idx === hoveredPolygon;\n                    const isSelected = idx === selectedPolygon;\n                    const points = p.points.map(p => [scales.x(p[0]), scales.y(p[1])]);\n                    const pathD =\n                        points\n                            .map((p, idx) => {\n                                return (idx === 0 ? 'M' : 'L') + p[0] + ',' + p[1];\n                            })\n                            .join('') + 'z';\n                    return (\n                        <g key={idx}>\n                            <path\n                                d={pathD}\n                                fill={isHovered && !isSelected ? 'url(#diagonalStripes)' : 'transparent'}\n                                stroke={isSelected || isHovered ? SELECTION_COLOR : BLACK}\n                                onMouseOver={() => setHoveredPolygon(idx)}\n                                onMouseLeave={() => setHoveredPolygon(null)}\n                                onClick={() => updateSelectedPolygon(idx)}\n                                style={{pointerEvents: lassoMode === 'selection' || isSelected ? 'none' : 'auto'}}\n                            />\n                            {isSelected && <g ref={el => updateSelectedCircles(el)} />}\n                        </g>\n                    );\n                })}\n                <polyline\n                    points={newPolygonPoints.map((p) => `${scales.x(p[0])},${scales.y(p[1])}`).join(' ')}\n                    stroke={BLACK}\n                    fill=\"none\"\n                    style={{pointerEvents: 'none'}}\n                />\n                {newPolygonPoints.length > 0 && movingPoint && (\n                    <g style={{pointerEvents: 'none'}}>\n                        <line\n                            x1={scales.x(newPolygonPoints[newPolygonPoints.length - 1][0])}\n                            y1={scales.y(newPolygonPoints[newPolygonPoints.length - 1][1])}\n                            x2={movingPoint[0]}\n                            y2={movingPoint[1]}\n                            stroke={BLACK}\n                        />\n                        {newPolygonPoints.map((p, idx) => (\n                            <circle\n                                key={idx}\n                                cx={scales.x(p[0])}\n                                cy={scales.y(p[1])}\n                                r={R}\n                                fill=\"white\"\n                                stroke={SELECTION_COLOR}\n                            />\n                        ))}\n                        <circle\n                            cx={movingPoint[0]}\n                            cy={movingPoint[1]}\n                            r={R}\n                            fill=\"white\"\n                            stroke={SELECTION_COLOR}\n                        />\n                    </g>\n                )}\n                {closeToStartPoint && movingPoint && (\n                    <circle\n                        cx={movingPoint[0] + 5}\n                        cy={movingPoint[1] - 5}\n                        r={2}\n                        fill=\"none\"\n                        stroke={SELECTION_COLOR}\n                        strokeWidth={0.5}\n                    />\n                )}\n            </g>\n        </>\n    );\n}\n"],"names":["SELECTION_COLOR","CLOSING_DISTANCE","R","MAX_HISTORY_LENGTH","Lasso","scales","chartSizes","zoomStateKey","defaultPolygons","onPolygonsApply","onLassoControlsStateUpdate","useEffect","onPolygonDelete","selectedPolygonRef","updatePolygons","closedPolygonsRef","_p","idx","updateSelectedPolygon","onModeSelect","e","updateMode","onClickBack","loadHistoryItem","historyIndexRef","onClickForward","SCATTERPLOT_LASSO_EVENTS","lassoMode","setLassoMode","useState","closedPolygons","setClosedPolygons","useRef","hoveredPolygon","setHoveredPolygon","selectedPolygon","setSelectedPolygon","newPolygonPoints","setNewPolygonPoints","newPolygonPointsRef","history","setHistory","historyIndex","setHistoryIndex","historyRef","movingPoint","setMovingPoint","movingPointRef","closeToStartPoint","setCloseToStartPoint","selectedCirclesContainerRef","selectedCirclesSelectionRef","saveCurrentStateToHistory","useCallback","newHistoryItem","newHistory","index","historyState","updateNewPolygon","p","saveToHistory","points","v","polygon","clearNotFinishedPolygon","onKeyDown","_a","d","onNewPointAddByClick","currentCoords","x","y","onMouseMove","startPoint","startX","startY","distance","clearSelectedCircles","select","updateSelectedCircles","el","onPolygonSelect","drag","editedPolygons","polygonIdx","pointIdx","draggablePointsData","selectedCircles","jsx","Fragment","isHovered","isSelected","pathD","BLACK","jsxs"],"mappings":"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"}
+{"version":3,"file":"Lasso.js","sources":["../../../src/scatterplot-umap/components/Lasso.tsx"],"sourcesContent":["import {SCATTERPLOT_LASSO_EVENTS} from '../constants';\nimport type {LassoControlsState, LassoMode} from '../types';\nimport type {Polygon} from '../types';\nimport type {Selection} from 'd3-selection';\nimport {select} from 'd3-selection';\nimport {BLACK} from '../../constants';\nimport type {ChartScales, ChartSizes, Point} from '../types';\nimport type {MouseEvent} from 'react';\nimport React, {useCallback, useEffect, useRef, useState} from 'react';\nimport {drag} from 'd3-drag';\n\nconst SELECTION_COLOR = '#845CFF';\nconst START_GREY = '#CFD1DB';\nconst CLOSING_DISTANCE = 20;\nconst R = 3;\nconst R_START = 6;\nconst MAX_HISTORY_LENGTH = 10;\n\ntype CircleData = { // moving point for editing\n    idx: number;\n    p: Point;\n};\ntype CirclesSelection = Selection<SVGCircleElement, CircleData, SVGGElement | null, CircleData>;\n\ntype HistoryFrame = {\n    newPolygonPoints: Point[],\n    closedPolygons: Polygon[]\n}\n\n// Mode = 'selection': creating new polygons, pan with button\n// Mode = 'pen': selecting polygon to edit or delete, any zooming actions\nexport function Lasso({\n    scales,\n    chartSizes,\n    zoomStateKey,\n    defaultPolygons,\n    onPolygonsApply,\n    onLassoControlsStateUpdate,\n}: {\n    scales: ChartScales;\n    chartSizes: ChartSizes;\n    zoomStateKey: string;\n    defaultPolygons: Polygon[];\n    onPolygonsApply: (data: Polygon[]) => void;\n    onLassoControlsStateUpdate: (v: LassoControlsState) => void;\n}) {\n    useEffect(() => {\n        // Events from outer controls\n        function onPolygonDelete() {\n            if (selectedPolygonRef.current === null) {\n                return;\n            }\n            updatePolygons([...closedPolygonsRef.current.filter((_p, idx) => idx !== selectedPolygonRef.current)]);\n            updateSelectedPolygon(null);\n            onPolygonsApply(closedPolygonsRef.current);\n        }\n\n        function onModeSelect(e: CustomEvent<LassoMode>) {\n            updateMode(e.detail);\n        }\n        function onClickBack() {\n            loadHistoryItem(historyIndexRef.current - 1);\n        }\n        function onClickForward() {\n            loadHistoryItem(historyIndexRef.current + 1);\n        }\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.delete, onPolygonDelete);\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.selectMode, onModeSelect as EventListener);\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.back, onClickBack);\n        document.addEventListener(SCATTERPLOT_LASSO_EVENTS.forward, onClickForward);\n        return () => {\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.delete, onPolygonDelete);\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.selectMode, onModeSelect as EventListener);\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.back, onClickBack);\n            document.removeEventListener(SCATTERPLOT_LASSO_EVENTS.forward, onClickForward);\n        };\n    }, []);\n\n    // inner state\n    const [lassoMode, setLassoMode] = useState<LassoMode>('pen');\n\n    const [closedPolygons, setClosedPolygons] = useState<Polygon[]>(defaultPolygons);\n    const closedPolygonsRef = useRef<Polygon[]>(defaultPolygons);\n\n    const [hoveredPolygon, setHoveredPolygon] = useState<number | null>(null);\n\n    const [selectedPolygon, setSelectedPolygon] = useState<number | null>(null);\n    const selectedPolygonRef = useRef<number | null>(null);\n\n    const [newPolygonPoints, setNewPolygonPoints] = useState<Point[]>([]);\n    const newPolygonPointsRef = useRef(newPolygonPoints);\n\n    const [history, setHistory] = useState<HistoryFrame[]>([{newPolygonPoints, closedPolygons}]);\n    const [historyIndex, setHistoryIndex] = useState(0);\n    const historyRef = useRef(history);\n    const historyIndexRef = useRef(historyIndex);\n\n    const [movingPoint, setMovingPoint] = useState<null | Point>(null);\n    const movingPointRef = useRef<null | Point>(null);\n\n    const [closeToStartPoint, setCloseToStartPoint] = useState(false);\n\n    const selectedCirclesContainerRef = useRef<SVGGElement | null>(null);\n    const selectedCirclesSelectionRef = useRef<CirclesSelection | null>(null);\n\n    const saveCurrentStateToHistory = useCallback(function () {\n        const newHistoryItem = {\n            newPolygonPoints: [...newPolygonPointsRef.current],\n            closedPolygons: [...closedPolygonsRef.current]\n        };\n        const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);\n        newHistory.push(newHistoryItem);\n        if (newHistory.length > MAX_HISTORY_LENGTH) {\n            newHistory.shift();\n        }\n        setHistory(newHistory);\n        setHistoryIndex(newHistory.length - 1);\n        historyRef.current = newHistory;\n        historyIndexRef.current = newHistory.length - 1;\n    }, []);\n\n   const loadHistoryItem = useCallback(function (index:number) {\n        if (index > historyRef.current.length - 1 || index < 0) {\n            return;\n        }\n        updateMode('selection');\n        const historyState = historyRef.current[index];\n        updatePolygons(historyState.closedPolygons, false);\n        updateNewPolygon(historyState.newPolygonPoints, false);\n        setHistoryIndex(index);\n        historyIndexRef.current = index;\n    }, []);\n    function updatePolygons(p: Polygon[], saveToHistory = true) {\n        setClosedPolygons(p);\n        closedPolygonsRef.current = p;\n        if (saveToHistory) {\n            saveCurrentStateToHistory();\n        }\n    }\n\n    function updateNewPolygon(points:Point[], saveToHistory = true) {\n        newPolygonPointsRef.current = points;\n        setNewPolygonPoints(points);\n        if (saveToHistory) {\n            saveCurrentStateToHistory();\n        }\n    }\n\n    function updateSelectedPolygon(idx: number | null) {\n        setSelectedPolygon(idx);\n        selectedPolygonRef.current = idx;\n    }\n\n    function updateMode(v: LassoMode) {\n        setLassoMode(v);\n        if (v === 'selection') {\n            updateSelectedPolygon(null);\n            selectedCirclesSelectionRef.current = null;\n            selectedCirclesContainerRef.current = null;\n        }\n        if (v === 'pen') {\n            if (newPolygonPointsRef.current.length > 2) {\n                const polygon:Polygon = {points: newPolygonPointsRef.current, closed: true};\n                updatePolygons([...closedPolygonsRef.current, polygon]);\n                onPolygonsApply([...closedPolygonsRef.current, polygon]);\n            }\n            clearNotFinishedPolygon();\n        }\n    }\n    function clearNotFinishedPolygon(saveToHistory = true) {\n        movingPointRef.current = null;\n        updateNewPolygon([], saveToHistory);\n    }\n\n    function onKeyDown(e: KeyboardEvent) {\n        const escape = e.key === 'Escape';\n        if (!escape) {\n            return;\n        }\n        clearNotFinishedPolygon();\n    }\n\n    useEffect(() => {\n        document.addEventListener('keydown', onKeyDown);\n        return () => document.removeEventListener('keydown', onKeyDown);\n    }, []);\n\n    useEffect(() => {\n        selectedCirclesSelectionRef.current?.attr('cx', d => scales.x(d.p[0])).attr('cy', d => scales.y(d.p[1]));\n    }, [zoomStateKey, chartSizes.chartWidth, chartSizes.chartHeight]);\n\n    const onNewPointAddByClick = useCallback(function () {\n        setCloseToStartPoint(false);\n        if (!movingPointRef.current || lassoMode === 'pen') {\n            return;\n        }\n        const currentCoords = [...movingPointRef.current] as Point;\n        const x = scales.x.invert(currentCoords[0]);\n        const y = scales.y.invert(currentCoords[1]);\n\n        if (!newPolygonPointsRef.current.length) {\n            updateNewPolygon([[x, y]]);\n            return;\n        }\n\n        const points = newPolygonPointsRef.current;\n        const tooFar = !closeToStartPoint;\n        if (tooFar || points.length < 3) {\n            updateNewPolygon([...points, [x, y]]);\n        } else {\n            const polygon:Polygon = {points: [...points], closed: true};\n            clearNotFinishedPolygon(false);\n            updatePolygons([...closedPolygons, polygon]);\n            // to avoid freezing of ui updating in case of big amount of points to apply polygons and change opacity\n            setTimeout(() => onPolygonsApply([...closedPolygons, polygon]), 0);\n        }\n    }, [lassoMode, closeToStartPoint]);\n\n    const onMouseMove = useCallback(function(e: MouseEvent<SVGRectElement>) {\n        const p: Point = [e.nativeEvent.offsetX, e.nativeEvent.offsetY];\n        const points = newPolygonPointsRef.current;\n        const startPoint = newPolygonPointsRef.current[0];\n        if (startPoint) {\n            const startX = scales.x(startPoint[0]);\n            const startY = scales.y(startPoint[1]);\n            const distance = points.length > 1\n                ? Math.sqrt((p[0] - startX) ** 2 + (p[1] - startY) ** 2)\n                : Infinity;\n            setCloseToStartPoint(distance < CLOSING_DISTANCE);\n        } else {\n            setCloseToStartPoint(false);\n        }\n\n        setMovingPoint(p);\n        movingPointRef.current = p;\n    }, []);\n\n    function clearSelectedCircles() {\n        if (selectedCirclesContainerRef.current) {\n            select(selectedCirclesContainerRef.current).data([]).exit().remove();\n        }\n    }\n\n    function updateSelectedCircles(el: SVGGElement | null) {\n        if (el !== selectedCirclesContainerRef.current && el) {\n            clearSelectedCircles();\n            selectedCirclesContainerRef.current = el;\n            onPolygonSelect(selectedPolygon);\n        }\n    }\n\n    const onPolygonSelect = useCallback(function (idx: number | null) {\n        if (lassoMode === 'selection') {\n            return;\n        }\n        if (idx !== null) {\n            const d = drag<SVGCircleElement, CircleData, SVGGElement | null>()\n                .on('drag', function (e) {\n                    const el = select<SVGCircleElement, CircleData>(this);\n                    const d = el.data()[0] as number[] & CircleData;\n                    d[0] = e.x;\n                    d[1] = e.y;\n                    d.p = [scales.x.invert(d[0]), scales.y.invert(d[1])];\n                    el.attr('cx', d[0]).attr('cy', d[1]);\n                    const editedPolygons = closedPolygonsRef.current.map((polygon, polygonIdx) => {\n                        return idx !== polygonIdx ? polygon : {\n                            ...polygon,\n                            points: polygon.points.map((el, pointIdx) =>\n                                pointIdx === d.idx ? ([scales.x.invert(d[0]), scales.y.invert(d[1])] as Point) : el\n                            ),\n                        };\n                    });\n                    updatePolygons(editedPolygons, false);\n                })\n                .on('end', function () {\n                    saveCurrentStateToHistory();\n                    onPolygonsApply(closedPolygonsRef.current);\n                });\n            const draggablePointsData = closedPolygonsRef.current[idx].points.map((p, idx) => ({idx, p}));\n            const selectedCircles = select(selectedCirclesContainerRef.current)\n                .selectAll<SVGCircleElement, CircleData>('circle')\n                .data(draggablePointsData, (d) => d.idx)\n                .join('circle');\n            selectedCirclesSelectionRef.current = selectedCircles;\n\n            selectedCircles\n                .attr('cx', d => scales.x(d.p[0]))\n                .attr('cy', d => scales.y(d.p[1]))\n                .attr('r', R)\n                .attr('fill', 'white')\n                .attr('stroke', SELECTION_COLOR);\n            selectedCircles.call(d);\n        }\n    }, []);\n\n    useEffect(() => {\n        if (lassoMode === 'pen') {\n            onLassoControlsStateUpdate({\n                mode: lassoMode,\n                backEnabled: historyIndex > 0,\n                forwardEnabled: historyIndex < history.length - 1,\n                deleteEnabled: selectedPolygon !== null,\n            });\n        } else {\n            onLassoControlsStateUpdate({\n                mode: lassoMode,\n                backEnabled: historyIndex > 0,\n                forwardEnabled: historyIndex < history.length - 1,\n                deleteEnabled: false,\n            });\n        }\n    }, [lassoMode, selectedPolygon, historyIndex, history]);\n\n    return (\n        <>\n            <g>\n                <defs>\n                    <pattern\n                        id=\"diagonalStripes\"\n                        width=\"5\"\n                        height=\"5\"\n                        patternTransform=\"rotate(45 0 0)\"\n                        patternUnits=\"userSpaceOnUse\"\n                    >\n                        <line x1=\"0\" y1=\"0\" x2=\"0\" y2=\"10\" stroke={SELECTION_COLOR} strokeWidth=\"1\" />\n                    </pattern>\n                </defs>\n                <rect\n                    fill=\"transparent\"\n                    width={chartSizes.chartWidth}\n                    height={chartSizes.chartHeight}\n                    onMouseMove={onMouseMove}\n                    onClick={onNewPointAddByClick}\n                />\n                {closedPolygons.map((p, idx) => {\n                    const isHovered = idx === hoveredPolygon;\n                    const isSelected = idx === selectedPolygon;\n                    const points = p.points.map(p => [scales.x(p[0]), scales.y(p[1])]);\n                    const pathD =\n                        points\n                            .map((p, idx) => {\n                                return (idx === 0 ? 'M' : 'L') + p[0] + ',' + p[1];\n                            })\n                            .join('') + 'z';\n                    return (\n                        <g key={idx}>\n                            <path\n                                d={pathD}\n                                fill={isHovered && !isSelected ? 'url(#diagonalStripes)' : 'transparent'}\n                                stroke={isSelected || isHovered ? SELECTION_COLOR : BLACK}\n                                onMouseOver={() => setHoveredPolygon(idx)}\n                                onMouseLeave={() => setHoveredPolygon(null)}\n                                onClick={() => updateSelectedPolygon(idx)}\n                                style={{pointerEvents: lassoMode === 'selection' || isSelected ? 'none' : 'auto'}}\n                            />\n                            {isSelected && <g ref={el => updateSelectedCircles(el)} />}\n                        </g>\n                    );\n                })}\n                <polyline\n                    points={newPolygonPoints.map((p) => `${scales.x(p[0])},${scales.y(p[1])}`).join(' ')}\n                    stroke={BLACK}\n                    fill=\"none\"\n                    style={{pointerEvents: 'none'}}\n                />\n                {newPolygonPoints.length > 1 && movingPoint && (\n                    <g style={{pointerEvents: 'none'}}>\n                        <circle\n                            cx={scales.x(newPolygonPoints[0][0])}\n                            cy={scales.y(newPolygonPoints[0][1])}\n                            r={R_START}\n                            fill=\"none\"\n                            stroke={START_GREY}\n                            strokeDasharray=\"3 3\"\n                        />\n                        <line\n                            x1={movingPoint[0]}\n                            y1={movingPoint[1]}\n                            x2={scales.x(newPolygonPoints[0][0])}\n                            y2={scales.y(newPolygonPoints[0][1])}\n                            stroke={START_GREY}\n                            strokeDasharray=\"3 3\"\n                        />\n                    </g>\n                )}\n                {newPolygonPoints.length > 0 && movingPoint && (\n                    <g style={{pointerEvents: 'none'}}>\n                        <line\n                            x1={scales.x(newPolygonPoints[newPolygonPoints.length - 1][0])}\n                            y1={scales.y(newPolygonPoints[newPolygonPoints.length - 1][1])}\n                            x2={movingPoint[0]}\n                            y2={movingPoint[1]}\n                            stroke={SELECTION_COLOR}\n                        />\n                        {newPolygonPoints.map((p, idx) => (\n                            <circle\n                                key={idx}\n                                cx={scales.x(p[0])}\n                                cy={scales.y(p[1])}\n                                r={R}\n                                fill=\"white\"\n                                stroke={idx > 0 ? SELECTION_COLOR : BLACK}\n                            />\n                        ))}\n                        <circle\n                            cx={movingPoint[0]}\n                            cy={movingPoint[1]}\n                            r={R}\n                            fill=\"white\"\n                            stroke={SELECTION_COLOR}\n                        />\n                    </g>\n                )}\n                {closeToStartPoint && movingPoint && (\n                    <circle\n                        cx={movingPoint[0] + 5}\n                        cy={movingPoint[1] - 5}\n                        r={2}\n                        fill=\"none\"\n                        stroke={SELECTION_COLOR}\n                        strokeWidth={0.5}\n                    />\n                )}\n            </g>\n        </>\n    );\n}\n"],"names":["SELECTION_COLOR","START_GREY","CLOSING_DISTANCE","R","R_START","MAX_HISTORY_LENGTH","Lasso","scales","chartSizes","zoomStateKey","defaultPolygons","onPolygonsApply","onLassoControlsStateUpdate","useEffect","onPolygonDelete","selectedPolygonRef","updatePolygons","closedPolygonsRef","_p","idx","updateSelectedPolygon","onModeSelect","e","updateMode","onClickBack","loadHistoryItem","historyIndexRef","onClickForward","SCATTERPLOT_LASSO_EVENTS","lassoMode","setLassoMode","useState","closedPolygons","setClosedPolygons","useRef","hoveredPolygon","setHoveredPolygon","selectedPolygon","setSelectedPolygon","newPolygonPoints","setNewPolygonPoints","newPolygonPointsRef","history","setHistory","historyIndex","setHistoryIndex","historyRef","movingPoint","setMovingPoint","movingPointRef","closeToStartPoint","setCloseToStartPoint","selectedCirclesContainerRef","selectedCirclesSelectionRef","saveCurrentStateToHistory","useCallback","newHistoryItem","newHistory","index","historyState","updateNewPolygon","p","saveToHistory","points","v","polygon","clearNotFinishedPolygon","onKeyDown","_a","d","onNewPointAddByClick","currentCoords","x","y","onMouseMove","startPoint","startX","startY","distance","clearSelectedCircles","select","updateSelectedCircles","el","onPolygonSelect","drag","editedPolygons","polygonIdx","pointIdx","draggablePointsData","selectedCircles","jsx","Fragment","isHovered","isSelected","pathD","BLACK","jsxs"],"mappings":"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"}

package/dist/scatterplot-umap/components/LowerSVG.d.ts

@@ -4,7 +4,7 @@ import { ScatterplotUmapSettingsImpl } from '../SettingsImpl';
 import { CaptionsSizes, ChartScales, ChartSizes, Dot, DotInfo, Margins, SVGLayerProps } from '../types';
 import { ColumnName } from '../../types';
 import { default as React } from 'react';
-declare function LowerSvg({ scales, chartSettings, mainTitle, keyColumn, margins, chartSizes, onlyPositive, container, zoomStateKey, legendData, dotsByGrouping, layers, aesGetters, tooltipData }: {
+declare function LowerSvg({ scales, chartSettings, mainTitle, keyColumn, margins, chartSizes, container, zoomStateKey, legendData, dotsByGrouping, layers, aesGetters, tooltipData }: {
     aesGetters: SVGLayerProps['aesGetters'];
     scales: ChartScales;
     chartSettings: ScatterplotUmapSettingsImpl['chartSettings'];
@@ -12,10 +12,6 @@ declare function LowerSvg({ scales, chartSettings, mainTitle, keyColumn, margins
     keyColumn: ColumnName | null;
     margins: Margins;
     chartSizes: ChartSizes;
-    onlyPositive: {
-        x: boolean;
-        y: boolean;
-    };
     captionsSizes: CaptionsSizes;
     selectedDot?: DotInfo | null;
     container: SVGElement | null;

package/dist/scatterplot-umap/components/LowerSVG.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LowerSVG.d.ts","sourceRoot":"","sources":["../../../src/scatterplot-umap/components/LowerSVG.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGrD,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAE7G,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAI9C,OAAO,KAA8B,MAAM,OAAO,CAAC;AAuBnD,iBAAS,QAAQ,CAAC,EACd,MAAM,EACN,aAAa,EACb,SAAS,EACT,SAAS,EACT,OAAO,EACP,UAAU,EACV,YAAY,EACZ,SAAS,EACT,YAAY,EACZ,UAAU,EACV,cAAc,EACd,MAAM,EACN,UAAU,EACV,WAAW,EACd,EAAE;IACC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IACxC,MAAM,EAAE,WAAW,CAAC;IACpB,aAAa,EAAE,2BAA2B,CAAC,eAAe,CAAC,CAAC;IAC5D,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,SAAS,EAAE,UAAU,GAAG,IAAI,CAAC;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,UAAU,CAAC;IACvB,YAAY,EAAE;QAAC,CAAC,EAAE,OAAO,CAAC;QAAC,CAAC,EAAE,OAAO,CAAA;KAAC,CAAC;IACvC,aAAa,EAAE,aAAa,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC7B,SAAS,EAAE,UAAU,GAAG,IAAI,CAAC;IAC7B,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,UAAU,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IACtC,MAAM,EAAE,2BAA2B,CAAC,QAAQ,CAAC,CAAC;IAC9C,WAAW,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;CACtC,kDA+JA;;AAED,wBAAoC"}
+{"version":3,"file":"LowerSVG.d.ts","sourceRoot":"","sources":["../../../src/scatterplot-umap/components/LowerSVG.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGrD,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAE7G,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAI9C,OAAO,KAA8B,MAAM,OAAO,CAAC;AAuBnD,iBAAS,QAAQ,CAAC,EACd,MAAM,EACN,aAAa,EACb,SAAS,EACT,SAAS,EACT,OAAO,EACP,UAAU,EACV,SAAS,EACT,YAAY,EACZ,UAAU,EACV,cAAc,EACd,MAAM,EACN,UAAU,EACV,WAAW,EACd,EAAE;IACC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IACxC,MAAM,EAAE,WAAW,CAAC;IACpB,aAAa,EAAE,2BAA2B,CAAC,eAAe,CAAC,CAAC;IAC5D,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,SAAS,EAAE,UAAU,GAAG,IAAI,CAAC;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,UAAU,CAAC;IACvB,aAAa,EAAE,aAAa,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC7B,SAAS,EAAE,UAAU,GAAG,IAAI,CAAC;IAC7B,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,UAAU,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;IACtC,MAAM,EAAE,2BAA2B,CAAC,QAAQ,CAAC,CAAC;IAC9C,WAAW,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;CACtC,kDA+JA;;AAED,wBAAoC"}

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

@@ -1,65 +1,64 @@
 import { j as e } from "../../node_modules/react/jsx-runtime.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 { BLACK as q } from "../../constants.js";
-import { DEFAULT_TICKS_SIZE as L, TITLE_LINE as g, LEGEND_OFFSET as G } from "../constants.js";
-import { Axis as P } from "../../scatterplot/components/Axis.js";
-import { numberFormat as F } from "../../utils/numberFormat.js";
-import J, { r as j } from "../../_virtual/index.js";
-import Q from "../../node_modules/d3-shape/src/line.js";
-import V from "../../node_modules/d3-shape/src/curve/basis.js";
-function S(i, s, c = []) {
-  const d = i.data, n = [`x: ${F(i.x)}`, `y: ${F(i.y)}`];
-  s != null && s.label && n.unshift(`${s.label}: ${d[s.label]}`);
+import { ChartsTitle as N } from "../../common/ChartsTitle.js";
+import { ContinuousGrid as O } from "../../common/ContinuousGrid.js";
+import R from "../../common/fonts.js";
+import { Legend as M } from "../../common/Legend.js";
+import { Tooltip as U } from "../../common/Tooltip.js";
+import { BLACK as Z } from "../../constants.js";
+import { DEFAULT_TICKS_SIZE as H, TITLE_LINE as g, LEGEND_OFFSET as q } from "../constants.js";
+import { Axis as L } from "../../scatterplot/components/Axis.js";
+import { numberFormat as P } from "../../utils/numberFormat.js";
+import G, { r as j } from "../../_virtual/index.js";
+import J from "../../node_modules/d3-shape/src/line.js";
+import Q from "../../node_modules/d3-shape/src/curve/basis.js";
+function V(i, s, c = []) {
+  const x = i.data, n = [`x: ${P(i.x)}`, `y: ${P(i.y)}`];
+  s != null && s.label && n.unshift(`${s.label}: ${x[s.label]}`);
   for (const t of c)
-    n.push(`${t.label}: ${d[t.valueLabels ?? t.value]}`);
+    n.push(`${t.label}: ${x[t.valueLabels ?? t.value]}`);
   return n;
 }
-function k(i) {
+function F(i) {
   return typeof i == "string" ? i : i.label ?? i.value;
 }
-const A = Q().curve(V);
-function z({
+const k = J().curve(Q);
+function S({
   scales: i,
   chartSettings: s,
   mainTitle: c,
-  keyColumn: d,
+  keyColumn: x,
   margins: n,
   chartSizes: t,
-  onlyPositive: u,
-  container: y,
+  container: u,
   zoomStateKey: w,
-  legendData: B,
-  dotsByGrouping: C,
-  layers: D,
+  legendData: A,
+  dotsByGrouping: B,
+  layers: C,
   aesGetters: f,
   tooltipData: a
 }) {
-  var b;
-  const { title: $, xAxis: p, yAxis: m, frame: I, legend: _ } = s, X = p.showTicks ? L : 0, Y = m.showTicks ? L : 0, T = p.title, v = m.title, K = {
+  var E;
+  const { title: y, xAxis: p, yAxis: m, frame: D, legend: I } = s, _ = p.showTicks ? H : 0, X = m.showTicks ? H : 0, $ = p.title, T = m.title, Y = {
     left: 0,
     right: t.chartWidth,
     top: 0,
     bottom: t.chartHeight
   };
-  if (!y)
+  if (!u)
     return null;
-  const o = D.find((r) => r.type === "curve"), [W, N] = j.useState([]);
-  function E() {
-    const x = Object.entries(C).map(([h, l]) => ({
+  const o = C.find((r) => r.type === "curve"), [W, K] = j.useState([]);
+  function v() {
+    const d = Object.entries(B).map(([h, l]) => ({
       key: h,
-      d: o != null && o.smoothing ? A(l) ?? "" : l.map((H) => `${i.x(H.x)},${i.y(H.y)}`).join(" "),
+      d: o != null && o.smoothing ? k(l) ?? "" : l.map((b) => `${i.x(b.x)},${i.y(b.y)}`).join(" "),
       dot: l[0]
     }));
-    N(x);
+    K(d);
   }
   return j.useEffect(() => {
-    o && (A.x((r) => i.x(r.x)).y((r) => i.y(r.y)), E());
-  }, [w]), j.useEffect(() => {
-    o && E();
+    o && (k.x((r) => i.x(r.x)).y((r) => i.y(r.y)), v());
+  }, [w, t.chartWidth, t.chartHeight]), j.useEffect(() => {
+    o && v();
   }, [o == null ? void 0 : o.smoothing]), /* @__PURE__ */ e.jsxs(
     "svg",
     {
@@ -69,41 +68,41 @@ function z({
       height: t.totalHeight,
       style: { pointerEvents: "none" },
       children: [
-        /* @__PURE__ */ e.jsx("defs", { children: M }),
+        /* @__PURE__ */ e.jsx("defs", { children: R }),
         /* @__PURE__ */ e.jsxs("g", { transform: `translate(${n.left},${n.top})`, fontFamily: "Manrope", children: [
           /* @__PURE__ */ e.jsx("clipPath", { id: "viewportClipPath", children: /* @__PURE__ */ e.jsx("rect", { x: "0", y: "0", width: t.chartWidth, height: t.chartHeight }) }),
           /* @__PURE__ */ e.jsx(
-            O,
+            N,
             {
               title: c,
-              show: $.show,
-              position: $.position,
+              show: y.show,
+              position: y.position,
               leftPadding: n.left,
               rightPadding: n.right,
               chartsWidth: t.chartWidth
             }
           ),
-          /* @__PURE__ */ e.jsxs("g", { dominantBaseline: "central", textAnchor: "middle", fontWeight: "500", fontSize: "14px", fill: q, children: [
-            T && /* @__PURE__ */ e.jsx(
+          /* @__PURE__ */ e.jsxs("g", { dominantBaseline: "central", textAnchor: "middle", fontWeight: "500", fontSize: "14px", fill: Z, children: [
+            $ && /* @__PURE__ */ e.jsx(
               "text",
               {
                 x: t.chartWidth / 2,
                 y: t.chartHeight + n.bottom - g / 2,
-                children: k(T)
+                children: F($)
               }
             ),
-            v && /* @__PURE__ */ e.jsx(
+            T && /* @__PURE__ */ e.jsx(
               "text",
               {
                 x: -n.left + g / 2,
                 y: t.chartHeight / 2,
                 transform: `rotate(-90,${-n.left + g / 2},${t.chartHeight / 2})`,
-                children: k(v)
+                children: F(T)
               }
             )
           ] }),
           /* @__PURE__ */ e.jsx(
-            R,
+            O,
             {
               width: t.chartWidth,
               height: t.chartHeight,
@@ -112,17 +111,17 @@ function z({
               axisX: p,
               axisY: m,
               updatingKey: w,
-              frameType: I.type
+              frameType: D.type
             }
           ),
-          /* @__PURE__ */ e.jsx("g", { transform: `translate(0,${t.chartHeight})`, children: /* @__PURE__ */ e.jsx(P, { scale: i.x, orient: "bottom", onlyPositive: u.x, tickSize: X }) }),
-          /* @__PURE__ */ e.jsx("g", { children: /* @__PURE__ */ e.jsx(P, { scale: i.y, orient: "left", onlyPositive: u.y, tickSize: Y }) }),
-          o && o.smoothing && /* @__PURE__ */ e.jsx("g", { clipPath: "url(#viewportClipPath)", children: W.map(({ key: r, d: x, dot: h }) => {
+          /* @__PURE__ */ e.jsx("g", { transform: `translate(0,${t.chartHeight})`, children: /* @__PURE__ */ e.jsx(L, { scale: i.x, orient: "bottom", tickSize: _ }) }),
+          /* @__PURE__ */ e.jsx("g", { children: /* @__PURE__ */ e.jsx(L, { scale: i.y, orient: "left", tickSize: X }) }),
+          o && o.smoothing && /* @__PURE__ */ e.jsx("g", { clipPath: "url(#viewportClipPath)", children: W.map(({ key: r, d, dot: h }) => {
             var l;
             return /* @__PURE__ */ e.jsx(
               "path",
               {
-                d: x,
+                d,
                 fill: "none",
                 stroke: f.dotFill(h.data),
                 strokeWidth: (l = o.aes) == null ? void 0 : l.lineWidth,
@@ -131,12 +130,12 @@ function z({
               r
             );
           }) }),
-          o && !o.smoothing && /* @__PURE__ */ e.jsx("g", { clipPath: "url(#viewportClipPath)", children: W.map(({ key: r, d: x, dot: h }) => {
+          o && !o.smoothing && /* @__PURE__ */ e.jsx("g", { clipPath: "url(#viewportClipPath)", children: W.map(({ key: r, d, dot: h }) => {
             var l;
             return /* @__PURE__ */ e.jsx(
               "polyline",
               {
-                points: x,
+                points: d,
                 fill: "none",
                 stroke: f.dotFill(h.data),
                 strokeWidth: (l = o.aes) == null ? void 0 : l.lineWidth,
@@ -146,26 +145,26 @@ function z({
             );
           }) }),
           a.selectedData && /* @__PURE__ */ e.jsx(
-            Z,
+            U,
             {
-              content: S(a.selectedData, d, (b = s.tooltips) == null ? void 0 : b.content),
+              content: V(a.selectedData, x, (E = s.tooltips) == null ? void 0 : E.content),
               x: i.x(a.selectedData.x),
               y: i.y(a.selectedData.y),
               active: !0,
               fixed: a.fixed,
-              sideDistances: K,
-              container: y,
+              sideDistances: Y,
+              container: u,
               onClose: a.onClose
             }
           ),
-          _.show && /* @__PURE__ */ e.jsx("g", { transform: `translate(${t.chartWidth + G},0)`, children: /* @__PURE__ */ e.jsx(U, { legendData: B }) })
+          I.show && /* @__PURE__ */ e.jsx("g", { transform: `translate(${t.chartWidth + q},0)`, children: /* @__PURE__ */ e.jsx(M, { legendData: A }) })
         ] })
       ]
     }
   );
 }
-const ct = J.memo(z);
+const ft = G.memo(S);
 export {
-  ct as default
+  ft 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 { 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 { BLACK } from '../../constants';\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';\nimport { Axis } from '../../scatterplot/components/Axis';\nimport type { ColumnName } from '../../types';\nimport type { CurveUmapLayer } from '../../types/scatterplot-umap';\nimport { numberFormat } from '../../utils/numberFormat';\nimport { curveBasis, line } from 'd3-shape';\nimport React, { useEffect, useState } from 'react';\n\nfunction getTooltipContent(dot: DotInfo, keyColumn: ColumnName | null, columnsList: ColumnName[] = []) {\n    const row = dot.data;\n    const lines = [`x: ${numberFormat(dot.x)}`, `y: ${numberFormat(dot.y)}`];\n    if (keyColumn?.label) {\n        lines.unshift(`${keyColumn.label}: ${row[keyColumn.label]}`);\n    }\n    for (const column of columnsList) {\n        lines.push(`${column.label}: ${row[column.valueLabels ?? column.value]}`);\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    onlyPositive,\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    onlyPositive: {x: boolean; y: boolean};\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 {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]);\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\" onlyPositive={onlyPositive.x} tickSize={tickSizeX} />\n                    </g>\n                )}\n                {needLeftAxis && (\n                    <g>\n                        <Axis scale={scales.y} orient=\"left\" onlyPositive={onlyPositive.y} 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.data)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.data)}\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.data)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.data)}\n                            />\n                        ))}\n                    </g>\n                )}\n                {tooltipData.selectedData && (\n                    <Tooltip\n                        content={getTooltipContent(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","dot","keyColumn","columnsList","row","lines","numberFormat","column","getTitle","title","lineGenerator","line","curveBasis","LowerSvg","scales","chartSettings","mainTitle","margins","chartSizes","onlyPositive","container","zoomStateKey","legendData","dotsByGrouping","layers","aesGetters","tooltipData","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":";;;;;;;;;;;;;AAkBA,SAASA,EAAkBC,GAAcC,GAA8BC,IAA4B,CAAA,GAAI;AACnG,QAAMC,IAAMH,EAAI,MACVI,IAAQ,CAAC,MAAMC,EAAaL,EAAI,CAAC,CAAC,IAAI,MAAMK,EAAaL,EAAI,CAAC,CAAC,EAAE;AACvE,EAAIC,KAAA,QAAAA,EAAW,SACXG,EAAM,QAAQ,GAAGH,EAAU,KAAK,KAAKE,EAAIF,EAAU,KAAK,CAAC,EAAE;AAE/D,aAAWK,KAAUJ;AACjB,IAAAE,EAAM,KAAK,GAAGE,EAAO,KAAK,KAAKH,EAAIG,EAAO,eAAeA,EAAO,KAAK,CAAC,EAAE;AAE5E,SAAOF;AACX;AAEA,SAASG,EAASC,GAAoC;AAClD,SAAI,OAAOA,KAAU,WACVA,IAEJA,EAAM,SAASA,EAAM;AAChC;AAEA,MAAMC,IAAgBC,EAAA,EAAY,MAAMC,CAAU;AAElD,SAASC,EAAS;AAAA,EACd,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAd;AAAA,EACA,SAAAe;AAAA,EACA,YAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AACJ,GAiBG;;AACC,QAAM,EAAC,OAAAjB,GAAO,OAAAkB,GAAO,OAAAC,GAAO,OAAAC,GAAO,QAAAC,MAAUf,GACvCgB,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,CAACE;AACD,WAAO;AAGX,QAAMiB,IAAab,EAAO,KAAK,CAAAc,MAASA,EAAM,SAAS,OAAO,GACxD,CAACjC,GAAOkC,CAAQ,IAAIC,EAAAA,SAA8C,CAAA,CAAE;AAE1E,WAASC,IAAc;AAEnB,UAAMC,IADO,OAAO,QAAQnB,CAAc,EACnB,IAAI,CAAC,CAACoB,GAAKC,CAAI,OAAO;AAAA,MACzC,KAAAD;AAAA,MACA,GAAGN,KAAA,QAAAA,EAAY,YAAY3B,EAAckC,CAAI,KAAK,KAAKA,EAAK,IAAI,CAAAC,MAAK,GAAG/B,EAAO,EAAE+B,EAAE,CAAC,CAAC,IAAI/B,EAAO,EAAE+B,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,MAGL3B,EACK,EAAE,CAACmC,MAAW/B,EAAO,EAAE+B,EAAE,CAAC,CAAC,EAC3B,EAAE,CAACA,MAAW/B,EAAO,EAAE+B,EAAE,CAAC,CAAC,GAChCJ,EAAA;AAAA,EACJ,GAAG,CAACpB,CAAY,CAAC,GAEjByB,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,OAAOlC;AAAA,cACP,MAAMP,EAAM;AAAA,cACZ,UAAUA,EAAM;AAAA,cAChB,aAAaQ,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,QAAQJ,EAAO;AAAA,cACf,QAAQA,EAAO;AAAA,cACf,OAAOa;AAAA,cACP,OAAOC;AAAA,cACP,aAAaP;AAAA,cACb,WAAWQ,EAAM;AAAA,YAAA;AAAA,UAAA;AAAA,gCAGhB,KAAA,EAAE,WAAW,eAAeX,EAAW,WAAW,KAC/C,UAAA8B,gBAAAA,EAAAA,IAACM,GAAA,EAAK,OAAOxC,EAAO,GAAG,QAAO,UAAS,cAAcK,EAAa,GAAG,UAAUY,GAAW,EAAA,CAC9F;AAAA,UAGAiB,gBAAAA,EAAAA,IAAC,KAAA,EACG,UAAAA,gBAAAA,EAAAA,IAACM,KAAK,OAAOxC,EAAO,GAAG,QAAO,QAAO,cAAcK,EAAa,GAAG,UAAUc,GAAW,GAC5F;AAAA,UAEHI,KAAcA,EAAW,aACtBW,gBAAAA,EAAAA,IAAC,OAAE,UAAS,0BACP,UAAA3C,EAAM,IAAI,CAAC,EAAC,KAAAsC,GAAK,GAAAE,GAAG,KAAA5C;;AACjB+C,mCAAAA,EAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBAEG,GAAAH;AAAA,gBACA,MAAK;AAAA,gBACL,QAAQpB,EAAW,QAAQxB,EAAI,IAAI;AAAA,gBACnC,cAAasD,IAAAlB,EAAW,QAAX,gBAAAkB,EAAgB;AAAA,gBAC7B,iBAAiB9B,EAAW,SAASxB,EAAI,IAAI;AAAA,cAAA;AAAA,cALxC0C;AAAA,YAAA;AAAA,WAOZ,GACL;AAAA,UAEHN,KAAc,CAACA,EAAW,mCACtB,KAAA,EAAE,UAAS,0BACP,UAAAhC,EAAM,IAAI,CAAC,EAAC,KAAAsC,GAAK,GAAAE,GAAG,KAAA5C;;AACjB+C,mCAAAA,EAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBAEG,QAAQH;AAAA,gBACR,MAAK;AAAA,gBACL,QAAQpB,EAAW,QAAQxB,EAAI,IAAI;AAAA,gBACnC,cAAasD,IAAAlB,EAAW,QAAX,gBAAAkB,EAAgB;AAAA,gBAC7B,iBAAiB9B,EAAW,SAASxB,EAAI,IAAI;AAAA,cAAA;AAAA,cALxC0C;AAAA,YAAA;AAAA,WAOZ,GACL;AAAA,UAEHjB,EAAY,gBACTsB,gBAAAA,EAAAA;AAAAA,YAACQ;AAAA,YAAA;AAAA,cACG,SAASxD,EAAkB0B,EAAY,cAAcxB,IAAWqD,IAAAxC,EAAc,aAAd,gBAAAwC,EAAwB,OAAO;AAAA,cAC/F,GAAGzC,EAAO,EAAEY,EAAY,aAAa,CAAC;AAAA,cACtC,GAAGZ,EAAO,EAAEY,EAAY,aAAa,CAAC;AAAA,cACtC,QAAQ;AAAA,cACR,OAAOA,EAAY;AAAA,cACnB,eAAAU;AAAA,cACA,WAAAhB;AAAA,cACA,SAASM,EAAY;AAAA,YAAA;AAAA,UAAA;AAAA,UAG5BI,EAAO,QACJkB,gBAAAA,MAAC,KAAA,EAAE,WAAW,aAAa9B,EAAW,aAAauC,CAAa,OAC5D,UAAAT,gBAAAA,EAAAA,IAACU,GAAA,EAAO,YAAApC,GAAwB,EAAA,CACpC;AAAA,QAAA,EAAA,CAER;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGZ;AAEA,MAAAqC,KAAeC,EAAM,KAAK/C,CAAQ;"}
+{"version":3,"file":"LowerSVG.js","sources":["../../../src/scatterplot-umap/components/LowerSVG.tsx"],"sourcesContent":["import { 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 { BLACK } from '../../constants';\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';\nimport { Axis } from '../../scatterplot/components/Axis';\nimport type { ColumnName } from '../../types';\nimport type { CurveUmapLayer } from '../../types/scatterplot-umap';\nimport { numberFormat } from '../../utils/numberFormat';\nimport { curveBasis, line } from 'd3-shape';\nimport React, { useEffect, useState } from 'react';\n\nfunction getTooltipContent(dot: DotInfo, keyColumn: ColumnName | null, columnsList: ColumnName[] = []) {\n    const row = dot.data;\n    const lines = [`x: ${numberFormat(dot.x)}`, `y: ${numberFormat(dot.y)}`];\n    if (keyColumn?.label) {\n        lines.unshift(`${keyColumn.label}: ${row[keyColumn.label]}`);\n    }\n    for (const column of columnsList) {\n        lines.push(`${column.label}: ${row[column.valueLabels ?? column.value]}`);\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 {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.data)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.data)}\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.data)}\n                                strokeWidth={curveLayer.aes?.lineWidth}\n                                strokeDasharray={aesGetters.lineType(dot.data)}\n                            />\n                        ))}\n                    </g>\n                )}\n                {tooltipData.selectedData && (\n                    <Tooltip\n                        content={getTooltipContent(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","dot","keyColumn","columnsList","row","lines","numberFormat","column","getTitle","title","lineGenerator","line","curveBasis","LowerSvg","scales","chartSettings","mainTitle","margins","chartSizes","container","zoomStateKey","legendData","dotsByGrouping","layers","aesGetters","tooltipData","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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"}

package/dist/scatterplot-umap/components/SVGLayer.d.ts

@@ -1,3 +1,3 @@
 import { SVGLayerProps } from '../types';
-export declare function SVGLayer({ settingsId, scales, chartSettings, mainTitle, keyColumn, margins, chartSizes, captionsSizes, onlyPositive, container, zoomStateKey, aesGetters, legendData, labels, onPolygonUpdate, onTooltipHintSwitch, onLassoControlsStateUpdate, dotsByGrouping, layers, defaultPolygons, selectedDot, }: SVGLayerProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SVGLayer({ settingsId, scales, chartSettings, mainTitle, keyColumn, margins, chartSizes, captionsSizes, container, zoomStateKey, aesGetters, legendData, labels, onPolygonUpdate, onTooltipHintSwitch, onLassoControlsStateUpdate, dotsByGrouping, layers, defaultPolygons, selectedDot, }: SVGLayerProps): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=SVGLayer.d.ts.map

package/dist/scatterplot-umap/components/SVGLayer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SVGLayer.d.ts","sourceRoot":"","sources":["../../../src/scatterplot-umap/components/SVGLayer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAW,aAAa,EAAE,MAAM,UAAU,CAAC;AAIvD,wBAAgB,QAAQ,CAAC,EACrB,UAAU,EACV,MAAM,EACN,aAAa,EACb,SAAS,EACT,SAAS,EACT,OAAO,EACP,UAAU,EACV,aAAa,EACb,YAAY,EACZ,SAAS,EACT,YAAY,EACZ,UAAU,EACV,UAAU,EACV,MAAM,EACN,eAAe,EACf,mBAAmB,EACnB,0BAA0B,EAC1B,cAAc,EACd,MAAM,EACN,eAAe,EACf,WAAkB,GACrB,EAAE,aAAa,kDAoDf"}
+{"version":3,"file":"SVGLayer.d.ts","sourceRoot":"","sources":["../../../src/scatterplot-umap/components/SVGLayer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAW,aAAa,EAAE,MAAM,UAAU,CAAC;AAIvD,wBAAgB,QAAQ,CAAC,EACrB,UAAU,EACV,MAAM,EACN,aAAa,EACb,SAAS,EACT,SAAS,EACT,OAAO,EACP,UAAU,EACV,aAAa,EACb,SAAS,EACT,YAAY,EACZ,UAAU,EACV,UAAU,EACV,MAAM,EACN,eAAe,EACf,mBAAmB,EACnB,0BAA0B,EAC1B,cAAc,EACd,MAAM,EACN,eAAe,EACf,WAAkB,GACrB,EAAE,aAAa,kDAmDf"}

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

@@ -1,11 +1,11 @@
 import { j as p } from "../../node_modules/react/jsx-runtime.js";
-import { r as w } from "../../_virtual/index.js";
-import { r as y } from "../../node_modules/react-dom/index.js";
-import { ErrorBoundary as B } from "../../common/ErrorBoundary.js";
-import { useTooltip as G } from "../../common/Tooltip.js";
-import I from "./LowerSVG.js";
-import P from "./UpperSVG.js";
-function q({
+import { r as h } from "../../_virtual/index.js";
+import { r as w } from "../../node_modules/react-dom/index.js";
+import { ErrorBoundary as y } from "../../common/ErrorBoundary.js";
+import { useTooltip as B } from "../../common/Tooltip.js";
+import G from "./LowerSVG.js";
+import I from "./UpperSVG.js";
+function k({
   settingsId: s,
   scales: t,
   chartSettings: x,
@@ -14,32 +14,31 @@ function q({
   margins: j,
   chartSizes: f,
   captionsSizes: l,
-  onlyPositive: E,
   container: r,
   zoomStateKey: i,
   aesGetters: u,
-  legendData: e,
-  labels: d,
-  onPolygonUpdate: v,
-  onTooltipHintSwitch: L,
-  onLassoControlsStateUpdate: M,
-  dotsByGrouping: V,
-  layers: g,
-  defaultPolygons: h,
+  legendData: E,
+  labels: e,
+  onPolygonUpdate: d,
+  onTooltipHintSwitch: v,
+  onLassoControlsStateUpdate: L,
+  dotsByGrouping: M,
+  layers: V,
+  defaultPolygons: g,
   selectedDot: o = null
 }) {
   if (!r)
     return null;
-  const m = G(L);
-  return w.useEffect(() => {
+  const m = B(v);
+  return h.useEffect(() => {
     o ? m.onMouseEnter(o) : m.onMouseLeave();
-  }, [o]), /* @__PURE__ */ p.jsx("div", { children: /* @__PURE__ */ p.jsxs(B, { dataId: s, children: [
+  }, [o]), /* @__PURE__ */ p.jsx("div", { children: /* @__PURE__ */ p.jsxs(y, { dataId: s, children: [
     /* @__PURE__ */ p.jsx(
-      I,
+      G,
       {
         aesGetters: u,
-        dotsByGrouping: V,
-        layers: g,
+        dotsByGrouping: M,
+        layers: V,
         scales: t,
         keyColumn: a,
         margins: j,
@@ -47,27 +46,26 @@ function q({
         captionsSizes: l,
         chartSettings: x,
         chartSizes: f,
-        onlyPositive: E,
         container: r,
         zoomStateKey: i,
-        legendData: e,
+        legendData: E,
         tooltipData: m
       }
     ),
-    y.createPortal(
+    w.createPortal(
       /* @__PURE__ */ p.jsx(
-        P,
+        I,
         {
           scales: t,
           container: r,
           aesGetters: u,
-          labels: d,
+          labels: e,
           chartSizes: f,
           zoomStateKey: i,
           selectedDot: o,
-          defaultPolygons: h,
-          onPolygonUpdate: v,
-          onLassoControlsStateUpdate: M,
+          defaultPolygons: g,
+          onPolygonUpdate: d,
+          onLassoControlsStateUpdate: L,
           tooltipData: m
         }
       ),
@@ -76,6 +74,6 @@ function q({
   ] }) });
 }
 export {
-  q as SVGLayer
+  k as SVGLayer
 };
 //# sourceMappingURL=SVGLayer.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SVGLayer.js","sources":["../../../src/scatterplot-umap/components/SVGLayer.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { ErrorBoundary } from '../../common/ErrorBoundary';\nimport { useTooltip } from '../../common/Tooltip';\nimport type { DotInfo, SVGLayerProps } from '../types';\nimport LowerSvg from './LowerSVG';\nimport UpperSVG from './UpperSVG';\n\nexport function SVGLayer({\n    settingsId,\n    scales,\n    chartSettings,\n    mainTitle,\n    keyColumn,\n    margins,\n    chartSizes,\n    captionsSizes,\n    onlyPositive,\n    container,\n    zoomStateKey,\n    aesGetters,\n    legendData,\n    labels,\n    onPolygonUpdate,\n    onTooltipHintSwitch,\n    onLassoControlsStateUpdate,\n    dotsByGrouping,\n    layers,\n    defaultPolygons,\n    selectedDot = null,\n}: SVGLayerProps) {\n    if (!container) {\n        return null;\n    }\n    const tooltipData = useTooltip<DotInfo>(onTooltipHintSwitch);\n    useEffect(() => {\n        if (selectedDot) {\n            tooltipData.onMouseEnter(selectedDot);\n        } else {\n            tooltipData.onMouseLeave();\n        }\n    }, [selectedDot]);\n\n    return (\n        <div>\n        <ErrorBoundary dataId={settingsId}>\n            <LowerSvg\n                aesGetters={aesGetters}\n                dotsByGrouping={dotsByGrouping}\n                layers={layers}\n                scales={scales}\n                keyColumn={keyColumn}\n                margins={margins}\n                mainTitle={mainTitle}\n                captionsSizes={captionsSizes}\n                chartSettings={chartSettings}\n                chartSizes={chartSizes}\n                onlyPositive={onlyPositive}\n                container={container}\n                zoomStateKey={zoomStateKey}\n                legendData={legendData}\n                tooltipData={tooltipData}\n            />\n            {createPortal(\n                <UpperSVG\n                    scales={scales}\n                    container={container}\n                    aesGetters={aesGetters}\n                    labels={labels}\n                    chartSizes={chartSizes}\n                    zoomStateKey={zoomStateKey}\n                    selectedDot={selectedDot}\n                    defaultPolygons={defaultPolygons}\n                    onPolygonUpdate={onPolygonUpdate}\n                    onLassoControlsStateUpdate={onLassoControlsStateUpdate}\n                    tooltipData={tooltipData}\n                />,\n                container\n            )}\n        </ErrorBoundary>\n        </div>\n    );\n}\n"],"names":["SVGLayer","settingsId","scales","chartSettings","mainTitle","keyColumn","margins","chartSizes","captionsSizes","onlyPositive","container","zoomStateKey","aesGetters","legendData","labels","onPolygonUpdate","onTooltipHintSwitch","onLassoControlsStateUpdate","dotsByGrouping","layers","defaultPolygons","selectedDot","tooltipData","useTooltip","useEffect","jsx","jsxs","ErrorBoundary","LowerSvg","createPortal","UpperSVG"],"mappings":";;;;;;;AAQO,SAASA,EAAS;AAAA,EACrB,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,4BAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,aAAAC,IAAc;AAClB,GAAkB;AACd,MAAI,CAACX;AACD,WAAO;AAEX,QAAMY,IAAcC,EAAoBP,CAAmB;AAC3DQ,SAAAA,EAAAA,UAAU,MAAM;AACZ,IAAIH,IACAC,EAAY,aAAaD,CAAW,IAEpCC,EAAY,aAAA;AAAA,EAEpB,GAAG,CAACD,CAAW,CAAC,GAGZI,gBAAAA,EAAAA,IAAC,OAAA,EACD,UAAAC,gBAAAA,EAAAA,KAACC,GAAA,EAAc,QAAQ1B,GACnB,UAAA;AAAA,IAAAwB,gBAAAA,EAAAA;AAAAA,MAACG;AAAA,MAAA;AAAA,QACG,YAAAhB;AAAA,QACA,gBAAAM;AAAA,QACA,QAAAC;AAAA,QACA,QAAAjB;AAAA,QACA,WAAAG;AAAA,QACA,SAAAC;AAAA,QACA,WAAAF;AAAA,QACA,eAAAI;AAAA,QACA,eAAAL;AAAA,QACA,YAAAI;AAAA,QACA,cAAAE;AAAA,QACA,WAAAC;AAAA,QACA,cAAAC;AAAA,QACA,YAAAE;AAAA,QACA,aAAAS;AAAA,MAAA;AAAA,IAAA;AAAA,IAEHO,EAAAA;AAAAA,MACGJ,gBAAAA,EAAAA;AAAAA,QAACK;AAAA,QAAA;AAAA,UACG,QAAA5B;AAAA,UACA,WAAAQ;AAAA,UACA,YAAAE;AAAA,UACA,QAAAE;AAAA,UACA,YAAAP;AAAA,UACA,cAAAI;AAAA,UACA,aAAAU;AAAA,UACA,iBAAAD;AAAA,UACA,iBAAAL;AAAA,UACA,4BAAAE;AAAA,UACA,aAAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAEJZ;AAAA,IAAA;AAAA,EACJ,EAAA,CACJ,EAAA,CACA;AAER;"}
+{"version":3,"file":"SVGLayer.js","sources":["../../../src/scatterplot-umap/components/SVGLayer.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { ErrorBoundary } from '../../common/ErrorBoundary';\nimport { useTooltip } from '../../common/Tooltip';\nimport type { DotInfo, SVGLayerProps } from '../types';\nimport LowerSvg from './LowerSVG';\nimport UpperSVG from './UpperSVG';\n\nexport function SVGLayer({\n    settingsId,\n    scales,\n    chartSettings,\n    mainTitle,\n    keyColumn,\n    margins,\n    chartSizes,\n    captionsSizes,\n    container,\n    zoomStateKey,\n    aesGetters,\n    legendData,\n    labels,\n    onPolygonUpdate,\n    onTooltipHintSwitch,\n    onLassoControlsStateUpdate,\n    dotsByGrouping,\n    layers,\n    defaultPolygons,\n    selectedDot = null,\n}: SVGLayerProps) {\n    if (!container) {\n        return null;\n    }\n    const tooltipData = useTooltip<DotInfo>(onTooltipHintSwitch);\n    useEffect(() => {\n        if (selectedDot) {\n            tooltipData.onMouseEnter(selectedDot);\n        } else {\n            tooltipData.onMouseLeave();\n        }\n    }, [selectedDot]);\n\n    return (\n        <div>\n        <ErrorBoundary dataId={settingsId}>\n            <LowerSvg\n                aesGetters={aesGetters}\n                dotsByGrouping={dotsByGrouping}\n                layers={layers}\n                scales={scales}\n                keyColumn={keyColumn}\n                margins={margins}\n                mainTitle={mainTitle}\n                captionsSizes={captionsSizes}\n                chartSettings={chartSettings}\n                chartSizes={chartSizes}\n                container={container}\n                zoomStateKey={zoomStateKey}\n                legendData={legendData}\n                tooltipData={tooltipData}\n            />\n            {createPortal(\n                <UpperSVG\n                    scales={scales}\n                    container={container}\n                    aesGetters={aesGetters}\n                    labels={labels}\n                    chartSizes={chartSizes}\n                    zoomStateKey={zoomStateKey}\n                    selectedDot={selectedDot}\n                    defaultPolygons={defaultPolygons}\n                    onPolygonUpdate={onPolygonUpdate}\n                    onLassoControlsStateUpdate={onLassoControlsStateUpdate}\n                    tooltipData={tooltipData}\n                />,\n                container\n            )}\n        </ErrorBoundary>\n        </div>\n    );\n}\n"],"names":["SVGLayer","settingsId","scales","chartSettings","mainTitle","keyColumn","margins","chartSizes","captionsSizes","container","zoomStateKey","aesGetters","legendData","labels","onPolygonUpdate","onTooltipHintSwitch","onLassoControlsStateUpdate","dotsByGrouping","layers","defaultPolygons","selectedDot","tooltipData","useTooltip","useEffect","jsx","jsxs","ErrorBoundary","LowerSvg","createPortal","UpperSVG"],"mappings":";;;;;;;AAQO,SAASA,EAAS;AAAA,EACrB,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,4BAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,aAAAC,IAAc;AAClB,GAAkB;AACd,MAAI,CAACX;AACD,WAAO;AAEX,QAAMY,IAAcC,EAAoBP,CAAmB;AAC3DQ,SAAAA,EAAAA,UAAU,MAAM;AACZ,IAAIH,IACAC,EAAY,aAAaD,CAAW,IAEpCC,EAAY,aAAA;AAAA,EAEpB,GAAG,CAACD,CAAW,CAAC,GAGZI,gBAAAA,EAAAA,IAAC,OAAA,EACD,UAAAC,gBAAAA,EAAAA,KAACC,GAAA,EAAc,QAAQzB,GACnB,UAAA;AAAA,IAAAuB,gBAAAA,EAAAA;AAAAA,MAACG;AAAA,MAAA;AAAA,QACG,YAAAhB;AAAA,QACA,gBAAAM;AAAA,QACA,QAAAC;AAAA,QACA,QAAAhB;AAAA,QACA,WAAAG;AAAA,QACA,SAAAC;AAAA,QACA,WAAAF;AAAA,QACA,eAAAI;AAAA,QACA,eAAAL;AAAA,QACA,YAAAI;AAAA,QACA,WAAAE;AAAA,QACA,cAAAC;AAAA,QACA,YAAAE;AAAA,QACA,aAAAS;AAAA,MAAA;AAAA,IAAA;AAAA,IAEHO,EAAAA;AAAAA,MACGJ,gBAAAA,EAAAA;AAAAA,QAACK;AAAA,QAAA;AAAA,UACG,QAAA3B;AAAA,UACA,WAAAO;AAAA,UACA,YAAAE;AAAA,UACA,QAAAE;AAAA,UACA,YAAAN;AAAA,UACA,cAAAG;AAAA,UACA,aAAAU;AAAA,UACA,iBAAAD;AAAA,UACA,iBAAAL;AAAA,UACA,4BAAAE;AAAA,UACA,aAAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAEJZ;AAAA,IAAA;AAAA,EACJ,EAAA,CACJ,EAAA,CACA;AAER;"}