@bbl-digital/snorre 2.2.10 → 2.2.11

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.
package/dist/bundle.js CHANGED
@@ -24519,8 +24519,12 @@
24519
24519
  barConfig,
24520
24520
  active,
24521
24521
  payload,
24522
- label
24522
+ label,
24523
+ ...rest
24523
24524
  }) => {
24525
+ const {
24526
+ formatter
24527
+ } = rest;
24524
24528
  const theme = react.useTheme();
24525
24529
 
24526
24530
  const configHasProperty = config => config?.length && config.findIndex(v => v?.hasOwnProperty('shortName')) !== -1;
@@ -24542,7 +24546,7 @@
24542
24546
  };
24543
24547
 
24544
24548
  const TooltipPayload = () => {
24545
- return active && payload?.length && payload.map(item => /*#__PURE__*/jsxRuntime.jsxs(TooltipPayloadWrapper, {
24549
+ return active && payload?.length && payload.map((item, index) => /*#__PURE__*/jsxRuntime.jsxs(TooltipPayloadWrapper, {
24546
24550
  children: [/*#__PURE__*/jsxRuntime.jsxs(ItemNameGroup, {
24547
24551
  children: [item?.stroke && /*#__PURE__*/jsxRuntime.jsx("svg", {
24548
24552
  width: "16",
@@ -24570,7 +24574,7 @@
24570
24574
  children: [getTooltipItemName(item), ":"]
24571
24575
  })]
24572
24576
  }), /*#__PURE__*/jsxRuntime.jsx(Text, {
24573
- children: getFormattedPrice(item.value, 2)
24577
+ children: formatter ? formatter(getFormattedPrice(item.value, 2), getTooltipItemName(item), payload[index], index) : getFormattedPrice(item.value, 2)
24574
24578
  })]
24575
24579
  }, item.name));
24576
24580
  };
@@ -29636,6 +29640,9 @@
29636
29640
  right: 50
29637
29641
  },
29638
29642
  layout = 'horizontal',
29643
+ tickFormatterX = e => e,
29644
+ tickFormatterY = e => e,
29645
+ tooltipFormatter = e => e,
29639
29646
  ...rest
29640
29647
  }) => {
29641
29648
  return /*#__PURE__*/jsxRuntime.jsx(LineChartContainer, {
@@ -29657,14 +29664,19 @@
29657
29664
  tickLine: tickLineX && tickLineX,
29658
29665
  type: layout === 'vertical' ? 'number' : 'category',
29659
29666
  padding: xAxisPadding && xAxisPadding,
29667
+ tickFormatter: tickFormatterX,
29660
29668
  tickMargin: 5
29661
29669
  }), /*#__PURE__*/jsxRuntime.jsx(recharts.YAxis, {
29662
29670
  dataKey: yAxisDataKey && yAxisDataKey,
29663
29671
  axisLine: yAxisLine && yAxisLine,
29664
29672
  tickLine: tickLineY && tickLineY,
29665
- type: layout === 'vertical' ? 'category' : 'number'
29673
+ type: layout === 'vertical' ? 'category' : 'number',
29674
+ tickFormatter: tickFormatterY
29666
29675
  }), /*#__PURE__*/jsxRuntime.jsx(recharts.Tooltip, {
29667
- content: /*#__PURE__*/jsxRuntime.jsx(CustomTooltip, {})
29676
+ content: /*#__PURE__*/jsxRuntime.jsx(CustomTooltip, {
29677
+ formatter: tooltipFormatter,
29678
+ lineConfig: lines
29679
+ })
29668
29680
  }), /*#__PURE__*/jsxRuntime.jsx(recharts.Legend, {
29669
29681
  verticalAlign: legendVAlign && legendVAlign,
29670
29682
  align: legendHAlign && legendHAlign,
@@ -26,6 +26,9 @@ const SimpleLineChart = ({
26
26
  right: 50
27
27
  },
28
28
  layout = 'horizontal',
29
+ tickFormatterX = e => e,
30
+ tickFormatterY = e => e,
31
+ tooltipFormatter = e => e,
29
32
  ...rest
30
33
  }) => {
31
34
  return /*#__PURE__*/_jsx(LineChartContainer, {
@@ -47,14 +50,19 @@ const SimpleLineChart = ({
47
50
  tickLine: tickLineX && tickLineX,
48
51
  type: layout === 'vertical' ? 'number' : 'category',
49
52
  padding: xAxisPadding && xAxisPadding,
53
+ tickFormatter: tickFormatterX,
50
54
  tickMargin: 5
51
55
  }), /*#__PURE__*/_jsx(YAxis, {
52
56
  dataKey: yAxisDataKey && yAxisDataKey,
53
57
  axisLine: yAxisLine && yAxisLine,
54
58
  tickLine: tickLineY && tickLineY,
55
- type: layout === 'vertical' ? 'category' : 'number'
59
+ type: layout === 'vertical' ? 'category' : 'number',
60
+ tickFormatter: tickFormatterY
56
61
  }), /*#__PURE__*/_jsx(Tooltip, {
57
- content: /*#__PURE__*/_jsx(CustomTooltip, {})
62
+ content: /*#__PURE__*/_jsx(CustomTooltip, {
63
+ formatter: tooltipFormatter,
64
+ lineConfig: lines
65
+ })
58
66
  }), /*#__PURE__*/_jsx(Legend, {
59
67
  verticalAlign: legendVAlign && legendVAlign,
60
68
  align: legendHAlign && legendHAlign,
@@ -11,8 +11,12 @@ const CustomTooltip = ({
11
11
  barConfig,
12
12
  active,
13
13
  payload,
14
- label
14
+ label,
15
+ ...rest
15
16
  }) => {
17
+ const {
18
+ formatter
19
+ } = rest;
16
20
  const theme = useTheme();
17
21
 
18
22
  const configHasProperty = config => config?.length && config.findIndex(v => v?.hasOwnProperty('shortName')) !== -1;
@@ -34,7 +38,7 @@ const CustomTooltip = ({
34
38
  };
35
39
 
36
40
  const TooltipPayload = () => {
37
- return active && payload?.length && payload.map(item => /*#__PURE__*/_jsxs(TooltipPayloadWrapper, {
41
+ return active && payload?.length && payload.map((item, index) => /*#__PURE__*/_jsxs(TooltipPayloadWrapper, {
38
42
  children: [/*#__PURE__*/_jsxs(ItemNameGroup, {
39
43
  children: [item?.stroke && /*#__PURE__*/_jsx("svg", {
40
44
  width: "16",
@@ -62,7 +66,7 @@ const CustomTooltip = ({
62
66
  children: [getTooltipItemName(item), ":"]
63
67
  })]
64
68
  }), /*#__PURE__*/_jsx(Text, {
65
- children: getFormattedPrice(item.value, 2)
69
+ children: formatter ? formatter(getFormattedPrice(item.value, 2), getTooltipItemName(item), payload[index], index) : getFormattedPrice(item.value, 2)
66
70
  })]
67
71
  }, item.name));
68
72
  };
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { Line, Margin } from 'recharts';
2
+ import { Line, Margin, TickFormatterFunction, TooltipFormatter } from 'recharts';
3
3
  import { LineType } from 'recharts';
4
4
  interface IProps extends Partial<Line> {
5
5
  /** The source data. Example format: [{name: string, value: string}]. Name is required*/
@@ -50,6 +50,12 @@ interface IProps extends Partial<Line> {
50
50
  };
51
51
  /**layout: vertical or horizontal BarChart. Defaults to horizontal. */
52
52
  layout?: 'horizontal' | 'vertical';
53
+ /**tickFormatterX: formatter function of X-axis tick */
54
+ tickFormatterX?: TickFormatterFunction;
55
+ /**tickFormatterY: formatter function of Y-axis tick */
56
+ tickFormatterY?: TickFormatterFunction;
57
+ /** tooltipFormatter: formatter of the tooltip */
58
+ tooltipFormatter?: TooltipFormatter;
53
59
  }
54
60
  declare const SimpleLineChart: React.FC<IProps>;
55
61
  export default SimpleLineChart;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/SimpleLineChart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAGL,IAAI,EAEJ,MAAM,EAKP,MAAM,UAAU,CAAA;AAGjB,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAEnC,UAAU,MAAO,SAAQ,OAAO,CAAC,IAAI,CAAC;IACpC,wFAAwF;IACxF,IAAI,EAAE,GAAG,EAAE,CAAA;IACX,wMAAwM;IACxM,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAA;QACZ,OAAO,EAAE,MAAM,CAAA;QACf,MAAM,EAAE,MAAM,CAAA;QACd,IAAI,EAAE,QAAQ,CAAA;QACd,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,EAAE,CAAA;IACH,iHAAiH;IACjH,YAAY,EAAE,MAAM,CAAA;IACpB,gHAAgH;IAChH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sEAAsE;IACtE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,uFAAuF;IACvF,YAAY,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC1C,uFAAuF;IACvF,YAAY,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IAC1C,6FAA6F;IAC7F,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,wGAAwG;IACxG,aAAa,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IAC5E,iFAAiF;IACjF,YAAY,CAAC,EAAE;QACb,GAAG,CAAC,EAAE,MAAM,CAAA;QACZ,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,IAAI,CAAC,EAAE,MAAM,CAAA;KACd,CAAA;IACD,sEAAsE;IACtE,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;CACnC;AACD,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAyErC,CAAA;AAED,eAAe,eAAe,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/SimpleLineChart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAGL,IAAI,EAEJ,MAAM,EAEN,qBAAqB,EAErB,gBAAgB,EAGjB,MAAM,UAAU,CAAA;AAGjB,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAEnC,UAAU,MAAO,SAAQ,OAAO,CAAC,IAAI,CAAC;IACpC,wFAAwF;IACxF,IAAI,EAAE,GAAG,EAAE,CAAA;IACX,wMAAwM;IACxM,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAA;QACZ,OAAO,EAAE,MAAM,CAAA;QACf,MAAM,EAAE,MAAM,CAAA;QACd,IAAI,EAAE,QAAQ,CAAA;QACd,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,EAAE,CAAA;IACH,iHAAiH;IACjH,YAAY,EAAE,MAAM,CAAA;IACpB,gHAAgH;IAChH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sEAAsE;IACtE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,uFAAuF;IACvF,YAAY,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC1C,uFAAuF;IACvF,YAAY,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IAC1C,6FAA6F;IAC7F,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,wGAAwG;IACxG,aAAa,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IAC5E,iFAAiF;IACjF,YAAY,CAAC,EAAE;QACb,GAAG,CAAC,EAAE,MAAM,CAAA;QACZ,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,IAAI,CAAC,EAAE,MAAM,CAAA;KACd,CAAA;IACD,sEAAsE;IACtE,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAClC,yDAAyD;IACzD,cAAc,CAAC,EAAE,qBAAqB,CAAA;IACtC,wDAAwD;IACxD,cAAc,CAAC,EAAE,qBAAqB,CAAA;IACtC,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;CACpC;AACD,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAkFrC,CAAA;AAED,eAAe,eAAe,CAAA"}
@@ -26,6 +26,9 @@ const SimpleLineChart = ({
26
26
  right: 50
27
27
  },
28
28
  layout = 'horizontal',
29
+ tickFormatterX = e => e,
30
+ tickFormatterY = e => e,
31
+ tooltipFormatter = e => e,
29
32
  ...rest
30
33
  }) => {
31
34
  return /*#__PURE__*/_jsx(LineChartContainer, {
@@ -47,14 +50,19 @@ const SimpleLineChart = ({
47
50
  tickLine: tickLineX && tickLineX,
48
51
  type: layout === 'vertical' ? 'number' : 'category',
49
52
  padding: xAxisPadding && xAxisPadding,
53
+ tickFormatter: tickFormatterX,
50
54
  tickMargin: 5
51
55
  }), /*#__PURE__*/_jsx(YAxis, {
52
56
  dataKey: yAxisDataKey && yAxisDataKey,
53
57
  axisLine: yAxisLine && yAxisLine,
54
58
  tickLine: tickLineY && tickLineY,
55
- type: layout === 'vertical' ? 'category' : 'number'
59
+ type: layout === 'vertical' ? 'category' : 'number',
60
+ tickFormatter: tickFormatterY
56
61
  }), /*#__PURE__*/_jsx(Tooltip, {
57
- content: /*#__PURE__*/_jsx(CustomTooltip, {})
62
+ content: /*#__PURE__*/_jsx(CustomTooltip, {
63
+ formatter: tooltipFormatter,
64
+ lineConfig: lines
65
+ })
58
66
  }), /*#__PURE__*/_jsx(Legend, {
59
67
  verticalAlign: legendVAlign && legendVAlign,
60
68
  align: legendHAlign && legendHAlign,
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomTooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAIvC,UAAU,MAAO,SAAQ,YAAY;IACnC,UAAU,CAAC,EAAE,GAAG,EAAE,CAAA;IAClB,SAAS,CAAC,EAAE,GAAG,EAAE,CAAA;CAClB;AACD,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CA8EnC,CAAA;AAED,eAAe,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomTooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAIvC,UAAU,MAAO,SAAQ,YAAY;IACnC,UAAU,CAAC,EAAE,GAAG,EAAE,CAAA;IAClB,SAAS,CAAC,EAAE,GAAG,EAAE,CAAA;CAClB;AACD,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAyFnC,CAAA;AAED,eAAe,aAAa,CAAA"}
@@ -11,8 +11,12 @@ const CustomTooltip = ({
11
11
  barConfig,
12
12
  active,
13
13
  payload,
14
- label
14
+ label,
15
+ ...rest
15
16
  }) => {
17
+ const {
18
+ formatter
19
+ } = rest;
16
20
  const theme = useTheme();
17
21
 
18
22
  const configHasProperty = config => config?.length && config.findIndex(v => v?.hasOwnProperty('shortName')) !== -1;
@@ -34,7 +38,7 @@ const CustomTooltip = ({
34
38
  };
35
39
 
36
40
  const TooltipPayload = () => {
37
- return active && payload?.length && payload.map(item => /*#__PURE__*/_jsxs(TooltipPayloadWrapper, {
41
+ return active && payload?.length && payload.map((item, index) => /*#__PURE__*/_jsxs(TooltipPayloadWrapper, {
38
42
  children: [/*#__PURE__*/_jsxs(ItemNameGroup, {
39
43
  children: [item?.stroke && /*#__PURE__*/_jsx("svg", {
40
44
  width: "16",
@@ -62,7 +66,7 @@ const CustomTooltip = ({
62
66
  children: [getTooltipItemName(item), ":"]
63
67
  })]
64
68
  }), /*#__PURE__*/_jsx(Text, {
65
- children: getFormattedPrice(item.value, 2)
69
+ children: formatter ? formatter(getFormattedPrice(item.value, 2), getTooltipItemName(item), payload[index], index) : getFormattedPrice(item.value, 2)
66
70
  })]
67
71
  }, item.name));
68
72
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bbl-digital/snorre",
3
- "version": "2.2.10",
3
+ "version": "2.2.11",
4
4
  "description": "Design library for BBL Digital",
5
5
  "license": "MIT",
6
6
  "main": "./lib/index.js",