@elliemae/ds-dataviz 3.8.1 → 3.9.0-next.1

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.
Files changed (164) hide show
  1. package/dist/cjs/graphs/Chart/Chart.js.map +2 -2
  2. package/dist/cjs/graphs/Chart/ChartContext.js +3 -1
  3. package/dist/cjs/graphs/Chart/ChartContext.js.map +2 -2
  4. package/dist/cjs/graphs/Chart/config/useChart.js +86 -33
  5. package/dist/cjs/graphs/Chart/config/useChart.js.map +3 -3
  6. package/dist/cjs/graphs/Chart/config/useInternalMargins.js +103 -0
  7. package/dist/cjs/graphs/Chart/config/useInternalMargins.js.map +7 -0
  8. package/dist/cjs/graphs/Chart/config/useKeyboardNavigation.js +25 -15
  9. package/dist/cjs/graphs/Chart/config/useKeyboardNavigation.js.map +2 -2
  10. package/dist/cjs/graphs/Chart/config/useScales.js +43 -17
  11. package/dist/cjs/graphs/Chart/config/useScales.js.map +2 -2
  12. package/dist/cjs/graphs/Chart/helpers/index.js +9 -13
  13. package/dist/cjs/graphs/Chart/helpers/index.js.map +2 -2
  14. package/dist/cjs/graphs/Chart/parts/ActivePoint.js +1 -1
  15. package/dist/cjs/graphs/Chart/parts/ActivePoint.js.map +2 -2
  16. package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js +17 -25
  17. package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js.map +3 -3
  18. package/dist/cjs/graphs/Chart/parts/Axis/AxisLeft.js +33 -38
  19. package/dist/cjs/graphs/Chart/parts/Axis/AxisLeft.js.map +2 -2
  20. package/dist/cjs/graphs/Chart/parts/Axis/AxisRight.js +6 -11
  21. package/dist/cjs/graphs/Chart/parts/Axis/AxisRight.js.map +2 -2
  22. package/dist/cjs/graphs/Chart/parts/ChartContainer.js +65 -16
  23. package/dist/cjs/graphs/Chart/parts/ChartContainer.js.map +2 -2
  24. package/dist/cjs/graphs/Chart/parts/FocusableRegion.js +17 -68
  25. package/dist/cjs/graphs/Chart/parts/FocusableRegion.js.map +2 -2
  26. package/dist/cjs/graphs/Chart/{series/Pie.js → parts/Labels/BottomLabel.js} +20 -12
  27. package/dist/cjs/graphs/Chart/parts/Labels/BottomLabel.js.map +7 -0
  28. package/dist/cjs/graphs/Chart/parts/Labels/Label.js +52 -0
  29. package/dist/cjs/graphs/Chart/parts/Labels/Label.js.map +7 -0
  30. package/dist/cjs/graphs/Chart/parts/Labels/LeftLabel.js +61 -0
  31. package/dist/cjs/graphs/Chart/parts/Labels/LeftLabel.js.map +7 -0
  32. package/dist/cjs/graphs/Chart/parts/Labels/RightLabel.js +65 -0
  33. package/dist/cjs/graphs/Chart/parts/Labels/RightLabel.js.map +7 -0
  34. package/dist/cjs/graphs/Chart/parts/Legend/BottomLegend.js +28 -30
  35. package/dist/cjs/graphs/Chart/parts/Legend/BottomLegend.js.map +2 -2
  36. package/dist/cjs/graphs/Chart/parts/Legend/LeftLegend.js +14 -19
  37. package/dist/cjs/graphs/Chart/parts/Legend/LeftLegend.js.map +2 -2
  38. package/dist/cjs/graphs/Chart/parts/Legend/LegendItem.js +100 -0
  39. package/dist/cjs/graphs/Chart/parts/Legend/LegendItem.js.map +7 -0
  40. package/dist/cjs/graphs/Chart/parts/Legend/RightLegend.js +31 -25
  41. package/dist/cjs/graphs/Chart/parts/Legend/RightLegend.js.map +2 -2
  42. package/dist/cjs/graphs/Chart/parts/Legend/TopLegend.js +3 -13
  43. package/dist/cjs/graphs/Chart/parts/Legend/TopLegend.js.map +2 -2
  44. package/dist/cjs/graphs/Chart/parts/Scrapper/Scrapper.js +50 -16
  45. package/dist/cjs/graphs/Chart/parts/Scrapper/Scrapper.js.map +2 -2
  46. package/dist/cjs/graphs/Chart/parts/Scrapper/ScrapperLine.js +3 -1
  47. package/dist/cjs/graphs/Chart/parts/Scrapper/ScrapperLine.js.map +2 -2
  48. package/dist/cjs/graphs/Chart/parts/Scrapper/VerticalScrapper.js +39 -17
  49. package/dist/cjs/graphs/Chart/parts/Scrapper/VerticalScrapper.js.map +2 -2
  50. package/dist/cjs/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js +29 -28
  51. package/dist/cjs/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js.map +2 -2
  52. package/dist/cjs/graphs/Chart/parts/Scroller/ScrollBarX.js.map +2 -2
  53. package/dist/cjs/graphs/Chart/parts/Scroller/ScrollableContainerX.js +2 -2
  54. package/dist/cjs/graphs/Chart/parts/Scroller/ScrollableContainerX.js.map +2 -2
  55. package/dist/cjs/graphs/Chart/parts/SeriesFactory.js +57 -41
  56. package/dist/cjs/graphs/Chart/parts/SeriesFactory.js.map +2 -2
  57. package/dist/cjs/graphs/Chart/react-desc-prop-types.js +1 -12
  58. package/dist/cjs/graphs/Chart/react-desc-prop-types.js.map +2 -2
  59. package/dist/cjs/graphs/Chart/series/Bars.js +29 -27
  60. package/dist/cjs/graphs/Chart/series/Bars.js.map +2 -2
  61. package/dist/cjs/graphs/Chart/series/HorizontalBars.js +85 -0
  62. package/dist/cjs/graphs/Chart/series/HorizontalBars.js.map +7 -0
  63. package/dist/cjs/graphs/Chart/series/HorizontalStackedBars.js +77 -0
  64. package/dist/cjs/graphs/Chart/series/HorizontalStackedBars.js.map +7 -0
  65. package/dist/cjs/graphs/Chart/series/Line.js +23 -19
  66. package/dist/cjs/graphs/Chart/series/Line.js.map +2 -2
  67. package/dist/cjs/graphs/Chart/series/Point.js +88 -18
  68. package/dist/cjs/graphs/Chart/series/Point.js.map +2 -2
  69. package/dist/cjs/graphs/Chart/series/Points.js +23 -27
  70. package/dist/cjs/graphs/Chart/series/Points.js.map +2 -2
  71. package/dist/cjs/graphs/Chart/series/Rect.js +105 -8
  72. package/dist/cjs/graphs/Chart/series/Rect.js.map +2 -2
  73. package/dist/cjs/graphs/Chart/series/StackedBar.js +23 -30
  74. package/dist/cjs/graphs/Chart/series/StackedBar.js.map +2 -2
  75. package/dist/cjs/graphs/Chart/series/index.js +0 -1
  76. package/dist/cjs/graphs/Chart/series/index.js.map +2 -2
  77. package/dist/cjs/graphs/Chart/styles.js +5 -20
  78. package/dist/cjs/graphs/Chart/styles.js.map +2 -2
  79. package/dist/cjs/graphs/constants.js +20 -0
  80. package/dist/cjs/graphs/constants.js.map +2 -2
  81. package/dist/esm/graphs/Chart/Chart.js.map +2 -2
  82. package/dist/esm/graphs/Chart/ChartContext.js +3 -1
  83. package/dist/esm/graphs/Chart/ChartContext.js.map +2 -2
  84. package/dist/esm/graphs/Chart/config/useChart.js +87 -34
  85. package/dist/esm/graphs/Chart/config/useChart.js.map +2 -2
  86. package/dist/esm/graphs/Chart/config/useInternalMargins.js +77 -0
  87. package/dist/esm/graphs/Chart/config/useInternalMargins.js.map +7 -0
  88. package/dist/esm/graphs/Chart/config/useKeyboardNavigation.js +26 -16
  89. package/dist/esm/graphs/Chart/config/useKeyboardNavigation.js.map +2 -2
  90. package/dist/esm/graphs/Chart/config/useScales.js +44 -18
  91. package/dist/esm/graphs/Chart/config/useScales.js.map +2 -2
  92. package/dist/esm/graphs/Chart/helpers/index.js +10 -14
  93. package/dist/esm/graphs/Chart/helpers/index.js.map +2 -2
  94. package/dist/esm/graphs/Chart/parts/ActivePoint.js +1 -1
  95. package/dist/esm/graphs/Chart/parts/ActivePoint.js.map +2 -2
  96. package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js +18 -26
  97. package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js.map +3 -3
  98. package/dist/esm/graphs/Chart/parts/Axis/AxisLeft.js +34 -39
  99. package/dist/esm/graphs/Chart/parts/Axis/AxisLeft.js.map +2 -2
  100. package/dist/esm/graphs/Chart/parts/Axis/AxisRight.js +6 -11
  101. package/dist/esm/graphs/Chart/parts/Axis/AxisRight.js.map +2 -2
  102. package/dist/esm/graphs/Chart/parts/ChartContainer.js +66 -17
  103. package/dist/esm/graphs/Chart/parts/ChartContainer.js.map +2 -2
  104. package/dist/esm/graphs/Chart/parts/FocusableRegion.js +18 -69
  105. package/dist/esm/graphs/Chart/parts/FocusableRegion.js.map +2 -2
  106. package/dist/esm/graphs/Chart/parts/Labels/BottomLabel.js +28 -0
  107. package/dist/esm/graphs/Chart/parts/Labels/BottomLabel.js.map +7 -0
  108. package/dist/esm/graphs/Chart/parts/Labels/Label.js +26 -0
  109. package/dist/esm/graphs/Chart/parts/Labels/Label.js.map +7 -0
  110. package/dist/esm/graphs/Chart/parts/Labels/LeftLabel.js +35 -0
  111. package/dist/esm/graphs/Chart/parts/Labels/LeftLabel.js.map +7 -0
  112. package/dist/esm/graphs/Chart/parts/Labels/RightLabel.js +39 -0
  113. package/dist/esm/graphs/Chart/parts/Labels/RightLabel.js.map +7 -0
  114. package/dist/esm/graphs/Chart/parts/Legend/BottomLegend.js +28 -30
  115. package/dist/esm/graphs/Chart/parts/Legend/BottomLegend.js.map +2 -2
  116. package/dist/esm/graphs/Chart/parts/Legend/LeftLegend.js +16 -21
  117. package/dist/esm/graphs/Chart/parts/Legend/LeftLegend.js.map +2 -2
  118. package/dist/esm/graphs/Chart/parts/Legend/LegendItem.js +74 -0
  119. package/dist/esm/graphs/Chart/parts/Legend/LegendItem.js.map +7 -0
  120. package/dist/esm/graphs/Chart/parts/Legend/RightLegend.js +32 -26
  121. package/dist/esm/graphs/Chart/parts/Legend/RightLegend.js.map +2 -2
  122. package/dist/esm/graphs/Chart/parts/Legend/TopLegend.js +3 -13
  123. package/dist/esm/graphs/Chart/parts/Legend/TopLegend.js.map +2 -2
  124. package/dist/esm/graphs/Chart/parts/Scrapper/Scrapper.js +51 -17
  125. package/dist/esm/graphs/Chart/parts/Scrapper/Scrapper.js.map +2 -2
  126. package/dist/esm/graphs/Chart/parts/Scrapper/ScrapperLine.js +3 -1
  127. package/dist/esm/graphs/Chart/parts/Scrapper/ScrapperLine.js.map +2 -2
  128. package/dist/esm/graphs/Chart/parts/Scrapper/VerticalScrapper.js +39 -17
  129. package/dist/esm/graphs/Chart/parts/Scrapper/VerticalScrapper.js.map +2 -2
  130. package/dist/esm/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js +29 -28
  131. package/dist/esm/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js.map +2 -2
  132. package/dist/esm/graphs/Chart/parts/Scroller/ScrollBarX.js.map +2 -2
  133. package/dist/esm/graphs/Chart/parts/Scroller/ScrollableContainerX.js +2 -2
  134. package/dist/esm/graphs/Chart/parts/Scroller/ScrollableContainerX.js.map +2 -2
  135. package/dist/esm/graphs/Chart/parts/SeriesFactory.js +58 -42
  136. package/dist/esm/graphs/Chart/parts/SeriesFactory.js.map +2 -2
  137. package/dist/esm/graphs/Chart/react-desc-prop-types.js +1 -12
  138. package/dist/esm/graphs/Chart/react-desc-prop-types.js.map +2 -2
  139. package/dist/esm/graphs/Chart/series/Bars.js +30 -28
  140. package/dist/esm/graphs/Chart/series/Bars.js.map +2 -2
  141. package/dist/esm/graphs/Chart/series/HorizontalBars.js +59 -0
  142. package/dist/esm/graphs/Chart/series/HorizontalBars.js.map +7 -0
  143. package/dist/esm/graphs/Chart/series/HorizontalStackedBars.js +51 -0
  144. package/dist/esm/graphs/Chart/series/HorizontalStackedBars.js.map +7 -0
  145. package/dist/esm/graphs/Chart/series/Line.js +25 -21
  146. package/dist/esm/graphs/Chart/series/Line.js.map +2 -2
  147. package/dist/esm/graphs/Chart/series/Point.js +89 -19
  148. package/dist/esm/graphs/Chart/series/Point.js.map +2 -2
  149. package/dist/esm/graphs/Chart/series/Points.js +24 -28
  150. package/dist/esm/graphs/Chart/series/Points.js.map +2 -2
  151. package/dist/esm/graphs/Chart/series/Rect.js +106 -9
  152. package/dist/esm/graphs/Chart/series/Rect.js.map +2 -2
  153. package/dist/esm/graphs/Chart/series/StackedBar.js +24 -31
  154. package/dist/esm/graphs/Chart/series/StackedBar.js.map +2 -2
  155. package/dist/esm/graphs/Chart/series/index.js +0 -1
  156. package/dist/esm/graphs/Chart/series/index.js.map +2 -2
  157. package/dist/esm/graphs/Chart/styles.js +5 -20
  158. package/dist/esm/graphs/Chart/styles.js.map +2 -2
  159. package/dist/esm/graphs/constants.js +20 -0
  160. package/dist/esm/graphs/constants.js.map +2 -2
  161. package/package.json +8 -8
  162. package/dist/cjs/graphs/Chart/series/Pie.js.map +0 -7
  163. package/dist/esm/graphs/Chart/series/Pie.js +0 -20
  164. package/dist/esm/graphs/Chart/series/Pie.js.map +0 -7
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/config/useChart.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-nested-callbacks */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useState, useRef, useEffect } from 'react';\n\n// import { useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport type { DSChartT } from '../react-desc-prop-types';\n// import { propTypes } from '../react-desc-prop-types';\nimport { useScales } from './useScales';\nimport { stackData } from '../helpers';\nexport const useChart = (props: DSChartT.Props) => {\n // useValidateTypescriptPropTypes(props, propTypes);\n\n const { series, yAxis, width, height, groups: groupsStacked } = props;\n\n const containerRef = useRef(null);\n const svgRef = useRef(null);\n\n const [isGrabbed, setIsGrabbed] = useState(false);\n const [startPosition, setStartPosition] = useState(0);\n\n const [activePoint, setActivePoint] = useState('');\n const [activeSerie, setActiveSerie] = useState('');\n const [scrapperPosY, setScrapperPosY] = useState('');\n const [scrapperPosX, setScrapperPosX] = useState('');\n const [xScrollbarPosition, setXScrollbarPosition] = useState(0);\n const [isScrollbarVisible, setIsScrollbarVisible] = useState(false);\n const oldLastPosition = useRef(0);\n\n const [axisLeftWidth, setAxisLeftWidth] = useState(null);\n const [axisBottomHeight, setAxisBottomHeight] = useState(null);\n const [axisRightWidth, setAxisRightWidth] = useState(null);\n\n const [leftLegend, setLeftLegend] = useState(null);\n const [rightLegend, setRightLegend] = useState(null);\n const [topLegend, setTopLegend] = useState(null);\n const [bottomLegend, setBottomLegend] = useState(null);\n\n // @todo create a useInternalMargin\n const internalMargin = useMemo(\n () => ({\n bottom:\n 10 +\n (axisBottomHeight?.getBoundingClientRect().height ?? 0) +\n (bottomLegend?.getBoundingClientRect().height ?? 0),\n top: 10 + (topLegend?.getBoundingClientRect().height ?? 0),\n right:\n 10 + (axisRightWidth?.getBoundingClientRect().width ?? 0) + (rightLegend?.getBoundingClientRect().width ?? 0),\n left: 10 + (axisLeftWidth?.getBoundingClientRect().width ?? 0) + (leftLegend?.getBoundingClientRect().width ?? 0),\n }),\n [axisBottomHeight, axisLeftWidth, axisRightWidth, bottomLegend, leftLegend, rightLegend, topLegend],\n );\n const innerWidth = useMemo(\n () => width - internalMargin.left - internalMargin.right,\n [internalMargin.left, internalMargin.right, width],\n );\n const innerHeight = useMemo(\n () => height - internalMargin.top - internalMargin.bottom,\n [internalMargin.top, internalMargin.bottom, height],\n );\n const groups = useMemo(() => series.map((serie) => serie.name), []);\n const stackedData = useMemo(() => stackData(groupsStacked, series), [groupsStacked, series]);\n // @TODO we need to create a logic to get this from both axis\n const containerRatio = (props?.xAxis.advanced?.pointSpacing?.value as number) ?? 1;\n\n const currentData = useMemo(\n () =>\n series.map((d, i) => ({\n ...d,\n originalData: d,\n key: `${d.name}-${i}`,\n data: d.data.map((value, index) => ({\n key: `${d.name}-${i}-${index}`,\n value,\n position: index,\n })),\n })),\n [series],\n );\n\n const { xScale, yScale, y2Scale, subGroupScale, colorScale, getBandwidth } = useScales({\n props,\n innerHeight,\n innerWidth,\n groups,\n stackedData,\n currentData,\n containerRatio,\n });\n\n return useMemo(\n () => ({\n props: { ...props, data: currentData },\n innerHeight,\n innerWidth,\n groups,\n colorScale,\n stackedData,\n subGroupScale,\n svgRef,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n setScrapperPosY,\n scrapperPosX,\n setScrapperPosX,\n activePoint,\n setActivePoint,\n activeSerie,\n setActiveSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n setStartPosition,\n isScrollbarVisible,\n setIsScrollbarVisible,\n oldLastPosition,\n containerRatio,\n internalMargin,\n axisLeftWidth,\n leftLegend,\n setAxisLeftWidth,\n setLeftLegend,\n setRightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomHeight,\n setAxisRightWidth,\n }),\n [\n props,\n currentData,\n innerHeight,\n innerWidth,\n groups,\n colorScale,\n stackedData,\n subGroupScale,\n scrapperPosX,\n setScrapperPosX,\n xScale,\n yScale,\n y2Scale,\n getBandwidth,\n scrapperPosY,\n activePoint,\n activeSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n setStartPosition,\n isScrollbarVisible,\n setIsScrollbarVisible,\n oldLastPosition,\n containerRatio,\n internalMargin,\n axisLeftWidth,\n leftLegend,\n setAxisLeftWidth,\n setLeftLegend,\n setRightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomHeight,\n setAxisRightWidth,\n ],\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,SAAS,UAAU,cAAyB;AAKrD,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AACnB,MAAM,WAAW,CAAC,UAA0B;AAGjD,QAAM,EAAE,QAAQ,OAAO,OAAO,QAAQ,QAAQ,cAAc,IAAI;AAEhE,QAAM,eAAe,OAAO,IAAI;AAChC,QAAM,SAAS,OAAO,IAAI;AAE1B,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,CAAC;AAEpD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,EAAE;AACjD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,EAAE;AACjD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,EAAE;AACnD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,EAAE;AACnD,QAAM,CAAC,oBAAoB,qBAAqB,IAAI,SAAS,CAAC;AAC9D,QAAM,CAAC,oBAAoB,qBAAqB,IAAI,SAAS,KAAK;AAClE,QAAM,kBAAkB,OAAO,CAAC;AAEhC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,IAAI;AACvD,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAS,IAAI;AAC7D,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,IAAI;AAEzD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,IAAI;AACjD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,IAAI;AACnD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAC/C,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,IAAI;AAGrD,QAAM,iBAAiB;AAAA,IACrB,OAAO;AAAA,MACL,QACE,MACC,kBAAkB,sBAAsB,EAAE,UAAU,MACpD,cAAc,sBAAsB,EAAE,UAAU;AAAA,MACnD,KAAK,MAAM,WAAW,sBAAsB,EAAE,UAAU;AAAA,MACxD,OACE,MAAM,gBAAgB,sBAAsB,EAAE,SAAS,MAAM,aAAa,sBAAsB,EAAE,SAAS;AAAA,MAC7G,MAAM,MAAM,eAAe,sBAAsB,EAAE,SAAS,MAAM,YAAY,sBAAsB,EAAE,SAAS;AAAA,IACjH;AAAA,IACA,CAAC,kBAAkB,eAAe,gBAAgB,cAAc,YAAY,aAAa,SAAS;AAAA,EACpG;AACA,QAAM,aAAa;AAAA,IACjB,MAAM,QAAQ,eAAe,OAAO,eAAe;AAAA,IACnD,CAAC,eAAe,MAAM,eAAe,OAAO,KAAK;AAAA,EACnD;AACA,QAAM,cAAc;AAAA,IAClB,MAAM,SAAS,eAAe,MAAM,eAAe;AAAA,IACnD,CAAC,eAAe,KAAK,eAAe,QAAQ,MAAM;AAAA,EACpD;AACA,QAAM,SAAS,QAAQ,MAAM,OAAO,IAAI,CAAC,UAAU,MAAM,IAAI,GAAG,CAAC,CAAC;AAClE,QAAM,cAAc,QAAQ,MAAM,UAAU,eAAe,MAAM,GAAG,CAAC,eAAe,MAAM,CAAC;AAE3F,QAAM,iBAAkB,OAAO,MAAM,UAAU,cAAc,SAAoB;AAEjF,QAAM,cAAc;AAAA,IAClB,MACE,OAAO,IAAI,CAAC,GAAG,OAAO;AAAA,MACpB,GAAG;AAAA,MACH,cAAc;AAAA,MACd,KAAK,GAAG,EAAE,QAAQ;AAAA,MAClB,MAAM,EAAE,KAAK,IAAI,CAAC,OAAO,WAAW;AAAA,QAClC,KAAK,GAAG,EAAE,QAAQ,KAAK;AAAA,QACvB;AAAA,QACA,UAAU;AAAA,MACZ,EAAE;AAAA,IACJ,EAAE;AAAA,IACJ,CAAC,MAAM;AAAA,EACT;AAEA,QAAM,EAAE,QAAQ,QAAQ,SAAS,eAAe,YAAY,aAAa,IAAI,UAAU;AAAA,IACrF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL,OAAO;AAAA,MACL,OAAO,EAAE,GAAG,OAAO,MAAM,YAAY;AAAA,MACrC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;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,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-nested-callbacks */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useState, useRef, useCallback } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\n// import { useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport type { DSChartT } from '../react-desc-prop-types';\n// import { propTypes } from '../react-desc-prop-types';\nimport { useScales } from './useScales';\nimport { stackData } from '../helpers';\nimport { useInternalMargins } from './useInternalMargins';\nexport const useChart = (props: DSChartT.Props) => {\n // useValidateTypescriptPropTypes(props, propTypes);\n\n const { series, yAxis, xAxis, width, height, groups: groupsStacked } = props;\n\n const containerRef = useRef(null);\n const svgRef = useRef(null);\n\n const [isGrabbed, setIsGrabbed] = useState(false);\n const [startPosition, setStartPosition] = useState(0);\n\n const [activePoint, setActivePoint] = useState(null);\n const [activeSerie, setActiveSerie] = useState('');\n const [scrapperPosY, setScrapperPosY] = useState('');\n const [scrapperPosX, setScrapperPosX] = useState('');\n const [xScrollbarPosition, setXScrollbarPosition] = useState(0);\n const [isScrollbarVisible, setIsScrollbarVisible] = useState(false);\n const oldLastPosition = useRef(0);\n\n const [axisLeftRef, setAxisLeftRef] = useState<Element>();\n const [axisBottomRef, setAxisBottomRef] = useState<Element>();\n const [axisRightRef, setAxisRightRef] = useState<Element>();\n\n const [leftLegend, setLeftLegend] = useState<Element>();\n const [rightLegend, setRightLegend] = useState<Element>();\n const [topLegend, setTopLegend] = useState<Element>();\n const [bottomLegend, setBottomLegend] = useState<Element>();\n\n const [rightLabel, setRightLabel] = useState<Element>();\n const [leftLabel, setLeftLabel] = useState<Element>();\n const [bottomLabel, setBottomLabel] = useState<Element>();\n\n const { axisBottomHeight, axisRightWidth, bottomLabelHeight, internalMargin, leftLegendWidth, rightLabelWidth } =\n useInternalMargins({\n axisLeftRef,\n axisBottomRef,\n axisRightRef,\n leftLabel,\n leftLegend,\n rightLegend,\n topLegend,\n bottomLegend,\n rightLabel,\n bottomLabel,\n });\n const innerWidth = useMemo(\n () => width - internalMargin.left - internalMargin.right,\n [internalMargin.left, internalMargin.right, width],\n );\n const innerHeight = useMemo(\n () => height - internalMargin.top - internalMargin.bottom,\n [internalMargin.top, internalMargin.bottom, height],\n );\n\n const [currentData, setCurrentData] = useState(() =>\n series.map((d, i) => ({\n ...d,\n originalData: d,\n key: `${d.name}-${i}`,\n data: d.data\n .map((value, index) => ({\n key: `${d.name}-${i}-${index}`,\n value,\n position: index,\n }))\n .filter((datum) => datum.value !== null),\n })),\n );\n const stackedData = useMemo(() => stackData(groupsStacked, currentData), [groupsStacked, currentData]);\n // @TODO we need to create a logic to get this from both axis\n const containerRatio = (props?.xAxis.advanced?.pointSpacing?.value as number) ?? 1;\n\n const groups = useMemo(() => currentData.map((serie) => serie.name), [currentData]);\n\n const visibleGroups = useMemo(\n () => currentData.filter((serie) => !serie.isHidden).map((serie) => serie.name),\n [currentData],\n );\n\n const { xScale, yScale, y2Scale, subGroupScale, colorScale, getBandwidth } = useScales({\n props,\n innerHeight,\n innerWidth,\n groups,\n stackedData,\n currentData,\n containerRatio,\n });\n\n const isHorizontal = useMemo(() => !!yScale.bandwidth, [yScale]);\n\n const getXValue = useCallback(\n (datum) =>\n !isHorizontal ? xAxis?.cols?.[datum.position] ?? datum.value.x ?? datum.position : datum.value.x ?? datum.value,\n [isHorizontal, xAxis?.cols],\n );\n\n const getYValue = useCallback(\n (datum) =>\n !isHorizontal ? datum.value?.y ?? datum.value : yAxis?.cols?.[datum.position] ?? datum.value.x ?? datum.position,\n [isHorizontal, yAxis?.cols],\n );\n\n const chartId = useMemo(() => uuidv4(), []);\n\n return useMemo(\n () => ({\n props: { ...props, data: currentData },\n innerHeight,\n innerWidth,\n // @todo change this to series and visible series\n groups,\n visibleGroups,\n colorScale,\n stackedData,\n subGroupScale,\n svgRef,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n setScrapperPosY,\n scrapperPosX,\n setScrapperPosX,\n activePoint,\n setActivePoint,\n activeSerie,\n setActiveSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n setStartPosition,\n isScrollbarVisible,\n setIsScrollbarVisible,\n oldLastPosition,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n setAxisLeftRef,\n setLeftLegend,\n setRightLegend,\n rightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomRef,\n axisBottomHeight,\n setAxisRightRef,\n setRightLabel,\n setBottomLabel,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n setCurrentData,\n setLeftLabel,\n leftLabel,\n chartId,\n }),\n [\n props,\n currentData,\n innerHeight,\n innerWidth,\n groups,\n visibleGroups,\n colorScale,\n stackedData,\n subGroupScale,\n scrapperPosX,\n setScrapperPosX,\n xScale,\n yScale,\n y2Scale,\n getBandwidth,\n scrapperPosY,\n activePoint,\n activeSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n setStartPosition,\n rightLabelWidth,\n rightLegend,\n bottomLabelHeight,\n isScrollbarVisible,\n setIsScrollbarVisible,\n oldLastPosition,\n containerRatio,\n internalMargin,\n axisBottomHeight,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n setAxisLeftRef,\n setLeftLegend,\n setRightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomRef,\n setAxisRightRef,\n setRightLabel,\n setBottomLabel,\n getXValue,\n getYValue,\n isHorizontal,\n setCurrentData,\n axisRightWidth,\n setLeftLabel,\n leftLabel,\n chartId,\n ],\n );\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -0,0 +1,77 @@
1
+ import * as React from "react";
2
+ import { useMemo } from "react";
3
+ const useInternalMargins = ({
4
+ axisLeftRef,
5
+ axisBottomRef,
6
+ axisRightRef,
7
+ leftLabel,
8
+ leftLegend,
9
+ rightLegend,
10
+ topLegend,
11
+ bottomLegend,
12
+ rightLabel,
13
+ bottomLabel
14
+ }) => {
15
+ const axisLeftWidth = useMemo(() => axisLeftRef?.getBoundingClientRect()?.width || 0, [axisLeftRef]);
16
+ const axisBottomHeight = useMemo(() => axisBottomRef?.getBoundingClientRect()?.height || 0, [axisBottomRef]);
17
+ const axisRightWidth = useMemo(() => axisRightRef?.getBoundingClientRect()?.width || 0, [axisRightRef]);
18
+ const bottomLabelHeight = useMemo(() => bottomLabel?.getBoundingClientRect()?.height || 0, [bottomLabel]);
19
+ const rightLabelWidth = useMemo(() => rightLabel?.getBoundingClientRect()?.width || 0, [rightLabel]);
20
+ const leftLabelWidth = useMemo(() => leftLabel?.getBoundingClientRect()?.width || 0, [leftLabel]);
21
+ const topLegendHeight = useMemo(() => topLegend?.getBoundingClientRect()?.height || 0, [topLegend]);
22
+ const bottomLegendHeight = useMemo(() => bottomLegend?.getBoundingClientRect()?.height || 0, [bottomLegend]);
23
+ const rightLegendWidth = useMemo(() => rightLegend?.getBoundingClientRect()?.width || 0, [rightLegend]);
24
+ const leftLegendWidth = useMemo(() => leftLegend?.getBoundingClientRect()?.width || 0, [leftLegend]);
25
+ const internalMargin = useMemo(
26
+ () => ({
27
+ bottom: 10 + axisBottomHeight + bottomLegendHeight + bottomLabelHeight,
28
+ top: 10 + topLegendHeight,
29
+ right: 10 + rightLabelWidth + axisRightWidth + rightLegendWidth,
30
+ left: 10 + axisLeftWidth + leftLabelWidth + leftLegendWidth
31
+ }),
32
+ [
33
+ axisBottomHeight,
34
+ bottomLegendHeight,
35
+ bottomLabelHeight,
36
+ topLegendHeight,
37
+ rightLabelWidth,
38
+ axisRightWidth,
39
+ rightLegendWidth,
40
+ axisLeftWidth,
41
+ leftLabelWidth,
42
+ leftLegendWidth
43
+ ]
44
+ );
45
+ return useMemo(
46
+ () => ({
47
+ internalMargin,
48
+ leftLegendWidth,
49
+ axisBottomHeight,
50
+ bottomLegendHeight,
51
+ bottomLabelHeight,
52
+ topLegendHeight,
53
+ rightLabelWidth,
54
+ axisRightWidth,
55
+ rightLegendWidth,
56
+ axisLeftWidth,
57
+ leftLabelWidth
58
+ }),
59
+ [
60
+ axisBottomHeight,
61
+ axisLeftWidth,
62
+ axisRightWidth,
63
+ bottomLabelHeight,
64
+ bottomLegendHeight,
65
+ internalMargin,
66
+ leftLabelWidth,
67
+ leftLegendWidth,
68
+ rightLabelWidth,
69
+ rightLegendWidth,
70
+ topLegendHeight
71
+ ]
72
+ );
73
+ };
74
+ export {
75
+ useInternalMargins
76
+ };
77
+ //# sourceMappingURL=useInternalMargins.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/config/useInternalMargins.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo } from 'react';\n\ninterface UseInternalMarginsT {\n axisLeftRef?: Element;\n axisBottomRef?: Element;\n axisRightRef?: Element;\n leftLegend?: Element;\n leftLabel?: Element;\n rightLegend?: Element;\n topLegend?: Element;\n bottomLegend?: Element;\n rightLabel?: Element;\n bottomLabel?: Element;\n}\nexport const useInternalMargins = ({\n axisLeftRef,\n axisBottomRef,\n axisRightRef,\n leftLabel,\n leftLegend,\n rightLegend,\n topLegend,\n bottomLegend,\n rightLabel,\n bottomLabel,\n}: UseInternalMarginsT) => {\n // Axis\n const axisLeftWidth = useMemo(() => axisLeftRef?.getBoundingClientRect()?.width || 0, [axisLeftRef]);\n const axisBottomHeight = useMemo(() => axisBottomRef?.getBoundingClientRect()?.height || 0, [axisBottomRef]);\n const axisRightWidth = useMemo(() => axisRightRef?.getBoundingClientRect()?.width || 0, [axisRightRef]);\n\n // Labels\n const bottomLabelHeight = useMemo(() => bottomLabel?.getBoundingClientRect()?.height || 0, [bottomLabel]);\n const rightLabelWidth = useMemo(() => rightLabel?.getBoundingClientRect()?.width || 0, [rightLabel]);\n const leftLabelWidth = useMemo(() => leftLabel?.getBoundingClientRect()?.width || 0, [leftLabel]);\n\n // Legends\n const topLegendHeight = useMemo(() => topLegend?.getBoundingClientRect()?.height || 0, [topLegend]);\n const bottomLegendHeight = useMemo(() => bottomLegend?.getBoundingClientRect()?.height || 0, [bottomLegend]);\n const rightLegendWidth = useMemo(() => rightLegend?.getBoundingClientRect()?.width || 0, [rightLegend]);\n const leftLegendWidth = useMemo(() => leftLegend?.getBoundingClientRect()?.width || 0, [leftLegend]);\n // @todo create a useInternalMargin\n const internalMargin = useMemo(\n () => ({\n bottom: 10 + axisBottomHeight + bottomLegendHeight + bottomLabelHeight,\n top: 10 + topLegendHeight,\n right: 10 + rightLabelWidth + axisRightWidth + rightLegendWidth,\n left: 10 + axisLeftWidth + leftLabelWidth + leftLegendWidth,\n }),\n\n [\n axisBottomHeight,\n bottomLegendHeight,\n bottomLabelHeight,\n topLegendHeight,\n rightLabelWidth,\n axisRightWidth,\n rightLegendWidth,\n axisLeftWidth,\n leftLabelWidth,\n leftLegendWidth,\n ],\n );\n\n return useMemo(\n () => ({\n internalMargin,\n leftLegendWidth,\n axisBottomHeight,\n bottomLegendHeight,\n bottomLabelHeight,\n topLegendHeight,\n rightLabelWidth,\n axisRightWidth,\n rightLegendWidth,\n axisLeftWidth,\n leftLabelWidth,\n }),\n [\n axisBottomHeight,\n axisLeftWidth,\n axisRightWidth,\n bottomLabelHeight,\n bottomLegendHeight,\n internalMargin,\n leftLabelWidth,\n leftLegendWidth,\n rightLabelWidth,\n rightLegendWidth,\n topLegendHeight,\n ],\n );\n};\n\n// const [axisLeftRef, setAxisLeftRef] = useState<Element>();\n// const [axisBottomRef, setAxisBottomRef] = useState<Element>();\n// const [axisRightRef, setAxisRightRef] = useState<Element>();\n\n// const [leftLegend, setLeftLegend] = useState<Element>();\n// const [rightLegend, setRightLegend] = useState<Element>();\n// const [topLegend, setTopLegend] = useState<Element>();\n// const [bottomLegend, setBottomLegend] = useState<Element>();\n\n// const [rightLabel, setRightLabel] = useState<Element>();\n// const [leftLabel, setLeftLabel] = useState<Element>();\n// const [bottomLabel, setBottomLabel] = useState<Element>();\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,eAAe;AAcjB,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA2B;AAEzB,QAAM,gBAAgB,QAAQ,MAAM,aAAa,sBAAsB,GAAG,SAAS,GAAG,CAAC,WAAW,CAAC;AACnG,QAAM,mBAAmB,QAAQ,MAAM,eAAe,sBAAsB,GAAG,UAAU,GAAG,CAAC,aAAa,CAAC;AAC3G,QAAM,iBAAiB,QAAQ,MAAM,cAAc,sBAAsB,GAAG,SAAS,GAAG,CAAC,YAAY,CAAC;AAGtG,QAAM,oBAAoB,QAAQ,MAAM,aAAa,sBAAsB,GAAG,UAAU,GAAG,CAAC,WAAW,CAAC;AACxG,QAAM,kBAAkB,QAAQ,MAAM,YAAY,sBAAsB,GAAG,SAAS,GAAG,CAAC,UAAU,CAAC;AACnG,QAAM,iBAAiB,QAAQ,MAAM,WAAW,sBAAsB,GAAG,SAAS,GAAG,CAAC,SAAS,CAAC;AAGhG,QAAM,kBAAkB,QAAQ,MAAM,WAAW,sBAAsB,GAAG,UAAU,GAAG,CAAC,SAAS,CAAC;AAClG,QAAM,qBAAqB,QAAQ,MAAM,cAAc,sBAAsB,GAAG,UAAU,GAAG,CAAC,YAAY,CAAC;AAC3G,QAAM,mBAAmB,QAAQ,MAAM,aAAa,sBAAsB,GAAG,SAAS,GAAG,CAAC,WAAW,CAAC;AACtG,QAAM,kBAAkB,QAAQ,MAAM,YAAY,sBAAsB,GAAG,SAAS,GAAG,CAAC,UAAU,CAAC;AAEnG,QAAM,iBAAiB;AAAA,IACrB,OAAO;AAAA,MACL,QAAQ,KAAK,mBAAmB,qBAAqB;AAAA,MACrD,KAAK,KAAK;AAAA,MACV,OAAO,KAAK,kBAAkB,iBAAiB;AAAA,MAC/C,MAAM,KAAK,gBAAgB,iBAAiB;AAAA,IAC9C;AAAA,IAEA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;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,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
+ "names": []
7
+ }
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- import { useCallback, useContext, useMemo, useState } from "react";
2
+ import { useCallback, useContext, useEffect, useMemo, useState } from "react";
3
3
  import { ChartContext } from "../ChartContext";
4
4
  const findInCircularList = (list, from, step = 1) => {
5
5
  for (let i = (from + step + list.length) % list.length; i !== from && from > -1; i = (i + step + list.length) % list.length) {
@@ -13,25 +13,29 @@ const useKeyboardNavigation = () => {
13
13
  activePoint,
14
14
  setActivePoint,
15
15
  containerRef,
16
- groups,
16
+ visibleGroups,
17
17
  yScale,
18
18
  xScale,
19
19
  setXScrollbarPosition,
20
20
  containerRatio,
21
21
  xScrollbarPosition,
22
22
  innerWidth,
23
+ getXValue,
23
24
  props: { data, xAxis }
24
25
  } = useContext(ChartContext);
25
- const [currentFocusedDataset, setCurrentFocusedDataset] = useState(groups[0]);
26
+ const [currentFocusedDataset, setCurrentFocusedDataset] = useState(visibleGroups[0]);
27
+ useEffect(() => {
28
+ setCurrentFocusedDataset(visibleGroups[0]);
29
+ }, [visibleGroups]);
26
30
  const currentGroup = useMemo(() => data.find((d) => d.name === currentFocusedDataset), [currentFocusedDataset, data]);
27
31
  const currentItemIndex = useMemo(
28
- () => currentGroup.data.findIndex((opt) => opt.key === activePoint),
32
+ () => currentGroup.data.findIndex((opt) => opt.key === activePoint?.key),
29
33
  [activePoint, currentGroup]
30
34
  );
31
35
  const handleOnFocus = useCallback(
32
36
  (e) => {
33
37
  if (containerRef?.current === e.target) {
34
- setActivePoint(currentGroup.data[0].key);
38
+ setActivePoint(currentGroup.data[0]);
35
39
  setXScrollbarPosition(0);
36
40
  }
37
41
  },
@@ -40,7 +44,7 @@ const useKeyboardNavigation = () => {
40
44
  const handleOnBlur = useCallback(() => {
41
45
  setTimeout(() => {
42
46
  if (!containerRef?.current?.contains(document.activeElement) || containerRef?.current === document.activeElement) {
43
- setActivePoint("");
47
+ setActivePoint(null);
44
48
  }
45
49
  });
46
50
  }, [containerRef, setActivePoint]);
@@ -51,14 +55,20 @@ const useKeyboardNavigation = () => {
51
55
  currentItemIndex,
52
56
  step
53
57
  );
54
- setActivePoint(currentGroup.data[newValue].key);
58
+ setActivePoint(currentGroup.data[newValue]);
55
59
  if (containerRatio > 1) {
56
- const xValue = xScale(xAxis.cols[currentGroup.data[newValue].position]);
60
+ const xValue = xScale(getXValue(currentGroup.data[newValue]));
61
+ const barWidth = innerWidth / containerRatio;
57
62
  const total = innerWidth * containerRatio;
58
63
  if (total <= xValue) {
59
64
  setXScrollbarPosition((total - innerWidth) / containerRatio);
60
65
  } else if (xValue > xScrollbarPosition * containerRatio + innerWidth)
61
- setXScrollbarPosition((prev) => prev + 10);
66
+ setXScrollbarPosition((prev) => {
67
+ const nextPosition = prev + (xValue / containerRatio - prev);
68
+ if (nextPosition + barWidth > innerWidth)
69
+ return innerWidth - barWidth;
70
+ return nextPosition;
71
+ });
62
72
  else if (xValue < xScrollbarPosition * containerRatio)
63
73
  setXScrollbarPosition(xValue / containerRatio);
64
74
  }
@@ -67,10 +77,10 @@ const useKeyboardNavigation = () => {
67
77
  containerRatio,
68
78
  currentGroup.data,
69
79
  currentItemIndex,
80
+ getXValue,
70
81
  innerWidth,
71
82
  setActivePoint,
72
83
  setXScrollbarPosition,
73
- xAxis.cols,
74
84
  xScale,
75
85
  xScrollbarPosition
76
86
  ]
@@ -79,16 +89,16 @@ const useKeyboardNavigation = () => {
79
89
  (step) => {
80
90
  setCurrentFocusedDataset((prev) => {
81
91
  const nextGroup = findInCircularList(
82
- groups,
83
- groups.findIndex((item) => item === prev),
92
+ visibleGroups,
93
+ visibleGroups.findIndex((item) => item === prev),
84
94
  step
85
95
  );
86
- const nextGroupData = data.find((d) => d.name === groups[nextGroup]);
87
- setActivePoint(nextGroupData.data[currentItemIndex].key);
88
- return groups[nextGroup];
96
+ const nextGroupData = data.find((d) => d.name === visibleGroups[nextGroup]);
97
+ setActivePoint(nextGroupData.data[currentItemIndex] ?? nextGroupData.data[0]);
98
+ return visibleGroups[nextGroup];
89
99
  });
90
100
  },
91
- [currentItemIndex, data, setActivePoint, groups]
101
+ [currentItemIndex, data, setActivePoint, visibleGroups]
92
102
  );
93
103
  const onInputKeyDown = useCallback(
94
104
  (e) => {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/config/useKeyboardNavigation.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useContext, useMemo, useState } from 'react';\nimport { ChartContext } from '../ChartContext';\n\nexport const findInCircularList = (\n list,\n from: number,\n //criteria: (item) => boolean,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i]) return i;\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const {\n activePoint,\n setActivePoint,\n containerRef,\n groups,\n yScale,\n xScale,\n setXScrollbarPosition,\n containerRatio,\n xScrollbarPosition,\n innerWidth,\n props: { data, xAxis },\n } = useContext(ChartContext);\n\n const [currentFocusedDataset, setCurrentFocusedDataset] = useState(groups[0]);\n\n const currentGroup = useMemo(() => data.find((d) => d.name === currentFocusedDataset), [currentFocusedDataset, data]);\n\n const currentItemIndex = useMemo(\n () => currentGroup.data.findIndex((opt) => opt.key === activePoint),\n [activePoint, currentGroup],\n );\n\n const handleOnFocus: React.FocusEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (containerRef?.current === e.target) {\n setActivePoint(currentGroup.data[0].key);\n setXScrollbarPosition(0);\n }\n },\n [containerRef, currentGroup.data, setActivePoint, setXScrollbarPosition],\n );\n\n const handleOnBlur: React.FocusEventHandler<HTMLInputElement> = useCallback(() => {\n setTimeout(() => {\n if (\n !containerRef?.current?.contains(document.activeElement) ||\n containerRef?.current === document.activeElement\n ) {\n setActivePoint('');\n }\n });\n }, [containerRef, setActivePoint]);\n\n const navigateSerie = useCallback(\n (step: number) => {\n const newValue = findInCircularList(\n currentGroup.data.map((d) => d.value.toString()),\n currentItemIndex,\n step,\n );\n setActivePoint(currentGroup.data[newValue].key);\n if (containerRatio > 1) {\n const xValue = xScale(xAxis.cols[currentGroup.data[newValue].position]);\n\n const total = innerWidth * containerRatio;\n if (total <= xValue) {\n setXScrollbarPosition((total - innerWidth) / containerRatio);\n } else if (xValue > xScrollbarPosition * containerRatio + innerWidth)\n setXScrollbarPosition((prev) => prev + 10);\n else if (xValue < xScrollbarPosition * containerRatio) setXScrollbarPosition(xValue / containerRatio);\n }\n },\n [\n containerRatio,\n currentGroup.data,\n currentItemIndex,\n innerWidth,\n setActivePoint,\n setXScrollbarPosition,\n xAxis.cols,\n xScale,\n xScrollbarPosition,\n ],\n );\n\n const changeSerie = useCallback(\n (step: number) => {\n setCurrentFocusedDataset((prev) => {\n const nextGroup = findInCircularList(\n groups,\n groups.findIndex((item) => item === prev),\n step,\n );\n const nextGroupData = data.find((d) => d.name === groups[nextGroup]);\n setActivePoint(nextGroupData.data[currentItemIndex].key);\n return groups[nextGroup];\n });\n },\n [currentItemIndex, data, setActivePoint, groups],\n );\n\n const onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n if (e.code !== 'Tab') {\n e.preventDefault();\n }\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n if (yScale.bandwidth) changeSerie(e.code === 'ArrowLeft' ? -1 : 1);\n else navigateSerie(e.code === 'ArrowLeft' ? -1 : 1);\n }\n\n if (['ArrowDown', 'ArrowUp'].includes(e.code)) {\n if (yScale.bandwidth) navigateSerie(e.code === 'ArrowDown' ? -1 : 1);\n else changeSerie(e.code === 'ArrowDown' ? -1 : 1);\n }\n },\n [changeSerie, navigateSerie, yScale.bandwidth],\n );\n\n return useMemo(\n () => ({ onInputKeyDown, handleOnBlur, handleOnFocus }),\n [handleOnBlur, handleOnFocus, onInputKeyDown],\n );\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useContext, useEffect, useMemo, useState } from 'react';\nimport { ChartContext } from '../ChartContext';\n\nexport const findInCircularList = (\n list,\n from: number,\n //criteria: (item) => boolean,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i]) return i;\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const {\n activePoint,\n setActivePoint,\n containerRef,\n visibleGroups,\n yScale,\n xScale,\n setXScrollbarPosition,\n containerRatio,\n xScrollbarPosition,\n innerWidth,\n getXValue,\n props: { data, xAxis },\n } = useContext(ChartContext);\n\n const [currentFocusedDataset, setCurrentFocusedDataset] = useState(visibleGroups[0]);\n\n useEffect(() => {\n setCurrentFocusedDataset(visibleGroups[0]);\n }, [visibleGroups]);\n\n const currentGroup = useMemo(() => data.find((d) => d.name === currentFocusedDataset), [currentFocusedDataset, data]);\n\n const currentItemIndex = useMemo(\n () => currentGroup.data.findIndex((opt) => opt.key === activePoint?.key),\n [activePoint, currentGroup],\n );\n\n const handleOnFocus: React.FocusEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (containerRef?.current === e.target) {\n setActivePoint(currentGroup.data[0]);\n setXScrollbarPosition(0);\n }\n },\n [containerRef, currentGroup.data, setActivePoint, setXScrollbarPosition],\n );\n\n const handleOnBlur: React.FocusEventHandler<HTMLInputElement> = useCallback(() => {\n setTimeout(() => {\n if (\n !containerRef?.current?.contains(document.activeElement) ||\n containerRef?.current === document.activeElement\n ) {\n setActivePoint(null);\n }\n });\n }, [containerRef, setActivePoint]);\n\n const navigateSerie = useCallback(\n (step: number) => {\n const newValue = findInCircularList(\n currentGroup.data.map((d) => d.value.toString()),\n currentItemIndex,\n step,\n );\n setActivePoint(currentGroup.data[newValue]);\n if (containerRatio > 1) {\n const xValue = xScale(getXValue(currentGroup.data[newValue]));\n const barWidth = innerWidth / containerRatio;\n const total = innerWidth * containerRatio;\n if (total <= xValue) {\n // to go from the first to last\n setXScrollbarPosition((total - innerWidth) / containerRatio);\n } else if (xValue > xScrollbarPosition * containerRatio + innerWidth)\n // if is not visible we move the scroll to the next best position\n setXScrollbarPosition((prev) => {\n const nextPosition = prev + (xValue / containerRatio - prev);\n if (nextPosition + barWidth > innerWidth) return innerWidth - barWidth;\n return nextPosition;\n });\n // move backwards\n else if (xValue < xScrollbarPosition * containerRatio) setXScrollbarPosition(xValue / containerRatio);\n }\n },\n [\n containerRatio,\n currentGroup.data,\n currentItemIndex,\n getXValue,\n innerWidth,\n setActivePoint,\n setXScrollbarPosition,\n xScale,\n xScrollbarPosition,\n ],\n );\n\n const changeSerie = useCallback(\n (step: number) => {\n setCurrentFocusedDataset((prev) => {\n const nextGroup = findInCircularList(\n visibleGroups,\n visibleGroups.findIndex((item) => item === prev),\n step,\n );\n const nextGroupData = data.find((d) => d.name === visibleGroups[nextGroup]);\n setActivePoint(nextGroupData.data[currentItemIndex] ?? nextGroupData.data[0]);\n return visibleGroups[nextGroup];\n });\n },\n [currentItemIndex, data, setActivePoint, visibleGroups],\n );\n\n const onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n if (e.code !== 'Tab') {\n e.preventDefault();\n }\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n if (yScale.bandwidth) changeSerie(e.code === 'ArrowLeft' ? -1 : 1);\n else navigateSerie(e.code === 'ArrowLeft' ? -1 : 1);\n }\n\n if (['ArrowDown', 'ArrowUp'].includes(e.code)) {\n if (yScale.bandwidth) navigateSerie(e.code === 'ArrowDown' ? -1 : 1);\n else changeSerie(e.code === 'ArrowDown' ? -1 : 1);\n }\n },\n [changeSerie, navigateSerie, yScale.bandwidth],\n );\n\n return useMemo(\n () => ({ onInputKeyDown, handleOnBlur, handleOnFocus }),\n [handleOnBlur, handleOnFocus, onInputKeyDown],\n );\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -1,6 +1,6 @@
1
1
  import * as React from "react";
2
2
  import { useMemo, useCallback } from "react";
3
- import { max, min, scaleLinear, scaleBand, scaleTime, scaleOrdinal, scaleLog } from "d3";
3
+ import { max, min, scaleLinear, scaleBand, scaleUtc, scaleOrdinal, scaleLog } from "d3";
4
4
  import { getStackedIndex } from "../helpers";
5
5
  import { COLOR_PALLET } from "../helpers/colorPallet";
6
6
  const useScales = ({
@@ -18,37 +18,54 @@ const useScales = ({
18
18
  const getLinearDomain = useCallback(
19
19
  (axis, axisString, withStackData = true) => {
20
20
  const begin = axis?.beginAtZero ? 0 : void 0;
21
- const data = series.filter((serie) => {
22
- if (serie.scale === "y2") {
23
- return serie.scale === axisString;
21
+ const data = currentData.filter((serie) => {
22
+ if (serie.isHidden)
23
+ return false;
24
+ if (serie.scale === axisString) {
25
+ return true;
24
26
  }
25
- return true;
27
+ if (!serie.scale && ["y", "x"].includes(axisString)) {
28
+ return true;
29
+ }
30
+ return false;
26
31
  }).map(
27
- (serie) => typeof serie.data[0] === "number" ? serie.data : serie.data.map((coord) => coord[axisString])
32
+ (serie) => serie.data.filter((datum) => datum.value).map((datum) => {
33
+ if (typeof datum.value === "number") {
34
+ return datum.value;
35
+ }
36
+ return datum.value[axisString];
37
+ })
28
38
  );
29
39
  const stack = withStackData && [
30
40
  min(stackedData.flat(), (layer) => min(layer, (sequence) => sequence[1])),
31
41
  max(stackedData.flat(), (layer) => max(layer, (sequence) => sequence[1]))
32
42
  ];
33
43
  const minRange = min([begin, min(data.flat()), stack[0]]);
34
- const maxRange = max([max(data.flat()), stack[1]]);
35
- return [minRange, maxRange];
44
+ const maxRange = max([begin, max(data.flat()), stack[1]]);
45
+ const [leftPadding, rightPadding] = typeof axis.domainPadding === "number" ? [axis.domainPadding, axis.domainPadding] : axis.domainPadding ?? [0, 0];
46
+ if (axis.type === "time") {
47
+ return [minRange, maxRange];
48
+ }
49
+ return [
50
+ minRange - (maxRange - minRange) * (leftPadding ?? 0),
51
+ maxRange + (maxRange - minRange) * (rightPadding ?? 0)
52
+ ];
36
53
  },
37
- [series, stackedData]
54
+ [currentData, stackedData]
38
55
  );
39
- const getScaleTime = (domain, range) => scaleTime().domain([min(domain) ?? 0, max(domain) ?? 0]).range(range);
56
+ const getScaleTime = (domain, range) => scaleUtc().domain(domain).range(range);
40
57
  const getScaleBand = (domain, range, padding = 0.2) => scaleBand().domain(domain).range(range).padding(padding).paddingOuter(0.1);
41
58
  const getScaleLinear = (domain, range) => scaleLinear().domain(domain).range(range);
42
59
  const getScaleLog = (domain, range) => scaleLog().domain(domain).range(range);
43
60
  const xScale = useMemo(() => {
44
61
  if (xAxis?.type === "time")
45
- return getScaleTime(xAxis.cols, [0, rangeTo]);
62
+ return getScaleTime(getLinearDomain(xAxis, "x", false), [0, rangeTo]);
46
63
  if (xAxis?.type === "linear" || yAxis?.type === "band") {
47
64
  const withStackData = yAxis?.type === "band";
48
65
  return getScaleLinear(getLinearDomain(xAxis, "x", withStackData), [0, rangeTo], xAxis.padding);
49
66
  }
50
- return getScaleBand(getBandDomain(xAxis), [0, innerWidth], xAxis.padding);
51
- }, [getBandDomain, getLinearDomain, innerWidth, rangeTo, xAxis, yAxis?.type]);
67
+ return getScaleBand(getBandDomain(xAxis), [0, rangeTo], xAxis.padding);
68
+ }, [getBandDomain, getLinearDomain, rangeTo, xAxis, yAxis?.type]);
52
69
  const yScale = useMemo(() => {
53
70
  if (yAxis?.type === "band")
54
71
  return getScaleBand(getBandDomain(yAxis), [innerHeight, 0], yAxis.padding);
@@ -65,10 +82,16 @@ const useScales = ({
65
82
  return getScaleLog(getLinearDomain(y2Axis, "y2"), [innerHeight, 0]);
66
83
  return getScaleLinear(getLinearDomain(y2Axis, "y2"), [innerHeight, 0]);
67
84
  }, [getBandDomain, getLinearDomain, innerHeight, y2Axis]);
68
- const colorScale = scaleOrdinal().domain(groups).range(currentData.map((d) => COLOR_PALLET[d.color] ?? d.color));
69
- const subgroupsWithBars = currentData.filter(
70
- (serie) => serie.type === "bar" && !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1)
71
- ).map((serie) => serie.name);
85
+ const colorScale = useMemo(
86
+ () => scaleOrdinal().domain(groups).range(currentData.map((d) => COLOR_PALLET[d.color] ?? d.color)),
87
+ [currentData, groups]
88
+ );
89
+ const subgroupsWithBars = useMemo(
90
+ () => currentData.filter(
91
+ (serie) => serie.type === "bar" && !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1) && !serie.isHidden
92
+ ).map((serie) => serie.name),
93
+ [currentData, stackedSeries]
94
+ );
72
95
  const getBandwidth = useCallback(() => {
73
96
  if (xScale.bandwidth)
74
97
  return xScale.bandwidth();
@@ -79,7 +102,10 @@ const useScales = ({
79
102
  if (stackedSeries?.length) {
80
103
  stackedSeries.forEach((_, i) => subgroupsWithBars.push(`stacked-data-${i}`));
81
104
  }
82
- const subGroupScale = getBandwidth() ? scaleBand().domain(subgroupsWithBars).range([0, getBandwidth() ?? 0]).paddingInner(0.55).padding(0.2) : null;
105
+ const subGroupScale = useMemo(
106
+ () => getBandwidth() ? scaleBand().domain(subgroupsWithBars).range([0, getBandwidth() ?? 0]).paddingInner(0.55).padding(0.2) : null,
107
+ [getBandwidth, subgroupsWithBars]
108
+ );
83
109
  return { xScale, y2Scale, yScale, subGroupScale, colorScale, getBandwidth };
84
110
  };
85
111
  export {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/config/useScales.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useCallback } from 'react';\nimport { max, min, scaleLinear, scaleBand, scaleTime, scaleOrdinal, scaleLog, Series, ScaleBand } from 'd3';\nimport { DSChartT } from '../react-desc-prop-types';\nimport { getStackedIndex } from '../helpers';\nimport { COLOR_PALLET } from '../helpers/colorPallet';\ninterface UseScales {\n props: DSChartT.Props;\n innerHeight: number;\n innerWidth: number;\n stackedData: Series<\n {\n [key: string]: number;\n },\n string\n >[][];\n currentData: {\n key: string;\n group: string;\n type: DSChartT.SerieTypeT;\n scale?: string;\n color: string;\n data: {\n key: string;\n value: number | { x: number; y: number };\n position: number;\n }[];\n }[];\n groups: string[];\n}\nexport const useScales = ({\n props,\n innerHeight,\n innerWidth,\n stackedData,\n currentData,\n groups,\n containerRatio,\n}: UseScales) => {\n const { series, xAxis, yAxis, y2Axis, groups: stackedSeries, types } = props;\n\n const rangeTo = innerWidth * (containerRatio ?? 1);\n const getBandDomain = useCallback((axis: DSChartT.AxisT) => axis.cols ?? [...series[0].data.keys()], [series]);\n\n const getLinearDomain = useCallback(\n (axis?: DSChartT.AxisT, axisString?: string, withStackData = true) => {\n // const data2 = data ? extent(data) : [];\n const begin = axis?.beginAtZero ? 0 : undefined;\n const data = series\n .filter((serie) => {\n if (serie.scale === 'y2') {\n return serie.scale === axisString;\n }\n return true;\n })\n .map((serie) =>\n typeof serie.data[0] === 'number' ? serie.data : serie.data.map((coord) => coord[axisString]),\n );\n\n const stack = withStackData && [\n min(stackedData.flat(), (layer) => min(layer, (sequence) => sequence[1])),\n max(stackedData.flat(), (layer) => max(layer, (sequence) => sequence[1])),\n ];\n const minRange = min([begin, min(data.flat()), stack[0]]);\n const maxRange = max([max(data.flat()), stack[1]]);\n // @TODO altering the domain to get padding right and left on axis\n // we set a pad on the x axis, we can create a prop to set this constant\n // return [\n // minRange - (axisString === 'x' ? (maxRange - minRange) * 0.05 : 0),\n // maxRange + (axisString === 'x' ? (maxRange - minRange) * 0.05 : 0),\n // ];\n return [minRange, maxRange];\n },\n [series, stackedData],\n );\n\n const getScaleTime = (domain: Date[], range: number[]) =>\n scaleTime()\n .domain([min(domain) ?? 0, max(domain) ?? 0])\n .range(range);\n\n const getScaleBand = (domain: string[], range: number[], padding = 0.2) =>\n scaleBand().domain(domain).range(range).padding(padding).paddingOuter(0.1);\n const getScaleLinear = (domain: number[], range: number[]) => scaleLinear().domain(domain).range(range);\n const getScaleLog = (domain: number[], range: number[]) => scaleLog().domain(domain).range(range);\n\n const xScale = useMemo(() => {\n if (xAxis?.type === 'time') return getScaleTime(xAxis.cols as Date[], [0, rangeTo]);\n if (xAxis?.type === 'linear' || yAxis?.type === 'band') {\n // @TODO is this really a thing ?\n const withStackData = yAxis?.type === 'band';\n return getScaleLinear(getLinearDomain(xAxis, 'x', withStackData) as number[], [0, rangeTo], xAxis.padding);\n }\n\n return getScaleBand(getBandDomain(xAxis) as string[], [0, innerWidth], xAxis.padding);\n }, [getBandDomain, getLinearDomain, innerWidth, rangeTo, xAxis, yAxis?.type]);\n\n const yScale = useMemo(() => {\n if (yAxis?.type === 'band') return getScaleBand(getBandDomain(yAxis), [innerHeight, 0], yAxis.padding);\n if (yAxis?.type === 'log') return getScaleLog(getLinearDomain(yAxis, 'y'), [innerHeight, 0]);\n return getScaleLinear(getLinearDomain(yAxis, 'y'), [innerHeight, 0]);\n }, [getBandDomain, getLinearDomain, innerHeight, yAxis]);\n\n const y2Scale = useMemo(() => {\n if (!y2Axis) return null;\n if (y2Axis?.type === 'band') return getScaleBand(getBandDomain(y2Axis), [innerHeight, 0], y2Scale.padding);\n if (y2Axis?.type === 'log') return getScaleLog(getLinearDomain(y2Axis, 'y2'), [innerHeight, 0]);\n return getScaleLinear(getLinearDomain(y2Axis, 'y2'), [innerHeight, 0]);\n }, [getBandDomain, getLinearDomain, innerHeight, y2Axis]);\n\n const colorScale = scaleOrdinal()\n .domain(groups)\n .range(currentData.map((d) => COLOR_PALLET[d.color] ?? d.color));\n // get only groups bars to calculate the subgroup scale\n\n const subgroupsWithBars = currentData\n .filter(\n (serie) => serie.type === 'bar' && !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1),\n )\n .map((serie) => serie.name);\n\n const getBandwidth = useCallback(() => {\n if ((xScale as ScaleBand<string>).bandwidth) return (xScale as ScaleBand<string>).bandwidth();\n if ((yScale as ScaleBand<string>).bandwidth) return (yScale as ScaleBand<string>).bandwidth();\n return innerWidth / xScale.ticks().length / 2;\n }, [innerWidth, xScale, yScale]);\n\n if (stackedSeries?.length) {\n stackedSeries.forEach((_, i) => subgroupsWithBars.push(`stacked-data-${i}`));\n }\n\n const subGroupScale = getBandwidth()\n ? scaleBand()\n .domain(subgroupsWithBars)\n .range([0, getBandwidth() ?? 0])\n .paddingInner(0.55)\n .padding(0.2)\n : null;\n\n return { xScale, y2Scale, yScale, subGroupScale, colorScale, getBandwidth };\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useCallback } from 'react';\nimport { max, min, scaleLinear, scaleBand, scaleUtc, scaleOrdinal, scaleLog, Series, ScaleBand } from 'd3';\nimport { DSChartT } from '../react-desc-prop-types';\nimport { getStackedIndex } from '../helpers';\nimport { COLOR_PALLET } from '../helpers/colorPallet';\ninterface UseScales {\n props: DSChartT.Props;\n innerHeight: number;\n innerWidth: number;\n stackedData: Series<\n {\n [key: string]: number;\n },\n string\n >[][];\n currentData: {\n key: string;\n group: string;\n type: DSChartT.SerieTypeT;\n scale?: string;\n color: string;\n data: {\n key: string;\n value: number | { x: number; y: number };\n position: number;\n }[];\n }[];\n groups: string[];\n}\nexport const useScales = ({\n props,\n innerHeight,\n innerWidth,\n stackedData,\n currentData,\n groups,\n containerRatio,\n}: UseScales) => {\n const { series, xAxis, yAxis, y2Axis, groups: stackedSeries, types } = props;\n\n const rangeTo = innerWidth * (containerRatio ?? 1);\n const getBandDomain = useCallback((axis: DSChartT.AxisT) => axis.cols ?? [...series[0].data.keys()], [series]);\n\n const getLinearDomain = useCallback(\n (axis?: DSChartT.AxisT, axisString?: string, withStackData = true) => {\n // const data2 = data ? extent(data) : [];\n const begin = axis?.beginAtZero ? 0 : undefined;\n const data = currentData\n .filter((serie) => {\n if (serie.isHidden) return false;\n if (serie.scale === axisString) {\n return true;\n }\n if (!serie.scale && ['y', 'x'].includes(axisString)) {\n return true;\n }\n return false;\n })\n .map(\n (serie) =>\n serie.data\n .filter((datum) => datum.value)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value[axisString];\n }),\n\n // ? serie.data.map((datum) => datum.value).flat()\n // : serie.data.map((datum) => datum.value.map((coord) => coord[axisString]).flat()),\n );\n\n const stack = withStackData && [\n min(stackedData.flat(), (layer) => min(layer, (sequence) => sequence[1])),\n max(stackedData.flat(), (layer) => max(layer, (sequence) => sequence[1])),\n ];\n const minRange = min([begin, min(data.flat()), stack[0]]);\n const maxRange = max([begin, max(data.flat()), stack[1]]);\n\n // @TODO fix this\n const [leftPadding, rightPadding] =\n typeof axis.domainPadding === 'number'\n ? [axis.domainPadding, axis.domainPadding]\n : axis.domainPadding ?? [0, 0];\n\n if (axis.type === 'time') {\n // @todo padding for time series\n return [minRange, maxRange];\n }\n return [\n minRange - (maxRange - minRange) * (leftPadding ?? 0),\n maxRange + (maxRange - minRange) * (rightPadding ?? 0),\n ];\n },\n [currentData, stackedData],\n );\n\n const getScaleTime = (domain: Date[], range: number[]) => scaleUtc().domain(domain).range(range);\n\n const getScaleBand = (domain: string[], range: number[], padding = 0.2) =>\n scaleBand().domain(domain).range(range).padding(padding).paddingOuter(0.1);\n const getScaleLinear = (domain: number[], range: number[]) => scaleLinear().domain(domain).range(range);\n const getScaleLog = (domain: number[], range: number[]) => scaleLog().domain(domain).range(range);\n\n const xScale = useMemo(() => {\n if (xAxis?.type === 'time') return getScaleTime(getLinearDomain(xAxis, 'x', false), [0, rangeTo]);\n if (xAxis?.type === 'linear' || yAxis?.type === 'band') {\n // @TODO is this really a thing ?\n const withStackData = yAxis?.type === 'band';\n return getScaleLinear(getLinearDomain(xAxis, 'x', withStackData) as number[], [0, rangeTo], xAxis.padding);\n }\n\n return getScaleBand(getBandDomain(xAxis) as string[], [0, rangeTo], xAxis.padding);\n }, [getBandDomain, getLinearDomain, rangeTo, xAxis, yAxis?.type]);\n\n const yScale = useMemo(() => {\n if (yAxis?.type === 'band') return getScaleBand(getBandDomain(yAxis), [innerHeight, 0], yAxis.padding);\n if (yAxis?.type === 'log') return getScaleLog(getLinearDomain(yAxis, 'y'), [innerHeight, 0]);\n return getScaleLinear(getLinearDomain(yAxis, 'y'), [innerHeight, 0]);\n }, [getBandDomain, getLinearDomain, innerHeight, yAxis]);\n\n const y2Scale = useMemo(() => {\n if (!y2Axis) return null;\n if (y2Axis?.type === 'band') return getScaleBand(getBandDomain(y2Axis), [innerHeight, 0], y2Scale.padding);\n if (y2Axis?.type === 'log') return getScaleLog(getLinearDomain(y2Axis, 'y2'), [innerHeight, 0]);\n return getScaleLinear(getLinearDomain(y2Axis, 'y2'), [innerHeight, 0]);\n }, [getBandDomain, getLinearDomain, innerHeight, y2Axis]);\n\n const colorScale = useMemo(\n () =>\n scaleOrdinal()\n .domain(groups)\n .range(currentData.map((d) => COLOR_PALLET[d.color] ?? d.color)),\n [currentData, groups],\n );\n // get only groups bars to calculate the subgroup scale\n\n const subgroupsWithBars = useMemo(\n () =>\n currentData\n .filter(\n (serie) =>\n serie.type === 'bar' &&\n !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1) &&\n !serie.isHidden,\n )\n .map((serie) => serie.name),\n [currentData, stackedSeries],\n );\n\n const getBandwidth = useCallback(() => {\n if ((xScale as ScaleBand<string>).bandwidth) return (xScale as ScaleBand<string>).bandwidth();\n if ((yScale as ScaleBand<string>).bandwidth) return (yScale as ScaleBand<string>).bandwidth();\n return innerWidth / xScale.ticks().length / 2;\n }, [innerWidth, xScale, yScale]);\n\n if (stackedSeries?.length) {\n stackedSeries.forEach((_, i) => subgroupsWithBars.push(`stacked-data-${i}`));\n }\n\n const subGroupScale = useMemo(\n () =>\n getBandwidth()\n ? scaleBand()\n .domain(subgroupsWithBars)\n .range([0, getBandwidth() ?? 0])\n .paddingInner(0.55)\n .padding(0.2)\n : null,\n [getBandwidth, subgroupsWithBars],\n );\n\n return { xScale, y2Scale, yScale, subGroupScale, colorScale, getBandwidth };\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- import { stack } from "d3";
2
+ import { stack, timeFormat, format } from "d3";
3
3
  const getStackedIndex = (groups, serie) => {
4
4
  for (let i = 0; i < groups.length; i += 1) {
5
5
  for (let j = 0; j < groups[i].length; j += 1) {
@@ -22,11 +22,11 @@ const stackData = (groupsStacked, series) => {
22
22
  if (!groupsStacked)
23
23
  return [];
24
24
  groupsStacked?.forEach((g) => {
25
- const seriesStacked = series.filter((serie) => g.includes(serie.name));
25
+ const seriesStacked = series.filter((serie) => g.includes(serie.name) && !serie.isHidden);
26
26
  const keys = seriesStacked.map((serie) => serie.name);
27
27
  const stackData2 = [];
28
28
  seriesStacked.forEach((serie) => {
29
- serie.data.forEach((d, i) => {
29
+ serie.originalData.data.forEach((d, i) => {
30
30
  if (typeof stackData2[i] === "object") {
31
31
  stackData2[i][serie.name] = typeof d === "number" ? d : d.y;
32
32
  }
@@ -37,19 +37,15 @@ const stackData = (groupsStacked, series) => {
37
37
  });
38
38
  return aux;
39
39
  };
40
- const getSeriesValuesAt = (data, point) => {
41
- const seriesValuesAtPoint = {};
42
- data.forEach((serie) => {
43
- serie.data.forEach((datum) => {
44
- if (datum.value === point) {
45
- seriesValuesAtPoint[serie.name] = seriesValuesAtPoint[serie.name] ? [...seriesValuesAtPoint[serie.name], point] : [point];
46
- }
47
- });
48
- });
49
- return seriesValuesAtPoint;
40
+ const getFormatGenerator = (type) => {
41
+ if (type === "time")
42
+ return timeFormat;
43
+ if (type === "linear")
44
+ return format;
45
+ return null;
50
46
  };
51
47
  export {
52
- getSeriesValuesAt,
48
+ getFormatGenerator,
53
49
  getStackedData,
54
50
  getStackedIndex,
55
51
  stackData
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/helpers/index.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { stack } from 'd3';\nimport { values } from 'lodash';\n\nexport const getStackedIndex = (groups: string[][], serie: string) => {\n for (let i = 0; i < groups.length; i += 1) {\n for (let j = 0; j < groups[i].length; j += 1) {\n if (groups[i][j] === serie) return i;\n }\n }\n return -1;\n};\n\nexport const getStackedData = (stackedData, serie) => {\n for (let i = 0; i < stackedData?.length; i += 1) {\n const data = stackedData[i].find((d) => d.key === serie.name);\n if (data) return data;\n }\n return false;\n};\n\nexport const stackData = (groupsStacked, series) => {\n const aux = [];\n if (!groupsStacked) return [];\n groupsStacked?.forEach((g) => {\n const seriesStacked = series.filter((serie) => g.includes(serie.name));\n const keys = seriesStacked.map((serie) => serie.name);\n const stackData: Array<{ [key: string]: number }> = [];\n seriesStacked.forEach((serie) => {\n serie.data.forEach((d, i) => {\n if (typeof stackData[i] === 'object') {\n stackData[i][serie.name] = typeof d === 'number' ? d : d.y;\n }\n stackData[i] = { ...stackData[i], [serie.name]: typeof d === 'number' ? d : d.y };\n });\n });\n\n aux.push(stack().keys(keys)(stackData));\n });\n return aux;\n};\n\nexport const getSeriesValuesAt = (data, point) => {\n const seriesValuesAtPoint = {};\n data.forEach((serie) => {\n serie.data.forEach((datum) => {\n if (datum.value === point) {\n seriesValuesAtPoint[serie.name] = seriesValuesAtPoint[serie.name]\n ? [...seriesValuesAtPoint[serie.name], point]\n : [point];\n }\n });\n });\n return seriesValuesAtPoint;\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,aAAa;AAGf,MAAM,kBAAkB,CAAC,QAAoB,UAAkB;AACpE,WAAS,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK,GAAG;AACzC,aAAS,IAAI,GAAG,IAAI,OAAO,GAAG,QAAQ,KAAK,GAAG;AAC5C,UAAI,OAAO,GAAG,OAAO;AAAO,eAAO;AAAA,IACrC;AAAA,EACF;AACA,SAAO;AACT;AAEO,MAAM,iBAAiB,CAAC,aAAa,UAAU;AACpD,WAAS,IAAI,GAAG,IAAI,aAAa,QAAQ,KAAK,GAAG;AAC/C,UAAM,OAAO,YAAY,GAAG,KAAK,CAAC,MAAM,EAAE,QAAQ,MAAM,IAAI;AAC5D,QAAI;AAAM,aAAO;AAAA,EACnB;AACA,SAAO;AACT;AAEO,MAAM,YAAY,CAAC,eAAe,WAAW;AAClD,QAAM,MAAM,CAAC;AACb,MAAI,CAAC;AAAe,WAAO,CAAC;AAC5B,iBAAe,QAAQ,CAAC,MAAM;AAC5B,UAAM,gBAAgB,OAAO,OAAO,CAAC,UAAU,EAAE,SAAS,MAAM,IAAI,CAAC;AACrE,UAAM,OAAO,cAAc,IAAI,CAAC,UAAU,MAAM,IAAI;AACpD,UAAMA,aAA8C,CAAC;AACrD,kBAAc,QAAQ,CAAC,UAAU;AAC/B,YAAM,KAAK,QAAQ,CAAC,GAAG,MAAM;AAC3B,YAAI,OAAOA,WAAU,OAAO,UAAU;AACpC,UAAAA,WAAU,GAAG,MAAM,QAAQ,OAAO,MAAM,WAAW,IAAI,EAAE;AAAA,QAC3D;AACA,QAAAA,WAAU,KAAK,EAAE,GAAGA,WAAU,IAAI,CAAC,MAAM,OAAO,OAAO,MAAM,WAAW,IAAI,EAAE,EAAE;AAAA,MAClF,CAAC;AAAA,IACH,CAAC;AAED,QAAI,KAAK,MAAM,EAAE,KAAK,IAAI,EAAEA,UAAS,CAAC;AAAA,EACxC,CAAC;AACD,SAAO;AACT;AAEO,MAAM,oBAAoB,CAAC,MAAM,UAAU;AAChD,QAAM,sBAAsB,CAAC;AAC7B,OAAK,QAAQ,CAAC,UAAU;AACtB,UAAM,KAAK,QAAQ,CAAC,UAAU;AAC5B,UAAI,MAAM,UAAU,OAAO;AACzB,4BAAoB,MAAM,QAAQ,oBAAoB,MAAM,QACxD,CAAC,GAAG,oBAAoB,MAAM,OAAO,KAAK,IAC1C,CAAC,KAAK;AAAA,MACZ;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACD,SAAO;AACT;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { stack, timeFormat, format } from 'd3';\nimport { values } from 'lodash';\n\nexport const getStackedIndex = (groups: string[][], serie: string) => {\n for (let i = 0; i < groups.length; i += 1) {\n for (let j = 0; j < groups[i].length; j += 1) {\n if (groups[i][j] === serie) return i;\n }\n }\n return -1;\n};\n\nexport const getStackedData = (stackedData, serie) => {\n for (let i = 0; i < stackedData?.length; i += 1) {\n const data = stackedData[i].find((d) => d.key === serie.name);\n if (data) return data;\n }\n return false;\n};\n\nexport const stackData = (groupsStacked, series) => {\n const aux = [];\n if (!groupsStacked) return [];\n groupsStacked?.forEach((g) => {\n const seriesStacked = series.filter((serie) => g.includes(serie.name) && !serie.isHidden);\n const keys = seriesStacked.map((serie) => serie.name);\n const stackData: Array<{ [key: string]: number }> = [];\n seriesStacked.forEach((serie) => {\n serie.originalData.data.forEach((d, i) => {\n if (typeof stackData[i] === 'object') {\n stackData[i][serie.name] = typeof d === 'number' ? d : d.y;\n }\n stackData[i] = { ...stackData[i], [serie.name]: typeof d === 'number' ? d : d.y };\n });\n });\n\n aux.push(stack().keys(keys)(stackData));\n });\n return aux;\n};\n\nexport const getFormatGenerator = (type: string) => {\n if (type === 'time') return timeFormat;\n if (type === 'linear') return format;\n return null;\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,OAAO,YAAY,cAAc;AAGnC,MAAM,kBAAkB,CAAC,QAAoB,UAAkB;AACpE,WAAS,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK,GAAG;AACzC,aAAS,IAAI,GAAG,IAAI,OAAO,GAAG,QAAQ,KAAK,GAAG;AAC5C,UAAI,OAAO,GAAG,OAAO;AAAO,eAAO;AAAA,IACrC;AAAA,EACF;AACA,SAAO;AACT;AAEO,MAAM,iBAAiB,CAAC,aAAa,UAAU;AACpD,WAAS,IAAI,GAAG,IAAI,aAAa,QAAQ,KAAK,GAAG;AAC/C,UAAM,OAAO,YAAY,GAAG,KAAK,CAAC,MAAM,EAAE,QAAQ,MAAM,IAAI;AAC5D,QAAI;AAAM,aAAO;AAAA,EACnB;AACA,SAAO;AACT;AAEO,MAAM,YAAY,CAAC,eAAe,WAAW;AAClD,QAAM,MAAM,CAAC;AACb,MAAI,CAAC;AAAe,WAAO,CAAC;AAC5B,iBAAe,QAAQ,CAAC,MAAM;AAC5B,UAAM,gBAAgB,OAAO,OAAO,CAAC,UAAU,EAAE,SAAS,MAAM,IAAI,KAAK,CAAC,MAAM,QAAQ;AACxF,UAAM,OAAO,cAAc,IAAI,CAAC,UAAU,MAAM,IAAI;AACpD,UAAMA,aAA8C,CAAC;AACrD,kBAAc,QAAQ,CAAC,UAAU;AAC/B,YAAM,aAAa,KAAK,QAAQ,CAAC,GAAG,MAAM;AACxC,YAAI,OAAOA,WAAU,OAAO,UAAU;AACpC,UAAAA,WAAU,GAAG,MAAM,QAAQ,OAAO,MAAM,WAAW,IAAI,EAAE;AAAA,QAC3D;AACA,QAAAA,WAAU,KAAK,EAAE,GAAGA,WAAU,IAAI,CAAC,MAAM,OAAO,OAAO,MAAM,WAAW,IAAI,EAAE,EAAE;AAAA,MAClF,CAAC;AAAA,IACH,CAAC;AAED,QAAI,KAAK,MAAM,EAAE,KAAK,IAAI,EAAEA,UAAS,CAAC;AAAA,EACxC,CAAC;AACD,SAAO;AACT;AAEO,MAAM,qBAAqB,CAAC,SAAiB;AAClD,MAAI,SAAS;AAAQ,WAAO;AAC5B,MAAI,SAAS;AAAU,WAAO;AAC9B,SAAO;AACT;",
6
6
  "names": ["stackData"]
7
7
  }
@@ -20,7 +20,7 @@ const ActivePoint = () => {
20
20
  item = data.find((serie) => serie.key === activeSerie);
21
21
  lastActiveSerie.current = item;
22
22
  } else if (activePoint) {
23
- item = data.find((serie) => serie.data.some((value) => activePoint === value.key));
23
+ item = data.find((serie) => serie.data.some((value) => activePoint?.key === value.key));
24
24
  lastActiveSerie.current = item;
25
25
  } else if (!lastActiveSerie.current) {
26
26
  return;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/parts/ActivePoint.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable arrow-body-style */\n/* eslint-disable indent */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport { ChartContext } from '../ChartContext';\nimport { Line, Points, Bars, StackedBar } from '../series';\nimport { getStackedIndex } from '../helpers';\n\nexport const ActivePoint = () => {\n const {\n props: { data, groups },\n activePoint,\n activeSerie,\n } = useContext(ChartContext);\n\n const lastActiveSerie = useRef(null);\n const activeItem = useMemo(() => {\n let item = null;\n if (!activePoint && !activeSerie && lastActiveSerie.current) {\n item = lastActiveSerie.current;\n }\n if (activeSerie) {\n item = data.find((serie) => serie.key === activeSerie);\n lastActiveSerie.current = item;\n } else if (activePoint) {\n item = data.find((serie) => serie.data.some((value) => activePoint === value.key));\n lastActiveSerie.current = item;\n } else if (!lastActiveSerie.current) {\n return;\n }\n\n if (item.type === 'bar' && groups && getStackedIndex(groups, item.name) > -1) {\n return <StackedBar serie={item} />;\n }\n if (item.type === 'bar') {\n return <Bars serie={item} />;\n }\n if (item.type === 'point') {\n return <Points serie={item} />;\n }\n if (item.type === 'line') {\n return <Line serie={item} />;\n }\n }, [activePoint, activeSerie, data, groups]);\n\n return <g className=\"redraw\">{activeItem}</g>;\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB;AAGA,SAAgB,YAAY,SAAS,cAAc;AACnD,SAAS,oBAAoB;AAC7B,SAAS,MAAM,QAAQ,MAAM,kBAAkB;AAC/C,SAAS,uBAAuB;AAEzB,MAAM,cAAc,MAAM;AAC/B,QAAM;AAAA,IACJ,OAAO,EAAE,MAAM,OAAO;AAAA,IACtB;AAAA,IACA;AAAA,EACF,IAAI,WAAW,YAAY;AAE3B,QAAM,kBAAkB,OAAO,IAAI;AACnC,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI,OAAO;AACX,QAAI,CAAC,eAAe,CAAC,eAAe,gBAAgB,SAAS;AAC3D,aAAO,gBAAgB;AAAA,IACzB;AACA,QAAI,aAAa;AACf,aAAO,KAAK,KAAK,CAAC,UAAU,MAAM,QAAQ,WAAW;AACrD,sBAAgB,UAAU;AAAA,IAC5B,WAAW,aAAa;AACtB,aAAO,KAAK,KAAK,CAAC,UAAU,MAAM,KAAK,KAAK,CAAC,UAAU,gBAAgB,MAAM,GAAG,CAAC;AACjF,sBAAgB,UAAU;AAAA,IAC5B,WAAW,CAAC,gBAAgB,SAAS;AACnC;AAAA,IACF;AAEA,QAAI,KAAK,SAAS,SAAS,UAAU,gBAAgB,QAAQ,KAAK,IAAI,IAAI,IAAI;AAC5E,aAAO,oBAAC;AAAA,QAAW,OAAO;AAAA,OAAM;AAAA,IAClC;AACA,QAAI,KAAK,SAAS,OAAO;AACvB,aAAO,oBAAC;AAAA,QAAK,OAAO;AAAA,OAAM;AAAA,IAC5B;AACA,QAAI,KAAK,SAAS,SAAS;AACzB,aAAO,oBAAC;AAAA,QAAO,OAAO;AAAA,OAAM;AAAA,IAC9B;AACA,QAAI,KAAK,SAAS,QAAQ;AACxB,aAAO,oBAAC;AAAA,QAAK,OAAO;AAAA,OAAM;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,aAAa,aAAa,MAAM,MAAM,CAAC;AAE3C,SAAO,oBAAC;AAAA,IAAE,WAAU;AAAA,IAAU;AAAA,GAAW;AAC3C;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable arrow-body-style */\n/* eslint-disable indent */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport { ChartContext } from '../ChartContext';\nimport { Line, Points, Bars, StackedBar } from '../series';\nimport { getStackedIndex } from '../helpers';\n\nexport const ActivePoint = () => {\n const {\n props: { data, groups },\n activePoint,\n activeSerie,\n } = useContext(ChartContext);\n\n const lastActiveSerie = useRef(null);\n const activeItem = useMemo(() => {\n let item = null;\n if (!activePoint && !activeSerie && lastActiveSerie.current) {\n item = lastActiveSerie.current;\n }\n if (activeSerie) {\n item = data.find((serie) => serie.key === activeSerie);\n lastActiveSerie.current = item;\n } else if (activePoint) {\n item = data.find((serie) => serie.data.some((value) => activePoint?.key === value.key));\n lastActiveSerie.current = item;\n } else if (!lastActiveSerie.current) {\n return;\n }\n\n if (item.type === 'bar' && groups && getStackedIndex(groups, item.name) > -1) {\n return <StackedBar serie={item} />;\n }\n if (item.type === 'bar') {\n return <Bars serie={item} />;\n }\n if (item.type === 'point') {\n return <Points serie={item} />;\n }\n if (item.type === 'line') {\n return <Line serie={item} />;\n }\n }, [activePoint, activeSerie, data, groups]);\n\n return <g className=\"redraw\">{activeItem}</g>;\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB;AAGA,SAAgB,YAAY,SAAS,cAAc;AACnD,SAAS,oBAAoB;AAC7B,SAAS,MAAM,QAAQ,MAAM,kBAAkB;AAC/C,SAAS,uBAAuB;AAEzB,MAAM,cAAc,MAAM;AAC/B,QAAM;AAAA,IACJ,OAAO,EAAE,MAAM,OAAO;AAAA,IACtB;AAAA,IACA;AAAA,EACF,IAAI,WAAW,YAAY;AAE3B,QAAM,kBAAkB,OAAO,IAAI;AACnC,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI,OAAO;AACX,QAAI,CAAC,eAAe,CAAC,eAAe,gBAAgB,SAAS;AAC3D,aAAO,gBAAgB;AAAA,IACzB;AACA,QAAI,aAAa;AACf,aAAO,KAAK,KAAK,CAAC,UAAU,MAAM,QAAQ,WAAW;AACrD,sBAAgB,UAAU;AAAA,IAC5B,WAAW,aAAa;AACtB,aAAO,KAAK,KAAK,CAAC,UAAU,MAAM,KAAK,KAAK,CAAC,UAAU,aAAa,QAAQ,MAAM,GAAG,CAAC;AACtF,sBAAgB,UAAU;AAAA,IAC5B,WAAW,CAAC,gBAAgB,SAAS;AACnC;AAAA,IACF;AAEA,QAAI,KAAK,SAAS,SAAS,UAAU,gBAAgB,QAAQ,KAAK,IAAI,IAAI,IAAI;AAC5E,aAAO,oBAAC;AAAA,QAAW,OAAO;AAAA,OAAM;AAAA,IAClC;AACA,QAAI,KAAK,SAAS,OAAO;AACvB,aAAO,oBAAC;AAAA,QAAK,OAAO;AAAA,OAAM;AAAA,IAC5B;AACA,QAAI,KAAK,SAAS,SAAS;AACzB,aAAO,oBAAC;AAAA,QAAO,OAAO;AAAA,OAAM;AAAA,IAC9B;AACA,QAAI,KAAK,SAAS,QAAQ;AACxB,aAAO,oBAAC;AAAA,QAAK,OAAO;AAAA,OAAM;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,aAAa,aAAa,MAAM,MAAM,CAAC;AAE3C,SAAO,oBAAC;AAAA,IAAE,WAAU;AAAA,IAAU;AAAA,GAAW;AAC3C;",
6
6
  "names": []
7
7
  }