`\n */\nexport function useElementOffset() {\n var extraDependencies = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];\n var [lastBoundingBox, setLastBoundingBox] = useState({\n height: 0,\n left: 0,\n top: 0,\n width: 0\n });\n var updateBoundingBox = useCallback(node => {\n if (node != null) {\n var rect = node.getBoundingClientRect();\n var box = {\n height: rect.height,\n left: rect.left,\n top: rect.top,\n width: rect.width\n };\n if (Math.abs(box.height - lastBoundingBox.height) > EPS || Math.abs(box.left - lastBoundingBox.left) > EPS || Math.abs(box.top - lastBoundingBox.top) > EPS || Math.abs(box.width - lastBoundingBox.width) > EPS) {\n setLastBoundingBox({\n height: box.height,\n left: box.left,\n top: box.top,\n width: box.width\n });\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [lastBoundingBox.width, lastBoundingBox.height, lastBoundingBox.top, lastBoundingBox.left, ...extraDependencies]);\n return [lastBoundingBox, updateBoundingBox];\n}","var _excluded = [\"contextPayload\"];\nfunction _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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nfunction _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; }\nfunction _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; }\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useLegendPortal } from '../context/legendPortalContext';\nimport { DefaultLegendContent } from './DefaultLegendContent';\nimport { getUniqPayload } from '../util/payload/getUniqPayload';\nimport { useLegendPayload } from '../context/legendPayloadContext';\nimport { useElementOffset } from '../util/useElementOffset';\nimport { useChartHeight, useChartWidth, useMargin } from '../context/chartLayoutContext';\nimport { setLegendSettings, setLegendSize } from '../state/legendSlice';\nimport { useAppDispatch } from '../state/hooks';\nimport { resolveDefaultProps } from '../util/resolveDefaultProps';\nimport { propsAreEqual } from '../util/propsAreEqual';\nfunction defaultUniqBy(entry) {\n return entry.value;\n}\nfunction LegendContent(props) {\n var {\n contextPayload\n } = props,\n otherProps = _objectWithoutProperties(props, _excluded);\n var finalPayload = getUniqPayload(contextPayload, props.payloadUniqBy, defaultUniqBy);\n var contentProps = _objectSpread(_objectSpread({}, otherProps), {}, {\n payload: finalPayload\n });\n if (/*#__PURE__*/React.isValidElement(props.content)) {\n return /*#__PURE__*/React.cloneElement(props.content, contentProps);\n }\n if (typeof props.content === 'function') {\n return /*#__PURE__*/React.createElement(props.content, contentProps);\n }\n return /*#__PURE__*/React.createElement(DefaultLegendContent, contentProps);\n}\nfunction getDefaultPosition(style, props, margin, chartWidth, chartHeight, box) {\n var {\n layout,\n align,\n verticalAlign\n } = props;\n var hPos, vPos;\n if (!style || (style.left === undefined || style.left === null) && (style.right === undefined || style.right === null)) {\n if (align === 'center' && layout === 'vertical') {\n hPos = {\n left: ((chartWidth || 0) - box.width) / 2\n };\n } else {\n hPos = align === 'right' ? {\n right: margin && margin.right || 0\n } : {\n left: margin && margin.left || 0\n };\n }\n }\n if (!style || (style.top === undefined || style.top === null) && (style.bottom === undefined || style.bottom === null)) {\n if (verticalAlign === 'middle') {\n vPos = {\n top: ((chartHeight || 0) - box.height) / 2\n };\n } else {\n vPos = verticalAlign === 'bottom' ? {\n bottom: margin && margin.bottom || 0\n } : {\n top: margin && margin.top || 0\n };\n }\n }\n return _objectSpread(_objectSpread({}, hPos), vPos);\n}\nfunction LegendSettingsDispatcher(props) {\n var dispatch = useAppDispatch();\n useEffect(() => {\n dispatch(setLegendSettings(props));\n }, [dispatch, props]);\n return null;\n}\nfunction LegendSizeDispatcher(props) {\n var dispatch = useAppDispatch();\n useEffect(() => {\n dispatch(setLegendSize(props));\n return () => {\n dispatch(setLegendSize({\n width: 0,\n height: 0\n }));\n };\n }, [dispatch, props]);\n return null;\n}\nfunction getWidthOrHeight(layout, height, width, maxWidth) {\n if (layout === 'vertical' && height != null) {\n return {\n height\n };\n }\n if (layout === 'horizontal') {\n return {\n width: width || maxWidth\n };\n }\n return null;\n}\nexport var legendDefaultProps = {\n align: 'center',\n iconSize: 14,\n inactiveColor: '#ccc',\n itemSorter: 'value',\n layout: 'horizontal',\n verticalAlign: 'bottom'\n};\n\n/**\n * @consumes CartesianChartContext\n * @consumes PolarChartContext\n */\nfunction LegendImpl(outsideProps) {\n var props = resolveDefaultProps(outsideProps, legendDefaultProps);\n var contextPayload = useLegendPayload();\n var legendPortalFromContext = useLegendPortal();\n var margin = useMargin();\n var {\n width: widthFromProps,\n height: heightFromProps,\n wrapperStyle,\n portal: portalFromProps\n } = props;\n // The contextPayload is not used directly inside the hook, but we need the onBBoxUpdate call\n // when the payload changes, therefore it's here as a dependency.\n var [lastBoundingBox, updateBoundingBox] = useElementOffset([contextPayload]);\n var chartWidth = useChartWidth();\n var chartHeight = useChartHeight();\n if (chartWidth == null || chartHeight == null) {\n return null;\n }\n var maxWidth = chartWidth - ((margin === null || margin === void 0 ? void 0 : margin.left) || 0) - ((margin === null || margin === void 0 ? void 0 : margin.right) || 0);\n var widthOrHeight = getWidthOrHeight(props.layout, heightFromProps, widthFromProps, maxWidth);\n // if the user supplies their own portal, only use their defined wrapper styles\n var outerStyle = portalFromProps ? wrapperStyle : _objectSpread(_objectSpread({\n position: 'absolute',\n width: (widthOrHeight === null || widthOrHeight === void 0 ? void 0 : widthOrHeight.width) || widthFromProps || 'auto',\n height: (widthOrHeight === null || widthOrHeight === void 0 ? void 0 : widthOrHeight.height) || heightFromProps || 'auto'\n }, getDefaultPosition(wrapperStyle, props, margin, chartWidth, chartHeight, lastBoundingBox)), wrapperStyle);\n var legendPortal = portalFromProps !== null && portalFromProps !== void 0 ? portalFromProps : legendPortalFromContext;\n if (legendPortal == null || contextPayload == null) {\n return null;\n }\n var legendElement = /*#__PURE__*/React.createElement(\"div\", {\n className: \"recharts-legend-wrapper\",\n style: outerStyle,\n ref: updateBoundingBox\n }, /*#__PURE__*/React.createElement(LegendSettingsDispatcher, {\n layout: props.layout,\n align: props.align,\n verticalAlign: props.verticalAlign,\n itemSorter: props.itemSorter\n }), !portalFromProps && /*#__PURE__*/React.createElement(LegendSizeDispatcher, {\n width: lastBoundingBox.width,\n height: lastBoundingBox.height\n }), /*#__PURE__*/React.createElement(LegendContent, _extends({}, props, widthOrHeight, {\n margin: margin,\n chartWidth: chartWidth,\n chartHeight: chartHeight,\n contextPayload: contextPayload\n })));\n return /*#__PURE__*/createPortal(legendElement, legendPortal);\n}\nexport var Legend = /*#__PURE__*/React.memo(LegendImpl, propsAreEqual);\nLegend.displayName = 'Legend';","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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\n/**\n * @fileOverview Default Tooltip Content\n */\n\nimport * as React from 'react';\nimport sortBy from 'es-toolkit/compat/sortBy';\nimport { clsx } from 'clsx';\nimport { isNullish, isNumOrStr } from '../util/DataUtils';\nfunction defaultFormatter(value) {\n return Array.isArray(value) && isNumOrStr(value[0]) && isNumOrStr(value[1]) ? value.join(' ~ ') : value;\n}\n\n/**\n * @inline\n */\n\nexport var defaultDefaultTooltipContentProps = {\n separator: ' : ',\n contentStyle: {\n margin: 0,\n padding: 10,\n backgroundColor: '#fff',\n border: '1px solid #ccc',\n whiteSpace: 'nowrap'\n },\n itemStyle: {\n display: 'block',\n paddingTop: 4,\n paddingBottom: 4,\n color: '#000'\n },\n labelStyle: {},\n accessibilityLayer: false\n};\nfunction lodashLikeSortBy(array, itemSorter) {\n if (itemSorter == null) {\n return array;\n }\n // @ts-expect-error sortBy types somehow are returning a number type.\n return sortBy(array, itemSorter);\n}\n\n/**\n * This component is by default rendered inside the {@link Tooltip} component. You would not use it directly.\n *\n * You can use this component to customize the content of the tooltip,\n * or you can provide your own completely independent content.\n */\nexport var DefaultTooltipContent = props => {\n var {\n separator = defaultDefaultTooltipContentProps.separator,\n contentStyle,\n itemStyle,\n labelStyle = defaultDefaultTooltipContentProps.labelStyle,\n payload,\n formatter,\n itemSorter,\n wrapperClassName,\n labelClassName,\n label,\n labelFormatter,\n accessibilityLayer = defaultDefaultTooltipContentProps.accessibilityLayer\n } = props;\n var renderContent = () => {\n if (payload && payload.length) {\n var listStyle = {\n padding: 0,\n margin: 0\n };\n var sortedPayload = lodashLikeSortBy(payload, itemSorter);\n var items = sortedPayload.map((entry, i) => {\n if (!entry || entry.type === 'none') {\n return null;\n }\n var finalFormatter = entry.formatter || formatter || defaultFormatter;\n var {\n value,\n name\n } = entry;\n var finalValue = value;\n var finalName = name;\n if (finalFormatter) {\n var formatted = finalFormatter(value, name, entry, i, payload);\n if (Array.isArray(formatted)) {\n [finalValue, finalName] = formatted;\n } else if (formatted != null) {\n finalValue = formatted;\n } else {\n return null;\n }\n }\n var finalItemStyle = _objectSpread(_objectSpread({}, defaultDefaultTooltipContentProps.itemStyle), {}, {\n color: entry.color || defaultDefaultTooltipContentProps.itemStyle.color\n }, itemStyle);\n return /*#__PURE__*/React.createElement(\"li\", {\n className: \"recharts-tooltip-item\",\n key: \"tooltip-item-\".concat(i),\n style: finalItemStyle\n }, isNumOrStr(finalName) ? /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-name\"\n }, finalName) : null, isNumOrStr(finalName) ? /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-separator\"\n }, separator) : null, /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-value\"\n }, finalValue), /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-unit\"\n }, entry.unit || ''));\n });\n return /*#__PURE__*/React.createElement(\"ul\", {\n className: \"recharts-tooltip-item-list\",\n style: listStyle\n }, items);\n }\n return null;\n };\n var finalStyle = _objectSpread(_objectSpread({}, defaultDefaultTooltipContentProps.contentStyle), contentStyle);\n var finalLabelStyle = _objectSpread({\n margin: 0\n }, labelStyle);\n var hasLabel = !isNullish(label);\n var finalLabel = hasLabel ? label : '';\n var wrapperCN = clsx('recharts-default-tooltip', wrapperClassName);\n var labelCN = clsx('recharts-tooltip-label', labelClassName);\n if (hasLabel && labelFormatter && payload !== undefined && payload !== null) {\n finalLabel = labelFormatter(label, payload);\n }\n var accessibilityAttributes = accessibilityLayer ? {\n role: 'status',\n 'aria-live': 'assertive'\n } : {};\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n className: wrapperCN,\n style: finalStyle\n }, accessibilityAttributes), /*#__PURE__*/React.createElement(\"p\", {\n className: labelCN,\n style: finalLabelStyle\n }, /*#__PURE__*/React.isValidElement(finalLabel) ? finalLabel : \"\".concat(finalLabel)), renderContent());\n};","import { clsx } from 'clsx';\nimport { isNumber } from '../DataUtils';\nvar CSS_CLASS_PREFIX = 'recharts-tooltip-wrapper';\nvar TOOLTIP_HIDDEN = {\n visibility: 'hidden'\n};\nexport function getTooltipCSSClassName(_ref) {\n var {\n coordinate,\n translateX,\n translateY\n } = _ref;\n return clsx(CSS_CLASS_PREFIX, {\n [\"\".concat(CSS_CLASS_PREFIX, \"-right\")]: isNumber(translateX) && coordinate && isNumber(coordinate.x) && translateX >= coordinate.x,\n [\"\".concat(CSS_CLASS_PREFIX, \"-left\")]: isNumber(translateX) && coordinate && isNumber(coordinate.x) && translateX < coordinate.x,\n [\"\".concat(CSS_CLASS_PREFIX, \"-bottom\")]: isNumber(translateY) && coordinate && isNumber(coordinate.y) && translateY >= coordinate.y,\n [\"\".concat(CSS_CLASS_PREFIX, \"-top\")]: isNumber(translateY) && coordinate && isNumber(coordinate.y) && translateY < coordinate.y\n });\n}\nexport function getTooltipTranslateXY(_ref2) {\n var {\n allowEscapeViewBox,\n coordinate,\n key,\n offset,\n position,\n reverseDirection,\n tooltipDimension,\n viewBox,\n viewBoxDimension\n } = _ref2;\n if (position && isNumber(position[key])) {\n return position[key];\n }\n var negative = coordinate[key] - tooltipDimension - (offset > 0 ? offset : 0);\n var positive = coordinate[key] + offset;\n if (allowEscapeViewBox[key]) {\n return reverseDirection[key] ? negative : positive;\n }\n var viewBoxKey = viewBox[key];\n if (viewBoxKey == null) {\n return 0;\n }\n if (reverseDirection[key]) {\n var _tooltipBoundary = negative;\n var _viewBoxBoundary = viewBoxKey;\n if (_tooltipBoundary < _viewBoxBoundary) {\n return Math.max(positive, viewBoxKey);\n }\n return Math.max(negative, viewBoxKey);\n }\n if (viewBoxDimension == null) {\n return 0;\n }\n var tooltipBoundary = positive + tooltipDimension;\n var viewBoxBoundary = viewBoxKey + viewBoxDimension;\n if (tooltipBoundary > viewBoxBoundary) {\n return Math.max(negative, viewBoxKey);\n }\n return Math.max(positive, viewBoxKey);\n}\nexport function getTransformStyle(_ref3) {\n var {\n translateX,\n translateY,\n useTranslate3d\n } = _ref3;\n return {\n transform: useTranslate3d ? \"translate3d(\".concat(translateX, \"px, \").concat(translateY, \"px, 0)\") : \"translate(\".concat(translateX, \"px, \").concat(translateY, \"px)\")\n };\n}\nexport function getTooltipTranslate(_ref4) {\n var {\n allowEscapeViewBox,\n coordinate,\n offsetTop,\n offsetLeft,\n position,\n reverseDirection,\n tooltipBox,\n useTranslate3d,\n viewBox\n } = _ref4;\n var cssProperties, translateX, translateY;\n if (tooltipBox.height > 0 && tooltipBox.width > 0 && coordinate) {\n translateX = getTooltipTranslateXY({\n allowEscapeViewBox,\n coordinate,\n key: 'x',\n offset: offsetLeft,\n position,\n reverseDirection,\n tooltipDimension: tooltipBox.width,\n viewBox,\n viewBoxDimension: viewBox.width\n });\n translateY = getTooltipTranslateXY({\n allowEscapeViewBox,\n coordinate,\n key: 'y',\n offset: offsetTop,\n position,\n reverseDirection,\n tooltipDimension: tooltipBox.height,\n viewBox,\n viewBoxDimension: viewBox.height\n });\n cssProperties = getTransformStyle({\n translateX,\n translateY,\n useTranslate3d\n });\n } else {\n cssProperties = TOOLTIP_HIDDEN;\n }\n return {\n cssProperties,\n cssClasses: getTooltipCSSClassName({\n translateX,\n translateY,\n coordinate\n })\n };\n}","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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nimport * as React from 'react';\nimport { getTooltipTranslate } from '../util/tooltip/translate';\nimport { usePrefersReducedMotion } from '../util/usePrefersReducedMotion';\nfunction resolveTransitionProperty(args) {\n if (args.prefersReducedMotion && args.isAnimationActive === 'auto') {\n return undefined;\n }\n if (args.isAnimationActive && args.active) {\n return \"transform \".concat(args.animationDuration, \"ms \").concat(args.animationEasing);\n }\n return undefined;\n}\nfunction TooltipBoundingBoxImpl(props) {\n var _props$coordinate3, _props$coordinate4, _props$coordinate$x2, _props$coordinate5, _props$coordinate$y2, _props$coordinate6;\n var prefersReducedMotion = usePrefersReducedMotion();\n var [state, setState] = React.useState(() => ({\n dismissed: false,\n dismissedAtCoordinate: {\n x: 0,\n y: 0\n }\n }));\n React.useEffect(() => {\n var handleKeyDown = event => {\n if (event.key === 'Escape') {\n var _props$coordinate$x, _props$coordinate, _props$coordinate$y, _props$coordinate2;\n setState({\n dismissed: true,\n dismissedAtCoordinate: {\n x: (_props$coordinate$x = (_props$coordinate = props.coordinate) === null || _props$coordinate === void 0 ? void 0 : _props$coordinate.x) !== null && _props$coordinate$x !== void 0 ? _props$coordinate$x : 0,\n y: (_props$coordinate$y = (_props$coordinate2 = props.coordinate) === null || _props$coordinate2 === void 0 ? void 0 : _props$coordinate2.y) !== null && _props$coordinate$y !== void 0 ? _props$coordinate$y : 0\n }\n });\n }\n };\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [(_props$coordinate3 = props.coordinate) === null || _props$coordinate3 === void 0 ? void 0 : _props$coordinate3.x, (_props$coordinate4 = props.coordinate) === null || _props$coordinate4 === void 0 ? void 0 : _props$coordinate4.y]);\n if (state.dismissed && (((_props$coordinate$x2 = (_props$coordinate5 = props.coordinate) === null || _props$coordinate5 === void 0 ? void 0 : _props$coordinate5.x) !== null && _props$coordinate$x2 !== void 0 ? _props$coordinate$x2 : 0) !== state.dismissedAtCoordinate.x || ((_props$coordinate$y2 = (_props$coordinate6 = props.coordinate) === null || _props$coordinate6 === void 0 ? void 0 : _props$coordinate6.y) !== null && _props$coordinate$y2 !== void 0 ? _props$coordinate$y2 : 0) !== state.dismissedAtCoordinate.y)) {\n setState(_objectSpread(_objectSpread({}, state), {}, {\n dismissed: false\n }));\n }\n var {\n cssClasses,\n cssProperties\n } = getTooltipTranslate({\n allowEscapeViewBox: props.allowEscapeViewBox,\n coordinate: props.coordinate,\n offsetLeft: typeof props.offset === 'number' ? props.offset : props.offset.x,\n offsetTop: typeof props.offset === 'number' ? props.offset : props.offset.y,\n position: props.position,\n reverseDirection: props.reverseDirection,\n tooltipBox: {\n height: props.lastBoundingBox.height,\n width: props.lastBoundingBox.width\n },\n useTranslate3d: props.useTranslate3d,\n viewBox: props.viewBox\n });\n var positionStyle = props.hasPortalFromProps ? {} : _objectSpread(_objectSpread({\n transition: resolveTransitionProperty({\n prefersReducedMotion,\n isAnimationActive: props.isAnimationActive,\n active: props.active,\n animationDuration: props.animationDuration,\n animationEasing: props.animationEasing\n })\n }, cssProperties), {}, {\n pointerEvents: 'none',\n position: 'absolute',\n top: 0,\n left: 0\n });\n var outerStyle = _objectSpread(_objectSpread({}, positionStyle), {}, {\n visibility: !state.dismissed && props.active && props.hasPayload ? 'visible' : 'hidden'\n }, props.wrapperStyle);\n return /*#__PURE__*/React.createElement(\"div\", {\n // @ts-expect-error typescript library does not recognize xmlns attribute, but it's required for an HTML chunk inside SVG.\n xmlns: \"http://www.w3.org/1999/xhtml\",\n tabIndex: -1,\n className: cssClasses,\n style: outerStyle,\n ref: props.innerRef\n }, props.children);\n}\nexport var TooltipBoundingBox = /*#__PURE__*/React.memo(TooltipBoundingBoxImpl);","var _excluded = [\"x\", \"y\", \"top\", \"left\", \"width\", \"height\", \"className\"];\nfunction _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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nfunction _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; }\nfunction _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; }\n/**\n * @fileOverview Cross\n */\nimport * as React from 'react';\nimport { clsx } from 'clsx';\nimport { isNumber } from '../util/DataUtils';\nimport { svgPropertiesAndEvents } from '../util/svgPropertiesAndEvents';\nvar getPath = (x, y, width, height, top, left) => {\n return \"M\".concat(x, \",\").concat(top, \"v\").concat(height, \"M\").concat(left, \",\").concat(y, \"h\").concat(width);\n};\nexport var Cross = _ref => {\n var {\n x = 0,\n y = 0,\n top = 0,\n left = 0,\n width = 0,\n height = 0,\n className\n } = _ref,\n rest = _objectWithoutProperties(_ref, _excluded);\n var props = _objectSpread({\n x,\n y,\n top,\n left,\n width,\n height\n }, rest);\n if (!isNumber(x) || !isNumber(y) || !isNumber(width) || !isNumber(height) || !isNumber(top) || !isNumber(left)) {\n return null;\n }\n return /*#__PURE__*/React.createElement(\"path\", _extends({}, svgPropertiesAndEvents(props), {\n className: clsx('recharts-cross', className),\n d: getPath(x, y, width, height, top, left)\n }));\n};","export function getCursorRectangle(layout, activeCoordinate, offset, tooltipAxisBandSize) {\n var halfSize = tooltipAxisBandSize / 2;\n return {\n stroke: 'none',\n fill: '#ccc',\n x: layout === 'horizontal' ? activeCoordinate.x - halfSize : offset.left + 0.5,\n y: layout === 'horizontal' ? offset.top + 0.5 : activeCoordinate.y - halfSize,\n width: layout === 'horizontal' ? tooltipAxisBandSize : offset.width - 1,\n height: layout === 'horizontal' ? offset.height - 1 : tooltipAxisBandSize\n };\n}","import { polarToCartesian } from '../PolarUtils';\n/**\n * Only applicable for radial layouts\n * @param {Object} activeCoordinate ChartCoordinate\n * @returns {Object} RadialCursorPoints\n */\nexport function getRadialCursorPoints(activeCoordinate) {\n var {\n cx,\n cy,\n radius,\n startAngle,\n endAngle\n } = activeCoordinate;\n var startPoint = polarToCartesian(cx, cy, radius, startAngle);\n var endPoint = polarToCartesian(cx, cy, radius, endAngle);\n return {\n points: [startPoint, endPoint],\n cx,\n cy,\n radius,\n startAngle,\n endAngle\n };\n}","import { polarToCartesian } from '../PolarUtils';\nimport { isPolarCoordinate } from '../types';\nimport { getRadialCursorPoints } from './getRadialCursorPoints';\nexport function getCursorPoints(layout, activeCoordinate, offset) {\n if (layout === 'horizontal') {\n return [{\n x: activeCoordinate.x,\n y: offset.top\n }, {\n x: activeCoordinate.x,\n y: offset.top + offset.height\n }];\n }\n if (layout === 'vertical') {\n return [{\n x: offset.left,\n y: activeCoordinate.y\n }, {\n x: offset.left + offset.width,\n y: activeCoordinate.y\n }];\n }\n if (isPolarCoordinate(activeCoordinate)) {\n if (layout === 'centric') {\n var {\n cx,\n cy,\n innerRadius,\n outerRadius,\n angle\n } = activeCoordinate;\n var innerPoint = polarToCartesian(cx, cy, innerRadius, angle);\n var outerPoint = polarToCartesian(cx, cy, outerRadius, angle);\n return [{\n x: innerPoint.x,\n y: innerPoint.y\n }, {\n x: outerPoint.x,\n y: outerPoint.y\n }];\n }\n return getRadialCursorPoints(activeCoordinate);\n }\n return undefined;\n}","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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nimport { useAppSelector } from '../state/hooks';\nimport { getBandSizeOfAxis } from '../util/ChartUtils';\nimport { selectTooltipAxis } from '../state/selectors/axisSelectors';\nimport { selectTooltipAxisScale, selectTooltipAxisTicks } from '../state/selectors/tooltipSelectors';\nexport var useTooltipAxis = () => useAppSelector(selectTooltipAxis);\nexport var useTooltipAxisBandSize = () => {\n var tooltipAxis = useTooltipAxis();\n var tooltipTicks = useAppSelector(selectTooltipAxisTicks);\n var tooltipAxisScale = useAppSelector(selectTooltipAxisScale);\n if (!tooltipAxis || !tooltipAxisScale) {\n return getBandSizeOfAxis(undefined, tooltipTicks);\n }\n return getBandSizeOfAxis(_objectSpread(_objectSpread({}, tooltipAxis), {}, {\n scale: tooltipAxisScale\n }), tooltipTicks);\n};","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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nimport * as React from 'react';\nimport { cloneElement, createElement, isValidElement } from 'react';\nimport { clsx } from 'clsx';\nimport { isPolarCoordinate } from '../util/types';\nimport { Curve } from '../shape/Curve';\nimport { Cross } from '../shape/Cross';\nimport { getCursorRectangle } from '../util/cursor/getCursorRectangle';\nimport { Rectangle } from '../shape/Rectangle';\nimport { getRadialCursorPoints } from '../util/cursor/getRadialCursorPoints';\nimport { Sector } from '../shape/Sector';\nimport { getCursorPoints } from '../util/cursor/getCursorPoints';\nimport { useChartLayout, useOffsetInternal } from '../context/chartLayoutContext';\nimport { useTooltipAxisBandSize } from '../context/useTooltipAxis';\nimport { useChartName } from '../state/selectors/selectors';\nimport { svgPropertiesNoEventsFromUnknown } from '../util/svgPropertiesNoEvents';\nimport { ZIndexLayer } from '../zIndex/ZIndexLayer';\nimport { DefaultZIndexes } from '../zIndex/DefaultZIndexes';\n\n/**\n * If set false, no cursor will be drawn when tooltip is active.\n * If set an object, the option is the configuration of cursor.\n * If set a React element, the option is the custom react element of drawing cursor\n */\n\nfunction RenderCursor(_ref) {\n var {\n cursor,\n cursorComp,\n cursorProps\n } = _ref;\n if (/*#__PURE__*/isValidElement(cursor)) {\n return /*#__PURE__*/cloneElement(cursor, cursorProps);\n }\n return /*#__PURE__*/createElement(cursorComp, cursorProps);\n}\nexport function CursorInternal(props) {\n var _props$zIndex;\n var {\n coordinate,\n payload,\n index,\n offset,\n tooltipAxisBandSize,\n layout,\n cursor,\n tooltipEventType,\n chartName\n } = props;\n\n // The cursor is a part of the Tooltip, and it should be shown (by default) when the Tooltip is active.\n var activeCoordinate = coordinate;\n var activePayload = payload;\n var activeTooltipIndex = index;\n if (!cursor || !activeCoordinate || chartName !== 'ScatterChart' && tooltipEventType !== 'axis') {\n return null;\n }\n var restProps, cursorComp, preferredZIndex;\n if (chartName === 'ScatterChart') {\n restProps = activeCoordinate;\n cursorComp = Cross;\n preferredZIndex = DefaultZIndexes.cursorLine;\n } else if (chartName === 'BarChart') {\n restProps = getCursorRectangle(layout, activeCoordinate, offset, tooltipAxisBandSize);\n cursorComp = Rectangle;\n preferredZIndex = DefaultZIndexes.cursorRectangle;\n } else if (layout === 'radial' && isPolarCoordinate(activeCoordinate)) {\n var {\n cx,\n cy,\n radius,\n startAngle,\n endAngle\n } = getRadialCursorPoints(activeCoordinate);\n restProps = {\n cx,\n cy,\n startAngle,\n endAngle,\n innerRadius: radius,\n outerRadius: radius\n };\n cursorComp = Sector;\n preferredZIndex = DefaultZIndexes.cursorLine;\n } else {\n restProps = {\n points: getCursorPoints(layout, activeCoordinate, offset)\n };\n cursorComp = Curve;\n preferredZIndex = DefaultZIndexes.cursorLine;\n }\n var extraClassName = typeof cursor === 'object' && 'className' in cursor ? cursor.className : undefined;\n var cursorProps = _objectSpread(_objectSpread(_objectSpread(_objectSpread({\n stroke: '#ccc',\n pointerEvents: 'none'\n }, offset), restProps), svgPropertiesNoEventsFromUnknown(cursor)), {}, {\n payload: activePayload,\n payloadIndex: activeTooltipIndex,\n className: clsx('recharts-tooltip-cursor', extraClassName)\n });\n return /*#__PURE__*/React.createElement(ZIndexLayer, {\n zIndex: (_props$zIndex = props.zIndex) !== null && _props$zIndex !== void 0 ? _props$zIndex : preferredZIndex\n }, /*#__PURE__*/React.createElement(RenderCursor, {\n cursor: cursor,\n cursorComp: cursorComp,\n cursorProps: cursorProps\n }));\n}\n\n/*\n * Cursor is the background, or a highlight,\n * that shows when user mouses over or activates\n * an area.\n *\n * It usually shows together with a tooltip\n * to emphasise which part of the chart does the tooltip refer to.\n */\nexport function Cursor(props) {\n var tooltipAxisBandSize = useTooltipAxisBandSize();\n var offset = useOffsetInternal();\n var layout = useChartLayout();\n var chartName = useChartName();\n if (tooltipAxisBandSize == null || offset == null || layout == null || chartName == null) {\n return null;\n }\n return /*#__PURE__*/React.createElement(CursorInternal, _extends({}, props, {\n offset: offset,\n layout: layout,\n tooltipAxisBandSize: tooltipAxisBandSize,\n chartName: chartName\n }));\n}","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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { DefaultTooltipContent } from './DefaultTooltipContent';\nimport { TooltipBoundingBox } from './TooltipBoundingBox';\nimport { getUniqPayload } from '../util/payload/getUniqPayload';\nimport { useViewBox } from '../context/chartLayoutContext';\nimport { useAccessibilityLayer } from '../context/accessibilityContext';\nimport { useElementOffset } from '../util/useElementOffset';\nimport { Cursor } from './Cursor';\nimport { selectActiveCoordinate, selectActiveLabel, selectIsTooltipActive, selectTooltipPayload } from '../state/selectors/selectors';\nimport { useTooltipPortal } from '../context/tooltipPortalContext';\nimport { useAppDispatch, useAppSelector } from '../state/hooks';\nimport { setTooltipSettingsState } from '../state/tooltipSlice';\nimport { useTooltipChartSynchronisation } from '../synchronisation/useChartSynchronisation';\nimport { useTooltipEventType } from '../state/selectors/selectTooltipEventType';\nimport { resolveDefaultProps } from '../util/resolveDefaultProps';\nfunction defaultUniqBy(entry) {\n return entry.dataKey;\n}\nfunction renderContent(content, props) {\n if (/*#__PURE__*/React.isValidElement(content)) {\n return /*#__PURE__*/React.cloneElement(content, props);\n }\n if (typeof content === 'function') {\n return /*#__PURE__*/React.createElement(content, props);\n }\n return /*#__PURE__*/React.createElement(DefaultTooltipContent, props);\n}\nvar emptyPayload = [];\nexport var defaultTooltipProps = {\n allowEscapeViewBox: {\n x: false,\n y: false\n },\n animationDuration: 400,\n animationEasing: 'ease',\n axisId: 0,\n contentStyle: {},\n cursor: true,\n filterNull: true,\n includeHidden: false,\n isAnimationActive: 'auto',\n itemSorter: 'name',\n itemStyle: {},\n labelStyle: {},\n offset: 10,\n reverseDirection: {\n x: false,\n y: false\n },\n separator: ' : ',\n trigger: 'hover',\n useTranslate3d: false,\n wrapperStyle: {}\n};\n\n/**\n * The Tooltip component displays a floating box with data values when hovering over or clicking on chart elements.\n *\n * It can be configured to show information for individual data points or for all points at a specific axis coordinate.\n * The appearance and content of the tooltip can be customized via props.\n *\n * @see {@link https://github.com/recharts/recharts/wiki/Tooltip-event-type-and-shared-prop Tooltip event type and shared prop wiki page}\n * @see {@link https://recharts.github.io/en-US/guide/activeIndex/ Active index replacement when migrating from Recharts v2 to v3}\n *\n * @consumes CartesianChartContext\n * @consumes PolarChartContext\n * @consumes TooltipEntrySettings\n */\nexport function Tooltip(outsideProps) {\n var _useAppSelector, _ref;\n var props = resolveDefaultProps(outsideProps, defaultTooltipProps);\n var {\n active: activeFromProps,\n allowEscapeViewBox,\n animationDuration,\n animationEasing,\n content,\n filterNull,\n isAnimationActive,\n offset,\n payloadUniqBy,\n position,\n reverseDirection,\n useTranslate3d,\n wrapperStyle,\n cursor,\n shared,\n trigger,\n defaultIndex,\n portal: portalFromProps,\n axisId\n } = props;\n var dispatch = useAppDispatch();\n var defaultIndexAsString = typeof defaultIndex === 'number' ? String(defaultIndex) : defaultIndex;\n useEffect(() => {\n dispatch(setTooltipSettingsState({\n shared,\n trigger,\n axisId,\n active: activeFromProps,\n defaultIndex: defaultIndexAsString\n }));\n }, [dispatch, shared, trigger, axisId, activeFromProps, defaultIndexAsString]);\n var viewBox = useViewBox();\n var accessibilityLayer = useAccessibilityLayer();\n var tooltipEventType = useTooltipEventType(shared);\n var {\n activeIndex,\n isActive\n } = (_useAppSelector = useAppSelector(state => selectIsTooltipActive(state, tooltipEventType, trigger, defaultIndexAsString))) !== null && _useAppSelector !== void 0 ? _useAppSelector : {};\n var payloadFromRedux = useAppSelector(state => selectTooltipPayload(state, tooltipEventType, trigger, defaultIndexAsString));\n var labelFromRedux = useAppSelector(state => selectActiveLabel(state, tooltipEventType, trigger, defaultIndexAsString));\n var coordinate = useAppSelector(state => selectActiveCoordinate(state, tooltipEventType, trigger, defaultIndexAsString));\n var payload = payloadFromRedux;\n var tooltipPortalFromContext = useTooltipPortal();\n /*\n * The user can set `active=true` on the Tooltip in which case the Tooltip will stay always active,\n * or `active=false` in which case the Tooltip never shows.\n *\n * If the `active` prop is not defined then it will show and hide based on mouse or keyboard activity.\n */\n var finalIsActive = (_ref = activeFromProps !== null && activeFromProps !== void 0 ? activeFromProps : isActive) !== null && _ref !== void 0 ? _ref : false;\n var [lastBoundingBox, updateBoundingBox] = useElementOffset([payload, finalIsActive]);\n var finalLabel = tooltipEventType === 'axis' ? labelFromRedux : undefined;\n useTooltipChartSynchronisation(tooltipEventType, trigger, coordinate, finalLabel, activeIndex, finalIsActive);\n var tooltipPortal = portalFromProps !== null && portalFromProps !== void 0 ? portalFromProps : tooltipPortalFromContext;\n if (tooltipPortal == null || viewBox == null || tooltipEventType == null) {\n return null;\n }\n var finalPayload = payload !== null && payload !== void 0 ? payload : emptyPayload;\n if (!finalIsActive) {\n finalPayload = emptyPayload;\n }\n if (filterNull && finalPayload.length) {\n finalPayload = getUniqPayload(finalPayload.filter(entry => entry.value != null && (entry.hide !== true || props.includeHidden)), payloadUniqBy, defaultUniqBy);\n }\n var hasPayload = finalPayload.length > 0;\n var tooltipContentProps = _objectSpread(_objectSpread({}, props), {}, {\n payload: finalPayload,\n label: finalLabel,\n active: finalIsActive,\n activeIndex,\n coordinate,\n accessibilityLayer\n });\n var tooltipElement = /*#__PURE__*/React.createElement(TooltipBoundingBox, {\n allowEscapeViewBox: allowEscapeViewBox,\n animationDuration: animationDuration,\n animationEasing: animationEasing,\n isAnimationActive: isAnimationActive,\n active: finalIsActive,\n coordinate: coordinate,\n hasPayload: hasPayload,\n offset: offset,\n position: position,\n reverseDirection: reverseDirection,\n useTranslate3d: useTranslate3d,\n viewBox: viewBox,\n wrapperStyle: wrapperStyle,\n lastBoundingBox: lastBoundingBox,\n innerRef: updateBoundingBox,\n hasPortalFromProps: Boolean(portalFromProps)\n }, renderContent(content, tooltipContentProps));\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/createPortal(tooltipElement, tooltipPortal), finalIsActive && /*#__PURE__*/React.createElement(Cursor, {\n cursor: cursor,\n tooltipEventType: tooltipEventType,\n coordinate: coordinate,\n payload: finalPayload,\n index: activeIndex\n }));\n}","export var rectWithPoints = (_ref, _ref2) => {\n var {\n x: x1,\n y: y1\n } = _ref;\n var {\n x: x2,\n y: y2\n } = _ref2;\n return {\n x: Math.min(x1, x2),\n y: Math.min(y1, y2),\n width: Math.abs(x2 - x1),\n height: Math.abs(y2 - y1)\n };\n};\n\n/**\n * Compute the x, y, width, and height of a box from two reference points.\n * @param {Object} coords x1, x2, y1, and y2\n * @return {Object} object\n */\nexport var rectWithCoords = _ref3 => {\n var {\n x1,\n y1,\n x2,\n y2\n } = _ref3;\n return rectWithPoints({\n x: x1,\n y: y1\n }, {\n x: x2,\n y: y2\n });\n};\n\n/** Normalizes the angle so that 0 <= angle < 180.\n * @param {number} angle Angle in degrees.\n * @return {number} the normalized angle with a value of at least 0 and never greater or equal to 180. */\nexport function normalizeAngle(angle) {\n return (angle % 180 + 180) % 180;\n}\n\n/** Calculates the width of the largest horizontal line that fits inside a rectangle that is displayed at an angle.\n * @param {Object} size Width and height of the text in a horizontal position.\n * @param {number} angle Angle in degrees in which the text is displayed.\n * @return {number} The width of the largest horizontal line that fits inside a rectangle that is displayed at an angle.\n */\nexport var getAngledRectangleWidth = function getAngledRectangleWidth(_ref4) {\n var {\n width,\n height\n } = _ref4;\n var angle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;\n // Ensure angle is >= 0 && < 180\n var normalizedAngle = normalizeAngle(angle);\n var angleRadians = normalizedAngle * Math.PI / 180;\n\n /* Depending on the height and width of the rectangle, we may need to use different formulas to calculate the angled\n * width. This threshold defines when each formula should kick in. */\n var angleThreshold = Math.atan(height / width);\n var angledWidth = angleRadians > angleThreshold && angleRadians < Math.PI - angleThreshold ? height / Math.sin(angleRadians) : width / Math.cos(angleRadians);\n return Math.abs(angledWidth);\n};","/**\n * Given an array and a number N, return a new array which contains every nTh\n * element of the input array. For n below 1, an empty array is returned.\n * For n equal to 1, the input array is returned as is.\n * For n greater than the length of the array, an array containing the first element\n * and every nTh element after that (if any) is returned.\n *\n * @param array An input array.\n * @param n A number specifying which elements to take.\n * @returns The result array of the same type as the input array.\n */\nexport function getEveryNth(array, n) {\n if (n < 1) {\n return [];\n }\n if (n === 1) {\n return array;\n }\n var result = [];\n for (var i = 0; i < array.length; i += n) {\n var item = array[i];\n if (item !== undefined) {\n result.push(item);\n }\n }\n return result;\n}","import { getAngledRectangleWidth } from './CartesianUtils';\nimport { getEveryNth } from './getEveryNth';\nexport function getAngledTickWidth(contentSize, unitSize, angle) {\n var size = {\n width: contentSize.width + unitSize.width,\n height: contentSize.height + unitSize.height\n };\n return getAngledRectangleWidth(size, angle);\n}\nexport function getTickBoundaries(viewBox, sign, sizeKey) {\n var isWidth = sizeKey === 'width';\n var {\n x,\n y,\n width,\n height\n } = viewBox;\n if (sign === 1) {\n return {\n start: isWidth ? x : y,\n end: isWidth ? x + width : y + height\n };\n }\n return {\n start: isWidth ? x + width : y + height,\n end: isWidth ? x : y\n };\n}\nexport function isVisible(sign, tickPosition, getSize, start, end) {\n /* Since getSize() is expensive (it reads the ticks' size from the DOM), we do this check first to avoid calculating\n * the tick's size. */\n if (sign * tickPosition < sign * start || sign * tickPosition > sign * end) {\n return false;\n }\n var size = getSize();\n return sign * (tickPosition - sign * size / 2 - start) >= 0 && sign * (tickPosition + sign * size / 2 - end) <= 0;\n}\nexport function getNumberIntervalTicks(ticks, interval) {\n return getEveryNth(ticks, interval + 1);\n}","import { isVisible } from '../util/TickUtils';\nimport { getEveryNth } from '../util/getEveryNth';\nexport function getEquidistantTicks(sign, boundaries, getTickSize, ticks, minTickGap) {\n // If the ticks are readonly, then the slice might not be necessary\n var result = (ticks || []).slice();\n var {\n start: initialStart,\n end\n } = boundaries;\n var index = 0;\n // Premature optimisation idea 1: Estimate a lower bound, and start from there.\n // For now, start from every tick\n var stepsize = 1;\n var start = initialStart;\n var _loop = function _loop() {\n // Given stepsize, evaluate whether every stepsize-th tick can be shown.\n // If it can not, then increase the stepsize by 1, and try again.\n\n var entry = ticks === null || ticks === void 0 ? void 0 : ticks[index];\n\n // Break condition - If we have evaluated all the ticks, then we are done.\n if (entry === undefined) {\n return {\n v: getEveryNth(ticks, stepsize)\n };\n }\n\n // Check if the element collides with the next element\n var i = index;\n var size;\n var getSize = () => {\n if (size === undefined) {\n size = getTickSize(entry, i);\n }\n return size;\n };\n var tickCoord = entry.coordinate;\n // We will always show the first tick.\n var isShow = index === 0 || isVisible(sign, tickCoord, getSize, start, end);\n if (!isShow) {\n // Start all over with a larger stepsize\n index = 0;\n start = initialStart;\n stepsize += 1;\n }\n if (isShow) {\n // If it can be shown, update the start\n start = tickCoord + sign * (getSize() / 2 + minTickGap);\n index += stepsize;\n }\n },\n _ret;\n while (stepsize <= result.length) {\n _ret = _loop();\n if (_ret) return _ret.v;\n }\n return [];\n}\nexport function getEquidistantPreserveEndTicks(sign, boundaries, getTickSize, ticks, minTickGap) {\n // If the ticks are readonly, then the slice might not be necessary\n // Reworked logic for getEquidistantPreserveEndTicks\n var result = (ticks || []).slice();\n var len = result.length;\n if (len === 0) {\n return [];\n }\n var {\n start: initialStart,\n end\n } = boundaries;\n\n // Start with stepsize = 1 (every tick) up to the maximum possible stepsize (len)\n for (var stepsize = 1; stepsize <= len; stepsize++) {\n // 1. Calculate the offset so the last tick (index len - 1) is always included in the sequence.\n var offset = (len - 1) % stepsize;\n var start = initialStart; // `start` tracks the coordinate of the last successfully drawn tick + gap\n var ok = true;\n\n // 2. Iterate through the end-anchored sequence: offset, offset + stepsize, ..., len - 1\n var _loop2 = function _loop2() {\n var entry = ticks[index];\n if (entry == null) {\n return 0; // continue\n }\n var i = index;\n var size;\n\n // Use a function to get size, as in the original code\n var getSize = () => {\n if (size === undefined) {\n size = getTickSize(entry, i);\n }\n return size;\n };\n var tickCoord = entry.coordinate;\n\n // 3. Apply visibility logic (including the first tick special case)\n // The reviewer says *not* to unconditionally bypass checks for the last tick.\n var isShow = index === offset || isVisible(sign, tickCoord, getSize, start, end);\n if (!isShow) {\n // If any tick in this end-anchored sequence fails visibility/collision,\n // reject this stepsize and move to the next iteration (larger stepsize).\n ok = false;\n return 1; // break\n }\n\n // 4. If showable, update the 'start' coordinate for the next collision check\n if (isShow) {\n start = tickCoord + sign * (getSize() / 2 + minTickGap);\n }\n },\n _ret2;\n for (var index = offset; index < len; index += stepsize) {\n _ret2 = _loop2();\n if (_ret2 === 0) continue;\n if (_ret2 === 1) break;\n }\n\n // 5. If the entire sequence for this stepsize passed the visibility check, return the result\n if (ok) {\n // Build the final result array explicitly using the validated stepsize and offset.\n var finalTicks = [];\n for (var _index = offset; _index < len; _index += stepsize) {\n var tick = ticks[_index];\n if (tick != null) {\n finalTicks.push(tick);\n }\n }\n return finalTicks;\n }\n }\n\n // If no stepsize works (this shouldn't happen unless minTickGap is huge), return an empty array.\n return [];\n}","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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nimport { mathSign, isNumber } from '../util/DataUtils';\nimport { getStringSize } from '../util/DOMUtils';\nimport { Global } from '../util/Global';\nimport { isVisible, getTickBoundaries, getNumberIntervalTicks, getAngledTickWidth } from '../util/TickUtils';\nimport { getEquidistantTicks, getEquidistantPreserveEndTicks } from './getEquidistantTicks';\nfunction getTicksEnd(sign, boundaries, getTickSize, ticks, minTickGap) {\n var result = (ticks || []).slice();\n var len = result.length;\n var {\n start\n } = boundaries;\n var {\n end\n } = boundaries;\n var _loop = function _loop(i) {\n var initialEntry = result[i];\n if (initialEntry == null) {\n return 1; // continue\n }\n var entry = initialEntry;\n var size;\n var getSize = () => {\n if (size === undefined) {\n size = getTickSize(initialEntry, i);\n }\n return size;\n };\n if (i === len - 1) {\n var gap = sign * (entry.coordinate + sign * getSize() / 2 - end);\n result[i] = entry = _objectSpread(_objectSpread({}, entry), {}, {\n tickCoord: gap > 0 ? entry.coordinate - gap * sign : entry.coordinate\n });\n } else {\n result[i] = entry = _objectSpread(_objectSpread({}, entry), {}, {\n tickCoord: entry.coordinate\n });\n }\n if (entry.tickCoord != null) {\n var isShow = isVisible(sign, entry.tickCoord, getSize, start, end);\n if (isShow) {\n end = entry.tickCoord - sign * (getSize() / 2 + minTickGap);\n result[i] = _objectSpread(_objectSpread({}, entry), {}, {\n isShow: true\n });\n }\n }\n };\n for (var i = len - 1; i >= 0; i--) {\n if (_loop(i)) continue;\n }\n return result;\n}\nfunction getTicksStart(sign, boundaries, getTickSize, ticks, minTickGap, preserveEnd) {\n // This method is mutating the array so clone is indeed necessary here\n var result = (ticks || []).slice();\n var len = result.length;\n var {\n start,\n end\n } = boundaries;\n if (preserveEnd) {\n // Try to guarantee the tail to be displayed\n var tail = ticks[len - 1];\n if (tail != null) {\n var tailSize = getTickSize(tail, len - 1);\n var tailGap = sign * (tail.coordinate + sign * tailSize / 2 - end);\n result[len - 1] = tail = _objectSpread(_objectSpread({}, tail), {}, {\n tickCoord: tailGap > 0 ? tail.coordinate - tailGap * sign : tail.coordinate\n });\n if (tail.tickCoord != null) {\n var isTailShow = isVisible(sign, tail.tickCoord, () => tailSize, start, end);\n if (isTailShow) {\n end = tail.tickCoord - sign * (tailSize / 2 + minTickGap);\n result[len - 1] = _objectSpread(_objectSpread({}, tail), {}, {\n isShow: true\n });\n }\n }\n }\n }\n var count = preserveEnd ? len - 1 : len;\n var _loop2 = function _loop2(i) {\n var initialEntry = result[i];\n if (initialEntry == null) {\n return 1; // continue\n }\n var entry = initialEntry;\n var size;\n var getSize = () => {\n if (size === undefined) {\n size = getTickSize(initialEntry, i);\n }\n return size;\n };\n if (i === 0) {\n var gap = sign * (entry.coordinate - sign * getSize() / 2 - start);\n result[i] = entry = _objectSpread(_objectSpread({}, entry), {}, {\n tickCoord: gap < 0 ? entry.coordinate - gap * sign : entry.coordinate\n });\n } else {\n result[i] = entry = _objectSpread(_objectSpread({}, entry), {}, {\n tickCoord: entry.coordinate\n });\n }\n if (entry.tickCoord != null) {\n var isShow = isVisible(sign, entry.tickCoord, getSize, start, end);\n if (isShow) {\n start = entry.tickCoord + sign * (getSize() / 2 + minTickGap);\n result[i] = _objectSpread(_objectSpread({}, entry), {}, {\n isShow: true\n });\n }\n }\n };\n for (var i = 0; i < count; i++) {\n if (_loop2(i)) continue;\n }\n return result;\n}\nexport function getTicks(props, fontSize, letterSpacing) {\n var {\n tick,\n ticks,\n viewBox,\n minTickGap,\n orientation,\n interval,\n tickFormatter,\n unit,\n angle\n } = props;\n if (!ticks || !ticks.length || !tick) {\n return [];\n }\n if (isNumber(interval) || Global.isSsr) {\n var _getNumberIntervalTic;\n return (_getNumberIntervalTic = getNumberIntervalTicks(ticks, isNumber(interval) ? interval : 0)) !== null && _getNumberIntervalTic !== void 0 ? _getNumberIntervalTic : [];\n }\n var candidates = [];\n var sizeKey = orientation === 'top' || orientation === 'bottom' ? 'width' : 'height';\n var unitSize = unit && sizeKey === 'width' ? getStringSize(unit, {\n fontSize,\n letterSpacing\n }) : {\n width: 0,\n height: 0\n };\n var getTickSize = (content, index) => {\n var value = typeof tickFormatter === 'function' ? tickFormatter(content.value, index) : content.value;\n // Recharts only supports angles when sizeKey === 'width'\n return sizeKey === 'width' ? getAngledTickWidth(getStringSize(value, {\n fontSize,\n letterSpacing\n }), unitSize, angle) : getStringSize(value, {\n fontSize,\n letterSpacing\n })[sizeKey];\n };\n var tick0 = ticks[0];\n var tick1 = ticks[1];\n var sign = ticks.length >= 2 && tick0 != null && tick1 != null ? mathSign(tick1.coordinate - tick0.coordinate) : 1;\n var boundaries = getTickBoundaries(viewBox, sign, sizeKey);\n if (interval === 'equidistantPreserveStart') {\n return getEquidistantTicks(sign, boundaries, getTickSize, ticks, minTickGap);\n }\n if (interval === 'equidistantPreserveEnd') {\n return getEquidistantPreserveEndTicks(sign, boundaries, getTickSize, ticks, minTickGap);\n }\n if (interval === 'preserveStart' || interval === 'preserveStartEnd') {\n candidates = getTicksStart(sign, boundaries, getTickSize, ticks, minTickGap, interval === 'preserveStartEnd');\n } else {\n candidates = getTicksEnd(sign, boundaries, getTickSize, ticks, minTickGap);\n }\n return candidates.filter(entry => entry.isShow);\n}","/**\n * Calculates the width of the Y-axis based on the tick labels and the axis label.\n * @param params - The parameters object.\n * @param [params.ticks] - An array-like object of tick elements, each with a `getBoundingClientRect` method.\n * @param [params.label] - The axis label element, with a `getBoundingClientRect` method.\n * @param [params.labelGapWithTick=5] - The gap between the label and the tick.\n * @param [params.tickSize=0] - The length of the tick line.\n * @param [params.tickMargin=0] - The margin between the tick line and the tick text.\n * @returns The calculated width of the Y-axis.\n */\nexport var getCalculatedYAxisWidth = _ref => {\n var {\n ticks,\n label,\n labelGapWithTick = 5,\n // Default gap between label and tick\n tickSize = 0,\n tickMargin = 0\n } = _ref;\n // find the max width of the tick labels\n var maxTickWidth = 0;\n if (ticks) {\n Array.from(ticks).forEach(tickNode => {\n if (tickNode) {\n var bbox = tickNode.getBoundingClientRect();\n if (bbox.width > maxTickWidth) {\n maxTickWidth = bbox.width;\n }\n }\n });\n\n // calculate width of the axis label\n var labelWidth = label ? label.getBoundingClientRect().width : 0;\n var tickWidth = tickSize + tickMargin;\n\n // calculate the updated width of the y-axis\n var updatedYAxisWidth = maxTickWidth + tickWidth + labelWidth + (label ? labelGapWithTick : 0);\n return Math.round(updatedYAxisWidth);\n }\n return 0;\n};","var _excluded = [\"axisLine\", \"width\", \"height\", \"className\", \"hide\", \"ticks\", \"axisType\", \"axisId\"];\nfunction _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; }\nfunction _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; }\nfunction _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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\n/**\n * @fileOverview Cartesian Axis\n */\nimport * as React from 'react';\nimport { useState, useRef, useCallback, forwardRef, useImperativeHandle, useEffect } from 'react';\nimport get from 'es-toolkit/compat/get';\nimport { clsx } from 'clsx';\nimport { Layer } from '../container/Layer';\nimport { Text, isValidTextAnchor } from '../component/Text';\nimport { CartesianLabelContextProvider, CartesianLabelFromLabelProp } from '../component/Label';\nimport { isNumber, noop } from '../util/DataUtils';\nimport { adaptEventsOfChild } from '../util/types';\nimport { getTicks } from './getTicks';\nimport { svgPropertiesNoEvents, svgPropertiesNoEventsFromUnknown } from '../util/svgPropertiesNoEvents';\nimport { getCalculatedYAxisWidth } from '../util/YAxisUtils';\nimport { resolveDefaultProps } from '../util/resolveDefaultProps';\nimport { ZIndexLayer } from '../zIndex/ZIndexLayer';\nimport { DefaultZIndexes } from '../zIndex/DefaultZIndexes';\nimport { getClassNameFromUnknown } from '../util/getClassNameFromUnknown';\nimport { removeRenderedTicks, setRenderedTicks } from '../state/renderedTicksSlice';\nimport { useAppDispatch } from '../state/hooks';\n\n/** The orientation of the axis in correspondence to the chart */\n\n/** A unit to be appended to a value */\n\n/** The formatter function of tick */\n\nexport var defaultCartesianAxisProps = {\n x: 0,\n y: 0,\n width: 0,\n height: 0,\n viewBox: {\n x: 0,\n y: 0,\n width: 0,\n height: 0\n },\n // The orientation of axis\n orientation: 'bottom',\n // The ticks\n ticks: [],\n stroke: '#666',\n tickLine: true,\n axisLine: true,\n tick: true,\n mirror: false,\n minTickGap: 5,\n // The width or height of tick\n tickSize: 6,\n tickMargin: 2,\n interval: 'preserveEnd',\n zIndex: DefaultZIndexes.axis\n};\n\n/*\n * `viewBox` and `scale` are SVG attributes.\n * Recharts however - unfortunately - has its own attributes named `viewBox` and `scale`\n * that are completely different data shape and different purpose.\n */\n\nfunction AxisLine(axisLineProps) {\n var {\n x,\n y,\n width,\n height,\n orientation,\n mirror,\n axisLine,\n otherSvgProps\n } = axisLineProps;\n if (!axisLine) {\n return null;\n }\n var props = _objectSpread(_objectSpread(_objectSpread({}, otherSvgProps), svgPropertiesNoEvents(axisLine)), {}, {\n fill: 'none'\n });\n if (orientation === 'top' || orientation === 'bottom') {\n var needHeight = +(orientation === 'top' && !mirror || orientation === 'bottom' && mirror);\n props = _objectSpread(_objectSpread({}, props), {}, {\n x1: x,\n y1: y + needHeight * height,\n x2: x + width,\n y2: y + needHeight * height\n });\n } else {\n var needWidth = +(orientation === 'left' && !mirror || orientation === 'right' && mirror);\n props = _objectSpread(_objectSpread({}, props), {}, {\n x1: x + needWidth * width,\n y1: y,\n x2: x + needWidth * width,\n y2: y + height\n });\n }\n return /*#__PURE__*/React.createElement(\"line\", _extends({}, props, {\n className: clsx('recharts-cartesian-axis-line', get(axisLine, 'className'))\n }));\n}\n\n/**\n * Calculate the coordinates of endpoints in ticks.\n * @param data The data of a simple tick.\n * @param x The x-coordinate of the axis.\n * @param y The y-coordinate of the axis.\n * @param width The width of the axis.\n * @param height The height of the axis.\n * @param orientation The orientation of the axis.\n * @param tickSize The length of the tick line.\n * @param mirror If true, the ticks are mirrored.\n * @param tickMargin The margin between the tick line and the tick text.\n * @returns An object with `line` and `tick` coordinates.\n * `line` is the coordinates for the tick line, and `tick` is the coordinate for the tick text.\n */\nfunction getTickLineCoord(data, x, y, width, height, orientation, tickSize, mirror, tickMargin) {\n var x1, x2, y1, y2, tx, ty;\n var sign = mirror ? -1 : 1;\n var finalTickSize = data.tickSize || tickSize;\n var tickCoord = isNumber(data.tickCoord) ? data.tickCoord : data.coordinate;\n switch (orientation) {\n case 'top':\n x1 = x2 = data.coordinate;\n y2 = y + +!mirror * height;\n y1 = y2 - sign * finalTickSize;\n ty = y1 - sign * tickMargin;\n tx = tickCoord;\n break;\n case 'left':\n y1 = y2 = data.coordinate;\n x2 = x + +!mirror * width;\n x1 = x2 - sign * finalTickSize;\n tx = x1 - sign * tickMargin;\n ty = tickCoord;\n break;\n case 'right':\n y1 = y2 = data.coordinate;\n x2 = x + +mirror * width;\n x1 = x2 + sign * finalTickSize;\n tx = x1 + sign * tickMargin;\n ty = tickCoord;\n break;\n default:\n x1 = x2 = data.coordinate;\n y2 = y + +mirror * height;\n y1 = y2 + sign * finalTickSize;\n ty = y1 + sign * tickMargin;\n tx = tickCoord;\n break;\n }\n return {\n line: {\n x1,\n y1,\n x2,\n y2\n },\n tick: {\n x: tx,\n y: ty\n }\n };\n}\n\n/**\n * @param orientation The orientation of the axis.\n * @param mirror If true, the ticks are mirrored.\n * @returns The text anchor of the tick.\n */\nfunction getTickTextAnchor(orientation, mirror) {\n switch (orientation) {\n case 'left':\n return mirror ? 'start' : 'end';\n case 'right':\n return mirror ? 'end' : 'start';\n default:\n return 'middle';\n }\n}\n\n/**\n * @param orientation The orientation of the axis.\n * @param mirror If true, the ticks are mirrored.\n * @returns The vertical text anchor of the tick.\n */\nfunction getTickVerticalAnchor(orientation, mirror) {\n switch (orientation) {\n case 'left':\n case 'right':\n return 'middle';\n case 'top':\n return mirror ? 'start' : 'end';\n default:\n return mirror ? 'end' : 'start';\n }\n}\nfunction TickItem(props) {\n var {\n option,\n tickProps,\n value\n } = props;\n var tickItem;\n var combinedClassName = clsx(tickProps.className, 'recharts-cartesian-axis-tick-value');\n if (/*#__PURE__*/React.isValidElement(option)) {\n // @ts-expect-error element cloning is not typed\n tickItem = /*#__PURE__*/React.cloneElement(option, _objectSpread(_objectSpread({}, tickProps), {}, {\n className: combinedClassName\n }));\n } else if (typeof option === 'function') {\n tickItem = option(_objectSpread(_objectSpread({}, tickProps), {}, {\n className: combinedClassName\n }));\n } else {\n var className = 'recharts-cartesian-axis-tick-value';\n if (typeof option !== 'boolean') {\n className = clsx(className, getClassNameFromUnknown(option));\n }\n tickItem = /*#__PURE__*/React.createElement(Text, _extends({}, tickProps, {\n className: className\n }), value);\n }\n return tickItem;\n}\nfunction RenderedTicksReporter(_ref) {\n var {\n ticks,\n axisType,\n axisId\n } = _ref;\n var dispatch = useAppDispatch();\n useEffect(() => {\n if (axisId == null || axisType == null) {\n return noop;\n }\n // Filter out irrelevant internal properties before exposing externally\n var tickItems = ticks.map(tick => ({\n value: tick.value,\n coordinate: tick.coordinate,\n offset: tick.offset,\n index: tick.index\n }));\n dispatch(setRenderedTicks({\n ticks: tickItems,\n axisId,\n axisType\n }));\n return () => {\n dispatch(removeRenderedTicks({\n axisId,\n axisType\n }));\n };\n }, [dispatch, ticks, axisId, axisType]);\n return null;\n}\nvar Ticks = /*#__PURE__*/forwardRef((props, ref) => {\n var {\n ticks = [],\n tick,\n tickLine,\n stroke,\n tickFormatter,\n unit,\n padding,\n tickTextProps,\n orientation,\n mirror,\n x,\n y,\n width,\n height,\n tickSize,\n tickMargin,\n fontSize,\n letterSpacing,\n getTicksConfig,\n events,\n axisType,\n axisId\n } = props;\n // @ts-expect-error some properties are optional in props but required in getTicks\n var finalTicks = getTicks(_objectSpread(_objectSpread({}, getTicksConfig), {}, {\n ticks\n }), fontSize, letterSpacing);\n var axisProps = svgPropertiesNoEvents(getTicksConfig);\n var customTickProps = svgPropertiesNoEventsFromUnknown(tick);\n // Use user-provided textAnchor if available, otherwise calculate from orientation/mirror\n var textAnchor = isValidTextAnchor(axisProps.textAnchor) ? axisProps.textAnchor : getTickTextAnchor(orientation, mirror);\n var verticalAnchor = getTickVerticalAnchor(orientation, mirror);\n var tickLinePropsObject = {};\n if (typeof tickLine === 'object') {\n tickLinePropsObject = tickLine;\n }\n var tickLineProps = _objectSpread(_objectSpread({}, axisProps), {}, {\n fill: 'none'\n }, tickLinePropsObject);\n var tickLineCoords = finalTicks.map(entry => _objectSpread({\n entry\n }, getTickLineCoord(entry, x, y, width, height, orientation, tickSize, mirror, tickMargin)));\n var tickLines = tickLineCoords.map(_ref2 => {\n var {\n entry,\n line: lineCoord\n } = _ref2;\n return /*#__PURE__*/React.createElement(Layer, {\n className: \"recharts-cartesian-axis-tick\",\n key: \"tick-\".concat(entry.value, \"-\").concat(entry.coordinate, \"-\").concat(entry.tickCoord)\n }, tickLine && /*#__PURE__*/React.createElement(\"line\", _extends({}, tickLineProps, lineCoord, {\n className: clsx('recharts-cartesian-axis-tick-line', get(tickLine, 'className'))\n })));\n });\n var tickLabels = tickLineCoords.map((_ref3, i) => {\n var _ref4, _tickTextProps$angle;\n var {\n entry,\n tick: tickCoord\n } = _ref3;\n // @ts-expect-error we're not checking that padding and orientation types are in sync\n var tickProps = _objectSpread(_objectSpread(_objectSpread(_objectSpread({\n verticalAnchor\n }, axisProps), {}, {\n textAnchor,\n stroke: 'none',\n fill: stroke\n }, tickCoord), {}, {\n index: i,\n payload: entry,\n visibleTicksCount: finalTicks.length,\n tickFormatter,\n padding\n }, tickTextProps), {}, {\n angle: (_ref4 = (_tickTextProps$angle = tickTextProps === null || tickTextProps === void 0 ? void 0 : tickTextProps.angle) !== null && _tickTextProps$angle !== void 0 ? _tickTextProps$angle : axisProps.angle) !== null && _ref4 !== void 0 ? _ref4 : 0\n });\n\n // @ts-expect-error customTickProps is contributing unknown props which we don't type properly\n var finalTickProps = _objectSpread(_objectSpread({}, tickProps), customTickProps);\n return /*#__PURE__*/React.createElement(Layer, _extends({\n className: \"recharts-cartesian-axis-tick-label\",\n key: \"tick-label-\".concat(entry.value, \"-\").concat(entry.coordinate, \"-\").concat(entry.tickCoord)\n }, adaptEventsOfChild(events, entry, i)), tick && /*#__PURE__*/React.createElement(TickItem, {\n option: tick,\n tickProps: finalTickProps,\n value: \"\".concat(typeof tickFormatter === 'function' ? tickFormatter(entry.value, i) : entry.value).concat(unit || '')\n }));\n });\n return /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-axis-ticks recharts-\".concat(axisType, \"-ticks\")\n }, /*#__PURE__*/React.createElement(RenderedTicksReporter, {\n ticks: finalTicks,\n axisId: axisId,\n axisType: axisType\n }), tickLabels.length > 0 && /*#__PURE__*/React.createElement(ZIndexLayer, {\n zIndex: DefaultZIndexes.label\n }, /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-axis-tick-labels recharts-\".concat(axisType, \"-tick-labels\"),\n ref: ref\n }, tickLabels)), tickLines.length > 0 && /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-axis-tick-lines recharts-\".concat(axisType, \"-tick-lines\")\n }, tickLines));\n});\nvar CartesianAxisComponent = /*#__PURE__*/forwardRef((props, ref) => {\n var {\n axisLine,\n width,\n height,\n className,\n hide,\n ticks,\n axisType,\n axisId\n } = props,\n rest = _objectWithoutProperties(props, _excluded);\n var [fontSize, setFontSize] = useState('');\n var [letterSpacing, setLetterSpacing] = useState('');\n var tickRefs = useRef(null);\n useImperativeHandle(ref, () => ({\n getCalculatedWidth: () => {\n var _props$labelRef;\n return getCalculatedYAxisWidth({\n ticks: tickRefs.current,\n label: (_props$labelRef = props.labelRef) === null || _props$labelRef === void 0 ? void 0 : _props$labelRef.current,\n labelGapWithTick: 5,\n tickSize: props.tickSize,\n tickMargin: props.tickMargin\n });\n }\n }));\n var layerRef = useCallback(el => {\n if (el) {\n var tickNodes = el.getElementsByClassName('recharts-cartesian-axis-tick-value');\n tickRefs.current = tickNodes;\n var tick = tickNodes[0];\n if (tick) {\n var computedStyle = window.getComputedStyle(tick);\n var calculatedFontSize = computedStyle.fontSize;\n var calculatedLetterSpacing = computedStyle.letterSpacing;\n if (calculatedFontSize !== fontSize || calculatedLetterSpacing !== letterSpacing) {\n setFontSize(calculatedFontSize);\n setLetterSpacing(calculatedLetterSpacing);\n }\n }\n }\n }, [fontSize, letterSpacing]);\n if (hide) {\n return null;\n }\n\n /*\n * This is different condition from what validateWidthHeight is doing;\n * the CartesianAxis does allow width or height to be undefined.\n */\n if (width != null && width <= 0 || height != null && height <= 0) {\n return null;\n }\n return /*#__PURE__*/React.createElement(ZIndexLayer, {\n zIndex: props.zIndex\n }, /*#__PURE__*/React.createElement(Layer, {\n className: clsx('recharts-cartesian-axis', className)\n }, /*#__PURE__*/React.createElement(AxisLine, {\n x: props.x,\n y: props.y,\n width: width,\n height: height,\n orientation: props.orientation,\n mirror: props.mirror,\n axisLine: axisLine,\n otherSvgProps: svgPropertiesNoEvents(props)\n }), /*#__PURE__*/React.createElement(Ticks, {\n ref: layerRef,\n axisType: axisType,\n events: rest,\n fontSize: fontSize,\n getTicksConfig: props,\n height: props.height,\n letterSpacing: letterSpacing,\n mirror: props.mirror,\n orientation: props.orientation,\n padding: props.padding,\n stroke: props.stroke,\n tick: props.tick,\n tickFormatter: props.tickFormatter,\n tickLine: props.tickLine,\n tickMargin: props.tickMargin,\n tickSize: props.tickSize,\n tickTextProps: props.tickTextProps,\n ticks: ticks,\n unit: props.unit,\n width: props.width,\n x: props.x,\n y: props.y,\n axisId: axisId\n }), /*#__PURE__*/React.createElement(CartesianLabelContextProvider, {\n x: props.x,\n y: props.y,\n width: props.width,\n height: props.height,\n lowerWidth: props.width,\n upperWidth: props.width\n }, /*#__PURE__*/React.createElement(CartesianLabelFromLabelProp, {\n label: props.label,\n labelRef: props.labelRef\n }), props.children)));\n});\n\n/**\n * @deprecated\n *\n * This component is not meant to be used directly in app code.\n * Use XAxis or YAxis instead.\n *\n * Starting from Recharts v4.0 we will make this component internal only.\n */\nexport var CartesianAxis = /*#__PURE__*/React.forwardRef((outsideProps, ref) => {\n var props = resolveDefaultProps(outsideProps, defaultCartesianAxisProps);\n return /*#__PURE__*/React.createElement(CartesianAxisComponent, _extends({}, props, {\n ref: ref\n }));\n});\nCartesianAxis.displayName = 'CartesianAxis';","var _excluded = [\"x1\", \"y1\", \"x2\", \"y2\", \"key\"],\n _excluded2 = [\"offset\"],\n _excluded3 = [\"xAxisId\", \"yAxisId\"],\n _excluded4 = [\"xAxisId\", \"yAxisId\"];\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nfunction _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); }\nfunction _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; }\nfunction _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; }\nimport * as React from 'react';\nimport { warn } from '../util/LogUtils';\nimport { isNumber } from '../util/DataUtils';\nimport { getCoordinatesOfGrid, getTicksOfAxis } from '../util/ChartUtils';\nimport { getTicks } from './getTicks';\nimport { defaultCartesianAxisProps } from './CartesianAxis';\nimport { useChartHeight, useChartWidth, useOffsetInternal } from '../context/chartLayoutContext';\nimport { selectAxisPropsNeededForCartesianGridTicksGenerator } from '../state/selectors/axisSelectors';\nimport { useAppSelector } from '../state/hooks';\nimport { useIsPanorama } from '../context/PanoramaContext';\nimport { resolveDefaultProps } from '../util/resolveDefaultProps';\nimport { svgPropertiesNoEvents } from '../util/svgPropertiesNoEvents';\nimport { isPositiveNumber } from '../util/isWellBehavedNumber';\nimport { ZIndexLayer } from '../zIndex/ZIndexLayer';\nimport { DefaultZIndexes } from '../zIndex/DefaultZIndexes';\n\n/**\n * The
{\n var {\n fill\n } = props;\n if (!fill || fill === 'none') {\n return null;\n }\n var {\n fillOpacity,\n x,\n y,\n width,\n height,\n ry\n } = props;\n return /*#__PURE__*/React.createElement(\"rect\", {\n x: x,\n y: y,\n ry: ry,\n width: width,\n height: height,\n stroke: \"none\",\n fill: fill,\n fillOpacity: fillOpacity,\n className: \"recharts-cartesian-grid-bg\"\n });\n};\nfunction LineItem(_ref) {\n var {\n option,\n lineItemProps\n } = _ref;\n var lineItem;\n if (/*#__PURE__*/React.isValidElement(option)) {\n // @ts-expect-error typescript does not see the props type when cloning an element\n lineItem = /*#__PURE__*/React.cloneElement(option, lineItemProps);\n } else if (typeof option === 'function') {\n lineItem = option(lineItemProps);\n } else {\n var _svgPropertiesNoEvent;\n var {\n x1,\n y1,\n x2,\n y2,\n key\n } = lineItemProps,\n others = _objectWithoutProperties(lineItemProps, _excluded);\n var _ref2 = (_svgPropertiesNoEvent = svgPropertiesNoEvents(others)) !== null && _svgPropertiesNoEvent !== void 0 ? _svgPropertiesNoEvent : {},\n {\n offset: __\n } = _ref2,\n restOfFilteredProps = _objectWithoutProperties(_ref2, _excluded2);\n lineItem = /*#__PURE__*/React.createElement(\"line\", _extends({}, restOfFilteredProps, {\n x1: x1,\n y1: y1,\n x2: x2,\n y2: y2,\n fill: \"none\",\n key: key\n }));\n }\n return lineItem;\n}\nfunction HorizontalGridLines(props) {\n var {\n x,\n width,\n horizontal = true,\n horizontalPoints\n } = props;\n if (!horizontal || !horizontalPoints || !horizontalPoints.length) {\n return null;\n }\n var {\n xAxisId,\n yAxisId\n } = props,\n otherLineItemProps = _objectWithoutProperties(props, _excluded3);\n var items = horizontalPoints.map((entry, i) => {\n var lineItemProps = _objectSpread(_objectSpread({}, otherLineItemProps), {}, {\n x1: x,\n y1: entry,\n x2: x + width,\n y2: entry,\n key: \"line-\".concat(i),\n index: i\n });\n return /*#__PURE__*/React.createElement(LineItem, {\n key: \"line-\".concat(i),\n option: horizontal,\n lineItemProps: lineItemProps\n });\n });\n return /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-grid-horizontal\"\n }, items);\n}\nfunction VerticalGridLines(props) {\n var {\n y,\n height,\n vertical = true,\n verticalPoints\n } = props;\n if (!vertical || !verticalPoints || !verticalPoints.length) {\n return null;\n }\n var {\n xAxisId,\n yAxisId\n } = props,\n otherLineItemProps = _objectWithoutProperties(props, _excluded4);\n var items = verticalPoints.map((entry, i) => {\n var lineItemProps = _objectSpread(_objectSpread({}, otherLineItemProps), {}, {\n x1: entry,\n y1: y,\n x2: entry,\n y2: y + height,\n key: \"line-\".concat(i),\n index: i\n });\n return /*#__PURE__*/React.createElement(LineItem, {\n option: vertical,\n lineItemProps: lineItemProps,\n key: \"line-\".concat(i)\n });\n });\n return /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-grid-vertical\"\n }, items);\n}\nfunction HorizontalStripes(props) {\n var {\n horizontalFill,\n fillOpacity,\n x,\n y,\n width,\n height,\n horizontalPoints,\n horizontal = true\n } = props;\n if (!horizontal || !horizontalFill || !horizontalFill.length || horizontalPoints == null) {\n return null;\n }\n var roundedSortedHorizontalPoints = horizontalPoints.map(e => Math.round(e + y - y)).sort((a, b) => a - b);\n // Why is this condition `!==` instead of `<=` ?\n if (y !== roundedSortedHorizontalPoints[0]) {\n roundedSortedHorizontalPoints.unshift(0);\n }\n var items = roundedSortedHorizontalPoints.map((entry, i) => {\n // Why do we strip only the last stripe if it is invisible, and not all invisible stripes?\n var nextPoint = roundedSortedHorizontalPoints[i + 1];\n var lastStripe = nextPoint == null;\n var lineHeight = lastStripe ? y + height - entry : nextPoint - entry;\n if (lineHeight <= 0) {\n return null;\n }\n var colorIndex = i % horizontalFill.length;\n return /*#__PURE__*/React.createElement(\"rect\", {\n key: \"react-\".concat(i),\n y: entry,\n x: x,\n height: lineHeight,\n width: width,\n stroke: \"none\",\n fill: horizontalFill[colorIndex],\n fillOpacity: fillOpacity,\n className: \"recharts-cartesian-grid-bg\"\n });\n });\n return /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-gridstripes-horizontal\"\n }, items);\n}\nfunction VerticalStripes(props) {\n var {\n vertical = true,\n verticalFill,\n fillOpacity,\n x,\n y,\n width,\n height,\n verticalPoints\n } = props;\n if (!vertical || !verticalFill || !verticalFill.length) {\n return null;\n }\n var roundedSortedVerticalPoints = verticalPoints.map(e => Math.round(e + x - x)).sort((a, b) => a - b);\n if (x !== roundedSortedVerticalPoints[0]) {\n roundedSortedVerticalPoints.unshift(0);\n }\n var items = roundedSortedVerticalPoints.map((entry, i) => {\n var nextPoint = roundedSortedVerticalPoints[i + 1];\n var lastStripe = nextPoint == null;\n var lineWidth = lastStripe ? x + width - entry : nextPoint - entry;\n if (lineWidth <= 0) {\n return null;\n }\n var colorIndex = i % verticalFill.length;\n return /*#__PURE__*/React.createElement(\"rect\", {\n key: \"react-\".concat(i),\n x: entry,\n y: y,\n width: lineWidth,\n height: height,\n stroke: \"none\",\n fill: verticalFill[colorIndex],\n fillOpacity: fillOpacity,\n className: \"recharts-cartesian-grid-bg\"\n });\n });\n return /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-gridstripes-vertical\"\n }, items);\n}\nvar defaultVerticalCoordinatesGenerator = (_ref3, syncWithTicks) => {\n var {\n xAxis,\n width,\n height,\n offset\n } = _ref3;\n return getCoordinatesOfGrid(getTicks(_objectSpread(_objectSpread(_objectSpread({}, defaultCartesianAxisProps), xAxis), {}, {\n ticks: getTicksOfAxis(xAxis, true),\n viewBox: {\n x: 0,\n y: 0,\n width,\n height\n }\n })), offset.left, offset.left + offset.width, syncWithTicks);\n};\nvar defaultHorizontalCoordinatesGenerator = (_ref4, syncWithTicks) => {\n var {\n yAxis,\n width,\n height,\n offset\n } = _ref4;\n return getCoordinatesOfGrid(getTicks(_objectSpread(_objectSpread(_objectSpread({}, defaultCartesianAxisProps), yAxis), {}, {\n ticks: getTicksOfAxis(yAxis, true),\n viewBox: {\n x: 0,\n y: 0,\n width,\n height\n }\n })), offset.top, offset.top + offset.height, syncWithTicks);\n};\nexport var defaultCartesianGridProps = {\n horizontal: true,\n vertical: true,\n // The ordinates of horizontal grid lines\n horizontalPoints: [],\n // The abscissas of vertical grid lines\n verticalPoints: [],\n stroke: '#ccc',\n fill: 'none',\n // The fill of colors of grid lines\n verticalFill: [],\n horizontalFill: [],\n xAxisId: 0,\n yAxisId: 0,\n syncWithTicks: false,\n zIndex: DefaultZIndexes.grid\n};\n\n/**\n * Renders background grid with lines and fill colors in a Cartesian chart.\n *\n * @consumes CartesianChartContext\n */\nexport function CartesianGrid(props) {\n var chartWidth = useChartWidth();\n var chartHeight = useChartHeight();\n var offset = useOffsetInternal();\n var propsIncludingDefaults = _objectSpread(_objectSpread({}, resolveDefaultProps(props, defaultCartesianGridProps)), {}, {\n x: isNumber(props.x) ? props.x : offset.left,\n y: isNumber(props.y) ? props.y : offset.top,\n width: isNumber(props.width) ? props.width : offset.width,\n height: isNumber(props.height) ? props.height : offset.height\n });\n var {\n xAxisId,\n yAxisId,\n x,\n y,\n width,\n height,\n syncWithTicks,\n horizontalValues,\n verticalValues\n } = propsIncludingDefaults;\n var isPanorama = useIsPanorama();\n var xAxis = useAppSelector(state => selectAxisPropsNeededForCartesianGridTicksGenerator(state, 'xAxis', xAxisId, isPanorama));\n var yAxis = useAppSelector(state => selectAxisPropsNeededForCartesianGridTicksGenerator(state, 'yAxis', yAxisId, isPanorama));\n if (!isPositiveNumber(width) || !isPositiveNumber(height) || !isNumber(x) || !isNumber(y)) {\n return null;\n }\n\n /*\n * verticalCoordinatesGenerator and horizontalCoordinatesGenerator are defined\n * outside the propsIncludingDefaults because they were never part of the original props\n * and they were never passed as a prop down to horizontal/vertical custom elements.\n * If we add these two to propsIncludingDefaults then we are changing public API.\n * Not a bad thing per se but also not necessary.\n */\n var verticalCoordinatesGenerator = propsIncludingDefaults.verticalCoordinatesGenerator || defaultVerticalCoordinatesGenerator;\n var horizontalCoordinatesGenerator = propsIncludingDefaults.horizontalCoordinatesGenerator || defaultHorizontalCoordinatesGenerator;\n var {\n horizontalPoints,\n verticalPoints\n } = propsIncludingDefaults;\n\n // No horizontal points are specified\n if ((!horizontalPoints || !horizontalPoints.length) && typeof horizontalCoordinatesGenerator === 'function') {\n var isHorizontalValues = horizontalValues && horizontalValues.length;\n var generatorResult = horizontalCoordinatesGenerator({\n yAxis: yAxis ? _objectSpread(_objectSpread({}, yAxis), {}, {\n ticks: isHorizontalValues ? horizontalValues : yAxis.ticks\n }) : undefined,\n width: chartWidth !== null && chartWidth !== void 0 ? chartWidth : width,\n height: chartHeight !== null && chartHeight !== void 0 ? chartHeight : height,\n offset\n }, isHorizontalValues ? true : syncWithTicks);\n warn(Array.isArray(generatorResult), \"horizontalCoordinatesGenerator should return Array but instead it returned [\".concat(typeof generatorResult, \"]\"));\n if (Array.isArray(generatorResult)) {\n horizontalPoints = generatorResult;\n }\n }\n\n // No vertical points are specified\n if ((!verticalPoints || !verticalPoints.length) && typeof verticalCoordinatesGenerator === 'function') {\n var isVerticalValues = verticalValues && verticalValues.length;\n var _generatorResult = verticalCoordinatesGenerator({\n xAxis: xAxis ? _objectSpread(_objectSpread({}, xAxis), {}, {\n ticks: isVerticalValues ? verticalValues : xAxis.ticks\n }) : undefined,\n width: chartWidth !== null && chartWidth !== void 0 ? chartWidth : width,\n height: chartHeight !== null && chartHeight !== void 0 ? chartHeight : height,\n offset\n }, isVerticalValues ? true : syncWithTicks);\n warn(Array.isArray(_generatorResult), \"verticalCoordinatesGenerator should return Array but instead it returned [\".concat(typeof _generatorResult, \"]\"));\n if (Array.isArray(_generatorResult)) {\n verticalPoints = _generatorResult;\n }\n }\n return /*#__PURE__*/React.createElement(ZIndexLayer, {\n zIndex: propsIncludingDefaults.zIndex\n }, /*#__PURE__*/React.createElement(\"g\", {\n className: \"recharts-cartesian-grid\"\n }, /*#__PURE__*/React.createElement(Background, {\n fill: propsIncludingDefaults.fill,\n fillOpacity: propsIncludingDefaults.fillOpacity,\n x: propsIncludingDefaults.x,\n y: propsIncludingDefaults.y,\n width: propsIncludingDefaults.width,\n height: propsIncludingDefaults.height,\n ry: propsIncludingDefaults.ry\n }), /*#__PURE__*/React.createElement(HorizontalStripes, _extends({}, propsIncludingDefaults, {\n horizontalPoints: horizontalPoints\n })), /*#__PURE__*/React.createElement(VerticalStripes, _extends({}, propsIncludingDefaults, {\n verticalPoints: verticalPoints\n })), /*#__PURE__*/React.createElement(HorizontalGridLines, _extends({}, propsIncludingDefaults, {\n offset: offset,\n horizontalPoints: horizontalPoints,\n xAxis: xAxis,\n yAxis: yAxis\n })), /*#__PURE__*/React.createElement(VerticalGridLines, _extends({}, propsIncludingDefaults, {\n offset: offset,\n verticalPoints: verticalPoints,\n xAxis: xAxis,\n yAxis: yAxis\n }))));\n}\nCartesianGrid.displayName = 'CartesianGrid';","var _excluded = [\"children\"];\nfunction _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; }\nfunction _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; }\nimport * as React from 'react';\nimport { createContext, useContext, useEffect, useRef } from 'react';\nimport { addErrorBar, removeErrorBar, replaceErrorBar } from '../state/errorBarSlice';\nimport { useAppDispatch } from '../state/hooks';\nimport { useGraphicalItemId } from './RegisterGraphicalItemId';\nvar initialContextState = {\n data: [],\n xAxisId: 'xAxis-0',\n yAxisId: 'yAxis-0',\n dataPointFormatter: () => ({\n x: 0,\n y: 0,\n value: 0\n }),\n errorBarOffset: 0\n};\nvar ErrorBarContext = /*#__PURE__*/createContext(initialContextState);\nexport function SetErrorBarContext(props) {\n var {\n children\n } = props,\n rest = _objectWithoutProperties(props, _excluded);\n return /*#__PURE__*/React.createElement(ErrorBarContext.Provider, {\n value: rest\n }, children);\n}\nexport var useErrorBarContext = () => useContext(ErrorBarContext);\nexport function ReportErrorBarSettings(props) {\n var dispatch = useAppDispatch();\n var graphicalItemId = useGraphicalItemId();\n var prevPropsRef = useRef(null);\n useEffect(() => {\n if (graphicalItemId == null) {\n // ErrorBar outside a graphical item context does not do anything.\n return;\n }\n if (prevPropsRef.current === null) {\n dispatch(addErrorBar({\n itemId: graphicalItemId,\n errorBar: props\n }));\n } else if (prevPropsRef.current !== props) {\n dispatch(replaceErrorBar({\n itemId: graphicalItemId,\n prev: prevPropsRef.current,\n next: props\n }));\n }\n prevPropsRef.current = props;\n }, [dispatch, graphicalItemId, props]);\n useEffect(() => {\n return () => {\n if (prevPropsRef.current != null && graphicalItemId != null) {\n dispatch(removeErrorBar({\n itemId: graphicalItemId,\n errorBar: prevPropsRef.current\n }));\n prevPropsRef.current = null;\n }\n };\n }, [dispatch, graphicalItemId]);\n return null;\n}","import * as React from 'react';\nimport { useAppSelector } from '../state/hooks';\nimport { implicitXAxis, implicitYAxis, selectXAxisSettings, selectYAxisSettings } from '../state/selectors/axisSelectors';\nimport { usePlotArea } from '../hooks';\nexport function useNeedsClip(xAxisId, yAxisId) {\n var _xAxis$allowDataOverf, _yAxis$allowDataOverf;\n var xAxis = useAppSelector(state => selectXAxisSettings(state, xAxisId));\n var yAxis = useAppSelector(state => selectYAxisSettings(state, yAxisId));\n var needClipX = (_xAxis$allowDataOverf = xAxis === null || xAxis === void 0 ? void 0 : xAxis.allowDataOverflow) !== null && _xAxis$allowDataOverf !== void 0 ? _xAxis$allowDataOverf : implicitXAxis.allowDataOverflow;\n var needClipY = (_yAxis$allowDataOverf = yAxis === null || yAxis === void 0 ? void 0 : yAxis.allowDataOverflow) !== null && _yAxis$allowDataOverf !== void 0 ? _yAxis$allowDataOverf : implicitYAxis.allowDataOverflow;\n var needClip = needClipX || needClipY;\n return {\n needClip,\n needClipX,\n needClipY\n };\n}\nexport function GraphicalItemClipPath(_ref) {\n var {\n xAxisId,\n yAxisId,\n clipPathId\n } = _ref;\n var plotArea = usePlotArea();\n var {\n needClipX,\n needClipY,\n needClip\n } = useNeedsClip(xAxisId, yAxisId);\n if (!needClip || !plotArea) {\n return null;\n }\n var {\n x,\n y,\n width,\n height\n } = plotArea;\n return /*#__PURE__*/React.createElement(\"clipPath\", {\n id: \"clipPath-\".concat(clipPathId)\n }, /*#__PURE__*/React.createElement(\"rect\", {\n x: needClipX ? x : x - width / 2,\n y: needClipY ? y : y - height / 2,\n width: needClipX ? width : width * 2,\n height: needClipY ? height : height * 2\n }));\n}","import { defaultAxisId } from '../cartesianAxisSlice';\nexport function selectXAxisIdFromGraphicalItemId(state, id) {\n var _state$graphicalItems, _state$graphicalItems2;\n return (_state$graphicalItems = (_state$graphicalItems2 = state.graphicalItems.cartesianItems.find(item => item.id === id)) === null || _state$graphicalItems2 === void 0 ? void 0 : _state$graphicalItems2.xAxisId) !== null && _state$graphicalItems !== void 0 ? _state$graphicalItems : defaultAxisId;\n}\nexport function selectYAxisIdFromGraphicalItemId(state, id) {\n var _state$graphicalItems3, _state$graphicalItems4;\n return (_state$graphicalItems3 = (_state$graphicalItems4 = state.graphicalItems.cartesianItems.find(item => item.id === id)) === null || _state$graphicalItems4 === void 0 ? void 0 : _state$graphicalItems4.yAxisId) !== null && _state$graphicalItems3 !== void 0 ? _state$graphicalItems3 : defaultAxisId;\n}","var _excluded = [\"domain\", \"range\"],\n _excluded2 = [\"domain\", \"range\"];\nfunction _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; }\nfunction _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; }\nimport { propsAreEqual } from './propsAreEqual';\nfunction shortArraysAreEqual(arr1, arr2) {\n if (arr1 === arr2) {\n return true;\n }\n if (Array.isArray(arr1) && arr1.length === 2 && Array.isArray(arr2) && arr2.length === 2) {\n return arr1[0] === arr2[0] && arr1[1] === arr2[1];\n }\n return false;\n}\n\n/**\n * Usually we would not compare array props deeply for performance consideration.\n * However, for axis props, domain is sometimes defined as a two-elements array, and range is always\n * a two-elements array. So we can do a shallow comparison for the rest props and a shallow\n * comparison for these two array props.\n * @param prevProps\n * @param nextProps\n */\nexport function axisPropsAreEqual(prevProps, nextProps) {\n if (prevProps === nextProps) {\n return true;\n }\n var {\n domain: prevDomain,\n range: prevRange\n } = prevProps,\n prevRest = _objectWithoutProperties(prevProps, _excluded);\n var {\n domain: nextDomain,\n range: nextRange\n } = nextProps,\n nextRest = _objectWithoutProperties(nextProps, _excluded2);\n if (!shortArraysAreEqual(prevDomain, nextDomain)) {\n return false;\n }\n if (!shortArraysAreEqual(prevRange, nextRange)) {\n return false;\n }\n return propsAreEqual(prevRest, nextRest);\n}","var _excluded = [\"type\"],\n _excluded2 = [\"dangerouslySetInnerHTML\", \"ticks\", \"scale\"],\n _excluded3 = [\"id\", \"scale\"];\nfunction _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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nfunction _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; }\nfunction _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; }\n/**\n * @fileOverview X Axis\n */\nimport * as React from 'react';\nimport { useLayoutEffect, useMemo, useRef } from 'react';\nimport { clsx } from 'clsx';\nimport { CartesianAxis, defaultCartesianAxisProps } from './CartesianAxis';\nimport { useAppDispatch, useAppSelector } from '../state/hooks';\nimport { addXAxis, replaceXAxis, removeXAxis } from '../state/cartesianAxisSlice';\nimport { implicitXAxis, selectTicksOfAxis, selectXAxisPosition, selectXAxisSettingsNoDefaults, selectXAxisSize } from '../state/selectors/axisSelectors';\nimport { selectAxisViewBox } from '../state/selectors/selectChartOffsetInternal';\nimport { useIsPanorama } from '../context/PanoramaContext';\nimport { resolveDefaultProps } from '../util/resolveDefaultProps';\nimport { axisPropsAreEqual } from '../util/axisPropsAreEqual';\nimport { useCartesianChartLayout } from '../context/chartLayoutContext';\nimport { getAxisTypeBasedOnLayout } from '../util/getAxisTypeBasedOnLayout';\nfunction SetXAxisSettings(props) {\n var dispatch = useAppDispatch();\n var prevSettingsRef = useRef(null);\n var layout = useCartesianChartLayout();\n var {\n type: typeFromProps\n } = props,\n restProps = _objectWithoutProperties(props, _excluded);\n var evaluatedType = getAxisTypeBasedOnLayout(layout, 'xAxis', typeFromProps);\n var settings = useMemo(() => {\n if (evaluatedType == null) {\n return undefined;\n }\n return _objectSpread(_objectSpread({}, restProps), {}, {\n type: evaluatedType\n });\n }, [restProps, evaluatedType]);\n useLayoutEffect(() => {\n if (settings == null) {\n return;\n }\n if (prevSettingsRef.current === null) {\n dispatch(addXAxis(settings));\n } else if (prevSettingsRef.current !== settings) {\n dispatch(replaceXAxis({\n prev: prevSettingsRef.current,\n next: settings\n }));\n }\n prevSettingsRef.current = settings;\n }, [settings, dispatch]);\n useLayoutEffect(() => {\n return () => {\n if (prevSettingsRef.current) {\n dispatch(removeXAxis(prevSettingsRef.current));\n prevSettingsRef.current = null;\n }\n };\n }, [dispatch]);\n return null;\n}\nvar XAxisImpl = props => {\n var {\n xAxisId,\n className\n } = props;\n var viewBox = useAppSelector(selectAxisViewBox);\n var isPanorama = useIsPanorama();\n var axisType = 'xAxis';\n var cartesianTickItems = useAppSelector(state => selectTicksOfAxis(state, axisType, xAxisId, isPanorama));\n var axisSize = useAppSelector(state => selectXAxisSize(state, xAxisId));\n var position = useAppSelector(state => selectXAxisPosition(state, xAxisId));\n /*\n * Here we select settings from the store and prefer to use them instead of the actual props\n * so that the chart is consistent. If we used the props directly, some components will use axis settings\n * from state and some from props and because there is a render step between these two, they might be showing different things.\n * https://github.com/recharts/recharts/issues/6257\n */\n var synchronizedSettings = useAppSelector(state => selectXAxisSettingsNoDefaults(state, xAxisId));\n if (axisSize == null || position == null || synchronizedSettings == null) {\n return null;\n }\n var {\n dangerouslySetInnerHTML,\n ticks,\n scale: del\n } = props,\n allOtherProps = _objectWithoutProperties(props, _excluded2);\n var {\n id,\n scale: del2\n } = synchronizedSettings,\n restSynchronizedSettings = _objectWithoutProperties(synchronizedSettings, _excluded3);\n return /*#__PURE__*/React.createElement(CartesianAxis, _extends({}, allOtherProps, restSynchronizedSettings, {\n x: position.x,\n y: position.y,\n width: axisSize.width,\n height: axisSize.height,\n className: clsx(\"recharts-\".concat(axisType, \" \").concat(axisType), className),\n viewBox: viewBox,\n ticks: cartesianTickItems,\n axisType: axisType,\n axisId: xAxisId\n }));\n};\nexport var xAxisDefaultProps = {\n allowDataOverflow: implicitXAxis.allowDataOverflow,\n allowDecimals: implicitXAxis.allowDecimals,\n allowDuplicatedCategory: implicitXAxis.allowDuplicatedCategory,\n angle: implicitXAxis.angle,\n axisLine: defaultCartesianAxisProps.axisLine,\n height: implicitXAxis.height,\n hide: false,\n includeHidden: implicitXAxis.includeHidden,\n interval: implicitXAxis.interval,\n label: false,\n minTickGap: implicitXAxis.minTickGap,\n mirror: implicitXAxis.mirror,\n orientation: implicitXAxis.orientation,\n padding: implicitXAxis.padding,\n reversed: implicitXAxis.reversed,\n scale: implicitXAxis.scale,\n tick: implicitXAxis.tick,\n tickCount: implicitXAxis.tickCount,\n tickLine: defaultCartesianAxisProps.tickLine,\n tickSize: defaultCartesianAxisProps.tickSize,\n type: implicitXAxis.type,\n niceTicks: implicitXAxis.niceTicks,\n xAxisId: 0\n};\nvar XAxisSettingsDispatcher = outsideProps => {\n var props = resolveDefaultProps(outsideProps, xAxisDefaultProps);\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SetXAxisSettings, {\n allowDataOverflow: props.allowDataOverflow,\n allowDecimals: props.allowDecimals,\n allowDuplicatedCategory: props.allowDuplicatedCategory,\n angle: props.angle,\n dataKey: props.dataKey,\n domain: props.domain,\n height: props.height,\n hide: props.hide,\n id: props.xAxisId,\n includeHidden: props.includeHidden,\n interval: props.interval,\n minTickGap: props.minTickGap,\n mirror: props.mirror,\n name: props.name,\n orientation: props.orientation,\n padding: props.padding,\n reversed: props.reversed,\n scale: props.scale,\n tick: props.tick,\n tickCount: props.tickCount,\n tickFormatter: props.tickFormatter,\n ticks: props.ticks,\n type: props.type,\n unit: props.unit,\n niceTicks: props.niceTicks\n }), /*#__PURE__*/React.createElement(XAxisImpl, props));\n};\n\n/**\n * @consumes CartesianViewBoxContext\n * @provides CartesianLabelContext\n */\nexport var XAxis = /*#__PURE__*/React.memo(XAxisSettingsDispatcher, axisPropsAreEqual);\n// @ts-expect-error we need to set the displayName for debugging purposes\n\nXAxis.displayName = 'XAxis';","var _excluded = [\"type\"],\n _excluded2 = [\"dangerouslySetInnerHTML\", \"ticks\", \"scale\"],\n _excluded3 = [\"id\", \"scale\"];\nfunction _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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nfunction _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; }\nfunction _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; }\nimport * as React from 'react';\nimport { isValidElement, useLayoutEffect, useMemo, useRef } from 'react';\nimport { clsx } from 'clsx';\nimport { CartesianAxis, defaultCartesianAxisProps } from './CartesianAxis';\nimport { addYAxis, replaceYAxis, removeYAxis, updateYAxisWidth } from '../state/cartesianAxisSlice';\nimport { useAppDispatch, useAppSelector } from '../state/hooks';\nimport { implicitYAxis, selectTicksOfAxis, selectYAxisPosition, selectYAxisSettingsNoDefaults, selectYAxisSize } from '../state/selectors/axisSelectors';\nimport { selectAxisViewBox } from '../state/selectors/selectChartOffsetInternal';\nimport { useIsPanorama } from '../context/PanoramaContext';\nimport { isLabelContentAFunction } from '../component/Label';\nimport { resolveDefaultProps } from '../util/resolveDefaultProps';\nimport { axisPropsAreEqual } from '../util/axisPropsAreEqual';\nimport { useCartesianChartLayout } from '../context/chartLayoutContext';\nimport { getAxisTypeBasedOnLayout } from '../util/getAxisTypeBasedOnLayout';\nfunction SetYAxisSettings(props) {\n var dispatch = useAppDispatch();\n var prevSettingsRef = useRef(null);\n var layout = useCartesianChartLayout();\n var {\n type: typeFromProps\n } = props,\n restProps = _objectWithoutProperties(props, _excluded);\n var evaluatedType = getAxisTypeBasedOnLayout(layout, 'yAxis', typeFromProps);\n var settings = useMemo(() => {\n if (evaluatedType == null) {\n return undefined;\n }\n return _objectSpread(_objectSpread({}, restProps), {}, {\n type: evaluatedType\n });\n }, [evaluatedType, restProps]);\n useLayoutEffect(() => {\n if (settings == null) {\n return;\n }\n if (prevSettingsRef.current === null) {\n dispatch(addYAxis(settings));\n } else if (prevSettingsRef.current !== settings) {\n dispatch(replaceYAxis({\n prev: prevSettingsRef.current,\n next: settings\n }));\n }\n prevSettingsRef.current = settings;\n }, [settings, dispatch]);\n useLayoutEffect(() => {\n return () => {\n if (prevSettingsRef.current) {\n dispatch(removeYAxis(prevSettingsRef.current));\n prevSettingsRef.current = null;\n }\n };\n }, [dispatch]);\n return null;\n}\nfunction YAxisImpl(props) {\n var {\n yAxisId,\n className,\n width,\n label\n } = props;\n var cartesianAxisRef = useRef(null);\n var labelRef = useRef(null);\n var viewBox = useAppSelector(selectAxisViewBox);\n var isPanorama = useIsPanorama();\n var dispatch = useAppDispatch();\n var axisType = 'yAxis';\n var axisSize = useAppSelector(state => selectYAxisSize(state, yAxisId));\n var position = useAppSelector(state => selectYAxisPosition(state, yAxisId));\n var cartesianTickItems = useAppSelector(state => selectTicksOfAxis(state, axisType, yAxisId, isPanorama));\n /*\n * Here we select settings from the store and prefer to use them instead of the actual props\n * so that the chart is consistent. If we used the props directly, some components will use axis settings\n * from state and some from props and because there is a render step between these two, they might be showing different things.\n * https://github.com/recharts/recharts/issues/6257\n */\n var synchronizedSettings = useAppSelector(state => selectYAxisSettingsNoDefaults(state, yAxisId));\n useLayoutEffect(() => {\n // No dynamic width calculation is done when width !== 'auto'\n // or when a function/react element is used for label\n if (width !== 'auto' || !axisSize || isLabelContentAFunction(label) || /*#__PURE__*/isValidElement(label) || synchronizedSettings == null) {\n return;\n }\n var axisComponent = cartesianAxisRef.current;\n if (!axisComponent) {\n return;\n }\n var updatedYAxisWidth = axisComponent.getCalculatedWidth();\n\n // if the width has changed, dispatch an action to update the width\n if (Math.round(axisSize.width) !== Math.round(updatedYAxisWidth)) {\n dispatch(updateYAxisWidth({\n id: yAxisId,\n width: updatedYAxisWidth\n }));\n }\n }, [\n // The dependency on cartesianAxisRef.current is not needed because useLayoutEffect will run after every render.\n // The ref will be populated by then.\n // To re-run this effect when ticks change, we can depend on the ticks array from the store.\n cartesianTickItems, axisSize, dispatch, label, yAxisId, width, synchronizedSettings]);\n if (axisSize == null || position == null || synchronizedSettings == null) {\n return null;\n }\n var {\n dangerouslySetInnerHTML,\n ticks,\n scale: del\n } = props,\n allOtherProps = _objectWithoutProperties(props, _excluded2);\n var {\n id,\n scale: del2\n } = synchronizedSettings,\n restSynchronizedSettings = _objectWithoutProperties(synchronizedSettings, _excluded3);\n return /*#__PURE__*/React.createElement(CartesianAxis, _extends({}, allOtherProps, restSynchronizedSettings, {\n ref: cartesianAxisRef,\n labelRef: labelRef,\n x: position.x,\n y: position.y,\n tickTextProps: width === 'auto' ? {\n width: undefined\n } : {\n width\n },\n width: axisSize.width,\n height: axisSize.height,\n className: clsx(\"recharts-\".concat(axisType, \" \").concat(axisType), className),\n viewBox: viewBox,\n ticks: cartesianTickItems,\n axisType: axisType,\n axisId: yAxisId\n }));\n}\nexport var yAxisDefaultProps = {\n allowDataOverflow: implicitYAxis.allowDataOverflow,\n allowDecimals: implicitYAxis.allowDecimals,\n allowDuplicatedCategory: implicitYAxis.allowDuplicatedCategory,\n angle: implicitYAxis.angle,\n axisLine: defaultCartesianAxisProps.axisLine,\n hide: false,\n includeHidden: implicitYAxis.includeHidden,\n interval: implicitYAxis.interval,\n label: false,\n minTickGap: implicitYAxis.minTickGap,\n mirror: implicitYAxis.mirror,\n orientation: implicitYAxis.orientation,\n padding: implicitYAxis.padding,\n reversed: implicitYAxis.reversed,\n scale: implicitYAxis.scale,\n tick: implicitYAxis.tick,\n tickCount: implicitYAxis.tickCount,\n tickLine: defaultCartesianAxisProps.tickLine,\n tickSize: defaultCartesianAxisProps.tickSize,\n type: implicitYAxis.type,\n niceTicks: implicitYAxis.niceTicks,\n width: implicitYAxis.width,\n yAxisId: 0\n};\nvar YAxisSettingsDispatcher = outsideProps => {\n var props = resolveDefaultProps(outsideProps, yAxisDefaultProps);\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SetYAxisSettings, {\n interval: props.interval,\n id: props.yAxisId,\n scale: props.scale,\n type: props.type,\n domain: props.domain,\n allowDataOverflow: props.allowDataOverflow,\n dataKey: props.dataKey,\n allowDuplicatedCategory: props.allowDuplicatedCategory,\n allowDecimals: props.allowDecimals,\n tickCount: props.tickCount,\n padding: props.padding,\n includeHidden: props.includeHidden,\n reversed: props.reversed,\n ticks: props.ticks,\n width: props.width,\n orientation: props.orientation,\n mirror: props.mirror,\n hide: props.hide,\n unit: props.unit,\n name: props.name,\n angle: props.angle,\n minTickGap: props.minTickGap,\n tick: props.tick,\n tickFormatter: props.tickFormatter,\n niceTicks: props.niceTicks\n }), /*#__PURE__*/React.createElement(YAxisImpl, props));\n};\n\n/**\n * @consumes CartesianViewBoxContext\n * @provides CartesianLabelContext\n */\nexport var YAxis = /*#__PURE__*/React.memo(YAxisSettingsDispatcher, axisPropsAreEqual);\n// @ts-expect-error we need to set the displayName for debugging purposes\n\nYAxis.displayName = 'YAxis';","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); }\nfunction 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; }\nfunction _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; }\nfunction _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; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _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); }\nimport * as React from 'react';\nimport { forwardRef } from 'react';\nimport { RechartsStoreProvider } from '../state/RechartsStoreProvider';\nimport { ChartDataContextProvider } from '../context/chartDataContext';\nimport { ReportMainChartProps } from '../state/ReportMainChartProps';\nimport { ReportChartProps } from '../state/ReportChartProps';\nimport { ReportEventSettings } from '../state/ReportEventSettings';\nimport { CategoricalChart } from './CategoricalChart';\nimport { resolveDefaultProps } from '../util/resolveDefaultProps';\nimport { initialEventSettingsState } from '../state/eventSettingsSlice';\nvar defaultMargin = {\n top: 5,\n right: 5,\n bottom: 5,\n left: 5\n};\nexport var defaultCartesianChartProps = _objectSpread({\n accessibilityLayer: true,\n barCategoryGap: '10%',\n barGap: 4,\n layout: 'horizontal',\n margin: defaultMargin,\n responsive: false,\n reverseStackOrder: false,\n stackOffset: 'none',\n syncMethod: 'index'\n}, initialEventSettingsState);\n\n/**\n * These are one-time, immutable options that decide the chart's behavior.\n * Users who wish to call CartesianChart may decide to pass these options explicitly,\n * but usually we would expect that they use one of the convenience components like BarChart, LineChart, etc.\n */\n\nexport var CartesianChart = /*#__PURE__*/forwardRef(function CartesianChart(props, ref) {\n var _categoricalChartProp;\n var rootChartProps = resolveDefaultProps(props.categoricalChartProps, defaultCartesianChartProps);\n var {\n chartName,\n defaultTooltipEventType,\n validateTooltipEventTypes,\n tooltipPayloadSearcher,\n categoricalChartProps\n } = props;\n var options = {\n chartName,\n defaultTooltipEventType,\n validateTooltipEventTypes,\n tooltipPayloadSearcher,\n eventEmitter: undefined\n };\n return /*#__PURE__*/React.createElement(RechartsStoreProvider, {\n preloadedState: {\n options\n },\n reduxStoreName: (_categoricalChartProp = categoricalChartProps.id) !== null && _categoricalChartProp !== void 0 ? _categoricalChartProp : chartName\n }, /*#__PURE__*/React.createElement(ChartDataContextProvider, {\n chartData: categoricalChartProps.data\n }), /*#__PURE__*/React.createElement(ReportMainChartProps, {\n layout: rootChartProps.layout,\n margin: rootChartProps.margin\n }), /*#__PURE__*/React.createElement(ReportEventSettings, {\n throttleDelay: rootChartProps.throttleDelay,\n throttledEvents: rootChartProps.throttledEvents\n }), /*#__PURE__*/React.createElement(ReportChartProps, {\n baseValue: rootChartProps.baseValue,\n accessibilityLayer: rootChartProps.accessibilityLayer,\n barCategoryGap: rootChartProps.barCategoryGap,\n maxBarSize: rootChartProps.maxBarSize,\n stackOffset: rootChartProps.stackOffset,\n barGap: rootChartProps.barGap,\n barSize: rootChartProps.barSize,\n syncId: rootChartProps.syncId,\n syncMethod: rootChartProps.syncMethod,\n className: rootChartProps.className,\n reverseStackOrder: rootChartProps.reverseStackOrder\n }), /*#__PURE__*/React.createElement(CategoricalChart, _extends({}, rootChartProps, {\n ref: ref\n })));\n});","import React from 'react';\nimport { formatExact } from '../utils/formatNumber';\n\n/**\n * Tooltip común de los gráficos del tablero.\n *\n * Existe por dos motivos que el tooltip por defecto de recharts no cubre:\n *\n * - Muestra el valor EXACTO, sin abreviar. El eje y las etiquetas abrevian\n * porque no hay sitio; el tooltip es justamente donde el usuario va a buscar la\n * cifra completa, y devolverle \"1,25M\" otra vez no le sirve de nada.\n * - Usa los tokens del tablero. El de recharts trae fondo blanco cableado,\n * asà que en modo oscuro aparecÃa un rectángulo blanco sobre el gráfico.\n */\n/** Una entrada del payload que recharts inyecta al tooltip. */\ninterface TooltipEntry {\n name?: string;\n value?: number | string;\n color?: string;\n}\n\n/**\n * Los tres primeros los inyecta recharts en tiempo de ejecución al pasar este\n * componente como `content`; se declaran opcionales porque el consumidor no los\n * escribe a mano. `TooltipProps` de recharts no se extiende aquÃ: su forma varÃa\n * entre versiones menores y encadenaba errores de tipo sin aportar seguridad real.\n */\ninterface ChartTooltipProps {\n active?: boolean;\n payload?: TooltipEntry[];\n label?: string | number;\n currency?: string | null;\n /** Total de la serie, para poder mostrar el porcentaje. */\n total?: number;\n}\n\nexport const ChartTooltip: React.FC = ({\n active,\n payload,\n label,\n currency = null,\n total = 0,\n}) => {\n if (!active || !payload || payload.length === 0) return null;\n\n return (\n \n {label != null && label !== '' && (\n \n {String(label)}\n
\n )}\n {payload.map((entry, index) => {\n /**\n * Cadena numérica incluida: hay endpoints que serializan todo como string y el resto\n * del módulo ya lo tolera (`KpiVentasHoy.toNum`, `ChartBarHorizontal`, `ChartDonut`).\n * Con el `: 0` anterior, esos gráficos se pintaban bien y su tooltip decÃa «$ 0».\n */\n const parsed = typeof entry.value === 'number'\n ? entry.value\n : Number(String(entry.value ?? '').replace(/,/g, ''));\n const value = Number.isFinite(parsed) ? parsed : 0;\n const share = total > 0 ? (value / total) * 100 : null;\n\n return (\n \n \n {entry.name}\n \n {formatExact(value, { currency })}\n {share !== null && (\n {` · ${share.toFixed(0)} %`}\n )}\n \n
\n );\n })}\n