Index: node_modules/recharts/es6/chart/AreaChart.js =================================================================== --- node_modules/recharts/es6/chart/AreaChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/AreaChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,21 @@ +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { CartesianChart } from './CartesianChart'; +var allowedTooltipTypes = ['axis']; + +/** + * @consumes ResponsiveContainerContext + * @provides CartesianViewBoxContext + * @provides CartesianChartContext + */ +export var AreaChart = /*#__PURE__*/forwardRef((props, ref) => { + return /*#__PURE__*/React.createElement(CartesianChart, { + chartName: "AreaChart", + defaultTooltipEventType: "axis", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: props, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/BarChart.js =================================================================== --- node_modules/recharts/es6/chart/BarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/BarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,21 @@ +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { CartesianChart } from './CartesianChart'; +var allowedTooltipTypes = ['axis', 'item']; + +/** + * @consumes ResponsiveContainerContext + * @provides CartesianViewBoxContext + * @provides CartesianChartContext + */ +export var BarChart = /*#__PURE__*/forwardRef((props, ref) => { + return /*#__PURE__*/React.createElement(CartesianChart, { + chartName: "BarChart", + defaultTooltipEventType: "axis", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: props, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/CartesianChart.js =================================================================== --- node_modules/recharts/es6/chart/CartesianChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/CartesianChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,76 @@ +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +import * as React from 'react'; +import { forwardRef } from 'react'; +import { RechartsStoreProvider } from '../state/RechartsStoreProvider'; +import { ChartDataContextProvider } from '../context/chartDataContext'; +import { ReportMainChartProps } from '../state/ReportMainChartProps'; +import { ReportChartProps } from '../state/ReportChartProps'; +import { CategoricalChart } from './CategoricalChart'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; +var defaultMargin = { + top: 5, + right: 5, + bottom: 5, + left: 5 +}; +export var defaultCartesianChartProps = { + accessibilityLayer: true, + barCategoryGap: '10%', + barGap: 4, + layout: 'horizontal', + margin: defaultMargin, + responsive: false, + reverseStackOrder: false, + stackOffset: 'none', + syncMethod: 'index' +}; + +/** + * These are one-time, immutable options that decide the chart's behavior. + * Users who wish to call CartesianChart may decide to pass these options explicitly, + * but usually we would expect that they use one of the convenience components like BarChart, LineChart, etc. + */ + +export var CartesianChart = /*#__PURE__*/forwardRef(function CartesianChart(props, ref) { + var _categoricalChartProp; + var rootChartProps = resolveDefaultProps(props.categoricalChartProps, defaultCartesianChartProps); + var { + chartName, + defaultTooltipEventType, + validateTooltipEventTypes, + tooltipPayloadSearcher, + categoricalChartProps + } = props; + var options = { + chartName, + defaultTooltipEventType, + validateTooltipEventTypes, + tooltipPayloadSearcher, + eventEmitter: undefined + }; + return /*#__PURE__*/React.createElement(RechartsStoreProvider, { + preloadedState: { + options + }, + reduxStoreName: (_categoricalChartProp = categoricalChartProps.id) !== null && _categoricalChartProp !== void 0 ? _categoricalChartProp : chartName + }, /*#__PURE__*/React.createElement(ChartDataContextProvider, { + chartData: categoricalChartProps.data + }), /*#__PURE__*/React.createElement(ReportMainChartProps, { + layout: rootChartProps.layout, + margin: rootChartProps.margin + }), /*#__PURE__*/React.createElement(ReportChartProps, { + baseValue: rootChartProps.baseValue, + accessibilityLayer: rootChartProps.accessibilityLayer, + barCategoryGap: rootChartProps.barCategoryGap, + maxBarSize: rootChartProps.maxBarSize, + stackOffset: rootChartProps.stackOffset, + barGap: rootChartProps.barGap, + barSize: rootChartProps.barSize, + syncId: rootChartProps.syncId, + syncMethod: rootChartProps.syncMethod, + className: rootChartProps.className, + reverseStackOrder: rootChartProps.reverseStackOrder + }), /*#__PURE__*/React.createElement(CategoricalChart, _extends({}, rootChartProps, { + ref: ref + }))); +}); Index: node_modules/recharts/es6/chart/CategoricalChart.js =================================================================== --- node_modules/recharts/es6/chart/CategoricalChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/CategoricalChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,63 @@ +var _excluded = ["width", "height", "responsive", "children", "className", "style", "compact", "title", "desc"]; +function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; } +function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; } +import * as React from 'react'; +import { forwardRef } from 'react'; +import { RootSurface } from '../container/RootSurface'; +import { RechartsWrapper } from './RechartsWrapper'; +import { ClipPathProvider } from '../container/ClipPathProvider'; +import { svgPropertiesNoEvents } from '../util/svgPropertiesNoEvents'; +import { ReportChartSize } from '../context/chartLayoutContext'; +export var CategoricalChart = /*#__PURE__*/forwardRef((props, ref) => { + var { + width, + height, + responsive, + children, + className, + style, + compact, + title, + desc + } = props, + others = _objectWithoutProperties(props, _excluded); + var attrs = svgPropertiesNoEvents(others); + + /* + * The "compact" mode is used as the panorama within Brush. + * However because `compact` is a public prop, let's assume that it can render outside of Brush too. + */ + if (compact) { + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ReportChartSize, { + width: width, + height: height + }), /*#__PURE__*/React.createElement(RootSurface, { + otherAttributes: attrs, + title: title, + desc: desc + }, children)); + } + return /*#__PURE__*/React.createElement(RechartsWrapper, { + className: className, + style: style, + width: width, + height: height, + responsive: responsive !== null && responsive !== void 0 ? responsive : false, + onClick: props.onClick, + onMouseLeave: props.onMouseLeave, + onMouseEnter: props.onMouseEnter, + onMouseMove: props.onMouseMove, + onMouseDown: props.onMouseDown, + onMouseUp: props.onMouseUp, + onContextMenu: props.onContextMenu, + onDoubleClick: props.onDoubleClick, + onTouchStart: props.onTouchStart, + onTouchMove: props.onTouchMove, + onTouchEnd: props.onTouchEnd + }, /*#__PURE__*/React.createElement(RootSurface, { + otherAttributes: attrs, + title: title, + desc: desc, + ref: ref + }, /*#__PURE__*/React.createElement(ClipPathProvider, null, children))); +}); Index: node_modules/recharts/es6/chart/ComposedChart.js =================================================================== --- node_modules/recharts/es6/chart/ComposedChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/ComposedChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,21 @@ +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { CartesianChart } from './CartesianChart'; +var allowedTooltipTypes = ['axis']; + +/** + * @consumes ResponsiveContainerContext + * @provides CartesianViewBoxContext + * @provides CartesianChartContext + */ +export var ComposedChart = /*#__PURE__*/forwardRef((props, ref) => { + return /*#__PURE__*/React.createElement(CartesianChart, { + chartName: "ComposedChart", + defaultTooltipEventType: "axis", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: props, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/FunnelChart.js =================================================================== --- node_modules/recharts/es6/chart/FunnelChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/FunnelChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,21 @@ +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { CartesianChart } from './CartesianChart'; +var allowedTooltipTypes = ['item']; + +/** + * @consumes ResponsiveContainerContext + * @provides CartesianViewBoxContext + * @provides CartesianChartContext + */ +export var FunnelChart = /*#__PURE__*/forwardRef((props, ref) => { + return /*#__PURE__*/React.createElement(CartesianChart, { + chartName: "FunnelChart", + defaultTooltipEventType: "item", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: props, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/LineChart.js =================================================================== --- node_modules/recharts/es6/chart/LineChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/LineChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,21 @@ +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { CartesianChart } from './CartesianChart'; +var allowedTooltipTypes = ['axis']; + +/** + * @consumes ResponsiveContainerContext + * @provides CartesianViewBoxContext + * @provides CartesianChartContext + */ +export var LineChart = /*#__PURE__*/forwardRef((props, ref) => { + return /*#__PURE__*/React.createElement(CartesianChart, { + chartName: "LineChart", + defaultTooltipEventType: "axis", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: props, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/PieChart.js =================================================================== --- node_modules/recharts/es6/chart/PieChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/PieChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,33 @@ +function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } +function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } +function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } +function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } +function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { defaultPolarChartProps, PolarChart } from './PolarChart'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; +var allowedTooltipTypes = ['item']; +export var defaultPieChartProps = _objectSpread(_objectSpread({}, defaultPolarChartProps), {}, { + layout: 'centric', + startAngle: 0, + endAngle: 360 +}); + +/** + * @consumes ResponsiveContainerContext + * @provides PolarViewBoxContext + * @provides PolarChartContext + */ +export var PieChart = /*#__PURE__*/forwardRef((props, ref) => { + var propsWithDefaults = resolveDefaultProps(props, defaultPieChartProps); + return /*#__PURE__*/React.createElement(PolarChart, { + chartName: "PieChart", + defaultTooltipEventType: "item", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: propsWithDefaults, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/PolarChart.js =================================================================== --- node_modules/recharts/es6/chart/PolarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/PolarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,107 @@ +var _excluded = ["layout"]; +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; } +function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; } +import { forwardRef } from 'react'; +import * as React from 'react'; +import { RechartsStoreProvider } from '../state/RechartsStoreProvider'; +import { ChartDataContextProvider } from '../context/chartDataContext'; +import { ReportMainChartProps } from '../state/ReportMainChartProps'; +import { ReportChartProps } from '../state/ReportChartProps'; +import { ReportPolarOptions } from '../state/ReportPolarOptions'; +import { CategoricalChart } from './CategoricalChart'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; +var defaultMargin = { + top: 5, + right: 5, + bottom: 5, + left: 5 +}; + +/** + * These default props are the same for all PolarChart components. + */ +export var defaultPolarChartProps = { + accessibilityLayer: true, + stackOffset: 'none', + barCategoryGap: '10%', + barGap: 4, + margin: defaultMargin, + reverseStackOrder: false, + syncMethod: 'index', + layout: 'radial', + responsive: false, + cx: '50%', + cy: '50%', + innerRadius: 0, + outerRadius: '80%' +}; + +/** + * These props are required for the PolarChart to function correctly. + * Users usually would not need to specify these explicitly, + * because the convenience components like PieChart, RadarChart, etc. + * will provide these defaults. + * We can't have the defaults in this file because each of those convenience components + * have their own opinions about what they should be. + */ + +/** + * These are one-time, immutable options that decide the chart's behavior. + * Users who wish to call CartesianChart may decide to pass these options explicitly, + * but usually we would expect that they use one of the convenience components like PieChart, RadarChart, etc. + */ + +export var PolarChart = /*#__PURE__*/forwardRef(function PolarChart(props, ref) { + var _polarChartProps$id; + var polarChartProps = resolveDefaultProps(props.categoricalChartProps, defaultPolarChartProps); + var { + layout + } = polarChartProps, + otherCategoricalProps = _objectWithoutProperties(polarChartProps, _excluded); + var { + chartName, + defaultTooltipEventType, + validateTooltipEventTypes, + tooltipPayloadSearcher + } = props; + var options = { + chartName, + defaultTooltipEventType, + validateTooltipEventTypes, + tooltipPayloadSearcher, + eventEmitter: undefined + }; + return /*#__PURE__*/React.createElement(RechartsStoreProvider, { + preloadedState: { + options + }, + reduxStoreName: (_polarChartProps$id = polarChartProps.id) !== null && _polarChartProps$id !== void 0 ? _polarChartProps$id : chartName + }, /*#__PURE__*/React.createElement(ChartDataContextProvider, { + chartData: polarChartProps.data + }), /*#__PURE__*/React.createElement(ReportMainChartProps, { + layout: layout, + margin: polarChartProps.margin + }), /*#__PURE__*/React.createElement(ReportChartProps, { + baseValue: undefined, + accessibilityLayer: polarChartProps.accessibilityLayer, + barCategoryGap: polarChartProps.barCategoryGap, + maxBarSize: polarChartProps.maxBarSize, + stackOffset: polarChartProps.stackOffset, + barGap: polarChartProps.barGap, + barSize: polarChartProps.barSize, + syncId: polarChartProps.syncId, + syncMethod: polarChartProps.syncMethod, + className: polarChartProps.className, + reverseStackOrder: polarChartProps.reverseStackOrder + }), /*#__PURE__*/React.createElement(ReportPolarOptions, { + cx: polarChartProps.cx, + cy: polarChartProps.cy, + startAngle: polarChartProps.startAngle, + endAngle: polarChartProps.endAngle, + innerRadius: polarChartProps.innerRadius, + outerRadius: polarChartProps.outerRadius + }), /*#__PURE__*/React.createElement(CategoricalChart, _extends({}, otherCategoricalProps, { + ref: ref + }))); +}); Index: node_modules/recharts/es6/chart/RadarChart.js =================================================================== --- node_modules/recharts/es6/chart/RadarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/RadarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,32 @@ +function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } +function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } +function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } +function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } +function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; +import { defaultPolarChartProps, PolarChart } from './PolarChart'; +var allowedTooltipTypes = ['axis']; +export var defaultRadarChartProps = _objectSpread(_objectSpread({}, defaultPolarChartProps), {}, { + layout: 'centric', + startAngle: 90, + endAngle: -270 +}); +/** + * @consumes ResponsiveContainerContext + * @provides PolarViewBoxContext + * @provides PolarChartContext + */ +export var RadarChart = /*#__PURE__*/forwardRef((props, ref) => { + var propsWithDefaults = resolveDefaultProps(props, defaultRadarChartProps); + return /*#__PURE__*/React.createElement(PolarChart, { + chartName: "RadarChart", + defaultTooltipEventType: "axis", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: propsWithDefaults, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/RadialBarChart.js =================================================================== --- node_modules/recharts/es6/chart/RadialBarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/RadialBarChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,33 @@ +function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } +function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } +function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } +function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } +function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; +import { defaultPolarChartProps, PolarChart } from './PolarChart'; +var allowedTooltipTypes = ['axis', 'item']; +export var defaultRadialBarChartProps = _objectSpread(_objectSpread({}, defaultPolarChartProps), {}, { + layout: 'radial', + startAngle: 0, + endAngle: 360 +}); + +/** + * @consumes ResponsiveContainerContext + * @provides PolarViewBoxContext + * @provides PolarChartContext + */ +export var RadialBarChart = /*#__PURE__*/forwardRef((props, ref) => { + var propsWithDefaults = resolveDefaultProps(props, defaultRadialBarChartProps); + return /*#__PURE__*/React.createElement(PolarChart, { + chartName: "RadialBarChart", + defaultTooltipEventType: "axis", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: propsWithDefaults, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/RechartsWrapper.js =================================================================== --- node_modules/recharts/es6/chart/RechartsWrapper.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/RechartsWrapper.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,342 @@ +function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } +function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } +function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } +function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } +function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +import * as React from 'react'; +import { forwardRef, useCallback, useEffect, useRef, useState } from 'react'; +import { clsx } from 'clsx'; +import { mouseLeaveChart } from '../state/tooltipSlice'; +import { useAppDispatch } from '../state/hooks'; +import { mouseClickAction, mouseMoveAction } from '../state/mouseEventsMiddleware'; +import { useSynchronisedEventsFromOtherCharts } from '../synchronisation/useChartSynchronisation'; +import { focusAction, keyDownAction } from '../state/keyboardEventsMiddleware'; +import { useReportScale } from '../util/useReportScale'; +import { externalEventAction } from '../state/externalEventsMiddleware'; +import { touchEventAction } from '../state/touchEventsMiddleware'; +import { TooltipPortalContext } from '../context/tooltipPortalContext'; +import { LegendPortalContext } from '../context/legendPortalContext'; +import { ReportChartSize } from '../context/chartLayoutContext'; +import { useResponsiveContainerContext } from '../component/ResponsiveContainer'; +var EventSynchronizer = () => { + useSynchronisedEventsFromOtherCharts(); + return null; +}; +function getNumberOrZero(value) { + if (typeof value === 'number') { + return value; + } + if (typeof value === 'string') { + var parsed = parseFloat(value); + if (!Number.isNaN(parsed)) { + return parsed; + } + } + return 0; +} +var ResponsiveDiv = /*#__PURE__*/forwardRef((props, ref) => { + var _props$style, _props$style2; + var observerRef = useRef(null); + var [sizes, setSizes] = useState({ + containerWidth: getNumberOrZero((_props$style = props.style) === null || _props$style === void 0 ? void 0 : _props$style.width), + containerHeight: getNumberOrZero((_props$style2 = props.style) === null || _props$style2 === void 0 ? void 0 : _props$style2.height) + }); + var setContainerSize = useCallback((newWidth, newHeight) => { + setSizes(prevState => { + var roundedWidth = Math.round(newWidth); + var roundedHeight = Math.round(newHeight); + if (prevState.containerWidth === roundedWidth && prevState.containerHeight === roundedHeight) { + return prevState; + } + return { + containerWidth: roundedWidth, + containerHeight: roundedHeight + }; + }); + }, []); + var innerRef = useCallback(node => { + if (typeof ref === 'function') { + ref(node); + } + if (node != null && typeof ResizeObserver !== 'undefined') { + var { + width: containerWidth, + height: containerHeight + } = node.getBoundingClientRect(); + setContainerSize(containerWidth, containerHeight); + var callback = entries => { + var entry = entries[0]; + if (entry == null) { + return; + } + var { + width, + height + } = entry.contentRect; + setContainerSize(width, height); + }; + var observer = new ResizeObserver(callback); + observer.observe(node); + observerRef.current = observer; + } + }, [ref, setContainerSize]); + useEffect(() => { + return () => { + var observer = observerRef.current; + if (observer != null) { + observer.disconnect(); + } + }; + }, [setContainerSize]); + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ReportChartSize, { + width: sizes.containerWidth, + height: sizes.containerHeight + }), /*#__PURE__*/React.createElement("div", _extends({ + ref: innerRef + }, props))); +}); +var ReadSizeOnceDiv = /*#__PURE__*/forwardRef((props, ref) => { + var { + width, + height + } = props; + var [sizes, setSizes] = useState({ + containerWidth: getNumberOrZero(width), + containerHeight: getNumberOrZero(height) + }); + var setContainerSize = useCallback((newWidth, newHeight) => { + setSizes(prevState => { + var roundedWidth = Math.round(newWidth); + var roundedHeight = Math.round(newHeight); + if (prevState.containerWidth === roundedWidth && prevState.containerHeight === roundedHeight) { + return prevState; + } + return { + containerWidth: roundedWidth, + containerHeight: roundedHeight + }; + }); + }, []); + var innerRef = useCallback(node => { + if (typeof ref === 'function') { + ref(node); + } + if (node != null) { + var { + width: containerWidth, + height: containerHeight + } = node.getBoundingClientRect(); + setContainerSize(containerWidth, containerHeight); + } + }, [ref, setContainerSize]); + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ReportChartSize, { + width: sizes.containerWidth, + height: sizes.containerHeight + }), /*#__PURE__*/React.createElement("div", _extends({ + ref: innerRef + }, props))); +}); +var StaticDiv = /*#__PURE__*/forwardRef((props, ref) => { + var { + width, + height + } = props; + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ReportChartSize, { + width: width, + height: height + }), /*#__PURE__*/React.createElement("div", _extends({ + ref: ref + }, props))); +}); +var NonResponsiveDiv = /*#__PURE__*/forwardRef((props, ref) => { + var { + width, + height + } = props; + // When width or height are percentages or CSS short names, read size from DOM once + if (typeof width === 'string' || typeof height === 'string') { + return /*#__PURE__*/React.createElement(ReadSizeOnceDiv, _extends({}, props, { + ref: ref + })); + } + // When both are numbers, use them directly + if (typeof width === 'number' && typeof height === 'number') { + return /*#__PURE__*/React.createElement(StaticDiv, _extends({}, props, { + width: width, + height: height, + ref: ref + })); + } + // When width/height are undefined, render wrapper div without reporting size + // This results in no SVG being rendered (intentional for backwards compatibility) + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ReportChartSize, { + width: width, + height: height + }), /*#__PURE__*/React.createElement("div", _extends({ + ref: ref + }, props))); +}); +function getWrapperDivComponent(responsive) { + return responsive ? ResponsiveDiv : NonResponsiveDiv; +} +export var RechartsWrapper = /*#__PURE__*/forwardRef((props, ref) => { + var { + children, + className, + height: heightFromProps, + onClick, + onContextMenu, + onDoubleClick, + onMouseDown, + onMouseEnter, + onMouseLeave, + onMouseMove, + onMouseUp, + onTouchEnd, + onTouchMove, + onTouchStart, + style, + width: widthFromProps, + responsive, + dispatchTouchEvents = true + } = props; + var containerRef = useRef(null); + var dispatch = useAppDispatch(); + var [tooltipPortal, setTooltipPortal] = useState(null); + var [legendPortal, setLegendPortal] = useState(null); + var setScaleRef = useReportScale(); + var responsiveContainerCalculations = useResponsiveContainerContext(); + var width = (responsiveContainerCalculations === null || responsiveContainerCalculations === void 0 ? void 0 : responsiveContainerCalculations.width) > 0 ? responsiveContainerCalculations.width : widthFromProps; + var height = (responsiveContainerCalculations === null || responsiveContainerCalculations === void 0 ? void 0 : responsiveContainerCalculations.height) > 0 ? responsiveContainerCalculations.height : heightFromProps; + var innerRef = useCallback(node => { + setScaleRef(node); + if (typeof ref === 'function') { + ref(node); + } + setTooltipPortal(node); + setLegendPortal(node); + if (node != null) { + containerRef.current = node; + } + }, [setScaleRef, ref, setTooltipPortal, setLegendPortal]); + var myOnClick = useCallback(e => { + dispatch(mouseClickAction(e)); + dispatch(externalEventAction({ + handler: onClick, + reactEvent: e + })); + }, [dispatch, onClick]); + var myOnMouseEnter = useCallback(e => { + dispatch(mouseMoveAction(e)); + dispatch(externalEventAction({ + handler: onMouseEnter, + reactEvent: e + })); + }, [dispatch, onMouseEnter]); + var myOnMouseLeave = useCallback(e => { + dispatch(mouseLeaveChart()); + dispatch(externalEventAction({ + handler: onMouseLeave, + reactEvent: e + })); + }, [dispatch, onMouseLeave]); + var myOnMouseMove = useCallback(e => { + dispatch(mouseMoveAction(e)); + dispatch(externalEventAction({ + handler: onMouseMove, + reactEvent: e + })); + }, [dispatch, onMouseMove]); + var onFocus = useCallback(() => { + dispatch(focusAction()); + }, [dispatch]); + var onKeyDown = useCallback(e => { + dispatch(keyDownAction(e.key)); + }, [dispatch]); + var myOnContextMenu = useCallback(e => { + dispatch(externalEventAction({ + handler: onContextMenu, + reactEvent: e + })); + }, [dispatch, onContextMenu]); + var myOnDoubleClick = useCallback(e => { + dispatch(externalEventAction({ + handler: onDoubleClick, + reactEvent: e + })); + }, [dispatch, onDoubleClick]); + var myOnMouseDown = useCallback(e => { + dispatch(externalEventAction({ + handler: onMouseDown, + reactEvent: e + })); + }, [dispatch, onMouseDown]); + var myOnMouseUp = useCallback(e => { + dispatch(externalEventAction({ + handler: onMouseUp, + reactEvent: e + })); + }, [dispatch, onMouseUp]); + var myOnTouchStart = useCallback(e => { + dispatch(externalEventAction({ + handler: onTouchStart, + reactEvent: e + })); + }, [dispatch, onTouchStart]); + + /* + * onTouchMove is special because it behaves different from mouse events. + * Mouse events have 'enter' + 'leave' combo that notify us when the mouse is over + * a certain element. Touch events don't have that; touch only gives us + * start (finger down), end (finger up) and move (finger moving). + * So we need to figure out which element the user is touching + * ourselves. Fortunately, there's a convenient method for that: + * https://developer.mozilla.org/en-US/docs/Web/API/Document/elementFromPoint + */ + var myOnTouchMove = useCallback(e => { + if (dispatchTouchEvents) { + dispatch(touchEventAction(e)); + } + dispatch(externalEventAction({ + handler: onTouchMove, + reactEvent: e + })); + }, [dispatch, dispatchTouchEvents, onTouchMove]); + var myOnTouchEnd = useCallback(e => { + dispatch(externalEventAction({ + handler: onTouchEnd, + reactEvent: e + })); + }, [dispatch, onTouchEnd]); + var WrapperDiv = getWrapperDivComponent(responsive); + return /*#__PURE__*/React.createElement(TooltipPortalContext.Provider, { + value: tooltipPortal + }, /*#__PURE__*/React.createElement(LegendPortalContext.Provider, { + value: legendPortal + }, /*#__PURE__*/React.createElement(WrapperDiv, { + width: width !== null && width !== void 0 ? width : style === null || style === void 0 ? void 0 : style.width, + height: height !== null && height !== void 0 ? height : style === null || style === void 0 ? void 0 : style.height, + className: clsx('recharts-wrapper', className), + style: _objectSpread({ + position: 'relative', + cursor: 'default', + width, + height + }, style), + onClick: myOnClick, + onContextMenu: myOnContextMenu, + onDoubleClick: myOnDoubleClick, + onFocus: onFocus, + onKeyDown: onKeyDown, + onMouseDown: myOnMouseDown, + onMouseEnter: myOnMouseEnter, + onMouseLeave: myOnMouseLeave, + onMouseMove: myOnMouseMove, + onMouseUp: myOnMouseUp, + onTouchEnd: myOnTouchEnd, + onTouchMove: myOnTouchMove, + onTouchStart: myOnTouchStart, + ref: innerRef + }, /*#__PURE__*/React.createElement(EventSynchronizer, null), children))); +}); Index: node_modules/recharts/es6/chart/Sankey.js =================================================================== --- node_modules/recharts/es6/chart/Sankey.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/Sankey.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,939 @@ +var _excluded = ["sourceX", "sourceY", "sourceControlX", "targetX", "targetY", "targetControlX", "linkWidth"], + _excluded2 = ["className", "style", "children", "id"]; +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; } +function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; } +function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } +function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } +function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } +function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } +function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } +import * as React from 'react'; +import { useCallback, useMemo, useState } from 'react'; +import maxBy from 'es-toolkit/compat/maxBy'; +import sumBy from 'es-toolkit/compat/sumBy'; +import get from 'es-toolkit/compat/get'; +import { Surface } from '../container/Surface'; +import { Layer } from '../container/Layer'; +import { Rectangle } from '../shape/Rectangle'; +import { getValueByDataKey } from '../util/ChartUtils'; +import { ReportChartMargin, ReportChartSize, useChartHeight, useChartWidth } from '../context/chartLayoutContext'; +import { TooltipPortalContext } from '../context/tooltipPortalContext'; +import { RechartsWrapper } from './RechartsWrapper'; +import { RechartsStoreProvider } from '../state/RechartsStoreProvider'; +import { useAppDispatch } from '../state/hooks'; +import { mouseLeaveItem, setActiveClickItemIndex, setActiveMouseOverItemIndex } from '../state/tooltipSlice'; +import { SetTooltipEntrySettings } from '../state/SetTooltipEntrySettings'; +import { SetComputedData } from '../context/chartDataContext'; +import { svgPropertiesNoEvents, svgPropertiesNoEventsFromUnknown } from '../util/svgPropertiesNoEvents'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; +import { isPositiveNumber } from '../util/isWellBehavedNumber'; +import { isNotNil, noop } from '../util/DataUtils'; +import { RegisterGraphicalItemId } from '../context/RegisterGraphicalItemId'; +var interpolationGenerator = (a, b) => { + var ka = +a; + var kb = b - ka; + return t => ka + kb * t; +}; +var centerY = node => node.y + node.dy / 2; + +// TODO why is this not reading dataKey? +var getValue = entry => entry && entry.value || 0; +var getSumOfIds = (links, ids) => ids.reduce((result, id) => result + getValue(links[id]), 0); +var getSumWithWeightedSource = (tree, links, ids) => ids.reduce((result, id) => { + var link = links[id]; + if (link == null) { + return result; + } + var sourceNode = tree[link.source]; + if (sourceNode == null) { + return result; + } + return result + centerY(sourceNode) * getValue(links[id]); +}, 0); +var getSumWithWeightedTarget = (tree, links, ids) => ids.reduce((result, id) => { + var link = links[id]; + if (link == null) { + return result; + } + var targetNode = tree[link.target]; + if (targetNode == null) { + return result; + } + return result + centerY(targetNode) * getValue(links[id]); +}, 0); +var ascendingY = (a, b) => a.y - b.y; +var searchTargetsAndSources = (links, id) => { + var sourceNodes = []; + var sourceLinks = []; + var targetNodes = []; + var targetLinks = []; + for (var i = 0, len = links.length; i < len; i++) { + var link = links[i]; + if ((link === null || link === void 0 ? void 0 : link.source) === id) { + targetNodes.push(link.target); + targetLinks.push(i); + } + if ((link === null || link === void 0 ? void 0 : link.target) === id) { + sourceNodes.push(link.source); + sourceLinks.push(i); + } + } + return { + sourceNodes, + sourceLinks, + targetLinks, + targetNodes + }; +}; +var updateDepthOfTargets = (tree, curNode) => { + var { + targetNodes + } = curNode; + for (var i = 0, len = targetNodes.length; i < len; i++) { + var targetNode = targetNodes[i]; + if (targetNode == null) { + continue; + } + var target = tree[targetNode]; + if (target) { + target.depth = Math.max(curNode.depth + 1, target.depth); + updateDepthOfTargets(tree, target); + } + } +}; +var getNodesTree = (_ref, width, nodeWidth, align) => { + var _maxBy$depth, _maxBy; + var { + nodes, + links + } = _ref; + var tree = nodes.map((entry, index) => { + var result = searchTargetsAndSources(links, index); + return _objectSpread(_objectSpread(_objectSpread({}, entry), result), {}, { + value: Math.max(getSumOfIds(links, result.sourceLinks), getSumOfIds(links, result.targetLinks)), + depth: 0 + }); + }); + for (var i = 0, len = tree.length; i < len; i++) { + var node = tree[i]; + if (node != null && !node.sourceNodes.length) { + updateDepthOfTargets(tree, node); + } + } + var maxDepth = (_maxBy$depth = (_maxBy = maxBy(tree, entry => entry.depth)) === null || _maxBy === void 0 ? void 0 : _maxBy.depth) !== null && _maxBy$depth !== void 0 ? _maxBy$depth : 0; + if (maxDepth >= 1) { + var childWidth = (width - nodeWidth) / maxDepth; + for (var _i = 0, _len = tree.length; _i < _len; _i++) { + var _node = tree[_i]; + if (_node == null) { + continue; + } + if (!_node.targetNodes.length) { + if (align === 'justify') { + _node.depth = maxDepth; + } + } + _node.x = _node.depth * childWidth; + _node.dx = nodeWidth; + } + } + return { + tree, + maxDepth + }; +}; +var getDepthTree = tree => { + var result = []; + for (var i = 0, len = tree.length; i < len; i++) { + var _result$node$depth; + var node = tree[i]; + if (node == null) { + continue; + } + if (!result[node.depth]) { + result[node.depth] = []; + } + (_result$node$depth = result[node.depth]) === null || _result$node$depth === void 0 || _result$node$depth.push(node); + } + return result; +}; +var updateYOfTree = (depthTree, height, nodePadding, links, verticalAlign) => { + var yRatio = Math.min(...depthTree.map(nodes => (height - (nodes.length - 1) * nodePadding) / sumBy(nodes, getValue))); + for (var d = 0, maxDepth = depthTree.length; d < maxDepth; d++) { + var nodes = depthTree[d]; + if (nodes == null) { + continue; + } + if (verticalAlign === 'top') { + var currentY = 0; + for (var i = 0, len = nodes.length; i < len; i++) { + var node = nodes[i]; + if (node == null) { + continue; + } + node.dy = node.value * yRatio; + node.y = currentY; + currentY += node.dy + nodePadding; + } + } else { + for (var _i2 = 0, _len2 = nodes.length; _i2 < _len2; _i2++) { + var _node2 = nodes[_i2]; + if (_node2 == null) { + continue; + } + _node2.y = _i2; + _node2.dy = _node2.value * yRatio; + } + } + } + return links.map(link => _objectSpread(_objectSpread({}, link), {}, { + dy: getValue(link) * yRatio + })); +}; +var resolveCollisions = function resolveCollisions(depthTree, height, nodePadding) { + var sort = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true; + for (var i = 0, len = depthTree.length; i < len; i++) { + var nodes = depthTree[i]; + if (nodes == null) { + continue; + } + var n = nodes.length; + + // Sort by the value of y + if (sort) { + nodes.sort(ascendingY); + } + var y0 = 0; + for (var j = 0; j < n; j++) { + var node = nodes[j]; + if (node == null) { + continue; + } + var dy = y0 - node.y; + if (dy > 0) { + node.y += dy; + } + y0 = node.y + node.dy + nodePadding; + } + y0 = height + nodePadding; + for (var _j = n - 1; _j >= 0; _j--) { + var _node3 = nodes[_j]; + if (_node3 == null) { + continue; + } + var _dy = _node3.y + _node3.dy + nodePadding - y0; + if (_dy > 0) { + _node3.y -= _dy; + y0 = _node3.y; + } else { + break; + } + } + } +}; +var relaxLeftToRight = (tree, depthTree, links, alpha) => { + for (var i = 0, maxDepth = depthTree.length; i < maxDepth; i++) { + var nodes = depthTree[i]; + if (nodes == null) { + continue; + } + for (var j = 0, len = nodes.length; j < len; j++) { + var node = nodes[j]; + if (node == null) { + continue; + } + if (node.sourceLinks.length) { + var sourceSum = getSumOfIds(links, node.sourceLinks); + var weightedSum = getSumWithWeightedSource(tree, links, node.sourceLinks); + var y = weightedSum / sourceSum; + node.y += (y - centerY(node)) * alpha; + } + } + } +}; +var relaxRightToLeft = (tree, depthTree, links, alpha) => { + for (var i = depthTree.length - 1; i >= 0; i--) { + var nodes = depthTree[i]; + if (nodes == null) { + continue; + } + for (var j = 0, len = nodes.length; j < len; j++) { + var node = nodes[j]; + if (node == null) { + continue; + } + if (node.targetLinks.length) { + var targetSum = getSumOfIds(links, node.targetLinks); + var weightedSum = getSumWithWeightedTarget(tree, links, node.targetLinks); + var y = weightedSum / targetSum; + node.y += (y - centerY(node)) * alpha; + } + } + } +}; +var updateYOfLinks = (tree, links) => { + for (var i = 0, len = tree.length; i < len; i++) { + var node = tree[i]; + if (node == null) { + continue; + } + var sy = 0; + var ty = 0; + node.targetLinks.sort((a, b) => { + var _links$a, _links$b, _tree$targetA, _tree$targetB; + var targetA = (_links$a = links[a]) === null || _links$a === void 0 ? void 0 : _links$a.target; + var targetB = (_links$b = links[b]) === null || _links$b === void 0 ? void 0 : _links$b.target; + if (targetA == null || targetB == null) { + return 0; + } + var yA = (_tree$targetA = tree[targetA]) === null || _tree$targetA === void 0 ? void 0 : _tree$targetA.y; + var yB = (_tree$targetB = tree[targetB]) === null || _tree$targetB === void 0 ? void 0 : _tree$targetB.y; + if (yA == null || yB == null) { + return 0; + } + return yA - yB; + }); + node.sourceLinks.sort((a, b) => { + var _links$a2, _links$b2, _tree$sourceA, _tree$sourceB; + var sourceA = (_links$a2 = links[a]) === null || _links$a2 === void 0 ? void 0 : _links$a2.source; + var sourceB = (_links$b2 = links[b]) === null || _links$b2 === void 0 ? void 0 : _links$b2.source; + if (sourceA == null || sourceB == null) { + return 0; + } + var yA = (_tree$sourceA = tree[sourceA]) === null || _tree$sourceA === void 0 ? void 0 : _tree$sourceA.y; + var yB = (_tree$sourceB = tree[sourceB]) === null || _tree$sourceB === void 0 ? void 0 : _tree$sourceB.y; + if (yA == null || yB == null) { + return 0; + } + return yA - yB; + }); + for (var j = 0, tLen = node.targetLinks.length; j < tLen; j++) { + var targetLink = node.targetLinks[j]; + if (targetLink == null) { + continue; + } + var link = links[targetLink]; + if (link) { + // @ts-expect-error we should refactor this to immutable + link.sy = sy; + sy += link.dy; + } + } + for (var _j2 = 0, sLen = node.sourceLinks.length; _j2 < sLen; _j2++) { + var sourceLink = node.sourceLinks[_j2]; + if (sourceLink == null) { + continue; + } + var _link = links[sourceLink]; + if (_link) { + // @ts-expect-error we should refactor this to immutable + _link.ty = ty; + ty += _link.dy; + } + } + } +}; +var computeData = _ref2 => { + var { + data, + width, + height, + iterations, + nodeWidth, + nodePadding, + sort, + verticalAlign, + align + } = _ref2; + var { + links + } = data; + var { + tree + } = getNodesTree(data, width, nodeWidth, align); + var depthTree = getDepthTree(tree); + var linksWithDy = updateYOfTree(depthTree, height, nodePadding, links, verticalAlign); + resolveCollisions(depthTree, height, nodePadding, sort); + if (verticalAlign === 'justify') { + var alpha = 1; + for (var i = 1; i <= iterations; i++) { + relaxRightToLeft(tree, depthTree, linksWithDy, alpha *= 0.99); + resolveCollisions(depthTree, height, nodePadding, sort); + relaxLeftToRight(tree, depthTree, linksWithDy, alpha); + resolveCollisions(depthTree, height, nodePadding, sort); + } + } + updateYOfLinks(tree, linksWithDy); + // @ts-expect-error updateYOfLinks modifies the links array to add sy and ty in place + var newLinks = linksWithDy; + return { + nodes: tree, + links: newLinks + }; +}; +var getNodeCoordinateOfTooltip = item => { + return { + x: +item.x + +item.width / 2, + y: +item.y + +item.height / 2 + }; +}; +var getLinkCoordinateOfTooltip = item => { + return 'sourceX' in item ? { + x: (item.sourceX + item.targetX) / 2, + y: (item.sourceY + item.targetY) / 2 + } : undefined; +}; +var getPayloadOfTooltip = (item, type, nameKey) => { + var { + payload + } = item; + if (type === 'node') { + return { + payload, + name: getValueByDataKey(payload, nameKey, ''), + value: getValueByDataKey(payload, 'value') + }; + } + if ('source' in payload && payload.source && payload.target) { + var sourceName = getValueByDataKey(payload.source, nameKey, ''); + var targetName = getValueByDataKey(payload.target, nameKey, ''); + return { + payload, + name: "".concat(sourceName, " - ").concat(targetName), + value: getValueByDataKey(payload, 'value') + }; + } + return undefined; +}; +export var sankeyPayloadSearcher = (_, activeIndex, computedData, nameKey) => { + if (activeIndex == null || typeof activeIndex !== 'string') { + return undefined; + } + if (computedData == null || typeof computedData !== 'object') { + return undefined; + } + var splitIndex = activeIndex.split('-'); + var [targetType, index] = splitIndex; + var item = get(computedData, "".concat(targetType, "s[").concat(index, "]")); + if (item) { + var payload = getPayloadOfTooltip(item, targetType, nameKey); + return payload; + } + return undefined; +}; +var options = { + chartName: 'Sankey', + defaultTooltipEventType: 'item', + validateTooltipEventTypes: ['item'], + tooltipPayloadSearcher: sankeyPayloadSearcher, + eventEmitter: undefined +}; +var SetSankeyTooltipEntrySettings = /*#__PURE__*/React.memo(_ref3 => { + var { + dataKey, + nameKey, + stroke, + strokeWidth, + fill, + name, + data, + id + } = _ref3; + var tooltipEntrySettings = { + dataDefinedOnItem: data, + getPosition: noop, + settings: { + stroke, + strokeWidth, + fill, + dataKey, + name, + nameKey, + hide: false, + type: undefined, + color: fill, + unit: '', + graphicalItemId: id + } + }; + return /*#__PURE__*/React.createElement(SetTooltipEntrySettings, { + tooltipEntrySettings: tooltipEntrySettings + }); +}); + +// TODO: improve types - NodeOptions uses SankeyNode, LinkOptions uses LinkProps. Standardize. + +function renderLinkItem(option, props) { + if (/*#__PURE__*/React.isValidElement(option)) { + return /*#__PURE__*/React.cloneElement(option, props); + } + if (typeof option === 'function') { + return option(props); + } + var { + sourceX, + sourceY, + sourceControlX, + targetX, + targetY, + targetControlX, + linkWidth + } = props, + others = _objectWithoutProperties(props, _excluded); + return /*#__PURE__*/React.createElement("path", _extends({ + className: "recharts-sankey-link", + d: "\n M".concat(sourceX, ",").concat(sourceY, "\n C").concat(sourceControlX, ",").concat(sourceY, " ").concat(targetControlX, ",").concat(targetY, " ").concat(targetX, ",").concat(targetY, "\n "), + fill: "none", + stroke: "#333", + strokeWidth: linkWidth, + strokeOpacity: "0.2" + }, svgPropertiesNoEvents(others))); +} +var buildLinkProps = _ref4 => { + var { + link, + nodes, + left, + top, + i, + linkContent, + linkCurvature + } = _ref4; + var { + sy: sourceRelativeY, + ty: targetRelativeY, + dy: linkWidth + } = link; + var sourceNode = nodes[link.source]; + var targetNode = nodes[link.target]; + if (sourceNode == null || targetNode == null) { + return undefined; + } + var sourceX = sourceNode.x + sourceNode.dx + left; + var targetX = targetNode.x + left; + var interpolationFunc = interpolationGenerator(sourceX, targetX); + var sourceControlX = interpolationFunc(linkCurvature); + var targetControlX = interpolationFunc(1 - linkCurvature); + var sourceY = sourceNode.y + sourceRelativeY + linkWidth / 2 + top; + var targetY = targetNode.y + targetRelativeY + linkWidth / 2 + top; + var linkProps = _objectSpread({ + sourceX, + // @ts-expect-error the linkContent from below is contributing unknown props + targetX, + sourceY, + // @ts-expect-error the linkContent from below is contributing unknown props + targetY, + sourceControlX, + targetControlX, + sourceRelativeY, + targetRelativeY, + linkWidth, + index: i, + payload: _objectSpread(_objectSpread({}, link), {}, { + source: sourceNode, + target: targetNode + }) + }, svgPropertiesNoEventsFromUnknown(linkContent)); + return linkProps; +}; +function SankeyLinkElement(_ref5) { + var { + graphicalItemId, + props, + i, + linkContent, + onMouseEnter: _onMouseEnter, + onMouseLeave: _onMouseLeave, + onClick: _onClick, + dataKey + } = _ref5; + var activeCoordinate = getLinkCoordinateOfTooltip(props); + var activeIndex = "link-".concat(i); + var dispatch = useAppDispatch(); + var events = { + onMouseEnter: e => { + dispatch(setActiveMouseOverItemIndex({ + activeIndex, + activeDataKey: dataKey, + activeCoordinate, + activeGraphicalItemId: graphicalItemId + })); + _onMouseEnter(props, e); + }, + onMouseLeave: e => { + dispatch(mouseLeaveItem()); + _onMouseLeave(props, e); + }, + onClick: e => { + dispatch(setActiveClickItemIndex({ + activeIndex, + activeDataKey: dataKey, + activeCoordinate, + activeGraphicalItemId: graphicalItemId + })); + _onClick(props, e); + } + }; + return /*#__PURE__*/React.createElement(Layer, events, renderLinkItem(linkContent, props)); +} +function AllSankeyLinkElements(_ref6) { + var { + graphicalItemId, + modifiedLinks, + links, + linkContent, + onMouseEnter, + onMouseLeave, + onClick, + dataKey + } = _ref6; + return /*#__PURE__*/React.createElement(Layer, { + className: "recharts-sankey-links", + key: "recharts-sankey-links" + }, links.map((link, i) => { + var linkProps = modifiedLinks[i]; + if (linkProps == null) { + return null; + } + return /*#__PURE__*/React.createElement(SankeyLinkElement, { + graphicalItemId: graphicalItemId, + key: "link-".concat(link.source, "-").concat(link.target, "-").concat(link.value), + props: linkProps, + linkContent: linkContent, + i: i, + onMouseEnter: onMouseEnter, + onMouseLeave: onMouseLeave, + onClick: onClick, + dataKey: dataKey + }); + })); +} +function renderNodeItem(option, props) { + if (/*#__PURE__*/React.isValidElement(option)) { + return /*#__PURE__*/React.cloneElement(option, props); + } + if (typeof option === 'function') { + return option(props); + } + return ( + /*#__PURE__*/ + // @ts-expect-error recharts radius is not compatible with SVG radius + React.createElement(Rectangle, _extends({ + className: "recharts-sankey-node", + fill: "#0088fe", + fillOpacity: "0.8" + }, svgPropertiesNoEvents(props))) + ); +} +var buildNodeProps = _ref7 => { + var { + node, + nodeContent, + top, + left, + i + } = _ref7; + var { + x, + y, + dx, + dy + } = node; + // @ts-expect-error nodeContent is passing in unknown props + var nodeProps = _objectSpread(_objectSpread({}, svgPropertiesNoEventsFromUnknown(nodeContent)), {}, { + x: x + left, + y: y + top, + width: dx, + height: dy, + index: i, + payload: node + }); + return nodeProps; +}; +function NodeElement(_ref8) { + var { + graphicalItemId, + props, + nodeContent, + i, + onMouseEnter: _onMouseEnter2, + onMouseLeave: _onMouseLeave2, + onClick: _onClick2, + dataKey + } = _ref8; + var dispatch = useAppDispatch(); + var activeCoordinate = getNodeCoordinateOfTooltip(props); + var activeIndex = "node-".concat(i); + var events = { + onMouseEnter: e => { + dispatch(setActiveMouseOverItemIndex({ + activeIndex, + activeDataKey: dataKey, + activeCoordinate, + activeGraphicalItemId: graphicalItemId + })); + _onMouseEnter2(props, e); + }, + onMouseLeave: e => { + dispatch(mouseLeaveItem()); + _onMouseLeave2(props, e); + }, + onClick: e => { + dispatch(setActiveClickItemIndex({ + activeIndex, + activeDataKey: dataKey, + activeCoordinate, + activeGraphicalItemId: graphicalItemId + })); + _onClick2(props, e); + } + }; + return /*#__PURE__*/React.createElement(Layer, events, renderNodeItem(nodeContent, props)); +} +function AllNodeElements(_ref9) { + var { + graphicalItemId, + modifiedNodes, + nodeContent, + onMouseEnter, + onMouseLeave, + onClick, + dataKey + } = _ref9; + return /*#__PURE__*/React.createElement(Layer, { + className: "recharts-sankey-nodes", + key: "recharts-sankey-nodes" + }, modifiedNodes.map((modifiedNode, i) => { + return /*#__PURE__*/React.createElement(NodeElement, { + graphicalItemId: graphicalItemId, + key: "node-".concat(modifiedNode.index, "-").concat(modifiedNode.x, "-").concat(modifiedNode.y), + props: modifiedNode, + nodeContent: nodeContent, + i: i, + onMouseEnter: onMouseEnter, + onMouseLeave: onMouseLeave, + onClick: onClick, + dataKey: dataKey + }); + })); +} +export var sankeyDefaultProps = { + align: 'justify', + dataKey: 'value', + iterations: 32, + linkCurvature: 0.5, + margin: { + top: 5, + right: 5, + bottom: 5, + left: 5 + }, + nameKey: 'name', + nodePadding: 10, + nodeWidth: 10, + sort: true, + verticalAlign: 'justify' +}; +function SankeyImpl(props) { + var { + className, + style, + children, + id + } = props, + others = _objectWithoutProperties(props, _excluded2); + var { + link, + dataKey, + node, + onMouseEnter, + onMouseLeave, + onClick, + data, + iterations, + nodeWidth, + nodePadding, + sort, + linkCurvature, + margin, + verticalAlign, + align + } = props; + var attrs = svgPropertiesNoEvents(others); + var width = useChartWidth(); + var height = useChartHeight(); + var { + links, + modifiedLinks, + modifiedNodes + } = useMemo(() => { + var _margin$left, _margin$right, _margin$top, _margin$bottom; + if (!data || !width || !height || width <= 0 || height <= 0) { + return { + nodes: [], + links: [], + modifiedLinks: [], + modifiedNodes: [] + }; + } + var contentWidth = width - ((_margin$left = margin.left) !== null && _margin$left !== void 0 ? _margin$left : 0) - ((_margin$right = margin.right) !== null && _margin$right !== void 0 ? _margin$right : 0); + var contentHeight = height - ((_margin$top = margin.top) !== null && _margin$top !== void 0 ? _margin$top : 0) - ((_margin$bottom = margin.bottom) !== null && _margin$bottom !== void 0 ? _margin$bottom : 0); + var computed = computeData({ + data, + width: contentWidth, + height: contentHeight, + iterations, + nodeWidth, + nodePadding, + sort, + verticalAlign, + align + }); + var top = margin.top || 0; + var left = margin.left || 0; + var newModifiedLinks = computed.links.map((l, i) => { + return buildLinkProps({ + link: l, + nodes: computed.nodes, + i, + top, + left, + linkContent: link, + linkCurvature + }); + }).filter(isNotNil); + var newModifiedNodes = computed.nodes.map((n, i) => { + return buildNodeProps({ + node: n, + nodeContent: node, + i, + top, + left + }); + }); + return { + nodes: computed.nodes, + links: computed.links, + modifiedLinks: newModifiedLinks, + modifiedNodes: newModifiedNodes + }; + }, [data, width, height, margin, iterations, nodeWidth, nodePadding, sort, link, node, linkCurvature, align, verticalAlign]); + var handleMouseEnter = useCallback((item, type, e) => { + if (onMouseEnter) { + onMouseEnter(item, type, e); + } + }, [onMouseEnter]); + var handleMouseLeave = useCallback((item, type, e) => { + if (onMouseLeave) { + onMouseLeave(item, type, e); + } + }, [onMouseLeave]); + var handleClick = useCallback((item, type, e) => { + if (onClick) { + onClick(item, type, e); + } + }, [onClick]); + if (!isPositiveNumber(width) || !isPositiveNumber(height) || !data || !data.links || !data.nodes) { + return null; + } + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SetComputedData, { + computedData: { + links: modifiedLinks, + nodes: modifiedNodes + } + }), /*#__PURE__*/React.createElement(Surface, _extends({}, attrs, { + width: width, + height: height + }), children, /*#__PURE__*/React.createElement(AllSankeyLinkElements, { + graphicalItemId: id, + links: links, + modifiedLinks: modifiedLinks, + linkContent: link, + dataKey: dataKey, + onMouseEnter: (linkProps, e) => handleMouseEnter(linkProps, 'link', e), + onMouseLeave: (linkProps, e) => handleMouseLeave(linkProps, 'link', e), + onClick: (linkProps, e) => handleClick(linkProps, 'link', e) + }), /*#__PURE__*/React.createElement(AllNodeElements, { + graphicalItemId: id, + modifiedNodes: modifiedNodes, + nodeContent: node, + dataKey: dataKey, + onMouseEnter: (nodeProps, e) => handleMouseEnter(nodeProps, 'node', e), + onMouseLeave: (nodeProps, e) => handleMouseLeave(nodeProps, 'node', e), + onClick: (nodeProps, e) => handleClick(nodeProps, 'node', e) + }))); +} + +/** + * Flow diagram in which the width of the arrows is proportional to the flow rate. + * It is typically used to visualize energy or material or cost transfers between processes. + * + * @consumes ResponsiveContainerContext + * @provides TooltipEntrySettings + */ +export function Sankey(outsideProps) { + var props = resolveDefaultProps(outsideProps, sankeyDefaultProps); + var { + width, + height, + style, + className, + id: externalId + } = props; + var [tooltipPortal, setTooltipPortal] = useState(null); + return /*#__PURE__*/React.createElement(RechartsStoreProvider, { + preloadedState: { + options + }, + reduxStoreName: className !== null && className !== void 0 ? className : 'Sankey' + }, /*#__PURE__*/React.createElement(ReportChartSize, { + width: width, + height: height + }), /*#__PURE__*/React.createElement(ReportChartMargin, { + margin: props.margin + }), /*#__PURE__*/React.createElement(RechartsWrapper, { + className: className, + style: style, + width: width, + height: height + /* + * Sankey, same as Treemap, suffers from overfilling the container + * and causing infinite render loops where the chart keeps growing. + */, + responsive: false, + ref: node => { + if (node && !tooltipPortal) { + setTooltipPortal(node); + } + }, + onMouseEnter: undefined, + onMouseLeave: undefined, + onClick: undefined, + onMouseMove: undefined, + onMouseDown: undefined, + onMouseUp: undefined, + onContextMenu: undefined, + onDoubleClick: undefined, + onTouchStart: undefined, + onTouchMove: undefined, + onTouchEnd: undefined + }, /*#__PURE__*/React.createElement(TooltipPortalContext.Provider, { + value: tooltipPortal + }, /*#__PURE__*/React.createElement(RegisterGraphicalItemId, { + id: externalId, + type: "sankey" + }, id => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SetSankeyTooltipEntrySettings, { + dataKey: props.dataKey, + nameKey: props.nameKey, + stroke: props.stroke, + strokeWidth: props.strokeWidth, + fill: props.fill, + name: props.name, + data: props.data, + id: id + }), /*#__PURE__*/React.createElement(SankeyImpl, _extends({}, props, { + id: id + }))))))); +} +Sankey.displayName = 'Sankey'; Index: node_modules/recharts/es6/chart/ScatterChart.js =================================================================== --- node_modules/recharts/es6/chart/ScatterChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/ScatterChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,21 @@ +import * as React from 'react'; +import { forwardRef } from 'react'; +import { arrayTooltipSearcher } from '../state/optionsSlice'; +import { CartesianChart } from './CartesianChart'; +var allowedTooltipTypes = ['item']; + +/** + * @consumes ResponsiveContainerContext + * @provides CartesianViewBoxContext + * @provides CartesianChartContext + */ +export var ScatterChart = /*#__PURE__*/forwardRef((props, ref) => { + return /*#__PURE__*/React.createElement(CartesianChart, { + chartName: "ScatterChart", + defaultTooltipEventType: "item", + validateTooltipEventTypes: allowedTooltipTypes, + tooltipPayloadSearcher: arrayTooltipSearcher, + categoricalChartProps: props, + ref: ref + }); +}); Index: node_modules/recharts/es6/chart/SunburstChart.js =================================================================== --- node_modules/recharts/es6/chart/SunburstChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/SunburstChart.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,328 @@ +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } +function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } +function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } +function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } +function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } +import * as React from 'react'; +import { useState } from 'react'; +import { scaleLinear } from 'victory-vendor/d3-scale'; +import { clsx } from 'clsx'; +import get from 'es-toolkit/compat/get'; +import { Surface } from '../container/Surface'; +import { Layer } from '../container/Layer'; +import { Sector } from '../shape/Sector'; +import { Text } from '../component/Text'; +import { polarToCartesian } from '../util/PolarUtils'; +import { ReportChartMargin, ReportChartSize, useChartHeight, useChartWidth } from '../context/chartLayoutContext'; +import { TooltipPortalContext } from '../context/tooltipPortalContext'; +import { RechartsWrapper } from './RechartsWrapper'; +import { mouseLeaveItem, setActiveClickItemIndex, setActiveMouseOverItemIndex } from '../state/tooltipSlice'; +import { SetTooltipEntrySettings } from '../state/SetTooltipEntrySettings'; +import { RechartsStoreProvider } from '../state/RechartsStoreProvider'; +import { useAppDispatch } from '../state/hooks'; +import { RegisterGraphicalItemId } from '../context/RegisterGraphicalItemId'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; + +/** + * We require tooltipIndex on each node internally to track which node is active in the tooltip. + * This is not required from the outside user - we can calculate it as we traverse the tree. + */ + +var defaultTextProps = { + fontWeight: 'bold', + paintOrder: 'stroke fill', + fontSize: '.75rem', + stroke: '#FFF', + fill: 'black', + pointerEvents: 'none' +}; +function getMaxDepthOf(node) { + if (!node.children || node.children.length === 0) return 1; + + // Calculate depth for each child and find the maximum + var childDepths = node.children.map(d => getMaxDepthOf(d)); + return 1 + Math.max(...childDepths); +} +var SetSunburstTooltipEntrySettings = /*#__PURE__*/React.memo(_ref => { + var { + dataKey, + nameKey, + data, + stroke, + fill, + positions, + id + } = _ref; + var tooltipEntrySettings = { + dataDefinedOnItem: data.children, + getPosition: index => positions.get(index), + // Sunburst does not support many of the properties as other charts do so there's plenty of defaults here + settings: { + stroke, + strokeWidth: undefined, + fill, + nameKey, + dataKey, + // if there is a nameKey use it, otherwise make the name of the tooltip the dataKey itself + name: nameKey ? undefined : dataKey, + hide: false, + type: undefined, + color: fill, + unit: '', + graphicalItemId: id + } + }; + return /*#__PURE__*/React.createElement(SetTooltipEntrySettings, { + tooltipEntrySettings: tooltipEntrySettings + }); +}); + +// Why is margin not a sunburst prop? No clue. Probably it should be +var defaultSunburstMargin = { + top: 0, + right: 0, + bottom: 0, + left: 0 +}; +export var payloadSearcher = (data, activeIndex) => { + if (activeIndex == null) { + return undefined; + } + return get(data, activeIndex); +}; +var addToSunburstNodeIndex = function addToSunburstNodeIndex(indexInChildrenArr) { + var activeTooltipIndexSoFar = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ''; + return "".concat(activeTooltipIndexSoFar, "children[").concat(indexInChildrenArr, "]"); +}; +var preloadedState = { + options: { + validateTooltipEventTypes: ['item'], + defaultTooltipEventType: 'item', + chartName: 'Sunburst', + tooltipPayloadSearcher: payloadSearcher, + eventEmitter: undefined + } +}; +export var defaultSunburstChartProps = { + padding: 2, + dataKey: 'value', + nameKey: 'name', + ringPadding: 2, + innerRadius: 50, + fill: '#333', + stroke: '#FFF', + textOptions: defaultTextProps, + startAngle: 0, + endAngle: 360, + responsive: false +}; +var SunburstChartImpl = _ref2 => { + var { + className, + data, + children, + padding, + dataKey, + nameKey, + ringPadding, + innerRadius, + fill, + stroke, + textOptions, + outerRadius: outerRadiusFromProps, + cx: cxFromProps, + cy: cyFromProps, + startAngle, + endAngle, + onClick, + onMouseEnter, + onMouseLeave, + id + } = _ref2; + var dispatch = useAppDispatch(); + var width = useChartWidth(); + var height = useChartHeight(); + if (width == null || height == null) { + return null; + } + var outerRadius = outerRadiusFromProps !== null && outerRadiusFromProps !== void 0 ? outerRadiusFromProps : Math.min(width, height) / 2; + var cx = cxFromProps !== null && cxFromProps !== void 0 ? cxFromProps : width / 2; + var cy = cyFromProps !== null && cyFromProps !== void 0 ? cyFromProps : height / 2; + var rScale = scaleLinear([0, data[dataKey]], [0, endAngle]); + var treeDepth = getMaxDepthOf(data); + var thickness = (outerRadius - innerRadius) / treeDepth; + var sectors = []; + var positions = new Map([]); + + // event handlers + function handleMouseEnter(node, e) { + if (onMouseEnter) onMouseEnter(node, e); + dispatch(setActiveMouseOverItemIndex({ + activeIndex: node.tooltipIndex, + activeDataKey: dataKey, + activeCoordinate: positions.get(node.name), + activeGraphicalItemId: id + })); + } + function handleMouseLeave(node, e) { + if (onMouseLeave) onMouseLeave(node, e); + dispatch(mouseLeaveItem()); + } + function handleClick(node) { + if (onClick) onClick(node); + dispatch(setActiveClickItemIndex({ + activeIndex: node.tooltipIndex, + activeDataKey: dataKey, + activeCoordinate: positions.get(node.name), + activeGraphicalItemId: id + })); + } + + // recursively add nodes for each data point and its children + function drawArcs(childNodes, options) { + var depth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1; + var { + radius, + innerR, + initialAngle, + childColor, + nestedActiveTooltipIndex + } = options; + var currentAngle = initialAngle; + if (!childNodes) return; // base case: no children of this node + + childNodes.forEach((d, i) => { + var _ref3, _d$fill; + var currentTooltipIndex = depth === 1 ? "[".concat(i, "]") : addToSunburstNodeIndex(i, nestedActiveTooltipIndex); + var nodeWithIndex = _objectSpread(_objectSpread({}, d), {}, { + tooltipIndex: currentTooltipIndex + }); + var arcLength = rScale(d[dataKey]); + var start = currentAngle; + // color priority - if there's a color on the individual point use that, otherwise use parent color or default + var fillColor = (_ref3 = (_d$fill = d === null || d === void 0 ? void 0 : d.fill) !== null && _d$fill !== void 0 ? _d$fill : childColor) !== null && _ref3 !== void 0 ? _ref3 : fill; + var { + x: textX, + y: textY + } = polarToCartesian(0, 0, innerR + radius / 2, -(start + arcLength - arcLength / 2)); + currentAngle += arcLength; + sectors.push(/*#__PURE__*/React.createElement("g", { + key: "sunburst-sector-".concat(d.name, "-").concat(i) + }, /*#__PURE__*/React.createElement(Sector, { + onClick: () => handleClick(nodeWithIndex), + onMouseEnter: e => handleMouseEnter(nodeWithIndex, e), + onMouseLeave: e => handleMouseLeave(nodeWithIndex, e), + fill: fillColor, + stroke: stroke, + strokeWidth: padding, + startAngle: start, + endAngle: start + arcLength, + innerRadius: innerR, + outerRadius: innerR + radius, + cx: cx, + cy: cy + }), /*#__PURE__*/React.createElement(Text, _extends({}, textOptions, { + alignmentBaseline: "middle", + textAnchor: "middle", + x: textX + cx, + y: cy - textY + }), d[dataKey]))); + var { + x: tooltipX, + y: tooltipY + } = polarToCartesian(cx, cy, innerR + radius / 2, start); + positions.set(d.name, { + x: tooltipX, + y: tooltipY + }); + return drawArcs(d.children, { + radius, + innerR: innerR + radius + ringPadding, + initialAngle: start, + childColor: fillColor, + nestedActiveTooltipIndex: currentTooltipIndex + }, depth + 1); + }); + } + drawArcs(data.children, { + radius: thickness, + innerR: innerRadius, + initialAngle: startAngle + }); + var layerClass = clsx('recharts-sunburst', className); + return /*#__PURE__*/React.createElement(Surface, { + width: width, + height: height + }, /*#__PURE__*/React.createElement(Layer, { + className: layerClass + }, sectors), /*#__PURE__*/React.createElement(SetSunburstTooltipEntrySettings, { + dataKey: dataKey, + nameKey: nameKey, + data: data, + stroke: stroke, + fill: fill, + positions: positions, + id: id + }), children); +}; + +/** + * The sunburst is a hierarchical chart, similar to a {@link Treemap}, plotted in polar coordinates. + * Sunburst charts effectively convey the hierarchical relationships and proportions within each level. + * It is easy to see all the middle layers in the hierarchy, which might get lost in other visualizations. + * For some datasets, the radial layout may be more visually appealing and intuitive than a traditional {@link Treemap}. + * + * @consumes ResponsiveContainerContext + * @provides TooltipEntrySettings + */ +export var SunburstChart = outsideProps => { + var props = resolveDefaultProps(outsideProps, defaultSunburstChartProps); + var { + className, + width, + height, + responsive, + style, + id: externalId + } = props; + var [tooltipPortal, setTooltipPortal] = useState(null); + return /*#__PURE__*/React.createElement(RechartsStoreProvider, { + preloadedState: preloadedState, + reduxStoreName: className !== null && className !== void 0 ? className : 'SunburstChart' + }, /*#__PURE__*/React.createElement(ReportChartSize, { + width: width, + height: height + }), /*#__PURE__*/React.createElement(ReportChartMargin, { + margin: defaultSunburstMargin + }), /*#__PURE__*/React.createElement(TooltipPortalContext.Provider, { + value: tooltipPortal + }, /*#__PURE__*/React.createElement(RechartsWrapper, { + className: className, + width: width, + height: height, + responsive: responsive, + style: style, + ref: node => { + if (tooltipPortal == null && node != null) { + setTooltipPortal(node); + } + }, + onMouseEnter: undefined, + onMouseLeave: undefined, + onClick: undefined, + onMouseMove: undefined, + onMouseDown: undefined, + onMouseUp: undefined, + onContextMenu: undefined, + onDoubleClick: undefined, + onTouchStart: undefined, + onTouchMove: undefined, + onTouchEnd: undefined + }, /*#__PURE__*/React.createElement(RegisterGraphicalItemId, { + id: externalId, + type: "sunburst" + }, id => /*#__PURE__*/React.createElement(SunburstChartImpl, _extends({}, props, { + id: id + })))))); +}; Index: node_modules/recharts/es6/chart/Treemap.js =================================================================== --- node_modules/recharts/es6/chart/Treemap.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/Treemap.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,830 @@ +var _excluded = ["width", "height", "className", "style", "children", "type"]; +function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; } +function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; } +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } +function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } +function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } +function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } +function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } +import * as React from 'react'; +import { PureComponent, useCallback, useState } from 'react'; +import omit from 'es-toolkit/compat/omit'; +import get from 'es-toolkit/compat/get'; +import { Layer } from '../container/Layer'; +import { Surface } from '../container/Surface'; +import { Polygon } from '../shape/Polygon'; +import { Rectangle } from '../shape/Rectangle'; +import { getValueByDataKey } from '../util/ChartUtils'; +import { COLOR_PANEL } from '../util/Constants'; +import { isNan, noop, uniqueId } from '../util/DataUtils'; +import { getStringSize } from '../util/DOMUtils'; +import { ReportChartMargin, useChartHeight, useChartWidth } from '../context/chartLayoutContext'; +import { TooltipPortalContext } from '../context/tooltipPortalContext'; +import { RechartsWrapper } from './RechartsWrapper'; +import { setActiveClickItemIndex, setActiveMouseOverItemIndex } from '../state/tooltipSlice'; +import { SetTooltipEntrySettings } from '../state/SetTooltipEntrySettings'; +import { RechartsStoreProvider } from '../state/RechartsStoreProvider'; +import { useAppDispatch } from '../state/hooks'; +import { isPositiveNumber } from '../util/isWellBehavedNumber'; +import { svgPropertiesNoEvents } from '../util/svgPropertiesNoEvents'; +import { CSSTransitionAnimate } from '../animation/CSSTransitionAnimate'; +import { resolveDefaultProps } from '../util/resolveDefaultProps'; +import { RegisterGraphicalItemId } from '../context/RegisterGraphicalItemId'; +var NODE_VALUE_KEY = 'value'; + +/** + * This is what end users defines as `data` on Treemap. + */ + +/** + * This is what is returned from `squarify`, the final treemap data structure + * that gets rendered and is stored in + */ + +function isTreemapNode(value) { + return value != null && typeof value === 'object' && 'x' in value && 'y' in value && 'width' in value && 'height' in value && typeof value.x === 'number' && typeof value.y === 'number' && typeof value.width === 'number' && typeof value.height === 'number'; +} +export var treemapPayloadSearcher = (data, activeIndex) => { + if (!data || !activeIndex) { + return undefined; + } + return get(data, activeIndex); +}; +export var addToTreemapNodeIndex = function addToTreemapNodeIndex(indexInChildrenArr) { + var activeTooltipIndexSoFar = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ''; + return "".concat(activeTooltipIndexSoFar, "children[").concat(indexInChildrenArr, "]"); +}; +var options = { + chartName: 'Treemap', + defaultTooltipEventType: 'item', + validateTooltipEventTypes: ['item'], + tooltipPayloadSearcher: treemapPayloadSearcher, + eventEmitter: undefined +}; +export var computeNode = _ref => { + var { + depth, + node, + index, + dataKey, + nameKey, + nestedActiveTooltipIndex + } = _ref; + var currentTooltipIndex = depth === 0 ? '' : addToTreemapNodeIndex(index, nestedActiveTooltipIndex); + var { + children + } = node; + var childDepth = depth + 1; + var computedChildren = children && children.length ? children.map((child, i) => computeNode({ + depth: childDepth, + node: child, + index: i, + dataKey, + nameKey, + nestedActiveTooltipIndex: currentTooltipIndex + })) : null; + var nodeValue; + if (computedChildren && computedChildren.length) { + nodeValue = computedChildren.reduce((result, child) => result + child.value, 0); + } else { + // TODO need to verify dataKey + var rawNodeValue = node[dataKey]; + var numericValue = typeof rawNodeValue === 'number' ? rawNodeValue : 0; + nodeValue = isNan(numericValue) || numericValue <= 0 ? 0 : numericValue; + } + return _objectSpread(_objectSpread({}, node), {}, { + children: computedChildren, + // @ts-expect-error getValueByDataKey does not validate the output type + name: getValueByDataKey(node, nameKey, ''), + [NODE_VALUE_KEY]: nodeValue, + depth, + index, + tooltipIndex: currentTooltipIndex + }); +}; +var filterRect = node => ({ + x: node.x, + y: node.y, + width: node.width, + height: node.height +}); +// Compute the area for each child based on value & scale. +var getAreaOfChildren = (children, areaValueRatio) => { + var ratio = areaValueRatio < 0 ? 0 : areaValueRatio; + return children.map(child => { + var area = child[NODE_VALUE_KEY] * ratio; + return _objectSpread(_objectSpread({}, child), {}, { + area: isNan(area) || area <= 0 ? 0 : area + }); + }); +}; + +// Computes the score for the specified row, as the worst aspect ratio. +var getWorstScore = (row, parentSize, aspectRatio) => { + var parentArea = parentSize * parentSize; + var rowArea = row.area * row.area; + var { + min, + max + } = row.reduce((result, child) => ({ + min: Math.min(result.min, child.area), + max: Math.max(result.max, child.area) + }), { + min: Infinity, + max: 0 + }); + return rowArea ? Math.max(parentArea * max * aspectRatio / rowArea, rowArea / (parentArea * min * aspectRatio)) : Infinity; +}; +var horizontalPosition = (row, parentSize, parentRect, isFlush) => { + var rowHeight = parentSize ? Math.round(row.area / parentSize) : 0; + if (isFlush || rowHeight > parentRect.height) { + rowHeight = parentRect.height; + } + var curX = parentRect.x; + var child; + for (var i = 0, len = row.length; i < len; i++) { + child = row[i]; + if (child == null) { + continue; + } + child.x = curX; + child.y = parentRect.y; + child.height = rowHeight; + child.width = Math.min(rowHeight ? Math.round(child.area / rowHeight) : 0, parentRect.x + parentRect.width - curX); + curX += child.width; + } + // add the remain x to the last one of row + if (child != null) { + child.width += parentRect.x + parentRect.width - curX; + } + return _objectSpread(_objectSpread({}, parentRect), {}, { + y: parentRect.y + rowHeight, + height: parentRect.height - rowHeight + }); +}; +var verticalPosition = (row, parentSize, parentRect, isFlush) => { + var rowWidth = parentSize ? Math.round(row.area / parentSize) : 0; + if (isFlush || rowWidth > parentRect.width) { + rowWidth = parentRect.width; + } + var curY = parentRect.y; + var child; + for (var i = 0, len = row.length; i < len; i++) { + child = row[i]; + if (child == null) { + continue; + } + child.x = parentRect.x; + child.y = curY; + child.width = rowWidth; + child.height = Math.min(rowWidth ? Math.round(child.area / rowWidth) : 0, parentRect.y + parentRect.height - curY); + curY += child.height; + } + if (child) { + child.height += parentRect.y + parentRect.height - curY; + } + return _objectSpread(_objectSpread({}, parentRect), {}, { + x: parentRect.x + rowWidth, + width: parentRect.width - rowWidth + }); +}; +var position = (row, parentSize, parentRect, isFlush) => { + if (parentSize === parentRect.width) { + return horizontalPosition(row, parentSize, parentRect, isFlush); + } + return verticalPosition(row, parentSize, parentRect, isFlush); +}; +// Recursively arranges the specified node's children into squarified rows. +var squarify = (node, aspectRatio) => { + var { + children + } = node; + if (children && children.length) { + var rect = filterRect(node); + // @ts-expect-error we can't create an array with static property on a single line so typescript will complain. + var row = []; + var best = Infinity; // the best row score so far + var child, score; // the current row score + var size = Math.min(rect.width, rect.height); // initial orientation + var scaleChildren = getAreaOfChildren(children, rect.width * rect.height / node[NODE_VALUE_KEY]); + var tempChildren = scaleChildren.slice(); + + // why are we setting static properties on an array? + row.area = 0; + while (tempChildren.length > 0) { + [child] = tempChildren; + if (child == null) { + continue; + } + // row first + row.push(child); + row.area += child.area; + score = getWorstScore(row, size, aspectRatio); + if (score <= best) { + // continue with this orientation + tempChildren.shift(); + best = score; + } else { + var _row$pop$area, _row$pop; + // abort, and try a different orientation + row.area -= (_row$pop$area = (_row$pop = row.pop()) === null || _row$pop === void 0 ? void 0 : _row$pop.area) !== null && _row$pop$area !== void 0 ? _row$pop$area : 0; + rect = position(row, size, rect, false); + size = Math.min(rect.width, rect.height); + row.length = row.area = 0; + best = Infinity; + } + } + if (row.length) { + rect = position(row, size, rect, true); + row.length = row.area = 0; + } + return _objectSpread(_objectSpread({}, node), {}, { + children: scaleChildren.map(c => squarify(c, aspectRatio)) + }); + } + return node; +}; +export var defaultTreeMapProps = { + aspectRatio: 0.5 * (1 + Math.sqrt(5)), + dataKey: 'value', + nameKey: 'name', + type: 'flat', + isAnimationActive: 'auto', + isUpdateAnimationActive: 'auto', + animationBegin: 0, + animationDuration: 1500, + animationEasing: 'linear' +}; +var defaultState = { + isAnimationFinished: false, + formatRoot: null, + currentRoot: undefined, + nestIndex: [], + prevAspectRatio: defaultTreeMapProps.aspectRatio, + prevDataKey: defaultTreeMapProps.dataKey +}; +function ContentItem(_ref2) { + var { + content, + nodeProps, + type, + colorPanel, + onMouseEnter, + onMouseLeave, + onClick + } = _ref2; + if (/*#__PURE__*/React.isValidElement(content)) { + return /*#__PURE__*/React.createElement(Layer, { + onMouseEnter: onMouseEnter, + onMouseLeave: onMouseLeave, + onClick: onClick + }, /*#__PURE__*/React.cloneElement(content, nodeProps)); + } + if (typeof content === 'function') { + return /*#__PURE__*/React.createElement(Layer, { + onMouseEnter: onMouseEnter, + onMouseLeave: onMouseLeave, + onClick: onClick + }, content(nodeProps)); + } + // optimize default shape + var { + x, + y, + width, + height, + index + } = nodeProps; + var arrow = null; + if (width > 10 && height > 10 && nodeProps.children && type === 'nest') { + arrow = /*#__PURE__*/React.createElement(Polygon, { + points: [{ + x: x + 2, + y: y + height / 2 + }, { + x: x + 6, + y: y + height / 2 + 3 + }, { + x: x + 2, + y: y + height / 2 + 6 + }] + }); + } + var text = null; + var nameSize = getStringSize(nodeProps.name); + if (width > 20 && height > 20 && nameSize.width < width && nameSize.height < height) { + text = /*#__PURE__*/React.createElement("text", { + x: x + 8, + y: y + height / 2 + 7, + fontSize: 14 + }, nodeProps.name); + } + var colors = colorPanel || COLOR_PANEL; + return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement(Rectangle, _extends({ + fill: nodeProps.depth < 2 ? colors[index % colors.length] : 'rgba(255,255,255,0)', + stroke: "#fff" + }, omit(nodeProps, ['children']), { + onMouseEnter: onMouseEnter, + onMouseLeave: onMouseLeave, + onClick: onClick, + "data-recharts-item-index": nodeProps.tooltipIndex + })), arrow, text); +} +function ContentItemWithEvents(props) { + var dispatch = useAppDispatch(); + var activeCoordinate = { + x: props.nodeProps.x + props.nodeProps.width / 2, + y: props.nodeProps.y + props.nodeProps.height / 2 + }; + var onMouseEnter = () => { + dispatch(setActiveMouseOverItemIndex({ + activeIndex: props.nodeProps.tooltipIndex, + activeDataKey: props.dataKey, + activeCoordinate, + activeGraphicalItemId: props.id + })); + }; + var onMouseLeave = () => { + // clearing state on mouseLeaveItem causes re-rendering issues + // we don't actually want to do this for TreeMap - we clear state when we leave the entire chart instead + }; + var onClick = () => { + dispatch(setActiveClickItemIndex({ + activeIndex: props.nodeProps.tooltipIndex, + activeDataKey: props.dataKey, + activeCoordinate, + activeGraphicalItemId: props.id + })); + }; + return /*#__PURE__*/React.createElement(ContentItem, _extends({}, props, { + onMouseEnter: onMouseEnter, + onMouseLeave: onMouseLeave, + onClick: onClick + })); +} +var SetTreemapTooltipEntrySettings = /*#__PURE__*/React.memo(_ref3 => { + var { + dataKey, + nameKey, + stroke, + fill, + currentRoot, + id + } = _ref3; + var tooltipEntrySettings = { + dataDefinedOnItem: currentRoot, + getPosition: noop, + // TODO I think Treemap has the capability of computing positions and supporting defaultIndex? Except it doesn't yet + settings: { + stroke, + strokeWidth: undefined, + fill, + dataKey, + nameKey, + name: undefined, + // Each TreemapNode has its own name + hide: false, + type: undefined, + color: fill, + unit: '', + graphicalItemId: id + } + }; + return /*#__PURE__*/React.createElement(SetTooltipEntrySettings, { + tooltipEntrySettings: tooltipEntrySettings + }); +}); + +// Why is margin not a treemap prop? No clue. Probably it should be +var defaultTreemapMargin = { + top: 0, + right: 0, + bottom: 0, + left: 0 +}; +function TreemapItem(_ref4) { + var { + content, + nodeProps, + isLeaf, + treemapProps, + onNestClick + } = _ref4; + var { + id, + isAnimationActive, + animationBegin, + animationDuration, + animationEasing, + isUpdateAnimationActive, + type, + colorPanel, + dataKey, + onAnimationStart, + onAnimationEnd, + onMouseEnter: onMouseEnterFromProps, + onClick: onItemClickFromProps, + onMouseLeave: onMouseLeaveFromProps + } = treemapProps; + var { + width, + height, + x, + y + } = nodeProps; + var translateX = -x - width; + var translateY = 0; + var onMouseEnter = e => { + if ((isLeaf || type === 'nest') && typeof onMouseEnterFromProps === 'function') { + onMouseEnterFromProps(nodeProps, e); + } + }; + var onMouseLeave = e => { + if ((isLeaf || type === 'nest') && typeof onMouseLeaveFromProps === 'function') { + onMouseLeaveFromProps(nodeProps, e); + } + }; + var onClick = () => { + if (type === 'nest') { + onNestClick(nodeProps); + } + if ((isLeaf || type === 'nest') && typeof onItemClickFromProps === 'function') { + onItemClickFromProps(nodeProps); + } + }; + var handleAnimationEnd = useCallback(() => { + if (typeof onAnimationEnd === 'function') { + onAnimationEnd(); + } + }, [onAnimationEnd]); + var handleAnimationStart = useCallback(() => { + if (typeof onAnimationStart === 'function') { + onAnimationStart(); + } + }, [onAnimationStart]); + return /*#__PURE__*/React.createElement(CSSTransitionAnimate, { + animationId: "treemap-".concat(nodeProps.tooltipIndex), + from: "translate(".concat(translateX, "px, ").concat(translateY, "px)"), + to: "translate(0, 0)", + attributeName: "transform", + begin: animationBegin, + easing: animationEasing, + isActive: isAnimationActive, + duration: animationDuration, + onAnimationStart: handleAnimationStart, + onAnimationEnd: handleAnimationEnd + }, style => /*#__PURE__*/React.createElement(Layer, { + onMouseEnter: onMouseEnter, + onMouseLeave: onMouseLeave, + onClick: onClick, + style: _objectSpread(_objectSpread({}, style), {}, { + transformOrigin: "".concat(x, " ").concat(y) + }) + }, /*#__PURE__*/React.createElement(ContentItemWithEvents, { + id: id, + content: content, + dataKey: dataKey, + nodeProps: _objectSpread(_objectSpread({}, nodeProps), {}, { + isAnimationActive, + isUpdateAnimationActive: !isUpdateAnimationActive, + width, + height, + x, + y + }), + type: type, + colorPanel: colorPanel + }))); +} +class TreemapWithState extends PureComponent { + constructor() { + super(...arguments); + _defineProperty(this, "state", _objectSpread({}, defaultState)); + _defineProperty(this, "handleClick", node => { + var { + onClick, + type + } = this.props; + if (type === 'nest' && node.children) { + var { + width, + height, + dataKey, + nameKey, + aspectRatio + } = this.props; + var root = computeNode({ + depth: 0, + node: _objectSpread(_objectSpread({}, node), {}, { + x: 0, + y: 0, + width, + height + }), + index: 0, + dataKey, + nameKey, + // with Treemap nesting, should this continue nesting the index or start from empty string? + nestedActiveTooltipIndex: node.tooltipIndex + }); + var formatRoot = squarify(root, aspectRatio); + var { + nestIndex + } = this.state; + nestIndex.push(node); + this.setState({ + formatRoot, + currentRoot: root, + nestIndex + }); + } + if (onClick) { + onClick(node); + } + }); + _defineProperty(this, "handleTouchMove", e => { + var touchEvent = e.touches[0]; + if (touchEvent == null) { + return; + } + var target = document.elementFromPoint(touchEvent.clientX, touchEvent.clientY); + if (!target || !target.getAttribute || this.state.formatRoot == null) { + return; + } + var itemIndex = target.getAttribute('data-recharts-item-index'); + var activeNode = treemapPayloadSearcher(this.state.formatRoot, itemIndex); + if (!isTreemapNode(activeNode)) { + return; + } + var { + dataKey, + dispatch + } = this.props; + var activeCoordinate = { + x: activeNode.x + activeNode.width / 2, + y: activeNode.y + activeNode.height / 2 + }; + + // Treemap does not support onTouchMove prop, but it could + // onTouchMove?.(activeNode, Number(itemIndex), e); + dispatch(setActiveMouseOverItemIndex({ + activeIndex: itemIndex, + activeDataKey: dataKey, + activeCoordinate, + activeGraphicalItemId: this.props.id + })); + }); + } + static getDerivedStateFromProps(nextProps, prevState) { + if (nextProps.data !== prevState.prevData || nextProps.type !== prevState.prevType || nextProps.width !== prevState.prevWidth || nextProps.height !== prevState.prevHeight || nextProps.dataKey !== prevState.prevDataKey || nextProps.aspectRatio !== prevState.prevAspectRatio) { + var root = computeNode({ + depth: 0, + // @ts-expect-error missing properties + node: { + children: nextProps.data, + x: 0, + y: 0, + width: nextProps.width, + height: nextProps.height + }, + index: 0, + dataKey: nextProps.dataKey, + nameKey: nextProps.nameKey + }); + var formatRoot = squarify(root, nextProps.aspectRatio); + return _objectSpread(_objectSpread({}, prevState), {}, { + formatRoot, + currentRoot: root, + nestIndex: [root], + prevAspectRatio: nextProps.aspectRatio, + prevData: nextProps.data, + prevWidth: nextProps.width, + prevHeight: nextProps.height, + prevDataKey: nextProps.dataKey, + prevType: nextProps.type + }); + } + return null; + } + handleNestIndex(node, i) { + var { + nestIndex + } = this.state; + var { + width, + height, + dataKey, + nameKey, + aspectRatio + } = this.props; + var root = computeNode({ + depth: 0, + node: _objectSpread(_objectSpread({}, node), {}, { + x: 0, + y: 0, + width, + height + }), + index: 0, + dataKey, + nameKey, + // with Treemap nesting, should this continue nesting the index or start from empty string? + nestedActiveTooltipIndex: node.tooltipIndex + }); + var formatRoot = squarify(root, aspectRatio); + nestIndex = nestIndex.slice(0, i + 1); + this.setState({ + formatRoot, + currentRoot: node, + nestIndex + }); + } + renderNode(root, node) { + var { + content, + type + } = this.props; + var nodeProps = _objectSpread(_objectSpread(_objectSpread({}, svgPropertiesNoEvents(this.props)), node), {}, { + root + }); + var isLeaf = !node.children || !node.children.length; + var { + currentRoot + } = this.state; + var isCurrentRootChild = ((currentRoot === null || currentRoot === void 0 ? void 0 : currentRoot.children) || []).filter(item => item.depth === node.depth && item.name === node.name); + if (!isCurrentRootChild.length && root.depth && type === 'nest') { + return null; + } + return /*#__PURE__*/React.createElement(Layer, { + key: "recharts-treemap-node-".concat(nodeProps.x, "-").concat(nodeProps.y, "-").concat(nodeProps.name), + className: "recharts-treemap-depth-".concat(node.depth) + }, /*#__PURE__*/React.createElement(TreemapItem, { + isLeaf: isLeaf, + content: content, + nodeProps: nodeProps, + treemapProps: this.props, + onNestClick: this.handleClick + }), node.children && node.children.length ? node.children.map(child => this.renderNode(node, child)) : null); + } + renderAllNodes() { + var { + formatRoot + } = this.state; + if (!formatRoot) { + return null; + } + return this.renderNode(formatRoot, formatRoot); + } + + // render nest treemap + renderNestIndex() { + var { + nameKey, + nestIndexContent + } = this.props; + var { + nestIndex + } = this.state; + return /*#__PURE__*/React.createElement("div", { + className: "recharts-treemap-nest-index-wrapper", + style: { + marginTop: '8px', + textAlign: 'center' + } + }, nestIndex.map((item, i) => { + // TODO need to verify nameKey type + var rawName = get(item, nameKey, 'root'); + var name = typeof rawName === 'string' ? rawName : 'root'; + var content; + if (/*#__PURE__*/React.isValidElement(nestIndexContent)) { + // the cloned content is ignored at all times - let's remove it? + content = /*#__PURE__*/React.cloneElement(nestIndexContent, item, i); + } + if (typeof nestIndexContent === 'function') { + content = nestIndexContent(item, i); + } else { + content = name; + } + return ( + /*#__PURE__*/ + // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions + React.createElement("div", { + onClick: this.handleNestIndex.bind(this, item, i), + key: "nest-index-".concat(uniqueId()), + className: "recharts-treemap-nest-index-box", + style: { + cursor: 'pointer', + display: 'inline-block', + padding: '0 7px', + background: '#000', + color: '#fff', + marginRight: '3px' + } + }, content) + ); + })); + } + render() { + var _this$props = this.props, + { + width, + height, + className, + style, + children, + type + } = _this$props, + others = _objectWithoutProperties(_this$props, _excluded); + var attrs = svgPropertiesNoEvents(others); + return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SetTreemapTooltipEntrySettings, { + dataKey: this.props.dataKey, + nameKey: this.props.nameKey, + stroke: this.props.stroke, + fill: this.props.fill, + currentRoot: this.state.currentRoot, + id: this.props.id + }), /*#__PURE__*/React.createElement(Surface, _extends({}, attrs, { + width: width, + height: type === 'nest' ? height - 30 : height, + onTouchMove: this.handleTouchMove + }), this.renderAllNodes(), children), type === 'nest' && this.renderNestIndex()); + } +} +_defineProperty(TreemapWithState, "displayName", 'Treemap'); +function TreemapDispatchInject(props) { + var dispatch = useAppDispatch(); + var width = useChartWidth(); + var height = useChartHeight(); + if (!isPositiveNumber(width) || !isPositiveNumber(height)) { + return null; + } + var { + id: externalId + } = props; + return /*#__PURE__*/React.createElement(RegisterGraphicalItemId, { + id: externalId, + type: "treemap" + }, id => /*#__PURE__*/React.createElement(TreemapWithState, _extends({}, props, { + id: id, + width: width, + height: height, + dispatch: dispatch + }))); +} + +/** + * The Treemap chart is used to visualize hierarchical data using nested rectangles. + * + * @consumes ResponsiveContainerContext + * @provides TooltipEntrySettings + */ +export function Treemap(outsideProps) { + var _props$className; + var props = resolveDefaultProps(outsideProps, defaultTreeMapProps); + var { + className, + style, + width, + height + } = props; + var [tooltipPortal, setTooltipPortal] = useState(null); + return /*#__PURE__*/React.createElement(RechartsStoreProvider, { + preloadedState: { + options + }, + reduxStoreName: (_props$className = props.className) !== null && _props$className !== void 0 ? _props$className : 'Treemap' + }, /*#__PURE__*/React.createElement(ReportChartMargin, { + margin: defaultTreemapMargin + }), /*#__PURE__*/React.createElement(RechartsWrapper, { + dispatchTouchEvents: false, + className: className, + style: style, + width: width, + height: height + /* + * Treemap has a bug where it doesn't include strokeWidth in its dimension calculation + * which makes the actual chart exactly {strokeWidth} larger than asked for. + * It's not a huge deal usually, but it makes the responsive option cycle infinitely. + */, + responsive: false, + ref: node => { + if (tooltipPortal == null && node != null) { + setTooltipPortal(node); + } + }, + onMouseEnter: undefined, + onMouseLeave: undefined, + onClick: undefined, + onMouseMove: undefined, + onMouseDown: undefined, + onMouseUp: undefined, + onContextMenu: undefined, + onDoubleClick: undefined, + onTouchStart: undefined, + onTouchMove: undefined, + onTouchEnd: undefined + }, /*#__PURE__*/React.createElement(TooltipPortalContext.Provider, { + value: tooltipPortal + }, /*#__PURE__*/React.createElement(TreemapDispatchInject, props)))); +} Index: node_modules/recharts/es6/chart/types.js =================================================================== --- node_modules/recharts/es6/chart/types.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) +++ node_modules/recharts/es6/chart/types.js (revision a762898ecd37a452c782821d4c2c4955c6ed2521) @@ -0,0 +1,1 @@ +export {};