@elliemae/ds-dataviz 3.12.0-rc.0 → 3.12.0-rc.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -48,7 +48,7 @@ var import_VerticalScrapper = require("./Scrapper/VerticalScrapper");
|
|
|
48
48
|
var import_Controllers = require("./Scroller/Controllers");
|
|
49
49
|
const ChartContainer = () => {
|
|
50
50
|
const {
|
|
51
|
-
props: { yAxis, xScroll, scrapper, xAxis },
|
|
51
|
+
props: { yAxis, xScroll, scrapper, xAxis, width: userWidth },
|
|
52
52
|
containerRef,
|
|
53
53
|
activePoint,
|
|
54
54
|
internalMargin,
|
|
@@ -67,9 +67,9 @@ const ChartContainer = () => {
|
|
|
67
67
|
containerRatio,
|
|
68
68
|
lastPosition,
|
|
69
69
|
setIsScrollbarVisible,
|
|
70
|
+
currentData,
|
|
70
71
|
width,
|
|
71
|
-
height
|
|
72
|
-
currentData
|
|
72
|
+
height
|
|
73
73
|
} = (0, import_react.useContext)(import_ChartContext.ChartContext);
|
|
74
74
|
const yScroll = yAxis.advanced?.pointSpacing?.value > 1;
|
|
75
75
|
const { onInputKeyDown, handleOnBlur, handleOnFocus } = (0, import_useKeyboardNavigation.useKeyboardNavigation)();
|
|
@@ -171,7 +171,7 @@ const ChartContainer = () => {
|
|
|
171
171
|
onMouseUp: handleMouseUp,
|
|
172
172
|
onMouseDown: (e) => e.preventDefault(),
|
|
173
173
|
isGrabbed,
|
|
174
|
-
style: { width, height },
|
|
174
|
+
style: { width: userWidth, height },
|
|
175
175
|
children: width !== 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", {
|
|
176
176
|
ref: svgRef,
|
|
177
177
|
width,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/parts/ChartContainer.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useContext, useMemo, useCallback, useEffect } from 'react';\nimport { StyledSVGWrapper } from '../styles';\n\nimport { ChartContext } from '../ChartContext';\nimport { useKeyboardNavigation } from '../config/useKeyboardNavigation';\nimport { Legend } from './Legend/Legend';\nimport { Label } from './Labels/Label';\nimport { BlurMask } from './Scroller/BlurMask';\nimport { ClipPaths } from './ClipPaths';\nimport { ScrollableContainerX } from './Scroller/ScrollableContainerX';\nimport { ScrollableContainerY } from './Scroller/ScrollableContainerY';\n\nimport { AxisBottom } from './Axis/AxisBottom';\nimport { AxisRight } from './Axis/AxisRight';\nimport { AxisLeft } from './Axis/AxisLeft';\nimport { SeriesFactory } from './SeriesFactory';\nimport { Scrapper } from './Scrapper/Scrapper';\nimport { VerticalScrapper } from './Scrapper/VerticalScrapper';\nimport { Controllers } from './Scroller/Controllers';\nexport const ChartContainer = () => {\n const {\n props: { yAxis, xScroll, scrapper, xAxis },\n containerRef,\n activePoint,\n internalMargin,\n setScrapperPosY,\n setScrapperPosX,\n setContainerRef,\n svgRef,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n innerWidth,\n innerHeight,\n setActivePoint,\n setXScrollbarPosition,\n xScrollbarPosition,\n containerRatio,\n lastPosition,\n setIsScrollbarVisible,\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0Gf;AA1GR,mBAAmE;AACnE,oBAAiC;AAEjC,0BAA6B;AAC7B,mCAAsC;AACtC,oBAAuB;AACvB,mBAAsB;AACtB,sBAAyB;AACzB,uBAA0B;AAC1B,kCAAqC;AACrC,kCAAqC;AAErC,wBAA2B;AAC3B,uBAA0B;AAC1B,sBAAyB;AACzB,2BAA8B;AAC9B,sBAAyB;AACzB,8BAAiC;AACjC,yBAA4B;AACrB,MAAM,iBAAiB,MAAM;AAClC,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,SAAS,UAAU,
|
|
4
|
+
"sourcesContent": ["import React, { useContext, useMemo, useCallback, useEffect } from 'react';\nimport { StyledSVGWrapper } from '../styles';\n\nimport { ChartContext } from '../ChartContext';\nimport { useKeyboardNavigation } from '../config/useKeyboardNavigation';\nimport { Legend } from './Legend/Legend';\nimport { Label } from './Labels/Label';\nimport { BlurMask } from './Scroller/BlurMask';\nimport { ClipPaths } from './ClipPaths';\nimport { ScrollableContainerX } from './Scroller/ScrollableContainerX';\nimport { ScrollableContainerY } from './Scroller/ScrollableContainerY';\n\nimport { AxisBottom } from './Axis/AxisBottom';\nimport { AxisRight } from './Axis/AxisRight';\nimport { AxisLeft } from './Axis/AxisLeft';\nimport { SeriesFactory } from './SeriesFactory';\nimport { Scrapper } from './Scrapper/Scrapper';\nimport { VerticalScrapper } from './Scrapper/VerticalScrapper';\nimport { Controllers } from './Scroller/Controllers';\nexport const ChartContainer = () => {\n const {\n props: { yAxis, xScroll, scrapper, xAxis, width: userWidth },\n containerRef,\n activePoint,\n internalMargin,\n setScrapperPosY,\n setScrapperPosX,\n setContainerRef,\n svgRef,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n innerWidth,\n innerHeight,\n setActivePoint,\n setXScrollbarPosition,\n xScrollbarPosition,\n containerRatio,\n lastPosition,\n setIsScrollbarVisible,\n currentData,\n width,\n height,\n } = useContext(ChartContext);\n\n // const xScroll = xAxis.advanced?.pointSpacing?.value > 1;\n const yScroll = yAxis.advanced?.pointSpacing?.value > 1;\n const { onInputKeyDown, handleOnBlur, handleOnFocus } = useKeyboardNavigation();\n\n const onMouseEnterHandler = useCallback(() => {\n setIsScrollbarVisible(true);\n }, [setIsScrollbarVisible]);\n const onMouseLeaveHandler = useCallback(() => {\n setScrapperPosY('');\n setScrapperPosX('');\n setIsScrollbarVisible(false);\n setIsGrabbed(false);\n }, [setIsGrabbed, setIsScrollbarVisible, setScrapperPosX, setScrapperPosY]);\n\n const handleMouseMove: React.MouseEventHandler = useCallback(\n (e) => {\n if (!isGrabbed) return;\n setActivePoint(null);\n if (xScroll) {\n const newPosition = lastPosition?.current + e.clientX - startPosition;\n if (newPosition < 0) setXScrollbarPosition(0);\n else if (newPosition > innerWidth - innerWidth / containerRatio)\n setXScrollbarPosition(innerWidth - innerWidth / containerRatio);\n else setXScrollbarPosition(newPosition);\n }\n if (yScroll) {\n const newPosition = lastPosition?.current + e.clientY - startPosition;\n if (newPosition < 0) setXScrollbarPosition(0);\n else if (newPosition > innerHeight - innerHeight / containerRatio)\n setXScrollbarPosition(innerHeight - innerHeight / containerRatio);\n else setXScrollbarPosition(newPosition);\n }\n },\n [\n isGrabbed,\n setActivePoint,\n xScroll,\n yScroll,\n lastPosition,\n startPosition,\n setXScrollbarPosition,\n innerWidth,\n containerRatio,\n innerHeight,\n ],\n );\n const handleMouseUp = useCallback(() => {\n lastPosition.current = xScrollbarPosition;\n setIsGrabbed(false);\n }, [lastPosition, setIsGrabbed, xScrollbarPosition]);\n\n const key = useMemo(\n () => `${width},${internalMargin.left},${internalMargin.top},${internalMargin.right},${internalMargin.bottom}`,\n [internalMargin, width],\n );\n\n if (currentData.length === 0) return null;\n\n const render = useMemo(() => {\n if (xScroll || xAxis.advanced?.pointSpacing?.value > 1) {\n return (\n <>\n <AxisRight />\n <AxisLeft />\n <ScrollableContainerX />\n </>\n );\n }\n if (yScroll) {\n return (\n <>\n <AxisBottom />\n <ScrollableContainerY />\n </>\n );\n }\n return (\n <>\n <AxisRight />\n <AxisLeft />\n <AxisBottom />\n <SeriesFactory />\n {scrapper?.type === 'horizontal' ? <Scrapper /> : null}\n {scrapper?.type === 'vertical' ? <VerticalScrapper /> : null}\n </>\n );\n }, [scrapper?.type, xAxis.advanced?.pointSpacing?.value, xScroll, yScroll]);\n return (\n <StyledSVGWrapper\n ref={setContainerRef}\n onKeyDown={onInputKeyDown}\n aria-hidden=\"true\"\n tabIndex={activePoint ? -1 : 0}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onMouseEnter={onMouseEnterHandler}\n onMouseLeave={onMouseLeaveHandler}\n onMouseMove={handleMouseMove}\n onMouseUp={handleMouseUp}\n onMouseDown={(e) => e.preventDefault()}\n isGrabbed={isGrabbed}\n style={{ width: userWidth, height }}\n >\n {width !== 0 ? (\n <svg ref={svgRef} width={width} height={height}>\n {/* this clipaths for animations and focus ring.. need to give a deeper look */}\n <ClipPaths />\n <BlurMask />\n <g key={key}>\n <g>\n <Controllers />\n <Legend />\n <Label />\n </g>\n <g className=\"container\" transform={`translate(${internalMargin.left},${internalMargin.top})`}>\n {render}\n {/* <ActivePoint/> @todo */}\n </g>\n </g>\n </svg>\n ) : null}\n </StyledSVGWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -19,7 +19,7 @@ import { VerticalScrapper } from "./Scrapper/VerticalScrapper";
|
|
|
19
19
|
import { Controllers } from "./Scroller/Controllers";
|
|
20
20
|
const ChartContainer = () => {
|
|
21
21
|
const {
|
|
22
|
-
props: { yAxis, xScroll, scrapper, xAxis },
|
|
22
|
+
props: { yAxis, xScroll, scrapper, xAxis, width: userWidth },
|
|
23
23
|
containerRef,
|
|
24
24
|
activePoint,
|
|
25
25
|
internalMargin,
|
|
@@ -38,9 +38,9 @@ const ChartContainer = () => {
|
|
|
38
38
|
containerRatio,
|
|
39
39
|
lastPosition,
|
|
40
40
|
setIsScrollbarVisible,
|
|
41
|
+
currentData,
|
|
41
42
|
width,
|
|
42
|
-
height
|
|
43
|
-
currentData
|
|
43
|
+
height
|
|
44
44
|
} = useContext(ChartContext);
|
|
45
45
|
const yScroll = yAxis.advanced?.pointSpacing?.value > 1;
|
|
46
46
|
const { onInputKeyDown, handleOnBlur, handleOnFocus } = useKeyboardNavigation();
|
|
@@ -142,7 +142,7 @@ const ChartContainer = () => {
|
|
|
142
142
|
onMouseUp: handleMouseUp,
|
|
143
143
|
onMouseDown: (e) => e.preventDefault(),
|
|
144
144
|
isGrabbed,
|
|
145
|
-
style: { width, height },
|
|
145
|
+
style: { width: userWidth, height },
|
|
146
146
|
children: width !== 0 ? /* @__PURE__ */ jsxs("svg", {
|
|
147
147
|
ref: svgRef,
|
|
148
148
|
width,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/parts/ChartContainer.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo, useCallback, useEffect } from 'react';\nimport { StyledSVGWrapper } from '../styles';\n\nimport { ChartContext } from '../ChartContext';\nimport { useKeyboardNavigation } from '../config/useKeyboardNavigation';\nimport { Legend } from './Legend/Legend';\nimport { Label } from './Labels/Label';\nimport { BlurMask } from './Scroller/BlurMask';\nimport { ClipPaths } from './ClipPaths';\nimport { ScrollableContainerX } from './Scroller/ScrollableContainerX';\nimport { ScrollableContainerY } from './Scroller/ScrollableContainerY';\n\nimport { AxisBottom } from './Axis/AxisBottom';\nimport { AxisRight } from './Axis/AxisRight';\nimport { AxisLeft } from './Axis/AxisLeft';\nimport { SeriesFactory } from './SeriesFactory';\nimport { Scrapper } from './Scrapper/Scrapper';\nimport { VerticalScrapper } from './Scrapper/VerticalScrapper';\nimport { Controllers } from './Scroller/Controllers';\nexport const ChartContainer = () => {\n const {\n props: { yAxis, xScroll, scrapper, xAxis },\n containerRef,\n activePoint,\n internalMargin,\n setScrapperPosY,\n setScrapperPosX,\n setContainerRef,\n svgRef,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n innerWidth,\n innerHeight,\n setActivePoint,\n setXScrollbarPosition,\n xScrollbarPosition,\n containerRatio,\n lastPosition,\n setIsScrollbarVisible,\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC0Gf,mBACE,KADF;AA1GR,SAAgB,YAAY,SAAS,mBAA8B;AACnE,SAAS,wBAAwB;AAEjC,SAAS,oBAAoB;AAC7B,SAAS,6BAA6B;AACtC,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AAErC,SAAS,kBAAkB;AAC3B,SAAS,iBAAiB;AAC1B,SAAS,gBAAgB;AACzB,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AACrB,MAAM,iBAAiB,MAAM;AAClC,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,SAAS,UAAU,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo, useCallback, useEffect } from 'react';\nimport { StyledSVGWrapper } from '../styles';\n\nimport { ChartContext } from '../ChartContext';\nimport { useKeyboardNavigation } from '../config/useKeyboardNavigation';\nimport { Legend } from './Legend/Legend';\nimport { Label } from './Labels/Label';\nimport { BlurMask } from './Scroller/BlurMask';\nimport { ClipPaths } from './ClipPaths';\nimport { ScrollableContainerX } from './Scroller/ScrollableContainerX';\nimport { ScrollableContainerY } from './Scroller/ScrollableContainerY';\n\nimport { AxisBottom } from './Axis/AxisBottom';\nimport { AxisRight } from './Axis/AxisRight';\nimport { AxisLeft } from './Axis/AxisLeft';\nimport { SeriesFactory } from './SeriesFactory';\nimport { Scrapper } from './Scrapper/Scrapper';\nimport { VerticalScrapper } from './Scrapper/VerticalScrapper';\nimport { Controllers } from './Scroller/Controllers';\nexport const ChartContainer = () => {\n const {\n props: { yAxis, xScroll, scrapper, xAxis, width: userWidth },\n containerRef,\n activePoint,\n internalMargin,\n setScrapperPosY,\n setScrapperPosX,\n setContainerRef,\n svgRef,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n innerWidth,\n innerHeight,\n setActivePoint,\n setXScrollbarPosition,\n xScrollbarPosition,\n containerRatio,\n lastPosition,\n setIsScrollbarVisible,\n currentData,\n width,\n height,\n } = useContext(ChartContext);\n\n // const xScroll = xAxis.advanced?.pointSpacing?.value > 1;\n const yScroll = yAxis.advanced?.pointSpacing?.value > 1;\n const { onInputKeyDown, handleOnBlur, handleOnFocus } = useKeyboardNavigation();\n\n const onMouseEnterHandler = useCallback(() => {\n setIsScrollbarVisible(true);\n }, [setIsScrollbarVisible]);\n const onMouseLeaveHandler = useCallback(() => {\n setScrapperPosY('');\n setScrapperPosX('');\n setIsScrollbarVisible(false);\n setIsGrabbed(false);\n }, [setIsGrabbed, setIsScrollbarVisible, setScrapperPosX, setScrapperPosY]);\n\n const handleMouseMove: React.MouseEventHandler = useCallback(\n (e) => {\n if (!isGrabbed) return;\n setActivePoint(null);\n if (xScroll) {\n const newPosition = lastPosition?.current + e.clientX - startPosition;\n if (newPosition < 0) setXScrollbarPosition(0);\n else if (newPosition > innerWidth - innerWidth / containerRatio)\n setXScrollbarPosition(innerWidth - innerWidth / containerRatio);\n else setXScrollbarPosition(newPosition);\n }\n if (yScroll) {\n const newPosition = lastPosition?.current + e.clientY - startPosition;\n if (newPosition < 0) setXScrollbarPosition(0);\n else if (newPosition > innerHeight - innerHeight / containerRatio)\n setXScrollbarPosition(innerHeight - innerHeight / containerRatio);\n else setXScrollbarPosition(newPosition);\n }\n },\n [\n isGrabbed,\n setActivePoint,\n xScroll,\n yScroll,\n lastPosition,\n startPosition,\n setXScrollbarPosition,\n innerWidth,\n containerRatio,\n innerHeight,\n ],\n );\n const handleMouseUp = useCallback(() => {\n lastPosition.current = xScrollbarPosition;\n setIsGrabbed(false);\n }, [lastPosition, setIsGrabbed, xScrollbarPosition]);\n\n const key = useMemo(\n () => `${width},${internalMargin.left},${internalMargin.top},${internalMargin.right},${internalMargin.bottom}`,\n [internalMargin, width],\n );\n\n if (currentData.length === 0) return null;\n\n const render = useMemo(() => {\n if (xScroll || xAxis.advanced?.pointSpacing?.value > 1) {\n return (\n <>\n <AxisRight />\n <AxisLeft />\n <ScrollableContainerX />\n </>\n );\n }\n if (yScroll) {\n return (\n <>\n <AxisBottom />\n <ScrollableContainerY />\n </>\n );\n }\n return (\n <>\n <AxisRight />\n <AxisLeft />\n <AxisBottom />\n <SeriesFactory />\n {scrapper?.type === 'horizontal' ? <Scrapper /> : null}\n {scrapper?.type === 'vertical' ? <VerticalScrapper /> : null}\n </>\n );\n }, [scrapper?.type, xAxis.advanced?.pointSpacing?.value, xScroll, yScroll]);\n return (\n <StyledSVGWrapper\n ref={setContainerRef}\n onKeyDown={onInputKeyDown}\n aria-hidden=\"true\"\n tabIndex={activePoint ? -1 : 0}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onMouseEnter={onMouseEnterHandler}\n onMouseLeave={onMouseLeaveHandler}\n onMouseMove={handleMouseMove}\n onMouseUp={handleMouseUp}\n onMouseDown={(e) => e.preventDefault()}\n isGrabbed={isGrabbed}\n style={{ width: userWidth, height }}\n >\n {width !== 0 ? (\n <svg ref={svgRef} width={width} height={height}>\n {/* this clipaths for animations and focus ring.. need to give a deeper look */}\n <ClipPaths />\n <BlurMask />\n <g key={key}>\n <g>\n <Controllers />\n <Legend />\n <Label />\n </g>\n <g className=\"container\" transform={`translate(${internalMargin.left},${internalMargin.top})`}>\n {render}\n {/* <ActivePoint/> @todo */}\n </g>\n </g>\n </svg>\n ) : null}\n </StyledSVGWrapper>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC0Gf,mBACE,KADF;AA1GR,SAAgB,YAAY,SAAS,mBAA8B;AACnE,SAAS,wBAAwB;AAEjC,SAAS,oBAAoB;AAC7B,SAAS,6BAA6B;AACtC,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AAErC,SAAS,kBAAkB;AAC3B,SAAS,iBAAiB;AAC1B,SAAS,gBAAgB;AACzB,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AACrB,MAAM,iBAAiB,MAAM;AAClC,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,SAAS,UAAU,OAAO,OAAO,UAAU;AAAA,IAC3D;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,YAAY;AAG3B,QAAM,UAAU,MAAM,UAAU,cAAc,QAAQ;AACtD,QAAM,EAAE,gBAAgB,cAAc,cAAc,IAAI,sBAAsB;AAE9E,QAAM,sBAAsB,YAAY,MAAM;AAC5C,0BAAsB,IAAI;AAAA,EAC5B,GAAG,CAAC,qBAAqB,CAAC;AAC1B,QAAM,sBAAsB,YAAY,MAAM;AAC5C,oBAAgB,EAAE;AAClB,oBAAgB,EAAE;AAClB,0BAAsB,KAAK;AAC3B,iBAAa,KAAK;AAAA,EACpB,GAAG,CAAC,cAAc,uBAAuB,iBAAiB,eAAe,CAAC;AAE1E,QAAM,kBAA2C;AAAA,IAC/C,CAAC,MAAM;AACL,UAAI,CAAC;AAAW;AAChB,qBAAe,IAAI;AACnB,UAAI,SAAS;AACX,cAAM,cAAc,cAAc,UAAU,EAAE,UAAU;AACxD,YAAI,cAAc;AAAG,gCAAsB,CAAC;AAAA,iBACnC,cAAc,aAAa,aAAa;AAC/C,gCAAsB,aAAa,aAAa,cAAc;AAAA;AAC3D,gCAAsB,WAAW;AAAA,MACxC;AACA,UAAI,SAAS;AACX,cAAM,cAAc,cAAc,UAAU,EAAE,UAAU;AACxD,YAAI,cAAc;AAAG,gCAAsB,CAAC;AAAA,iBACnC,cAAc,cAAc,cAAc;AACjD,gCAAsB,cAAc,cAAc,cAAc;AAAA;AAC7D,gCAAsB,WAAW;AAAA,MACxC;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,QAAM,gBAAgB,YAAY,MAAM;AACtC,iBAAa,UAAU;AACvB,iBAAa,KAAK;AAAA,EACpB,GAAG,CAAC,cAAc,cAAc,kBAAkB,CAAC;AAEnD,QAAM,MAAM;AAAA,IACV,MAAM,GAAG,SAAS,eAAe,QAAQ,eAAe,OAAO,eAAe,SAAS,eAAe;AAAA,IACtG,CAAC,gBAAgB,KAAK;AAAA,EACxB;AAEA,MAAI,YAAY,WAAW;AAAG,WAAO;AAErC,QAAM,SAAS,QAAQ,MAAM;AAC3B,QAAI,WAAW,MAAM,UAAU,cAAc,QAAQ,GAAG;AACtD,aACE;AAAA,QACE;AAAA,8BAAC,aAAU;AAAA,UACX,oBAAC,YAAS;AAAA,UACV,oBAAC,wBAAqB;AAAA;AAAA,OACxB;AAAA,IAEJ;AACA,QAAI,SAAS;AACX,aACE;AAAA,QACE;AAAA,8BAAC,cAAW;AAAA,UACZ,oBAAC,wBAAqB;AAAA;AAAA,OACxB;AAAA,IAEJ;AACA,WACE;AAAA,MACE;AAAA,4BAAC,aAAU;AAAA,QACX,oBAAC,YAAS;AAAA,QACV,oBAAC,cAAW;AAAA,QACZ,oBAAC,iBAAc;AAAA,QACd,UAAU,SAAS,eAAe,oBAAC,YAAS,IAAK;AAAA,QACjD,UAAU,SAAS,aAAa,oBAAC,oBAAiB,IAAK;AAAA;AAAA,KAC1D;AAAA,EAEJ,GAAG,CAAC,UAAU,MAAM,MAAM,UAAU,cAAc,OAAO,SAAS,OAAO,CAAC;AAC1E,SACE,oBAAC;AAAA,IACC,KAAK;AAAA,IACL,WAAW;AAAA,IACX,eAAY;AAAA,IACZ,UAAU,cAAc,KAAK;AAAA,IAC7B,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,cAAc;AAAA,IACd,cAAc;AAAA,IACd,aAAa;AAAA,IACb,WAAW;AAAA,IACX,aAAa,CAAC,MAAM,EAAE,eAAe;AAAA,IACrC;AAAA,IACA,OAAO,EAAE,OAAO,WAAW,OAAO;AAAA,IAEjC,oBAAU,IACT,qBAAC;AAAA,MAAI,KAAK;AAAA,MAAQ;AAAA,MAAc;AAAA,MAE9B;AAAA,4BAAC,aAAU;AAAA,QACX,oBAAC,YAAS;AAAA,QACV,qBAAC;AAAA,UACC;AAAA,iCAAC;AAAA,cACC;AAAA,oCAAC,eAAY;AAAA,gBACb,oBAAC,UAAO;AAAA,gBACR,oBAAC,SAAM;AAAA;AAAA,aACT;AAAA,YACA,oBAAC;AAAA,cAAE,WAAU;AAAA,cAAY,WAAW,aAAa,eAAe,QAAQ,eAAe;AAAA,cACpF;AAAA,aAEH;AAAA;AAAA,WATM,GAUR;AAAA;AAAA,KACF,IACE;AAAA,GACN;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-dataviz",
|
|
3
|
-
"version": "3.12.0-rc.
|
|
3
|
+
"version": "3.12.0-rc.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - DataViz",
|
|
6
6
|
"files": [
|
|
@@ -35,9 +35,9 @@
|
|
|
35
35
|
"indent": 4
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@elliemae/ds-popperjs": "3.12.0-rc.
|
|
39
|
-
"@elliemae/ds-system": "3.12.0-rc.
|
|
40
|
-
"@elliemae/ds-utilities": "3.12.0-rc.
|
|
38
|
+
"@elliemae/ds-popperjs": "3.12.0-rc.2",
|
|
39
|
+
"@elliemae/ds-system": "3.12.0-rc.2",
|
|
40
|
+
"@elliemae/ds-utilities": "3.12.0-rc.2",
|
|
41
41
|
"d3": "~7.6.1",
|
|
42
42
|
"d3-scale": "~4.0.2",
|
|
43
43
|
"d3-shape": "~3.1.0",
|
|
@@ -47,14 +47,14 @@
|
|
|
47
47
|
"devDependencies": {
|
|
48
48
|
"@elliemae/pui-theme": "~2.6.0",
|
|
49
49
|
"@types/d3": "~7.4.0",
|
|
50
|
-
"styled-components": "~5.3.
|
|
50
|
+
"styled-components": "~5.3.6"
|
|
51
51
|
},
|
|
52
52
|
"peerDependencies": {
|
|
53
53
|
"@elliemae/pui-theme": "~2.6.0",
|
|
54
54
|
"lodash": "^4.17.21",
|
|
55
55
|
"react": "^17.0.2",
|
|
56
56
|
"react-dom": "^17.0.2",
|
|
57
|
-
"styled-components": "
|
|
57
|
+
"styled-components": "~5.3.6"
|
|
58
58
|
},
|
|
59
59
|
"publishConfig": {
|
|
60
60
|
"access": "public",
|