@elliemae/ds-dataviz 3.14.0-rc.2 → 3.14.0-rc.4

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 (15) hide show
  1. package/dist/cjs/graphs/Chart/config/useGetters.js +12 -0
  2. package/dist/cjs/graphs/Chart/config/useGetters.js.map +2 -2
  3. package/dist/cjs/graphs/Chart/config/useScales.js +2 -2
  4. package/dist/cjs/graphs/Chart/config/useScales.js.map +2 -2
  5. package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js +2 -2
  6. package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js.map +2 -2
  7. package/dist/esm/graphs/Chart/config/useGetters.js +12 -0
  8. package/dist/esm/graphs/Chart/config/useGetters.js.map +2 -2
  9. package/dist/esm/graphs/Chart/config/useScales.js +2 -2
  10. package/dist/esm/graphs/Chart/config/useScales.js.map +2 -2
  11. package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js +2 -2
  12. package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js.map +2 -2
  13. package/dist/types/graphs/Chart/config/useChart.d.ts +6 -6
  14. package/dist/types/graphs/Chart/config/useGetters.d.ts +6 -6
  15. package/package.json +4 -4
package/dist/cjs/graphs/Chart/config/useGetters.js CHANGED
@@ -32,6 +32,8 @@ var import_react = require("react");
32
32
  const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) => {
33
33
  const getXValue = (0, import_react.useCallback)(
34
34
  (datum) => {
35
+ if (!datum)
36
+ return null;
35
37
  if (!isHorizontal) {
36
38
  if (xAxis?.cols?.[datum.position]) {
37
39
  return xAxis?.cols?.[datum.position];
@@ -49,6 +51,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
49
51
  );
50
52
  const getYValue = (0, import_react.useCallback)(
51
53
  (datum) => {
54
+ if (!datum)
55
+ return null;
52
56
  if (!isHorizontal) {
53
57
  if (typeof datum.value === "number") {
54
58
  return datum.value;
@@ -66,6 +70,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
66
70
  );
67
71
  const getXScaleValue = (0, import_react.useCallback)(
68
72
  (datum) => {
73
+ if (!datum)
74
+ return null;
69
75
  if (xAxis.type === "linear") {
70
76
  return xScale(getXValue(datum));
71
77
  }
@@ -75,6 +81,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
75
81
  );
76
82
  const getYScaleValue = (0, import_react.useCallback)(
77
83
  (datum) => {
84
+ if (!datum)
85
+ return null;
78
86
  const finalYScale = datum?.scale === "y2" ? y2Scale : yScale;
79
87
  if (yAxis.type === "band") {
80
88
  return finalYScale(getYValue(datum));
@@ -85,6 +93,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
85
93
  );
86
94
  const getYValueFormatted = (0, import_react.useCallback)(
87
95
  (datum) => {
96
+ if (!datum)
97
+ return null;
88
98
  const value = getYValue(datum);
89
99
  if (typeof yAxis.tick?.tickFormat === "function")
90
100
  return yAxis.tick.tickFormat(value);
@@ -94,6 +104,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
94
104
  );
95
105
  const getXValueFormatted = (0, import_react.useCallback)(
96
106
  (datum) => {
107
+ if (!datum)
108
+ return null;
97
109
  const value = getXValue(datum);
98
110
  if (typeof xAxis.tick?.tickFormat === "function")
99
111
  return xAxis.tick.tickFormat(value);
package/dist/cjs/graphs/Chart/config/useGetters.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/graphs/Chart/config/useGetters.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useMemo } from 'react';\nimport type { ScaleBand, ScaleLinear } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\n\ninterface UseGettersT {\n xAxis: DSChartT.AxisT;\n yAxis: DSChartT.AxisT;\n isHorizontal: boolean;\n xScale: DSChartT.Scales;\n yScale: DSChartT.Scales;\n y2Scale: DSChartT.Scales;\n}\nexport const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }: UseGettersT) => {\n const getXValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!isHorizontal) {\n if (xAxis?.cols?.[datum.position]) {\n return xAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.x;\n return datum.position.toString();\n }\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.x;\n },\n [isHorizontal, xAxis?.cols],\n );\n\n const getYValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!isHorizontal) {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.y;\n }\n if (yAxis?.cols?.[datum.position]) {\n return yAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.y;\n return datum.position.toString();\n },\n [isHorizontal, yAxis?.cols],\n );\n\n const getXScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (xAxis.type === 'linear') {\n return (xScale as ScaleLinear<number, number, never>)(getXValue(datum) as number);\n }\n return (xScale as ScaleBand<string>)(getXValue(datum) as string);\n },\n [getXValue, xAxis.type, xScale],\n );\n\n const getYScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n const finalYScale = datum?.scale === 'y2' ? y2Scale : yScale;\n if (yAxis.type === 'band') {\n return (finalYScale as ScaleBand<string>)(getYValue(datum) as string);\n }\n return (finalYScale as ScaleLinear<number, number, never>)(getYValue(datum) as number);\n },\n [getYValue, y2Scale, yAxis.type, yScale],\n );\n\n const getYValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n const value = getYValue(datum);\n if (typeof yAxis.tick?.tickFormat === 'function') return yAxis.tick.tickFormat(value);\n return value;\n },\n [getYValue, yAxis.tick],\n );\n\n const getXValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n const value = getXValue(datum);\n if (typeof xAxis.tick?.tickFormat === 'function') return xAxis.tick.tickFormat(value);\n return value;\n },\n [getXValue, xAxis.tick],\n );\n\n return useMemo(\n () => ({ getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted }),\n [getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAqC;AAY9B,MAAM,aAAa,CAAC,EAAE,OAAO,cAAc,OAAO,QAAQ,QAAQ,QAAQ,MAAmB;AAClG,QAAM,gBAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,OAAO,MAAM,WAAW;AACjC,iBAAO,OAAO,OAAO,MAAM;AAAA,QAC7B;AACA,YAAI,OAAO,MAAM,UAAU;AAAU,iBAAO,MAAM,OAAO;AACzD,eAAO,MAAM,SAAS,SAAS;AAAA,MACjC;AACA,UAAI,OAAO,MAAM,UAAU,UAAU;AACnC,eAAO,MAAM;AAAA,MACf;AACA,aAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,MAAM,UAAU,UAAU;AACnC,iBAAO,MAAM;AAAA,QACf;AACA,eAAO,MAAM,OAAO;AAAA,MACtB;AACA,UAAI,OAAO,OAAO,MAAM,WAAW;AACjC,eAAO,OAAO,OAAO,MAAM;AAAA,MAC7B;AACA,UAAI,OAAO,MAAM,UAAU;AAAU,eAAO,MAAM,OAAO;AACzD,aAAO,MAAM,SAAS,SAAS;AAAA,IACjC;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,qBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,UAAI,MAAM,SAAS,UAAU;AAC3B,eAAQ,OAA8C,UAAU,KAAK,CAAW;AAAA,MAClF;AACA,aAAQ,OAA6B,UAAU,KAAK,CAAW;AAAA,IACjE;AAAA,IACA,CAAC,WAAW,MAAM,MAAM,MAAM;AAAA,EAChC;AAEA,QAAM,qBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,YAAM,cAAc,OAAO,UAAU,OAAO,UAAU;AACtD,UAAI,MAAM,SAAS,QAAQ;AACzB,eAAQ,YAAkC,UAAU,KAAK,CAAW;AAAA,MACtE;AACA,aAAQ,YAAmD,UAAU,KAAK,CAAW;AAAA,IACvF;AAAA,IACA,CAAC,WAAW,SAAS,MAAM,MAAM,MAAM;AAAA,EACzC;AAEA,QAAM,yBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,QAAM,yBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,aAAO;AAAA,IACL,OAAO,EAAE,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,mBAAmB;AAAA,IACtG,CAAC,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,kBAAkB;AAAA,EAC/F;AACF;",
4
+ "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useMemo } from 'react';\nimport type { ScaleBand, ScaleLinear } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\n\ninterface UseGettersT {\n xAxis: DSChartT.AxisT;\n yAxis: DSChartT.AxisT;\n isHorizontal: boolean;\n xScale: DSChartT.Scales;\n yScale: DSChartT.Scales;\n y2Scale: DSChartT.Scales;\n}\nexport const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }: UseGettersT) => {\n const getXValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n if (!isHorizontal) {\n if (xAxis?.cols?.[datum.position]) {\n return xAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.x;\n return datum.position.toString();\n }\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.x;\n },\n [isHorizontal, xAxis?.cols],\n );\n\n const getYValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n if (!isHorizontal) {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.y;\n }\n if (yAxis?.cols?.[datum.position]) {\n return yAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.y;\n return datum.position.toString();\n },\n [isHorizontal, yAxis?.cols],\n );\n\n const getXScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n if (xAxis.type === 'linear') {\n return (xScale as ScaleLinear<number, number, never>)(getXValue(datum) as number);\n }\n return (xScale as ScaleBand<string>)(getXValue(datum) as string);\n },\n [getXValue, xAxis.type, xScale],\n );\n\n const getYScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n const finalYScale = datum?.scale === 'y2' ? y2Scale : yScale;\n if (yAxis.type === 'band') {\n return (finalYScale as ScaleBand<string>)(getYValue(datum) as string);\n }\n return (finalYScale as ScaleLinear<number, number, never>)(getYValue(datum) as number);\n },\n [getYValue, y2Scale, yAxis.type, yScale],\n );\n\n const getYValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n const value = getYValue(datum);\n if (typeof yAxis.tick?.tickFormat === 'function') return yAxis.tick.tickFormat(value);\n return value;\n },\n [getYValue, yAxis.tick],\n );\n\n const getXValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n const value = getXValue(datum);\n if (typeof xAxis.tick?.tickFormat === 'function') return xAxis.tick.tickFormat(value);\n return value;\n },\n [getXValue, xAxis.tick],\n );\n\n return useMemo(\n () => ({ getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted }),\n [getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAqC;AAY9B,MAAM,aAAa,CAAC,EAAE,OAAO,cAAc,OAAO,QAAQ,QAAQ,QAAQ,MAAmB;AAClG,QAAM,gBAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AACnB,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,OAAO,MAAM,WAAW;AACjC,iBAAO,OAAO,OAAO,MAAM;AAAA,QAC7B;AACA,YAAI,OAAO,MAAM,UAAU;AAAU,iBAAO,MAAM,OAAO;AACzD,eAAO,MAAM,SAAS,SAAS;AAAA,MACjC;AACA,UAAI,OAAO,MAAM,UAAU,UAAU;AACnC,eAAO,MAAM;AAAA,MACf;AACA,aAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,MAAM,UAAU,UAAU;AACnC,iBAAO,MAAM;AAAA,QACf;AACA,eAAO,MAAM,OAAO;AAAA,MACtB;AACA,UAAI,OAAO,OAAO,MAAM,WAAW;AACjC,eAAO,OAAO,OAAO,MAAM;AAAA,MAC7B;AACA,UAAI,OAAO,MAAM,UAAU;AAAU,eAAO,MAAM,OAAO;AACzD,aAAO,MAAM,SAAS,SAAS;AAAA,IACjC;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,qBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,UAAI,MAAM,SAAS,UAAU;AAC3B,eAAQ,OAA8C,UAAU,KAAK,CAAW;AAAA,MAClF;AACA,aAAQ,OAA6B,UAAU,KAAK,CAAW;AAAA,IACjE;AAAA,IACA,CAAC,WAAW,MAAM,MAAM,MAAM;AAAA,EAChC;AAEA,QAAM,qBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,YAAM,cAAc,OAAO,UAAU,OAAO,UAAU;AACtD,UAAI,MAAM,SAAS,QAAQ;AACzB,eAAQ,YAAkC,UAAU,KAAK,CAAW;AAAA,MACtE;AACA,aAAQ,YAAmD,UAAU,KAAK,CAAW;AAAA,IACvF;AAAA,IACA,CAAC,WAAW,SAAS,MAAM,MAAM,MAAM;AAAA,EACzC;AAEA,QAAM,yBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,QAAM,yBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,aAAO;AAAA,IACL,OAAO,EAAE,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,mBAAmB;AAAA,IACtG,CAAC,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,kBAAkB;AAAA,EAC/F;AACF;",
6
6
  "names": []
7
7
  }
package/dist/cjs/graphs/Chart/config/useScales.js CHANGED
@@ -223,9 +223,9 @@ const useScales = ({
223
223
  return;
224
224
  const width = innerWidth / bar[0].data.length;
225
225
  if (containerRatio > 1) {
226
- return width * containerRatio;
226
+ return Math.max(0.5, width * containerRatio);
227
227
  }
228
- return Math.trunc(width - width * 0.2);
228
+ return Math.max(0.5, Math.trunc(width - width * 0.2));
229
229
  }, [isXAxisCategorical, isYAxisCategorical, currentData, innerWidth, containerRatio, xScale, yScale]);
230
230
  const subGroupScale = (0, import_react.useMemo)(
231
231
  () => getBandwidth() ? (0, import_d3.scaleBand)().domain(subgroupsWithBars).range([0, getBandwidth() ?? 0]).paddingInner(0.55).padding(0.2).paddingOuter(0.01) : null,
package/dist/cjs/graphs/Chart/config/useScales.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/graphs/Chart/config/useScales.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useCallback } from 'react';\nimport type { Series, ScaleBand } from 'd3';\nimport { max, min, scaleLinear, scaleBand, scaleUtc, scaleOrdinal, scaleLog } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\nimport { getStackedIndex, getStackedData } from '../helpers';\nimport { COLOR_PALLET } from '../helpers/colorPallet';\nimport { TIME_OFFSET } from '../../constants';\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: DSChartT.InternalData;\n groups: string[];\n containerRatio: number;\n}\nexport const useScales = ({\n props,\n originalSeries: series,\n innerHeight,\n innerWidth,\n stackedData,\n currentData,\n containerRatio,\n}: UseScales) => {\n const { xAxis, yAxis, y2Axis, groups: stackedSeries, xScroll } = props;\n\n // const xScroll = xAxis.advanced?.pointSpacing?.value > 1;\n const yScroll = yAxis.advanced?.pointSpacing?.value > 1;\n\n const rangeToWidth = innerWidth * (xScroll ? containerRatio : 1);\n const rangeToHeight = innerHeight * (yScroll ? containerRatio : 1);\n\n const getBandDomain = useCallback(\n (axis: DSChartT.AxisT) => axis.cols ?? [...series[0].data.map((_, i) => i.toString())],\n [series],\n );\n\n const getPadding = (domainPadding: number | Array<number>) =>\n typeof domainPadding === 'number' ? [domainPadding, domainPadding] : domainPadding ?? [0, 0];\n\n const getLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const stackedDataFlatten = stackedData.filter((data) => data.scale === axisString).flat();\n const minStackedData = min(stackedDataFlatten, (layer) => min(layer, (sequence) => sequence[0]));\n const maxStackedData = max(stackedDataFlatten, (layer) => max(layer, (sequence) => sequence[1]));\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n if (typeof minStackedData === 'number') aux.push(minStackedData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (typeof end === 'number' || typeof end === 'object') aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n if (typeof maxStackedData === 'number') aux.push(maxStackedData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n if (typeof minRange === 'number' && typeof maxRange === 'number') {\n // @TODO fix this domain padding\n\n return [\n minRange - (maxRange - minRange) * (leftPadding ?? 0),\n maxRange + (maxRange - minRange) * (rightPadding ?? 0),\n ];\n }\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData, stackedData],\n );\n\n const getTimeLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n aux.push(begin);\n aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData],\n );\n\n // d3 scale functions\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.05);\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 // dataviz scales\n\n const xScale = useMemo(() => {\n if (xAxis?.type === 'time') return getScaleTime(getTimeLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n if (xAxis?.type === 'linear' || yAxis?.type === 'band') {\n return getScaleLinear(getLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n }\n\n return getScaleBand(getBandDomain(xAxis), [0, rangeToWidth]);\n }, [getBandDomain, getLinearDomain, getTimeLinearDomain, rangeToWidth, xAxis, yAxis?.type]);\n\n const yScale = useMemo(() => {\n if (yAxis?.type === 'band') return getScaleBand(getBandDomain(yAxis), [0, rangeToHeight]);\n if (yAxis?.type === 'log') return getScaleLog(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n return getScaleLinear(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n }, [getBandDomain, getLinearDomain, rangeToHeight, yAxis]);\n\n const y2Scale = useMemo(() => {\n if (!y2Axis) return null;\n if (y2Axis?.type === 'band') return getScaleBand(getBandDomain(y2Axis), [0, innerHeight]);\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(series.map((d) => d.name))\n .range(series.map((d) => COLOR_PALLET[d.color as keyof typeof COLOR_PALLET] ?? d.color))\n .unknown('red'),\n [series],\n );\n // get only groups bars to calculate the subgroup scale\n\n const subgroupsWithBars = useMemo(() => {\n const data = currentData\n .filter(\n (serie) => serie.type === 'bar' && !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1),\n )\n .map((serie) => serie.name);\n\n if (stackedSeries?.length) {\n stackedSeries.forEach((stackedGroup, i) => {\n if (stackedGroup.length > 0) data.push(`stacked-data-${i}`);\n });\n }\n return data;\n }, [currentData, stackedSeries]);\n\n const isXAxisCategorical = useMemo(\n () => (xAxis.type === undefined || xAxis.type === 'band') && yAxis.type !== 'band',\n [xAxis.type, yAxis.type],\n );\n const isYAxisCategorical = useMemo(() => yAxis.type === 'band', [yAxis.type]);\n const getBandwidth = useCallback(() => {\n if (isXAxisCategorical) {\n return (xScale as ScaleBand<string>).bandwidth();\n }\n if (isYAxisCategorical) {\n return (yScale as ScaleBand<string>).bandwidth();\n }\n // @todo explore this. is to create bars with a linear axis\n const bar = currentData.filter((serie) => serie.type === 'bar');\n const barsLength = bar.length;\n if (!barsLength) return;\n const width = innerWidth / bar[0].data.length;\n if (containerRatio > 1) {\n return width * containerRatio;\n }\n return Math.trunc(width - width * 0.2);\n }, [isXAxisCategorical, isYAxisCategorical, currentData, innerWidth, containerRatio, xScale, yScale]);\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 .paddingOuter(0.01)\n : null,\n [getBandwidth, subgroupsWithBars],\n );\n\n return { xScale, y2Scale, yScale, subGroupScale, colorScale, getBandwidth };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useCallback } from 'react';\nimport type { Series, ScaleBand } from 'd3';\nimport { max, min, scaleLinear, scaleBand, scaleUtc, scaleOrdinal, scaleLog } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\nimport { getStackedIndex, getStackedData } from '../helpers';\nimport { COLOR_PALLET } from '../helpers/colorPallet';\nimport { TIME_OFFSET } from '../../constants';\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: DSChartT.InternalData;\n groups: string[];\n containerRatio: number;\n}\nexport const useScales = ({\n props,\n originalSeries: series,\n innerHeight,\n innerWidth,\n stackedData,\n currentData,\n containerRatio,\n}: UseScales) => {\n const { xAxis, yAxis, y2Axis, groups: stackedSeries, xScroll } = props;\n\n // const xScroll = xAxis.advanced?.pointSpacing?.value > 1;\n const yScroll = yAxis.advanced?.pointSpacing?.value > 1;\n\n const rangeToWidth = innerWidth * (xScroll ? containerRatio : 1);\n const rangeToHeight = innerHeight * (yScroll ? containerRatio : 1);\n\n const getBandDomain = useCallback(\n (axis: DSChartT.AxisT) => axis.cols ?? [...series[0].data.map((_, i) => i.toString())],\n [series],\n );\n\n const getPadding = (domainPadding: number | Array<number>) =>\n typeof domainPadding === 'number' ? [domainPadding, domainPadding] : domainPadding ?? [0, 0];\n\n const getLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const stackedDataFlatten = stackedData.filter((data) => data.scale === axisString).flat();\n const minStackedData = min(stackedDataFlatten, (layer) => min(layer, (sequence) => sequence[0]));\n const maxStackedData = max(stackedDataFlatten, (layer) => max(layer, (sequence) => sequence[1]));\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n if (typeof minStackedData === 'number') aux.push(minStackedData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (typeof end === 'number' || typeof end === 'object') aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n if (typeof maxStackedData === 'number') aux.push(maxStackedData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n if (typeof minRange === 'number' && typeof maxRange === 'number') {\n // @TODO fix this domain padding\n\n return [\n minRange - (maxRange - minRange) * (leftPadding ?? 0),\n maxRange + (maxRange - minRange) * (rightPadding ?? 0),\n ];\n }\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData, stackedData],\n );\n\n const getTimeLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n aux.push(begin);\n aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData],\n );\n\n // d3 scale functions\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.05);\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 // dataviz scales\n\n const xScale = useMemo(() => {\n if (xAxis?.type === 'time') return getScaleTime(getTimeLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n if (xAxis?.type === 'linear' || yAxis?.type === 'band') {\n return getScaleLinear(getLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n }\n\n return getScaleBand(getBandDomain(xAxis), [0, rangeToWidth]);\n }, [getBandDomain, getLinearDomain, getTimeLinearDomain, rangeToWidth, xAxis, yAxis?.type]);\n\n const yScale = useMemo(() => {\n if (yAxis?.type === 'band') return getScaleBand(getBandDomain(yAxis), [0, rangeToHeight]);\n if (yAxis?.type === 'log') return getScaleLog(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n return getScaleLinear(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n }, [getBandDomain, getLinearDomain, rangeToHeight, yAxis]);\n\n const y2Scale = useMemo(() => {\n if (!y2Axis) return null;\n if (y2Axis?.type === 'band') return getScaleBand(getBandDomain(y2Axis), [0, innerHeight]);\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(series.map((d) => d.name))\n .range(series.map((d) => COLOR_PALLET[d.color as keyof typeof COLOR_PALLET] ?? d.color))\n .unknown('red'),\n [series],\n );\n // get only groups bars to calculate the subgroup scale\n\n const subgroupsWithBars = useMemo(() => {\n const data = currentData\n .filter(\n (serie) => serie.type === 'bar' && !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1),\n )\n .map((serie) => serie.name);\n\n if (stackedSeries?.length) {\n stackedSeries.forEach((stackedGroup, i) => {\n if (stackedGroup.length > 0) data.push(`stacked-data-${i}`);\n });\n }\n return data;\n }, [currentData, stackedSeries]);\n\n const isXAxisCategorical = useMemo(\n () => (xAxis.type === undefined || xAxis.type === 'band') && yAxis.type !== 'band',\n [xAxis.type, yAxis.type],\n );\n const isYAxisCategorical = useMemo(() => yAxis.type === 'band', [yAxis.type]);\n const getBandwidth = useCallback(() => {\n if (isXAxisCategorical) {\n return (xScale as ScaleBand<string>).bandwidth();\n }\n if (isYAxisCategorical) {\n return (yScale as ScaleBand<string>).bandwidth();\n }\n // @todo explore this. is to create bars with a linear axis\n const bar = currentData.filter((serie) => serie.type === 'bar');\n const barsLength = bar.length;\n if (!barsLength) return;\n const width = innerWidth / bar[0].data.length;\n if (containerRatio > 1) {\n return Math.max(0.5, width * containerRatio);\n }\n return Math.max(0.5, Math.trunc(width - width * 0.2));\n }, [isXAxisCategorical, isYAxisCategorical, currentData, innerWidth, containerRatio, xScale, yScale]);\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 .paddingOuter(0.01)\n : null,\n [getBandwidth, subgroupsWithBars],\n );\n\n return { xScale, y2Scale, yScale, subGroupScale, colorScale, getBandwidth };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": ["data"]
7
7
  }
package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js CHANGED
@@ -59,9 +59,9 @@ const AxisBottom = import_react.default.memo(() => {
59
59
  if (tickCount)
60
60
  return tickCount;
61
61
  if (containerRatio > 1) {
62
- return innerWidth / 100 * containerRatio;
62
+ return innerWidth / 80 * containerRatio;
63
63
  }
64
- return innerWidth / 100;
64
+ return innerWidth / 80;
65
65
  })();
66
66
  const ticks = xScale.ticks?.(ticksNum);
67
67
  if (containerRatio > 1 && uniqueData.length < 10 && !isHorizontal) {
package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../src/graphs/Chart/parts/Axis/AxisBottom.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useContext, useEffect, useRef } from 'react';\nimport type { ScaleLinear, ScaleTime } from 'd3';\nimport { select, axisBottom } from 'd3';\nimport { StyledAxis, StyledGrid } from '../../styles';\nimport { ChartContext } from '../../ChartContext';\nimport type { DSChartT } from '../../react-desc-prop-types';\nimport { useUniqueData } from '../../helpers/useUniqueData';\nimport { getFormatGenerator } from '../../helpers';\n\nexport const AxisBottom = React.memo(() => {\n const {\n props: { xAxis },\n innerHeight,\n xScale,\n innerWidth,\n containerRatio,\n internalMargin,\n isHorizontal,\n setAxisBottomRef,\n } = useContext(ChartContext);\n\n const axisRef = useRef<SVGSVGElement>(null);\n const gridRef = useRef<SVGSVGElement>(null);\n const { tickValues, tickFormat, overwriteTicks, color, tickRotation, tickCount } =\n xAxis.tick || ({} as DSChartT.AxisTickT);\n\n const ticksScales = ['linear', 'time', 'log'];\n // const ticks = xScale.ticks?.(tickCount ?? width / 100);\n\n const uniqueData = useUniqueData();\n useEffect(() => {\n const grid = axisBottom(xScale as ScaleLinear<number, number>)\n .tickSize(-innerHeight)\n .tickFormat('')\n .tickSizeOuter(0);\n\n const axis = axisBottom(xScale as ScaleLinear<number, number>).tickSizeOuter(0);\n\n if (ticksScales.includes(xAxis.type)) {\n const ticksNum = (() => {\n if (tickCount) return tickCount;\n if (containerRatio > 1) {\n return (innerWidth / 100) * containerRatio;\n }\n return innerWidth / 100;\n })();\n const ticks = (xScale as ScaleLinear<number, number> | ScaleTime<number, number, never>).ticks?.(ticksNum);\n\n // we show the only the ticks values on the screen when zoomed enough\n // @todo we need to improve this logic\n if (containerRatio > 1 && uniqueData.length < 10 && !isHorizontal) {\n const ticksName = uniqueData.map((u) => u.xValue);\n axis.tickValues(ticksName);\n grid.tickValues(ticksName);\n } else if (tickValues && ticks) {\n const finalTicks = overwriteTicks ? tickValues : [...ticks, ...tickValues];\n axis.tickValues(finalTicks);\n } else {\n axis.tickValues(ticks);\n grid.tickValues(ticks);\n }\n }\n\n if (tickFormat) {\n if (typeof tickFormat === 'string') {\n const formatGenerator = getFormatGenerator(xAxis.type ?? 'linear');\n axis.tickFormat((d) => formatGenerator(tickFormat)(d));\n }\n if (typeof tickFormat === 'function') {\n axis.tickFormat(tickFormat);\n }\n }\n\n if (axisRef?.current && gridRef?.current) {\n if (xAxis?.showGrid) select(gridRef.current).call(grid);\n const axisNode = select(axisRef.current);\n axisNode.call(axis);\n\n // // need to remove the first tick when live under the domain line\n // const firstTick = axisNode.select('.tick').node() as SVGGElement; // select all the text elements\n // if (firstTick?.getBoundingClientRect().left < internalMargin.left + 10 && !xScale.bandwidth) {\n // firstTick.remove();\n // }\n if (tickRotation)\n axisNode\n .selectAll('text')\n .style('text-anchor', tickRotation > 0 ? 'start' : 'end')\n .attr('dx', 8 * Math.sin(Math.PI * (tickRotation / 180)))\n .attr('dy', '.71em')\n .attr('y', 11.5 - 2.5 * (tickRotation / 15) * (tickRotation > 0 ? 1 : -1))\n .attr('transform', `rotate(${tickRotation})`);\n }\n }, [\n innerHeight,\n overwriteTicks,\n xAxis?.showGrid,\n tickFormat,\n tickValues,\n xScale,\n tickRotation,\n xAxis.type,\n ticksScales,\n tickCount,\n containerRatio,\n innerWidth,\n uniqueData.length,\n uniqueData,\n internalMargin.left,\n isHorizontal,\n ]);\n if (xAxis.hideAxis) return null;\n return (\n <g transform={`translate(0,${innerHeight})`}>\n <g ref={setAxisBottomRef}>\n <StyledAxis axisColor={xAxis.color} tickColor={color} ref={axisRef}></StyledAxis>\n </g>\n <StyledGrid ref={gridRef}></StyledGrid>\n </g>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useContext, useEffect, useRef } from 'react';\nimport type { ScaleLinear, ScaleTime } from 'd3';\nimport { select, axisBottom } from 'd3';\nimport { StyledAxis, StyledGrid } from '../../styles';\nimport { ChartContext } from '../../ChartContext';\nimport type { DSChartT } from '../../react-desc-prop-types';\nimport { useUniqueData } from '../../helpers/useUniqueData';\nimport { getFormatGenerator } from '../../helpers';\n\nexport const AxisBottom = React.memo(() => {\n const {\n props: { xAxis },\n innerHeight,\n xScale,\n innerWidth,\n containerRatio,\n internalMargin,\n isHorizontal,\n setAxisBottomRef,\n } = useContext(ChartContext);\n\n const axisRef = useRef<SVGSVGElement>(null);\n const gridRef = useRef<SVGSVGElement>(null);\n const { tickValues, tickFormat, overwriteTicks, color, tickRotation, tickCount } =\n xAxis.tick || ({} as DSChartT.AxisTickT);\n\n const ticksScales = ['linear', 'time', 'log'];\n // const ticks = xScale.ticks?.(tickCount ?? width / 100);\n\n const uniqueData = useUniqueData();\n useEffect(() => {\n const grid = axisBottom(xScale as ScaleLinear<number, number>)\n .tickSize(-innerHeight)\n .tickFormat('')\n .tickSizeOuter(0);\n\n const axis = axisBottom(xScale as ScaleLinear<number, number>).tickSizeOuter(0);\n\n if (ticksScales.includes(xAxis.type)) {\n const ticksNum = (() => {\n if (tickCount) return tickCount;\n if (containerRatio > 1) {\n return (innerWidth / 80) * containerRatio;\n }\n return innerWidth / 80;\n })();\n const ticks = (xScale as ScaleLinear<number, number> | ScaleTime<number, number, never>).ticks?.(ticksNum);\n\n // we show the only the ticks values on the screen when zoomed enough\n // @todo we need to improve this logic\n if (containerRatio > 1 && uniqueData.length < 10 && !isHorizontal) {\n const ticksName = uniqueData.map((u) => u.xValue);\n axis.tickValues(ticksName);\n grid.tickValues(ticksName);\n } else if (tickValues && ticks) {\n const finalTicks = overwriteTicks ? tickValues : [...ticks, ...tickValues];\n axis.tickValues(finalTicks);\n } else {\n axis.tickValues(ticks);\n grid.tickValues(ticks);\n }\n }\n\n if (tickFormat) {\n if (typeof tickFormat === 'string') {\n const formatGenerator = getFormatGenerator(xAxis.type ?? 'linear');\n axis.tickFormat((d) => formatGenerator(tickFormat)(d));\n }\n if (typeof tickFormat === 'function') {\n axis.tickFormat(tickFormat);\n }\n }\n\n if (axisRef?.current && gridRef?.current) {\n if (xAxis?.showGrid) select(gridRef.current).call(grid);\n const axisNode = select(axisRef.current);\n axisNode.call(axis);\n\n // // need to remove the first tick when live under the domain line\n // const firstTick = axisNode.select('.tick').node() as SVGGElement; // select all the text elements\n // if (firstTick?.getBoundingClientRect().left < internalMargin.left + 10 && !xScale.bandwidth) {\n // firstTick.remove();\n // }\n if (tickRotation)\n axisNode\n .selectAll('text')\n .style('text-anchor', tickRotation > 0 ? 'start' : 'end')\n .attr('dx', 8 * Math.sin(Math.PI * (tickRotation / 180)))\n .attr('dy', '.71em')\n .attr('y', 11.5 - 2.5 * (tickRotation / 15) * (tickRotation > 0 ? 1 : -1))\n .attr('transform', `rotate(${tickRotation})`);\n }\n }, [\n innerHeight,\n overwriteTicks,\n xAxis?.showGrid,\n tickFormat,\n tickValues,\n xScale,\n tickRotation,\n xAxis.type,\n ticksScales,\n tickCount,\n containerRatio,\n innerWidth,\n uniqueData.length,\n uniqueData,\n internalMargin.left,\n isHorizontal,\n ]);\n if (xAxis.hideAxis) return null;\n return (\n <g transform={`translate(0,${innerHeight})`}>\n <g ref={setAxisBottomRef}>\n <StyledAxis axisColor={xAxis.color} tickColor={color} ref={axisRef}></StyledAxis>\n </g>\n <StyledGrid ref={gridRef}></StyledGrid>\n </g>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": ["React"]
7
7
  }
package/dist/esm/graphs/Chart/config/useGetters.js CHANGED
@@ -3,6 +3,8 @@ import { useCallback, useMemo } from "react";
3
3
  const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) => {
4
4
  const getXValue = useCallback(
5
5
  (datum) => {
6
+ if (!datum)
7
+ return null;
6
8
  if (!isHorizontal) {
7
9
  if (xAxis?.cols?.[datum.position]) {
8
10
  return xAxis?.cols?.[datum.position];
@@ -20,6 +22,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
20
22
  );
21
23
  const getYValue = useCallback(
22
24
  (datum) => {
25
+ if (!datum)
26
+ return null;
23
27
  if (!isHorizontal) {
24
28
  if (typeof datum.value === "number") {
25
29
  return datum.value;
@@ -37,6 +41,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
37
41
  );
38
42
  const getXScaleValue = useCallback(
39
43
  (datum) => {
44
+ if (!datum)
45
+ return null;
40
46
  if (xAxis.type === "linear") {
41
47
  return xScale(getXValue(datum));
42
48
  }
@@ -46,6 +52,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
46
52
  );
47
53
  const getYScaleValue = useCallback(
48
54
  (datum) => {
55
+ if (!datum)
56
+ return null;
49
57
  const finalYScale = datum?.scale === "y2" ? y2Scale : yScale;
50
58
  if (yAxis.type === "band") {
51
59
  return finalYScale(getYValue(datum));
@@ -56,6 +64,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
56
64
  );
57
65
  const getYValueFormatted = useCallback(
58
66
  (datum) => {
67
+ if (!datum)
68
+ return null;
59
69
  const value = getYValue(datum);
60
70
  if (typeof yAxis.tick?.tickFormat === "function")
61
71
  return yAxis.tick.tickFormat(value);
@@ -65,6 +75,8 @@ const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }) =>
65
75
  );
66
76
  const getXValueFormatted = useCallback(
67
77
  (datum) => {
78
+ if (!datum)
79
+ return null;
68
80
  const value = getXValue(datum);
69
81
  if (typeof xAxis.tick?.tickFormat === "function")
70
82
  return xAxis.tick.tickFormat(value);
package/dist/esm/graphs/Chart/config/useGetters.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/config/useGetters.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, useMemo } from 'react';\nimport type { ScaleBand, ScaleLinear } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\n\ninterface UseGettersT {\n xAxis: DSChartT.AxisT;\n yAxis: DSChartT.AxisT;\n isHorizontal: boolean;\n xScale: DSChartT.Scales;\n yScale: DSChartT.Scales;\n y2Scale: DSChartT.Scales;\n}\nexport const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }: UseGettersT) => {\n const getXValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!isHorizontal) {\n if (xAxis?.cols?.[datum.position]) {\n return xAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.x;\n return datum.position.toString();\n }\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.x;\n },\n [isHorizontal, xAxis?.cols],\n );\n\n const getYValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!isHorizontal) {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.y;\n }\n if (yAxis?.cols?.[datum.position]) {\n return yAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.y;\n return datum.position.toString();\n },\n [isHorizontal, yAxis?.cols],\n );\n\n const getXScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (xAxis.type === 'linear') {\n return (xScale as ScaleLinear<number, number, never>)(getXValue(datum) as number);\n }\n return (xScale as ScaleBand<string>)(getXValue(datum) as string);\n },\n [getXValue, xAxis.type, xScale],\n );\n\n const getYScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n const finalYScale = datum?.scale === 'y2' ? y2Scale : yScale;\n if (yAxis.type === 'band') {\n return (finalYScale as ScaleBand<string>)(getYValue(datum) as string);\n }\n return (finalYScale as ScaleLinear<number, number, never>)(getYValue(datum) as number);\n },\n [getYValue, y2Scale, yAxis.type, yScale],\n );\n\n const getYValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n const value = getYValue(datum);\n if (typeof yAxis.tick?.tickFormat === 'function') return yAxis.tick.tickFormat(value);\n return value;\n },\n [getYValue, yAxis.tick],\n );\n\n const getXValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n const value = getXValue(datum);\n if (typeof xAxis.tick?.tickFormat === 'function') return xAxis.tick.tickFormat(value);\n return value;\n },\n [getXValue, xAxis.tick],\n );\n\n return useMemo(\n () => ({ getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted }),\n [getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted],\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACIvB,SAAS,aAAa,eAAe;AAY9B,MAAM,aAAa,CAAC,EAAE,OAAO,cAAc,OAAO,QAAQ,QAAQ,QAAQ,MAAmB;AAClG,QAAM,YAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,OAAO,MAAM,WAAW;AACjC,iBAAO,OAAO,OAAO,MAAM;AAAA,QAC7B;AACA,YAAI,OAAO,MAAM,UAAU;AAAU,iBAAO,MAAM,OAAO;AACzD,eAAO,MAAM,SAAS,SAAS;AAAA,MACjC;AACA,UAAI,OAAO,MAAM,UAAU,UAAU;AACnC,eAAO,MAAM;AAAA,MACf;AACA,aAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,MAAM,UAAU,UAAU;AACnC,iBAAO,MAAM;AAAA,QACf;AACA,eAAO,MAAM,OAAO;AAAA,MACtB;AACA,UAAI,OAAO,OAAO,MAAM,WAAW;AACjC,eAAO,OAAO,OAAO,MAAM;AAAA,MAC7B;AACA,UAAI,OAAO,MAAM,UAAU;AAAU,eAAO,MAAM,OAAO;AACzD,aAAO,MAAM,SAAS,SAAS;AAAA,IACjC;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,iBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,UAAI,MAAM,SAAS,UAAU;AAC3B,eAAQ,OAA8C,UAAU,KAAK,CAAW;AAAA,MAClF;AACA,aAAQ,OAA6B,UAAU,KAAK,CAAW;AAAA,IACjE;AAAA,IACA,CAAC,WAAW,MAAM,MAAM,MAAM;AAAA,EAChC;AAEA,QAAM,iBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,YAAM,cAAc,OAAO,UAAU,OAAO,UAAU;AACtD,UAAI,MAAM,SAAS,QAAQ;AACzB,eAAQ,YAAkC,UAAU,KAAK,CAAW;AAAA,MACtE;AACA,aAAQ,YAAmD,UAAU,KAAK,CAAW;AAAA,IACvF;AAAA,IACA,CAAC,WAAW,SAAS,MAAM,MAAM,MAAM;AAAA,EACzC;AAEA,QAAM,qBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,QAAM,qBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,SAAO;AAAA,IACL,OAAO,EAAE,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,mBAAmB;AAAA,IACtG,CAAC,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,kBAAkB;AAAA,EAC/F;AACF;",
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, useMemo } from 'react';\nimport type { ScaleBand, ScaleLinear } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\n\ninterface UseGettersT {\n xAxis: DSChartT.AxisT;\n yAxis: DSChartT.AxisT;\n isHorizontal: boolean;\n xScale: DSChartT.Scales;\n yScale: DSChartT.Scales;\n y2Scale: DSChartT.Scales;\n}\nexport const useGetters = ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }: UseGettersT) => {\n const getXValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n if (!isHorizontal) {\n if (xAxis?.cols?.[datum.position]) {\n return xAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.x;\n return datum.position.toString();\n }\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.x;\n },\n [isHorizontal, xAxis?.cols],\n );\n\n const getYValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n if (!isHorizontal) {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n return datum.value?.y;\n }\n if (yAxis?.cols?.[datum.position]) {\n return yAxis?.cols?.[datum.position];\n }\n if (typeof datum.value === 'object') return datum.value?.y;\n return datum.position.toString();\n },\n [isHorizontal, yAxis?.cols],\n );\n\n const getXScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n if (xAxis.type === 'linear') {\n return (xScale as ScaleLinear<number, number, never>)(getXValue(datum) as number);\n }\n return (xScale as ScaleBand<string>)(getXValue(datum) as string);\n },\n [getXValue, xAxis.type, xScale],\n );\n\n const getYScaleValue = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n const finalYScale = datum?.scale === 'y2' ? y2Scale : yScale;\n if (yAxis.type === 'band') {\n return (finalYScale as ScaleBand<string>)(getYValue(datum) as string);\n }\n return (finalYScale as ScaleLinear<number, number, never>)(getYValue(datum) as number);\n },\n [getYValue, y2Scale, yAxis.type, yScale],\n );\n\n const getYValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n const value = getYValue(datum);\n if (typeof yAxis.tick?.tickFormat === 'function') return yAxis.tick.tickFormat(value);\n return value;\n },\n [getYValue, yAxis.tick],\n );\n\n const getXValueFormatted = useCallback(\n (datum: DSChartT.InternalDatum) => {\n if (!datum) return null;\n\n const value = getXValue(datum);\n if (typeof xAxis.tick?.tickFormat === 'function') return xAxis.tick.tickFormat(value);\n return value;\n },\n [getXValue, xAxis.tick],\n );\n\n return useMemo(\n () => ({ getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted }),\n [getYValue, getXValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted],\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACIvB,SAAS,aAAa,eAAe;AAY9B,MAAM,aAAa,CAAC,EAAE,OAAO,cAAc,OAAO,QAAQ,QAAQ,QAAQ,MAAmB;AAClG,QAAM,YAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AACnB,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,OAAO,MAAM,WAAW;AACjC,iBAAO,OAAO,OAAO,MAAM;AAAA,QAC7B;AACA,YAAI,OAAO,MAAM,UAAU;AAAU,iBAAO,MAAM,OAAO;AACzD,eAAO,MAAM,SAAS,SAAS;AAAA,MACjC;AACA,UAAI,OAAO,MAAM,UAAU,UAAU;AACnC,eAAO,MAAM;AAAA,MACf;AACA,aAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,UAAI,CAAC,cAAc;AACjB,YAAI,OAAO,MAAM,UAAU,UAAU;AACnC,iBAAO,MAAM;AAAA,QACf;AACA,eAAO,MAAM,OAAO;AAAA,MACtB;AACA,UAAI,OAAO,OAAO,MAAM,WAAW;AACjC,eAAO,OAAO,OAAO,MAAM;AAAA,MAC7B;AACA,UAAI,OAAO,MAAM,UAAU;AAAU,eAAO,MAAM,OAAO;AACzD,aAAO,MAAM,SAAS,SAAS;AAAA,IACjC;AAAA,IACA,CAAC,cAAc,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,iBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,UAAI,MAAM,SAAS,UAAU;AAC3B,eAAQ,OAA8C,UAAU,KAAK,CAAW;AAAA,MAClF;AACA,aAAQ,OAA6B,UAAU,KAAK,CAAW;AAAA,IACjE;AAAA,IACA,CAAC,WAAW,MAAM,MAAM,MAAM;AAAA,EAChC;AAEA,QAAM,iBAAiB;AAAA,IACrB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,YAAM,cAAc,OAAO,UAAU,OAAO,UAAU;AACtD,UAAI,MAAM,SAAS,QAAQ;AACzB,eAAQ,YAAkC,UAAU,KAAK,CAAW;AAAA,MACtE;AACA,aAAQ,YAAmD,UAAU,KAAK,CAAW;AAAA,IACvF;AAAA,IACA,CAAC,WAAW,SAAS,MAAM,MAAM,MAAM;AAAA,EACzC;AAEA,QAAM,qBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,QAAM,qBAAqB;AAAA,IACzB,CAAC,UAAkC;AACjC,UAAI,CAAC;AAAO,eAAO;AAEnB,YAAM,QAAQ,UAAU,KAAK;AAC7B,UAAI,OAAO,MAAM,MAAM,eAAe;AAAY,eAAO,MAAM,KAAK,WAAW,KAAK;AACpF,aAAO;AAAA,IACT;AAAA,IACA,CAAC,WAAW,MAAM,IAAI;AAAA,EACxB;AAEA,SAAO;AAAA,IACL,OAAO,EAAE,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,mBAAmB;AAAA,IACtG,CAAC,WAAW,WAAW,gBAAgB,gBAAgB,oBAAoB,kBAAkB;AAAA,EAC/F;AACF;",
6
6
  "names": []
7
7
  }
package/dist/esm/graphs/Chart/config/useScales.js CHANGED
@@ -194,9 +194,9 @@ const useScales = ({
194
194
  return;
195
195
  const width = innerWidth / bar[0].data.length;
196
196
  if (containerRatio > 1) {
197
- return width * containerRatio;
197
+ return Math.max(0.5, width * containerRatio);
198
198
  }
199
- return Math.trunc(width - width * 0.2);
199
+ return Math.max(0.5, Math.trunc(width - width * 0.2));
200
200
  }, [isXAxisCategorical, isYAxisCategorical, currentData, innerWidth, containerRatio, xScale, yScale]);
201
201
  const subGroupScale = useMemo(
202
202
  () => getBandwidth() ? scaleBand().domain(subgroupsWithBars).range([0, getBandwidth() ?? 0]).paddingInner(0.55).padding(0.2).paddingOuter(0.01) : null,
package/dist/esm/graphs/Chart/config/useScales.js.map CHANGED
@@ -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-lines */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useCallback } from 'react';\nimport type { Series, ScaleBand } from 'd3';\nimport { max, min, scaleLinear, scaleBand, scaleUtc, scaleOrdinal, scaleLog } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\nimport { getStackedIndex, getStackedData } from '../helpers';\nimport { COLOR_PALLET } from '../helpers/colorPallet';\nimport { TIME_OFFSET } from '../../constants';\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: DSChartT.InternalData;\n groups: string[];\n containerRatio: number;\n}\nexport const useScales = ({\n props,\n originalSeries: series,\n innerHeight,\n innerWidth,\n stackedData,\n currentData,\n containerRatio,\n}: UseScales) => {\n const { xAxis, yAxis, y2Axis, groups: stackedSeries, xScroll } = props;\n\n // const xScroll = xAxis.advanced?.pointSpacing?.value > 1;\n const yScroll = yAxis.advanced?.pointSpacing?.value > 1;\n\n const rangeToWidth = innerWidth * (xScroll ? containerRatio : 1);\n const rangeToHeight = innerHeight * (yScroll ? containerRatio : 1);\n\n const getBandDomain = useCallback(\n (axis: DSChartT.AxisT) => axis.cols ?? [...series[0].data.map((_, i) => i.toString())],\n [series],\n );\n\n const getPadding = (domainPadding: number | Array<number>) =>\n typeof domainPadding === 'number' ? [domainPadding, domainPadding] : domainPadding ?? [0, 0];\n\n const getLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const stackedDataFlatten = stackedData.filter((data) => data.scale === axisString).flat();\n const minStackedData = min(stackedDataFlatten, (layer) => min(layer, (sequence) => sequence[0]));\n const maxStackedData = max(stackedDataFlatten, (layer) => max(layer, (sequence) => sequence[1]));\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n if (typeof minStackedData === 'number') aux.push(minStackedData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (typeof end === 'number' || typeof end === 'object') aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n if (typeof maxStackedData === 'number') aux.push(maxStackedData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n if (typeof minRange === 'number' && typeof maxRange === 'number') {\n // @TODO fix this domain padding\n\n return [\n minRange - (maxRange - minRange) * (leftPadding ?? 0),\n maxRange + (maxRange - minRange) * (rightPadding ?? 0),\n ];\n }\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData, stackedData],\n );\n\n const getTimeLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n aux.push(begin);\n aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData],\n );\n\n // d3 scale functions\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.05);\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 // dataviz scales\n\n const xScale = useMemo(() => {\n if (xAxis?.type === 'time') return getScaleTime(getTimeLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n if (xAxis?.type === 'linear' || yAxis?.type === 'band') {\n return getScaleLinear(getLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n }\n\n return getScaleBand(getBandDomain(xAxis), [0, rangeToWidth]);\n }, [getBandDomain, getLinearDomain, getTimeLinearDomain, rangeToWidth, xAxis, yAxis?.type]);\n\n const yScale = useMemo(() => {\n if (yAxis?.type === 'band') return getScaleBand(getBandDomain(yAxis), [0, rangeToHeight]);\n if (yAxis?.type === 'log') return getScaleLog(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n return getScaleLinear(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n }, [getBandDomain, getLinearDomain, rangeToHeight, yAxis]);\n\n const y2Scale = useMemo(() => {\n if (!y2Axis) return null;\n if (y2Axis?.type === 'band') return getScaleBand(getBandDomain(y2Axis), [0, innerHeight]);\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(series.map((d) => d.name))\n .range(series.map((d) => COLOR_PALLET[d.color as keyof typeof COLOR_PALLET] ?? d.color))\n .unknown('red'),\n [series],\n );\n // get only groups bars to calculate the subgroup scale\n\n const subgroupsWithBars = useMemo(() => {\n const data = currentData\n .filter(\n (serie) => serie.type === 'bar' && !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1),\n )\n .map((serie) => serie.name);\n\n if (stackedSeries?.length) {\n stackedSeries.forEach((stackedGroup, i) => {\n if (stackedGroup.length > 0) data.push(`stacked-data-${i}`);\n });\n }\n return data;\n }, [currentData, stackedSeries]);\n\n const isXAxisCategorical = useMemo(\n () => (xAxis.type === undefined || xAxis.type === 'band') && yAxis.type !== 'band',\n [xAxis.type, yAxis.type],\n );\n const isYAxisCategorical = useMemo(() => yAxis.type === 'band', [yAxis.type]);\n const getBandwidth = useCallback(() => {\n if (isXAxisCategorical) {\n return (xScale as ScaleBand<string>).bandwidth();\n }\n if (isYAxisCategorical) {\n return (yScale as ScaleBand<string>).bandwidth();\n }\n // @todo explore this. is to create bars with a linear axis\n const bar = currentData.filter((serie) => serie.type === 'bar');\n const barsLength = bar.length;\n if (!barsLength) return;\n const width = innerWidth / bar[0].data.length;\n if (containerRatio > 1) {\n return width * containerRatio;\n }\n return Math.trunc(width - width * 0.2);\n }, [isXAxisCategorical, isYAxisCategorical, currentData, innerWidth, containerRatio, xScale, yScale]);\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 .paddingOuter(0.01)\n : null,\n [getBandwidth, subgroupsWithBars],\n );\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-lines */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useCallback } from 'react';\nimport type { Series, ScaleBand } from 'd3';\nimport { max, min, scaleLinear, scaleBand, scaleUtc, scaleOrdinal, scaleLog } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types';\nimport { getStackedIndex, getStackedData } from '../helpers';\nimport { COLOR_PALLET } from '../helpers/colorPallet';\nimport { TIME_OFFSET } from '../../constants';\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: DSChartT.InternalData;\n groups: string[];\n containerRatio: number;\n}\nexport const useScales = ({\n props,\n originalSeries: series,\n innerHeight,\n innerWidth,\n stackedData,\n currentData,\n containerRatio,\n}: UseScales) => {\n const { xAxis, yAxis, y2Axis, groups: stackedSeries, xScroll } = props;\n\n // const xScroll = xAxis.advanced?.pointSpacing?.value > 1;\n const yScroll = yAxis.advanced?.pointSpacing?.value > 1;\n\n const rangeToWidth = innerWidth * (xScroll ? containerRatio : 1);\n const rangeToHeight = innerHeight * (yScroll ? containerRatio : 1);\n\n const getBandDomain = useCallback(\n (axis: DSChartT.AxisT) => axis.cols ?? [...series[0].data.map((_, i) => i.toString())],\n [series],\n );\n\n const getPadding = (domainPadding: number | Array<number>) =>\n typeof domainPadding === 'number' ? [domainPadding, domainPadding] : domainPadding ?? [0, 0];\n\n const getLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const stackedDataFlatten = stackedData.filter((data) => data.scale === axisString).flat();\n const minStackedData = min(stackedDataFlatten, (layer) => min(layer, (sequence) => sequence[0]));\n const maxStackedData = max(stackedDataFlatten, (layer) => max(layer, (sequence) => sequence[1]));\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n if (typeof minStackedData === 'number') aux.push(minStackedData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n if (typeof begin === 'number' || typeof begin === 'object') aux.push(begin);\n if (typeof end === 'number' || typeof end === 'object') aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n if (typeof maxStackedData === 'number') aux.push(maxStackedData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n if (typeof minRange === 'number' && typeof maxRange === 'number') {\n // @TODO fix this domain padding\n\n return [\n minRange - (maxRange - minRange) * (leftPadding ?? 0),\n maxRange + (maxRange - minRange) * (rightPadding ?? 0),\n ];\n }\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData, stackedData],\n );\n\n const getTimeLinearDomain = useCallback(\n (axis: DSChartT.AxisT, axisString: 'x' | 'y' | 'y2') => {\n // we are calculating the min and max between all the data\n // including the stacked groups if exists\n\n const begin = axis?.beginAtZero ? 0 : axis.min ?? undefined;\n const end = axis.max ?? undefined;\n const data = currentData\n // we filter the data based on scale.. if is x axis we dont because theres no x2 axis\n .filter((serie) => serie.scale === axisString || axisString === 'x')\n .map((serie) =>\n serie.data\n .filter((datum) => datum.value !== null)\n .map((datum) => {\n if (typeof datum.value === 'number') {\n return datum.value;\n }\n\n return datum.value[axisString === 'y2' ? 'y' : axisString];\n }),\n );\n\n const dataFlattened = data.flat();\n const minData = min(dataFlattened);\n const maxData = max(dataFlattened);\n const types = ['number', 'object'];\n\n const getMin = () => {\n const aux = [];\n aux.push(begin);\n if (types.includes(typeof minData)) aux.push(minData);\n return min(aux);\n };\n const getMax = () => {\n const aux = [];\n aux.push(begin);\n aux.push(end);\n if (types.includes(typeof maxData)) aux.push(maxData);\n return max(aux);\n };\n const minRange = getMin();\n const maxRange = getMax();\n\n const [leftPadding, rightPadding] = getPadding(axis.domainPadding);\n\n // timelinear case\n if (typeof minRange === 'object' && typeof maxRange === 'object') {\n if (axis.domainPaddingType && TIME_OFFSET[axis.domainPaddingType]) {\n return [\n TIME_OFFSET[axis.domainPaddingType].offset(minRange, -leftPadding),\n TIME_OFFSET[axis.domainPaddingType].offset(maxRange, rightPadding),\n ];\n }\n return [minRange, maxRange];\n }\n\n return [];\n },\n [currentData],\n );\n\n // d3 scale functions\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.05);\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 // dataviz scales\n\n const xScale = useMemo(() => {\n if (xAxis?.type === 'time') return getScaleTime(getTimeLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n if (xAxis?.type === 'linear' || yAxis?.type === 'band') {\n return getScaleLinear(getLinearDomain(xAxis, 'x'), [0, rangeToWidth]);\n }\n\n return getScaleBand(getBandDomain(xAxis), [0, rangeToWidth]);\n }, [getBandDomain, getLinearDomain, getTimeLinearDomain, rangeToWidth, xAxis, yAxis?.type]);\n\n const yScale = useMemo(() => {\n if (yAxis?.type === 'band') return getScaleBand(getBandDomain(yAxis), [0, rangeToHeight]);\n if (yAxis?.type === 'log') return getScaleLog(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n return getScaleLinear(getLinearDomain(yAxis, 'y'), [rangeToHeight, 0]);\n }, [getBandDomain, getLinearDomain, rangeToHeight, yAxis]);\n\n const y2Scale = useMemo(() => {\n if (!y2Axis) return null;\n if (y2Axis?.type === 'band') return getScaleBand(getBandDomain(y2Axis), [0, innerHeight]);\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(series.map((d) => d.name))\n .range(series.map((d) => COLOR_PALLET[d.color as keyof typeof COLOR_PALLET] ?? d.color))\n .unknown('red'),\n [series],\n );\n // get only groups bars to calculate the subgroup scale\n\n const subgroupsWithBars = useMemo(() => {\n const data = currentData\n .filter(\n (serie) => serie.type === 'bar' && !(stackedSeries?.length && getStackedIndex(stackedSeries, serie.name) > -1),\n )\n .map((serie) => serie.name);\n\n if (stackedSeries?.length) {\n stackedSeries.forEach((stackedGroup, i) => {\n if (stackedGroup.length > 0) data.push(`stacked-data-${i}`);\n });\n }\n return data;\n }, [currentData, stackedSeries]);\n\n const isXAxisCategorical = useMemo(\n () => (xAxis.type === undefined || xAxis.type === 'band') && yAxis.type !== 'band',\n [xAxis.type, yAxis.type],\n );\n const isYAxisCategorical = useMemo(() => yAxis.type === 'band', [yAxis.type]);\n const getBandwidth = useCallback(() => {\n if (isXAxisCategorical) {\n return (xScale as ScaleBand<string>).bandwidth();\n }\n if (isYAxisCategorical) {\n return (yScale as ScaleBand<string>).bandwidth();\n }\n // @todo explore this. is to create bars with a linear axis\n const bar = currentData.filter((serie) => serie.type === 'bar');\n const barsLength = bar.length;\n if (!barsLength) return;\n const width = innerWidth / bar[0].data.length;\n if (containerRatio > 1) {\n return Math.max(0.5, width * containerRatio);\n }\n return Math.max(0.5, Math.trunc(width - width * 0.2));\n }, [isXAxisCategorical, isYAxisCategorical, currentData, innerWidth, containerRatio, xScale, yScale]);\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 .paddingOuter(0.01)\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": ["data"]
7
7
  }
package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js CHANGED
@@ -30,9 +30,9 @@ const AxisBottom = React2.memo(() => {
30
30
  if (tickCount)
31
31
  return tickCount;
32
32
  if (containerRatio > 1) {
33
- return innerWidth / 100 * containerRatio;
33
+ return innerWidth / 80 * containerRatio;
34
34
  }
35
- return innerWidth / 100;
35
+ return innerWidth / 80;
36
36
  })();
37
37
  const ticks = xScale.ticks?.(ticksNum);
38
38
  if (containerRatio > 1 && uniqueData.length < 10 && !isHorizontal) {
package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../../src/graphs/Chart/parts/Axis/AxisBottom.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useContext, useEffect, useRef } from 'react';\nimport type { ScaleLinear, ScaleTime } from 'd3';\nimport { select, axisBottom } from 'd3';\nimport { StyledAxis, StyledGrid } from '../../styles';\nimport { ChartContext } from '../../ChartContext';\nimport type { DSChartT } from '../../react-desc-prop-types';\nimport { useUniqueData } from '../../helpers/useUniqueData';\nimport { getFormatGenerator } from '../../helpers';\n\nexport const AxisBottom = React.memo(() => {\n const {\n props: { xAxis },\n innerHeight,\n xScale,\n innerWidth,\n containerRatio,\n internalMargin,\n isHorizontal,\n setAxisBottomRef,\n } = useContext(ChartContext);\n\n const axisRef = useRef<SVGSVGElement>(null);\n const gridRef = useRef<SVGSVGElement>(null);\n const { tickValues, tickFormat, overwriteTicks, color, tickRotation, tickCount } =\n xAxis.tick || ({} as DSChartT.AxisTickT);\n\n const ticksScales = ['linear', 'time', 'log'];\n // const ticks = xScale.ticks?.(tickCount ?? width / 100);\n\n const uniqueData = useUniqueData();\n useEffect(() => {\n const grid = axisBottom(xScale as ScaleLinear<number, number>)\n .tickSize(-innerHeight)\n .tickFormat('')\n .tickSizeOuter(0);\n\n const axis = axisBottom(xScale as ScaleLinear<number, number>).tickSizeOuter(0);\n\n if (ticksScales.includes(xAxis.type)) {\n const ticksNum = (() => {\n if (tickCount) return tickCount;\n if (containerRatio > 1) {\n return (innerWidth / 100) * containerRatio;\n }\n return innerWidth / 100;\n })();\n const ticks = (xScale as ScaleLinear<number, number> | ScaleTime<number, number, never>).ticks?.(ticksNum);\n\n // we show the only the ticks values on the screen when zoomed enough\n // @todo we need to improve this logic\n if (containerRatio > 1 && uniqueData.length < 10 && !isHorizontal) {\n const ticksName = uniqueData.map((u) => u.xValue);\n axis.tickValues(ticksName);\n grid.tickValues(ticksName);\n } else if (tickValues && ticks) {\n const finalTicks = overwriteTicks ? tickValues : [...ticks, ...tickValues];\n axis.tickValues(finalTicks);\n } else {\n axis.tickValues(ticks);\n grid.tickValues(ticks);\n }\n }\n\n if (tickFormat) {\n if (typeof tickFormat === 'string') {\n const formatGenerator = getFormatGenerator(xAxis.type ?? 'linear');\n axis.tickFormat((d) => formatGenerator(tickFormat)(d));\n }\n if (typeof tickFormat === 'function') {\n axis.tickFormat(tickFormat);\n }\n }\n\n if (axisRef?.current && gridRef?.current) {\n if (xAxis?.showGrid) select(gridRef.current).call(grid);\n const axisNode = select(axisRef.current);\n axisNode.call(axis);\n\n // // need to remove the first tick when live under the domain line\n // const firstTick = axisNode.select('.tick').node() as SVGGElement; // select all the text elements\n // if (firstTick?.getBoundingClientRect().left < internalMargin.left + 10 && !xScale.bandwidth) {\n // firstTick.remove();\n // }\n if (tickRotation)\n axisNode\n .selectAll('text')\n .style('text-anchor', tickRotation > 0 ? 'start' : 'end')\n .attr('dx', 8 * Math.sin(Math.PI * (tickRotation / 180)))\n .attr('dy', '.71em')\n .attr('y', 11.5 - 2.5 * (tickRotation / 15) * (tickRotation > 0 ? 1 : -1))\n .attr('transform', `rotate(${tickRotation})`);\n }\n }, [\n innerHeight,\n overwriteTicks,\n xAxis?.showGrid,\n tickFormat,\n tickValues,\n xScale,\n tickRotation,\n xAxis.type,\n ticksScales,\n tickCount,\n containerRatio,\n innerWidth,\n uniqueData.length,\n uniqueData,\n internalMargin.left,\n isHorizontal,\n ]);\n if (xAxis.hideAxis) return null;\n return (\n <g transform={`translate(0,${innerHeight})`}>\n <g ref={setAxisBottomRef}>\n <StyledAxis axisColor={xAxis.color} tickColor={color} ref={axisRef}></StyledAxis>\n </g>\n <StyledGrid ref={gridRef}></StyledGrid>\n </g>\n );\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 complexity */\nimport React, { useContext, useEffect, useRef } from 'react';\nimport type { ScaleLinear, ScaleTime } from 'd3';\nimport { select, axisBottom } from 'd3';\nimport { StyledAxis, StyledGrid } from '../../styles';\nimport { ChartContext } from '../../ChartContext';\nimport type { DSChartT } from '../../react-desc-prop-types';\nimport { useUniqueData } from '../../helpers/useUniqueData';\nimport { getFormatGenerator } from '../../helpers';\n\nexport const AxisBottom = React.memo(() => {\n const {\n props: { xAxis },\n innerHeight,\n xScale,\n innerWidth,\n containerRatio,\n internalMargin,\n isHorizontal,\n setAxisBottomRef,\n } = useContext(ChartContext);\n\n const axisRef = useRef<SVGSVGElement>(null);\n const gridRef = useRef<SVGSVGElement>(null);\n const { tickValues, tickFormat, overwriteTicks, color, tickRotation, tickCount } =\n xAxis.tick || ({} as DSChartT.AxisTickT);\n\n const ticksScales = ['linear', 'time', 'log'];\n // const ticks = xScale.ticks?.(tickCount ?? width / 100);\n\n const uniqueData = useUniqueData();\n useEffect(() => {\n const grid = axisBottom(xScale as ScaleLinear<number, number>)\n .tickSize(-innerHeight)\n .tickFormat('')\n .tickSizeOuter(0);\n\n const axis = axisBottom(xScale as ScaleLinear<number, number>).tickSizeOuter(0);\n\n if (ticksScales.includes(xAxis.type)) {\n const ticksNum = (() => {\n if (tickCount) return tickCount;\n if (containerRatio > 1) {\n return (innerWidth / 80) * containerRatio;\n }\n return innerWidth / 80;\n })();\n const ticks = (xScale as ScaleLinear<number, number> | ScaleTime<number, number, never>).ticks?.(ticksNum);\n\n // we show the only the ticks values on the screen when zoomed enough\n // @todo we need to improve this logic\n if (containerRatio > 1 && uniqueData.length < 10 && !isHorizontal) {\n const ticksName = uniqueData.map((u) => u.xValue);\n axis.tickValues(ticksName);\n grid.tickValues(ticksName);\n } else if (tickValues && ticks) {\n const finalTicks = overwriteTicks ? tickValues : [...ticks, ...tickValues];\n axis.tickValues(finalTicks);\n } else {\n axis.tickValues(ticks);\n grid.tickValues(ticks);\n }\n }\n\n if (tickFormat) {\n if (typeof tickFormat === 'string') {\n const formatGenerator = getFormatGenerator(xAxis.type ?? 'linear');\n axis.tickFormat((d) => formatGenerator(tickFormat)(d));\n }\n if (typeof tickFormat === 'function') {\n axis.tickFormat(tickFormat);\n }\n }\n\n if (axisRef?.current && gridRef?.current) {\n if (xAxis?.showGrid) select(gridRef.current).call(grid);\n const axisNode = select(axisRef.current);\n axisNode.call(axis);\n\n // // need to remove the first tick when live under the domain line\n // const firstTick = axisNode.select('.tick').node() as SVGGElement; // select all the text elements\n // if (firstTick?.getBoundingClientRect().left < internalMargin.left + 10 && !xScale.bandwidth) {\n // firstTick.remove();\n // }\n if (tickRotation)\n axisNode\n .selectAll('text')\n .style('text-anchor', tickRotation > 0 ? 'start' : 'end')\n .attr('dx', 8 * Math.sin(Math.PI * (tickRotation / 180)))\n .attr('dy', '.71em')\n .attr('y', 11.5 - 2.5 * (tickRotation / 15) * (tickRotation > 0 ? 1 : -1))\n .attr('transform', `rotate(${tickRotation})`);\n }\n }, [\n innerHeight,\n overwriteTicks,\n xAxis?.showGrid,\n tickFormat,\n tickValues,\n xScale,\n tickRotation,\n xAxis.type,\n ticksScales,\n tickCount,\n containerRatio,\n innerWidth,\n uniqueData.length,\n uniqueData,\n internalMargin.left,\n isHorizontal,\n ]);\n if (xAxis.hideAxis) return null;\n return (\n <g transform={`translate(0,${innerHeight})`}>\n <g ref={setAxisBottomRef}>\n <StyledAxis axisColor={xAxis.color} tickColor={color} ref={axisRef}></StyledAxis>\n </g>\n <StyledGrid ref={gridRef}></StyledGrid>\n </g>\n );\n});\n"],
5
+ "mappings": "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",
6
6
  "names": ["React"]
7
7
  }
package/dist/types/graphs/Chart/config/useChart.d.ts CHANGED
@@ -62,15 +62,15 @@ export declare const useChart: (props: DSChartT.Props) => {
62
62
  setAxisRightRef: import("react").Dispatch<import("react").SetStateAction<SVGGElement | null>>;
63
63
  setRightLabel: import("react").Dispatch<import("react").SetStateAction<SVGGElement | null>>;
64
64
  setBottomLabel: import("react").Dispatch<import("react").SetStateAction<SVGGElement | null>>;
65
- getXScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;
66
- getYScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;
67
- getYValueFormatted: (datum: DSChartT.InternalDatum) => string | number;
68
- getXValueFormatted: (datum: DSChartT.InternalDatum) => string | number;
65
+ getXScaleValue: (datum: DSChartT.InternalDatum) => number | null | undefined;
66
+ getYScaleValue: (datum: DSChartT.InternalDatum) => number | null | undefined;
67
+ getYValueFormatted: (datum: DSChartT.InternalDatum) => string | number | null;
68
+ getXValueFormatted: (datum: DSChartT.InternalDatum) => string | number | null;
69
69
  bottomLabelHeight: number;
70
70
  rightLabelWidth: number;
71
71
  axisRightWidth: number;
72
- getXValue: (datum: DSChartT.InternalDatum) => string | number;
73
- getYValue: (datum: DSChartT.InternalDatum) => string | number;
72
+ getXValue: (datum: DSChartT.InternalDatum) => string | number | null;
73
+ getYValue: (datum: DSChartT.InternalDatum) => string | number | null;
74
74
  isHorizontal: boolean;
75
75
  setLeftLabel: import("react").Dispatch<import("react").SetStateAction<SVGGElement | null>>;
76
76
  leftLabel: SVGGElement | null;
package/dist/types/graphs/Chart/config/useGetters.d.ts CHANGED
@@ -8,11 +8,11 @@ interface UseGettersT {
8
8
  y2Scale: DSChartT.Scales;
9
9
  }
10
10
  export declare const useGetters: ({ xAxis, isHorizontal, yAxis, xScale, yScale, y2Scale }: UseGettersT) => {
11
- getYValue: (datum: DSChartT.InternalDatum) => string | number;
12
- getXValue: (datum: DSChartT.InternalDatum) => string | number;
13
- getXScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;
14
- getYScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;
15
- getYValueFormatted: (datum: DSChartT.InternalDatum) => string | number;
16
- getXValueFormatted: (datum: DSChartT.InternalDatum) => string | number;
11
+ getYValue: (datum: DSChartT.InternalDatum) => string | number | null;
12
+ getXValue: (datum: DSChartT.InternalDatum) => string | number | null;
13
+ getXScaleValue: (datum: DSChartT.InternalDatum) => number | null | undefined;
14
+ getYScaleValue: (datum: DSChartT.InternalDatum) => number | null | undefined;
15
+ getYValueFormatted: (datum: DSChartT.InternalDatum) => string | number | null;
16
+ getXValueFormatted: (datum: DSChartT.InternalDatum) => string | number | null;
17
17
  };
18
18
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-dataviz",
3
- "version": "3.14.0-rc.2",
3
+ "version": "3.14.0-rc.4",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - DataViz",
6
6
  "files": [
@@ -40,9 +40,9 @@
40
40
  "d3-shape": "~3.1.0",
41
41
  "resize-observer-polyfill": "~1.5.1",
42
42
  "uid": "~2.0.0",
43
- "@elliemae/ds-popperjs": "3.14.0-rc.2",
44
- "@elliemae/ds-system": "3.14.0-rc.2",
45
- "@elliemae/ds-utilities": "3.14.0-rc.2"
43
+ "@elliemae/ds-system": "3.14.0-rc.4",
44
+ "@elliemae/ds-popperjs": "3.14.0-rc.4",
45
+ "@elliemae/ds-utilities": "3.14.0-rc.4"
46
46
  },
47
47
  "devDependencies": {
48
48
  "@elliemae/pui-theme": "~2.6.0",