@mui/x-charts 7.16.0 → 7.18.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/BarChart/BarChart.js +13 -0
- package/BarChart/BarElement.js +2 -0
- package/BarChart/BarLabel/BarLabel.js +2 -0
- package/BarChart/BarPlot.js +2 -0
- package/BarChart/legend.js +3 -2
- package/BarChart/useBarChartProps.js +2 -0
- package/CHANGELOG.md +184 -4
- package/ChartContainer/ChartContainer.js +2 -0
- package/ChartContainer/useChartContainerProps.js +2 -0
- package/ChartContainer/useDefaultizeAxis.js +2 -0
- package/ChartsAxis/ChartsAxis.js +2 -0
- package/ChartsAxisHighlight/ChartsAxisHighlight.js +2 -0
- package/ChartsClipPath/ChartsClipPath.js +2 -0
- package/ChartsGrid/ChartsGrid.js +2 -0
- package/ChartsLegend/ChartsLegend.d.ts +2 -2
- package/ChartsLegend/ChartsLegend.js +11 -1
- package/ChartsLegend/ChartsLegendItem.d.ts +26 -0
- package/ChartsLegend/ChartsLegendItem.js +65 -0
- package/ChartsLegend/ContinuousColorLegend.js +2 -0
- package/ChartsLegend/DefaultChartsLegend.d.ts +9 -1
- package/ChartsLegend/DefaultChartsLegend.js +26 -4
- package/ChartsLegend/LegendPerItem.d.ts +1 -0
- package/ChartsLegend/LegendPerItem.js +19 -28
- package/ChartsLegend/PiecewiseColorLegend.d.ts +9 -1
- package/ChartsLegend/PiecewiseColorLegend.js +28 -7
- package/ChartsLegend/chartsLegend.types.d.ts +39 -1
- package/ChartsLegend/chartsLegendClasses.d.ts +2 -0
- package/ChartsLegend/chartsLegendClasses.js +1 -1
- package/ChartsLegend/useAxis.js +2 -0
- package/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +3 -1
- package/ChartsOverlay/ChartsLoadingOverlay.js +2 -0
- package/ChartsOverlay/ChartsNoDataOverlay.js +2 -0
- package/ChartsOverlay/ChartsOverlay.js +2 -0
- package/ChartsReferenceLine/ChartsReferenceLine.js +2 -0
- package/ChartsReferenceLine/ChartsXReferenceLine.js +3 -1
- package/ChartsReferenceLine/ChartsYReferenceLine.js +3 -1
- package/ChartsSurface/ChartsSurface.js +2 -0
- package/ChartsText/ChartsText.js +2 -0
- package/ChartsTooltip/ChartsTooltip.js +2 -0
- package/ChartsTooltip/DefaultChartsAxisTooltipContent.js +2 -0
- package/ChartsTooltip/DefaultChartsItemTooltipContent.js +2 -0
- package/ChartsTooltip/index.d.ts +3 -0
- package/ChartsTooltip/index.js +4 -1
- package/ChartsTooltip/useAxisTooltip.d.ts +18 -0
- package/ChartsTooltip/useAxisTooltip.js +84 -0
- package/ChartsTooltip/useItemTooltip.d.ts +10 -0
- package/ChartsTooltip/useItemTooltip.js +64 -0
- package/ChartsTooltip/utils.d.ts +2 -1
- package/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -0
- package/ChartsXAxis/ChartsXAxis.js +2 -0
- package/ChartsYAxis/ChartsYAxis.js +2 -0
- package/Gauge/Gauge.js +2 -0
- package/Gauge/GaugeContainer.js +2 -0
- package/Gauge/GaugeReferenceArc.js +2 -0
- package/Gauge/GaugeValueArc.js +2 -0
- package/Gauge/GaugeValueText.js +2 -0
- package/LineChart/AnimatedArea.js +2 -0
- package/LineChart/AnimatedLine.js +14 -22
- package/LineChart/AreaElement.js +2 -0
- package/LineChart/AreaPlot.js +2 -0
- package/LineChart/CircleMarkElement.d.ts +34 -0
- package/LineChart/CircleMarkElement.js +107 -0
- package/LineChart/LineChart.d.ts +4 -0
- package/LineChart/LineChart.js +17 -0
- package/LineChart/LineElement.js +2 -0
- package/LineChart/LineHighlightElement.js +2 -0
- package/LineChart/LineHighlightPlot.js +2 -0
- package/LineChart/LinePlot.js +2 -0
- package/LineChart/MarkElement.d.ts +1 -19
- package/LineChart/MarkElement.js +3 -19
- package/LineChart/MarkPlot.d.ts +6 -0
- package/LineChart/MarkPlot.js +13 -3
- package/LineChart/index.d.ts +2 -0
- package/LineChart/index.js +2 -1
- package/LineChart/legend.js +3 -2
- package/LineChart/markElementClasses.d.ts +20 -0
- package/LineChart/markElementClasses.js +19 -0
- package/LineChart/useLineChartProps.js +7 -3
- package/PieChart/PieArc.js +2 -0
- package/PieChart/PieArcLabel.js +2 -0
- package/PieChart/PieArcLabelPlot.js +2 -0
- package/PieChart/PieArcPlot.js +2 -0
- package/PieChart/PieChart.js +13 -0
- package/PieChart/PiePlot.js +2 -0
- package/PieChart/dataTransform/useTransformData.js +2 -0
- package/PieChart/legend.js +3 -1
- package/ResponsiveChartContainer/ResponsiveChartContainer.d.ts +10 -0
- package/ResponsiveChartContainer/ResponsiveChartContainer.js +12 -0
- package/ResponsiveChartContainer/useChartContainerDimensions.d.ts +1 -1
- package/ResponsiveChartContainer/useChartContainerDimensions.js +35 -9
- package/ResponsiveChartContainer/useResponsiveChartContainerProps.js +5 -2
- package/ScatterChart/Scatter.js +2 -0
- package/ScatterChart/ScatterChart.js +13 -0
- package/ScatterChart/ScatterPlot.js +2 -0
- package/ScatterChart/legend.js +3 -2
- package/ScatterChart/useScatterChartProps.js +2 -0
- package/SparkLineChart/SparkLineChart.js +12 -0
- package/context/CartesianProvider/CartesianProvider.js +5 -3
- package/context/CartesianProvider/getAxisExtremum.d.ts +1 -1
- package/context/CartesianProvider/getAxisExtremum.js +5 -4
- package/context/CartesianProvider/index.d.ts +0 -5
- package/context/CartesianProvider/index.js +1 -6
- package/context/CartesianProvider/useCartesianContext.js +2 -0
- package/context/DrawingProvider.js +2 -0
- package/context/HighlightedProvider/HighlightedProvider.js +2 -0
- package/context/HighlightedProvider/useHighlighted.js +2 -0
- package/context/HighlightedProvider/useItemHighlighted.js +2 -0
- package/context/InteractionProvider.js +2 -0
- package/context/PluginProvider/ExtremumGetter.types.d.ts +1 -0
- package/context/PluginProvider/Plugin.types.d.ts +4 -0
- package/context/PluginProvider/PluginContext.js +3 -1
- package/context/PluginProvider/PluginProvider.js +2 -0
- package/context/PluginProvider/index.d.ts +2 -0
- package/context/PluginProvider/index.js +3 -1
- package/context/PluginProvider/mergePlugins.d.ts +10 -0
- package/context/PluginProvider/mergePlugins.js +11 -1
- package/context/PluginProvider/useColorProcessor.js +2 -0
- package/context/PluginProvider/useRadiusExtremumGetter.d.ts +4 -0
- package/context/PluginProvider/useRadiusExtremumGetter.js +17 -0
- package/context/PluginProvider/useRotationExtremumGetter.d.ts +4 -0
- package/context/PluginProvider/useRotationExtremumGetter.js +17 -0
- package/context/PluginProvider/useSeriesFormatter.js +2 -0
- package/context/PolarProvider/Polar.types.d.ts +42 -0
- package/context/PolarProvider/Polar.types.js +1 -0
- package/context/PolarProvider/PolarContext.d.ts +4 -0
- package/context/PolarProvider/PolarContext.js +13 -0
- package/context/PolarProvider/PolarProvider.d.ts +4 -0
- package/context/PolarProvider/PolarProvider.js +49 -0
- package/context/PolarProvider/getAxisExtremum.d.ts +4 -0
- package/context/PolarProvider/getAxisExtremum.js +20 -0
- package/context/PolarProvider/index.d.ts +0 -0
- package/context/PolarProvider/index.js +0 -0
- package/context/PolarProvider/usePolarContext.d.ts +2 -0
- package/context/PolarProvider/usePolarContext.js +10 -0
- package/context/SeriesProvider/SeriesProvider.js +2 -0
- package/context/ZAxisContextProvider.js +2 -0
- package/hooks/useAxis.js +2 -0
- package/hooks/useAxisEvents.js +2 -0
- package/hooks/useChartDimensions.js +2 -0
- package/hooks/useChartId.js +2 -0
- package/hooks/useColorScale.js +2 -0
- package/hooks/useDrawingArea.js +2 -0
- package/hooks/useInteractionItemProps.js +2 -0
- package/hooks/useMounted.js +2 -0
- package/hooks/useReducedMotion.js +2 -0
- package/hooks/useScale.js +2 -0
- package/hooks/useSeries.js +2 -0
- package/hooks/useSvgRef.js +2 -0
- package/hooks/useTicks.js +2 -0
- package/index.js +1 -1
- package/internals/computeAxisValue.d.ts +38 -0
- package/{modern/context/CartesianProvider/computeValue.js → internals/computeAxisValue.js} +28 -15
- package/internals/index.d.ts +1 -0
- package/internals/index.js +1 -0
- package/models/axis.d.ts +20 -0
- package/models/seriesType/config.d.ts +6 -2
- package/modern/BarChart/BarChart.js +13 -0
- package/modern/BarChart/BarElement.js +2 -0
- package/modern/BarChart/BarLabel/BarLabel.js +2 -0
- package/modern/BarChart/BarPlot.js +2 -0
- package/modern/BarChart/legend.js +3 -2
- package/modern/BarChart/useBarChartProps.js +2 -0
- package/modern/ChartContainer/ChartContainer.js +2 -0
- package/modern/ChartContainer/useChartContainerProps.js +2 -0
- package/modern/ChartContainer/useDefaultizeAxis.js +2 -0
- package/modern/ChartsAxis/ChartsAxis.js +2 -0
- package/modern/ChartsAxisHighlight/ChartsAxisHighlight.js +2 -0
- package/modern/ChartsClipPath/ChartsClipPath.js +2 -0
- package/modern/ChartsGrid/ChartsGrid.js +2 -0
- package/modern/ChartsLegend/ChartsLegend.js +11 -1
- package/modern/ChartsLegend/ChartsLegendItem.js +65 -0
- package/modern/ChartsLegend/ContinuousColorLegend.js +2 -0
- package/modern/ChartsLegend/DefaultChartsLegend.js +26 -4
- package/modern/ChartsLegend/LegendPerItem.js +19 -28
- package/modern/ChartsLegend/PiecewiseColorLegend.js +28 -7
- package/modern/ChartsLegend/chartsLegendClasses.js +1 -1
- package/modern/ChartsLegend/useAxis.js +2 -0
- package/modern/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +3 -1
- package/modern/ChartsOverlay/ChartsLoadingOverlay.js +2 -0
- package/modern/ChartsOverlay/ChartsNoDataOverlay.js +2 -0
- package/modern/ChartsOverlay/ChartsOverlay.js +2 -0
- package/modern/ChartsReferenceLine/ChartsReferenceLine.js +2 -0
- package/modern/ChartsReferenceLine/ChartsXReferenceLine.js +3 -1
- package/modern/ChartsReferenceLine/ChartsYReferenceLine.js +3 -1
- package/modern/ChartsSurface/ChartsSurface.js +2 -0
- package/modern/ChartsText/ChartsText.js +2 -0
- package/modern/ChartsTooltip/ChartsTooltip.js +2 -0
- package/modern/ChartsTooltip/DefaultChartsAxisTooltipContent.js +2 -0
- package/modern/ChartsTooltip/DefaultChartsItemTooltipContent.js +2 -0
- package/modern/ChartsTooltip/index.js +4 -1
- package/modern/ChartsTooltip/useAxisTooltip.js +84 -0
- package/modern/ChartsTooltip/useItemTooltip.js +64 -0
- package/modern/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -0
- package/modern/ChartsXAxis/ChartsXAxis.js +2 -0
- package/modern/ChartsYAxis/ChartsYAxis.js +2 -0
- package/modern/Gauge/Gauge.js +2 -0
- package/modern/Gauge/GaugeContainer.js +2 -0
- package/modern/Gauge/GaugeReferenceArc.js +2 -0
- package/modern/Gauge/GaugeValueArc.js +2 -0
- package/modern/Gauge/GaugeValueText.js +2 -0
- package/modern/LineChart/AnimatedArea.js +2 -0
- package/modern/LineChart/AnimatedLine.js +14 -22
- package/modern/LineChart/AreaElement.js +2 -0
- package/modern/LineChart/AreaPlot.js +2 -0
- package/modern/LineChart/CircleMarkElement.js +107 -0
- package/modern/LineChart/LineChart.js +17 -0
- package/modern/LineChart/LineElement.js +2 -0
- package/modern/LineChart/LineHighlightElement.js +2 -0
- package/modern/LineChart/LineHighlightPlot.js +2 -0
- package/modern/LineChart/LinePlot.js +2 -0
- package/modern/LineChart/MarkElement.js +3 -19
- package/modern/LineChart/MarkPlot.js +13 -3
- package/modern/LineChart/index.js +2 -1
- package/modern/LineChart/legend.js +3 -2
- package/modern/LineChart/markElementClasses.js +19 -0
- package/modern/LineChart/useLineChartProps.js +7 -3
- package/modern/PieChart/PieArc.js +2 -0
- package/modern/PieChart/PieArcLabel.js +2 -0
- package/modern/PieChart/PieArcLabelPlot.js +2 -0
- package/modern/PieChart/PieArcPlot.js +2 -0
- package/modern/PieChart/PieChart.js +13 -0
- package/modern/PieChart/PiePlot.js +2 -0
- package/modern/PieChart/dataTransform/useTransformData.js +2 -0
- package/modern/PieChart/legend.js +3 -1
- package/modern/ResponsiveChartContainer/ResponsiveChartContainer.js +12 -0
- package/modern/ResponsiveChartContainer/useChartContainerDimensions.js +35 -9
- package/modern/ResponsiveChartContainer/useResponsiveChartContainerProps.js +5 -2
- package/modern/ScatterChart/Scatter.js +2 -0
- package/modern/ScatterChart/ScatterChart.js +13 -0
- package/modern/ScatterChart/ScatterPlot.js +2 -0
- package/modern/ScatterChart/legend.js +3 -2
- package/modern/ScatterChart/useScatterChartProps.js +2 -0
- package/modern/SparkLineChart/SparkLineChart.js +12 -0
- package/modern/context/CartesianProvider/CartesianProvider.js +5 -3
- package/modern/context/CartesianProvider/getAxisExtremum.js +5 -4
- package/modern/context/CartesianProvider/index.js +1 -6
- package/modern/context/CartesianProvider/useCartesianContext.js +2 -0
- package/modern/context/DrawingProvider.js +2 -0
- package/modern/context/HighlightedProvider/HighlightedProvider.js +2 -0
- package/modern/context/HighlightedProvider/useHighlighted.js +2 -0
- package/modern/context/HighlightedProvider/useItemHighlighted.js +2 -0
- package/modern/context/InteractionProvider.js +2 -0
- package/modern/context/PluginProvider/PluginContext.js +3 -1
- package/modern/context/PluginProvider/PluginProvider.js +2 -0
- package/modern/context/PluginProvider/index.js +3 -1
- package/modern/context/PluginProvider/mergePlugins.js +11 -1
- package/modern/context/PluginProvider/useColorProcessor.js +2 -0
- package/modern/context/PluginProvider/useRadiusExtremumGetter.js +17 -0
- package/modern/context/PluginProvider/useRotationExtremumGetter.js +17 -0
- package/modern/context/PluginProvider/useSeriesFormatter.js +2 -0
- package/modern/context/PolarProvider/Polar.types.js +1 -0
- package/modern/context/PolarProvider/PolarContext.js +13 -0
- package/modern/context/PolarProvider/PolarProvider.js +49 -0
- package/modern/context/PolarProvider/getAxisExtremum.js +20 -0
- package/modern/context/PolarProvider/index.js +0 -0
- package/modern/context/PolarProvider/usePolarContext.js +10 -0
- package/modern/context/SeriesProvider/SeriesProvider.js +2 -0
- package/modern/context/ZAxisContextProvider.js +2 -0
- package/modern/hooks/useAxis.js +2 -0
- package/modern/hooks/useAxisEvents.js +2 -0
- package/modern/hooks/useChartDimensions.js +2 -0
- package/modern/hooks/useChartId.js +2 -0
- package/modern/hooks/useColorScale.js +2 -0
- package/modern/hooks/useDrawingArea.js +2 -0
- package/modern/hooks/useInteractionItemProps.js +2 -0
- package/modern/hooks/useMounted.js +2 -0
- package/modern/hooks/useReducedMotion.js +2 -0
- package/modern/hooks/useScale.js +2 -0
- package/modern/hooks/useSeries.js +2 -0
- package/modern/hooks/useSvgRef.js +2 -0
- package/modern/hooks/useTicks.js +2 -0
- package/modern/index.js +1 -1
- package/{context/CartesianProvider/computeValue.js → modern/internals/computeAxisValue.js} +28 -15
- package/modern/internals/index.js +1 -0
- package/node/BarChart/BarChart.js +12 -0
- package/node/BarChart/BarElement.js +1 -0
- package/node/BarChart/BarLabel/BarLabel.js +1 -0
- package/node/BarChart/BarPlot.js +1 -0
- package/node/BarChart/legend.js +3 -2
- package/node/BarChart/useBarChartProps.js +1 -0
- package/node/ChartContainer/ChartContainer.js +1 -0
- package/node/ChartContainer/useChartContainerProps.js +1 -0
- package/node/ChartContainer/useDefaultizeAxis.js +1 -0
- package/node/ChartsAxis/ChartsAxis.js +1 -0
- package/node/ChartsAxisHighlight/ChartsAxisHighlight.js +1 -0
- package/node/ChartsClipPath/ChartsClipPath.js +1 -0
- package/node/ChartsGrid/ChartsGrid.js +1 -0
- package/node/ChartsLegend/ChartsLegend.js +10 -1
- package/node/ChartsLegend/ChartsLegendItem.js +72 -0
- package/node/ChartsLegend/ContinuousColorLegend.js +1 -0
- package/node/ChartsLegend/DefaultChartsLegend.js +25 -4
- package/node/ChartsLegend/LegendPerItem.js +18 -28
- package/node/ChartsLegend/PiecewiseColorLegend.js +27 -7
- package/node/ChartsLegend/chartsLegendClasses.js +1 -1
- package/node/ChartsLegend/useAxis.js +1 -0
- package/node/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +2 -1
- package/node/ChartsOverlay/ChartsLoadingOverlay.js +1 -0
- package/node/ChartsOverlay/ChartsNoDataOverlay.js +1 -0
- package/node/ChartsOverlay/ChartsOverlay.js +1 -0
- package/node/ChartsReferenceLine/ChartsReferenceLine.js +1 -0
- package/node/ChartsReferenceLine/ChartsXReferenceLine.js +2 -1
- package/node/ChartsReferenceLine/ChartsYReferenceLine.js +2 -1
- package/node/ChartsSurface/ChartsSurface.js +1 -0
- package/node/ChartsText/ChartsText.js +1 -0
- package/node/ChartsTooltip/ChartsTooltip.js +1 -0
- package/node/ChartsTooltip/DefaultChartsAxisTooltipContent.js +1 -0
- package/node/ChartsTooltip/DefaultChartsItemTooltipContent.js +1 -0
- package/node/ChartsTooltip/index.js +42 -1
- package/node/ChartsTooltip/useAxisTooltip.js +90 -0
- package/node/ChartsTooltip/useItemTooltip.js +71 -0
- package/node/ChartsVoronoiHandler/ChartsVoronoiHandler.js +1 -0
- package/node/ChartsXAxis/ChartsXAxis.js +1 -0
- package/node/ChartsYAxis/ChartsYAxis.js +1 -0
- package/node/Gauge/Gauge.js +1 -0
- package/node/Gauge/GaugeContainer.js +1 -0
- package/node/Gauge/GaugeReferenceArc.js +1 -0
- package/node/Gauge/GaugeValueArc.js +1 -0
- package/node/Gauge/GaugeValueText.js +1 -0
- package/node/LineChart/AnimatedArea.js +1 -0
- package/node/LineChart/AnimatedLine.js +13 -22
- package/node/LineChart/AreaElement.js +1 -0
- package/node/LineChart/AreaPlot.js +1 -0
- package/node/LineChart/CircleMarkElement.js +113 -0
- package/node/LineChart/LineChart.js +16 -0
- package/node/LineChart/LineElement.js +1 -0
- package/node/LineChart/LineHighlightElement.js +1 -0
- package/node/LineChart/LineHighlightPlot.js +1 -0
- package/node/LineChart/LinePlot.js +1 -0
- package/node/LineChart/MarkElement.js +3 -22
- package/node/LineChart/MarkPlot.js +12 -3
- package/node/LineChart/index.js +29 -1
- package/node/LineChart/legend.js +3 -2
- package/node/LineChart/markElementClasses.js +28 -0
- package/node/LineChart/useLineChartProps.js +6 -3
- package/node/PieChart/PieArc.js +1 -0
- package/node/PieChart/PieArcLabel.js +1 -0
- package/node/PieChart/PieArcLabelPlot.js +1 -0
- package/node/PieChart/PieArcPlot.js +1 -0
- package/node/PieChart/PieChart.js +12 -0
- package/node/PieChart/PiePlot.js +1 -0
- package/node/PieChart/dataTransform/useTransformData.js +1 -0
- package/node/PieChart/legend.js +3 -1
- package/node/ResponsiveChartContainer/ResponsiveChartContainer.js +11 -0
- package/node/ResponsiveChartContainer/useChartContainerDimensions.js +34 -9
- package/node/ResponsiveChartContainer/useResponsiveChartContainerProps.js +4 -2
- package/node/ScatterChart/Scatter.js +1 -0
- package/node/ScatterChart/ScatterChart.js +12 -0
- package/node/ScatterChart/ScatterPlot.js +1 -0
- package/node/ScatterChart/legend.js +3 -2
- package/node/ScatterChart/useScatterChartProps.js +1 -0
- package/node/SparkLineChart/SparkLineChart.js +11 -0
- package/node/context/CartesianProvider/CartesianProvider.js +4 -3
- package/node/context/CartesianProvider/getAxisExtremum.js +5 -4
- package/node/context/CartesianProvider/index.js +1 -13
- package/node/context/CartesianProvider/useCartesianContext.js +1 -0
- package/node/context/DrawingProvider.js +1 -0
- package/node/context/HighlightedProvider/HighlightedProvider.js +1 -0
- package/node/context/HighlightedProvider/useHighlighted.js +1 -0
- package/node/context/HighlightedProvider/useItemHighlighted.js +1 -0
- package/node/context/InteractionProvider.js +1 -0
- package/node/context/PluginProvider/PluginContext.js +3 -1
- package/node/context/PluginProvider/PluginProvider.js +1 -0
- package/node/context/PluginProvider/index.js +22 -0
- package/node/context/PluginProvider/mergePlugins.js +11 -1
- package/node/context/PluginProvider/useColorProcessor.js +1 -0
- package/node/context/PluginProvider/useRadiusExtremumGetter.js +23 -0
- package/node/context/PluginProvider/useRotationExtremumGetter.js +23 -0
- package/node/context/PluginProvider/useSeriesFormatter.js +1 -0
- package/node/context/PolarProvider/Polar.types.js +5 -0
- package/node/context/PolarProvider/PolarContext.js +20 -0
- package/node/context/PolarProvider/PolarProvider.js +54 -0
- package/node/context/PolarProvider/getAxisExtremum.js +27 -0
- package/node/context/PolarProvider/index.js +1 -0
- package/node/context/PolarProvider/usePolarContext.js +17 -0
- package/node/context/SeriesProvider/SeriesProvider.js +1 -0
- package/node/context/ZAxisContextProvider.js +1 -0
- package/node/hooks/useAxis.js +1 -0
- package/node/hooks/useAxisEvents.js +1 -0
- package/node/hooks/useChartDimensions.js +1 -0
- package/node/hooks/useChartId.js +1 -0
- package/node/hooks/useColorScale.js +1 -0
- package/node/hooks/useDrawingArea.js +1 -0
- package/node/hooks/useInteractionItemProps.js +1 -0
- package/node/hooks/useMounted.js +1 -0
- package/node/hooks/useReducedMotion.js +1 -0
- package/node/hooks/useScale.js +1 -0
- package/node/hooks/useSeries.js +1 -0
- package/node/hooks/useSvgRef.js +1 -0
- package/node/hooks/useTicks.js +1 -0
- package/node/index.js +1 -1
- package/node/{context/CartesianProvider/computeValue.js → internals/computeAxisValue.js} +29 -16
- package/node/internals/index.js +12 -0
- package/package.json +4 -4
- package/context/CartesianProvider/computeValue.d.ts +0 -30
- package/internals/warning.d.ts +0 -2
- package/internals/warning.js +0 -21
- package/modern/internals/warning.js +0 -21
- package/node/internals/warning.js +0 -28
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
1
3
|
import * as React from 'react';
|
|
4
|
+
import { computeAxisValue } from "../../internals/computeAxisValue.js";
|
|
2
5
|
import { useDrawingArea } from "../../hooks/useDrawingArea.js";
|
|
3
6
|
import { useSeries } from "../../hooks/useSeries.js";
|
|
4
7
|
import { CartesianContext } from "./CartesianContext.js";
|
|
5
|
-
import { computeValue } from "./computeValue.js";
|
|
6
8
|
import { useXExtremumGetter } from "../PluginProvider/useXExtremumGetter.js";
|
|
7
9
|
import { useYExtremumGetter } from "../PluginProvider/index.js";
|
|
8
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -16,14 +18,14 @@ function CartesianProvider(props) {
|
|
|
16
18
|
const drawingArea = useDrawingArea();
|
|
17
19
|
const xExtremumGetters = useXExtremumGetter();
|
|
18
20
|
const yExtremumGetters = useYExtremumGetter();
|
|
19
|
-
const xValues = React.useMemo(() =>
|
|
21
|
+
const xValues = React.useMemo(() => computeAxisValue({
|
|
20
22
|
drawingArea,
|
|
21
23
|
formattedSeries,
|
|
22
24
|
axis: xAxis,
|
|
23
25
|
extremumGetters: xExtremumGetters,
|
|
24
26
|
axisDirection: 'x'
|
|
25
27
|
}), [drawingArea, formattedSeries, xAxis, xExtremumGetters]);
|
|
26
|
-
const yValues = React.useMemo(() =>
|
|
28
|
+
const yValues = React.useMemo(() => computeAxisValue({
|
|
27
29
|
drawingArea,
|
|
28
30
|
formattedSeries,
|
|
29
31
|
axis: yAxis,
|
|
@@ -1,18 +1,19 @@
|
|
|
1
|
-
const axisExtremumCallback = (acc, chartType, axis, getters,
|
|
1
|
+
const axisExtremumCallback = (acc, chartType, axis, getters, axisIndex, formattedSeries, getFilters) => {
|
|
2
2
|
const getter = getters[chartType];
|
|
3
3
|
const series = formattedSeries[chartType]?.series ?? {};
|
|
4
4
|
const [minChartTypeData, maxChartTypeData] = getter?.({
|
|
5
5
|
series,
|
|
6
6
|
axis,
|
|
7
|
-
|
|
7
|
+
axisIndex,
|
|
8
|
+
isDefaultAxis: axisIndex === 0,
|
|
8
9
|
getFilters
|
|
9
10
|
}) ?? [Infinity, -Infinity];
|
|
10
11
|
const [minData, maxData] = acc;
|
|
11
12
|
return [Math.min(minChartTypeData, minData), Math.max(maxChartTypeData, maxData)];
|
|
12
13
|
};
|
|
13
|
-
export const getAxisExtremum = (axis, getters,
|
|
14
|
+
export const getAxisExtremum = (axis, getters, axisIndex, formattedSeries, getFilters) => {
|
|
14
15
|
const charTypes = Object.keys(getters);
|
|
15
|
-
const extremums = charTypes.reduce((acc, charType) => axisExtremumCallback(acc, charType, axis, getters,
|
|
16
|
+
const extremums = charTypes.reduce((acc, charType) => axisExtremumCallback(acc, charType, axis, getters, axisIndex, formattedSeries, getFilters), [Infinity, -Infinity]);
|
|
16
17
|
if (Number.isNaN(extremums[0]) || Number.isNaN(extremums[1])) {
|
|
17
18
|
return [Infinity, -Infinity];
|
|
18
19
|
}
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
import { computeValue } from "./computeValue.js";
|
|
2
1
|
export * from "./CartesianProvider.js";
|
|
3
2
|
export * from "./CartesianContext.js";
|
|
4
3
|
export * from "./useCartesianContext.js";
|
|
5
|
-
export * from "./Cartesian.types.js";
|
|
6
|
-
const cartesianProviderUtils = {
|
|
7
|
-
computeValue
|
|
8
|
-
};
|
|
9
|
-
export { cartesianProviderUtils };
|
|
4
|
+
export * from "./Cartesian.types.js";
|
|
@@ -5,7 +5,9 @@ export const PluginContext = /*#__PURE__*/React.createContext({
|
|
|
5
5
|
colorProcessors: {},
|
|
6
6
|
seriesFormatters: {},
|
|
7
7
|
xExtremumGetters: {},
|
|
8
|
-
yExtremumGetters: {}
|
|
8
|
+
yExtremumGetters: {},
|
|
9
|
+
rotationExtremumGetters: {},
|
|
10
|
+
radiusExtremumGetters: {}
|
|
9
11
|
}
|
|
10
12
|
});
|
|
11
13
|
if (process.env.NODE_ENV !== 'production') {
|
|
@@ -7,4 +7,6 @@ export * from "./ExtremumGetter.types.js";
|
|
|
7
7
|
export * from "./useColorProcessor.js";
|
|
8
8
|
export * from "./useSeriesFormatter.js";
|
|
9
9
|
export * from "./useXExtremumGetter.js";
|
|
10
|
-
export * from "./useYExtremumGetter.js";
|
|
10
|
+
export * from "./useYExtremumGetter.js";
|
|
11
|
+
export * from "./useRadiusExtremumGetter.js";
|
|
12
|
+
export * from "./useRotationExtremumGetter.js";
|
|
@@ -9,6 +9,8 @@ export function mergePlugins(plugins) {
|
|
|
9
9
|
const colorProcessors = {};
|
|
10
10
|
const xExtremumGetters = {};
|
|
11
11
|
const yExtremumGetters = {};
|
|
12
|
+
const rotationExtremumGetters = {};
|
|
13
|
+
const radiusExtremumGetters = {};
|
|
12
14
|
for (let i = 0; i < defaultizedPlugins.length; i += 1) {
|
|
13
15
|
const plugin = defaultizedPlugins[i];
|
|
14
16
|
const seriesType = plugin.seriesType;
|
|
@@ -20,11 +22,19 @@ export function mergePlugins(plugins) {
|
|
|
20
22
|
if (plugin.yExtremumGetter) {
|
|
21
23
|
yExtremumGetters[seriesType] = plugin.yExtremumGetter;
|
|
22
24
|
}
|
|
25
|
+
if (plugin.rotationExtremumGetter) {
|
|
26
|
+
rotationExtremumGetters[seriesType] = plugin.rotationExtremumGetter;
|
|
27
|
+
}
|
|
28
|
+
if (plugin.radiusExtremumGetter) {
|
|
29
|
+
radiusExtremumGetters[seriesType] = plugin.radiusExtremumGetter;
|
|
30
|
+
}
|
|
23
31
|
}
|
|
24
32
|
return {
|
|
25
33
|
seriesFormatters,
|
|
26
34
|
colorProcessors,
|
|
27
35
|
xExtremumGetters,
|
|
28
|
-
yExtremumGetters
|
|
36
|
+
yExtremumGetters,
|
|
37
|
+
rotationExtremumGetters,
|
|
38
|
+
radiusExtremumGetters
|
|
29
39
|
};
|
|
30
40
|
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { PluginContext } from "./PluginContext.js";
|
|
5
|
+
export function useRadiusExtremumGetter(seriesType) {
|
|
6
|
+
const {
|
|
7
|
+
isInitialized,
|
|
8
|
+
data
|
|
9
|
+
} = React.useContext(PluginContext);
|
|
10
|
+
if (!isInitialized) {
|
|
11
|
+
throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
|
|
12
|
+
}
|
|
13
|
+
if (!seriesType) {
|
|
14
|
+
return data.radiusExtremumGetters;
|
|
15
|
+
}
|
|
16
|
+
return data.radiusExtremumGetters[seriesType];
|
|
17
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { PluginContext } from "./PluginContext.js";
|
|
5
|
+
export function useRotationExtremumGetter(seriesType) {
|
|
6
|
+
const {
|
|
7
|
+
isInitialized,
|
|
8
|
+
data
|
|
9
|
+
} = React.useContext(PluginContext);
|
|
10
|
+
if (!isInitialized) {
|
|
11
|
+
throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
|
|
12
|
+
}
|
|
13
|
+
if (!seriesType) {
|
|
14
|
+
return data.rotationExtremumGetters;
|
|
15
|
+
}
|
|
16
|
+
return data.rotationExtremumGetters[seriesType];
|
|
17
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export const PolarContext = /*#__PURE__*/React.createContext({
|
|
3
|
+
isInitialized: false,
|
|
4
|
+
data: {
|
|
5
|
+
rotationAxis: {},
|
|
6
|
+
radiusAxis: {},
|
|
7
|
+
rotationAxisIds: [],
|
|
8
|
+
radiusAxisIds: []
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
12
|
+
PolarContext.displayName = 'PolarContext';
|
|
13
|
+
}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { computeAxisValue } from "../../internals/computeAxisValue.js";
|
|
5
|
+
import { useDrawingArea } from "../../hooks/useDrawingArea.js";
|
|
6
|
+
import { useSeries } from "../../hooks/useSeries.js";
|
|
7
|
+
import { PolarContext } from "./PolarContext.js";
|
|
8
|
+
import { useRadiusExtremumGetter } from "../PluginProvider/useRadiusExtremumGetter.js";
|
|
9
|
+
import { useRotationExtremumGetter } from "../PluginProvider/useRotationExtremumGetter.js";
|
|
10
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
|
+
function PolarProvider(props) {
|
|
12
|
+
const {
|
|
13
|
+
rotationAxis,
|
|
14
|
+
radiusAxis,
|
|
15
|
+
children
|
|
16
|
+
} = props;
|
|
17
|
+
const formattedSeries = useSeries();
|
|
18
|
+
const drawingArea = useDrawingArea();
|
|
19
|
+
const rotationExtremumGetters = useRotationExtremumGetter();
|
|
20
|
+
const radiusExtremumGetters = useRadiusExtremumGetter();
|
|
21
|
+
const rotationValues = React.useMemo(() => computeAxisValue({
|
|
22
|
+
drawingArea,
|
|
23
|
+
formattedSeries,
|
|
24
|
+
axis: rotationAxis,
|
|
25
|
+
extremumGetters: rotationExtremumGetters,
|
|
26
|
+
axisDirection: 'rotation'
|
|
27
|
+
}), [drawingArea, formattedSeries, rotationAxis, rotationExtremumGetters]);
|
|
28
|
+
const radiusValues = React.useMemo(() => computeAxisValue({
|
|
29
|
+
drawingArea,
|
|
30
|
+
formattedSeries,
|
|
31
|
+
axis: radiusAxis,
|
|
32
|
+
extremumGetters: radiusExtremumGetters,
|
|
33
|
+
axisDirection: 'radius'
|
|
34
|
+
}), [drawingArea, formattedSeries, radiusAxis, radiusExtremumGetters]);
|
|
35
|
+
const value = React.useMemo(() => ({
|
|
36
|
+
isInitialized: true,
|
|
37
|
+
data: {
|
|
38
|
+
rotationAxis: rotationValues.axis,
|
|
39
|
+
radiusAxis: radiusValues.axis,
|
|
40
|
+
rotationAxisIds: rotationValues.axisIds,
|
|
41
|
+
radiusAxisIds: radiusValues.axisIds
|
|
42
|
+
}
|
|
43
|
+
}), [rotationValues, radiusValues]);
|
|
44
|
+
return /*#__PURE__*/_jsx(PolarContext.Provider, {
|
|
45
|
+
value: value,
|
|
46
|
+
children: children
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
export { PolarProvider };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
const axisExtremumCallback = (acc, chartType, axis, getters, axisIndex, formattedSeries) => {
|
|
2
|
+
const getter = getters[chartType];
|
|
3
|
+
const series = formattedSeries[chartType]?.series ?? {};
|
|
4
|
+
const [minChartTypeData, maxChartTypeData] = getter?.({
|
|
5
|
+
series,
|
|
6
|
+
axis,
|
|
7
|
+
axisIndex,
|
|
8
|
+
isDefaultAxis: axisIndex === 0
|
|
9
|
+
}) ?? [Infinity, -Infinity];
|
|
10
|
+
const [minData, maxData] = acc;
|
|
11
|
+
return [Math.min(minChartTypeData, minData), Math.max(maxChartTypeData, maxData)];
|
|
12
|
+
};
|
|
13
|
+
export const getAxisExtremum = (axis, getters, axisIndex, formattedSeries) => {
|
|
14
|
+
const charTypes = Object.keys(getters);
|
|
15
|
+
const extremums = charTypes.reduce((acc, charType) => axisExtremumCallback(acc, charType, axis, getters, axisIndex, formattedSeries), [Infinity, -Infinity]);
|
|
16
|
+
if (Number.isNaN(extremums[0]) || Number.isNaN(extremums[1])) {
|
|
17
|
+
return [Infinity, -Infinity];
|
|
18
|
+
}
|
|
19
|
+
return extremums;
|
|
20
|
+
};
|
|
File without changes
|
package/modern/hooks/useAxis.js
CHANGED
package/modern/hooks/useScale.js
CHANGED
package/modern/hooks/useTicks.js
CHANGED
package/modern/index.js
CHANGED
|
@@ -1,15 +1,29 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import { scaleBand, scalePoint, scaleTime } from '@mui/x-charts-vendor/d3-scale';
|
|
3
|
-
import { isBandScaleConfig, isPointScaleConfig } from "
|
|
4
|
-
import { getColorScale, getOrdinalColorScale } from "
|
|
5
|
-
import { getTickNumber } from "
|
|
6
|
-
import { getScale } from "
|
|
7
|
-
import { zoomScaleRange } from "
|
|
8
|
-
import { getAxisExtremum } from "
|
|
9
|
-
|
|
3
|
+
import { isBandScaleConfig, isPointScaleConfig } from "../models/axis.js";
|
|
4
|
+
import { getColorScale, getOrdinalColorScale } from "./colorScale.js";
|
|
5
|
+
import { getTickNumber } from "../hooks/useTicks.js";
|
|
6
|
+
import { getScale } from "./getScale.js";
|
|
7
|
+
import { zoomScaleRange } from "../context/CartesianProvider/zoom.js";
|
|
8
|
+
import { getAxisExtremum } from "../context/CartesianProvider/getAxisExtremum.js";
|
|
9
|
+
function getRange(drawingArea, axisDirection, axis) {
|
|
10
|
+
if (axisDirection === 'rotation') {
|
|
11
|
+
const {
|
|
12
|
+
startAngle = 0,
|
|
13
|
+
endAngle = startAngle + 360
|
|
14
|
+
} = axis;
|
|
15
|
+
return axis.reverse ? [Math.PI * startAngle / 180, Math.PI * endAngle / 180] : [Math.PI * endAngle / 180, Math.PI * startAngle / 180];
|
|
16
|
+
}
|
|
17
|
+
if (axisDirection === 'radius') {
|
|
18
|
+
const {
|
|
19
|
+
minRadius = 0,
|
|
20
|
+
maxRadius = Math.min(drawingArea.width, drawingArea.height) / 2
|
|
21
|
+
} = axis;
|
|
22
|
+
return [minRadius, maxRadius];
|
|
23
|
+
}
|
|
10
24
|
const range = axisDirection === 'x' ? [drawingArea.left, drawingArea.left + drawingArea.width] : [drawingArea.top + drawingArea.height, drawingArea.top];
|
|
11
|
-
return
|
|
12
|
-
}
|
|
25
|
+
return axis.reverse ? [range[1], range[0]] : range;
|
|
26
|
+
}
|
|
13
27
|
const isDateData = data => data?.[0] instanceof Date;
|
|
14
28
|
function createDateFormatter(axis, range) {
|
|
15
29
|
const timeScale = scaleTime(axis.data, range);
|
|
@@ -19,7 +33,7 @@ function createDateFormatter(axis, range) {
|
|
|
19
33
|
}
|
|
20
34
|
const DEFAULT_CATEGORY_GAP_RATIO = 0.2;
|
|
21
35
|
const DEFAULT_BAR_GAP_RATIO = 0.1;
|
|
22
|
-
export function
|
|
36
|
+
export function computeAxisValue({
|
|
23
37
|
drawingArea,
|
|
24
38
|
formattedSeries,
|
|
25
39
|
axis: allAxis,
|
|
@@ -32,21 +46,20 @@ export function computeValue({
|
|
|
32
46
|
const completeAxis = {};
|
|
33
47
|
allAxis.forEach((eachAxis, axisIndex) => {
|
|
34
48
|
const axis = eachAxis;
|
|
35
|
-
const isDefaultAxis = axisIndex === 0;
|
|
36
49
|
const zoomOption = zoomOptions?.[axis.id];
|
|
37
50
|
const zoom = zoomData?.find(({
|
|
38
51
|
axisId
|
|
39
52
|
}) => axisId === axis.id);
|
|
40
53
|
const zoomRange = zoom ? [zoom.start, zoom.end] : [0, 100];
|
|
41
|
-
const range = getRange(drawingArea, axisDirection, axis
|
|
42
|
-
const [minData, maxData] = getAxisExtremum(axis, extremumGetters,
|
|
54
|
+
const range = getRange(drawingArea, axisDirection, axis);
|
|
55
|
+
const [minData, maxData] = getAxisExtremum(axis, extremumGetters, axisIndex, formattedSeries, zoom === undefined && !zoomOption ? getFilters : undefined // Do not apply filtering if zoom is already defined.
|
|
43
56
|
);
|
|
44
57
|
const data = axis.data ?? [];
|
|
45
58
|
if (isBandScaleConfig(axis)) {
|
|
46
59
|
const categoryGapRatio = axis.categoryGapRatio ?? DEFAULT_CATEGORY_GAP_RATIO;
|
|
47
60
|
const barGapRatio = axis.barGapRatio ?? DEFAULT_BAR_GAP_RATIO;
|
|
48
61
|
// Reverse range because ordinal scales are presented from top to bottom on y-axis
|
|
49
|
-
const scaleRange = axisDirection === '
|
|
62
|
+
const scaleRange = axisDirection === 'y' ? [range[1], range[0]] : range;
|
|
50
63
|
const zoomedRange = zoomScaleRange(scaleRange, zoomRange);
|
|
51
64
|
completeAxis[axis.id] = _extends({
|
|
52
65
|
categoryGapRatio,
|
|
@@ -65,7 +78,7 @@ export function computeValue({
|
|
|
65
78
|
}
|
|
66
79
|
}
|
|
67
80
|
if (isPointScaleConfig(axis)) {
|
|
68
|
-
const scaleRange = axisDirection === '
|
|
81
|
+
const scaleRange = axisDirection === 'y' ? [...range].reverse() : range;
|
|
69
82
|
const zoomedRange = zoomScaleRange(scaleRange, zoomRange);
|
|
70
83
|
completeAxis[axis.id] = _extends({}, axis, {
|
|
71
84
|
data,
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
'use client';
|
|
2
3
|
|
|
3
4
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
5
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
@@ -152,6 +153,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
|
|
|
152
153
|
itemMarkWidth: _propTypes.default.number,
|
|
153
154
|
labelStyle: _propTypes.default.object,
|
|
154
155
|
markGap: _propTypes.default.number,
|
|
156
|
+
onItemClick: _propTypes.default.func,
|
|
155
157
|
padding: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.shape({
|
|
156
158
|
bottom: _propTypes.default.number,
|
|
157
159
|
left: _propTypes.default.number,
|
|
@@ -201,6 +203,16 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
|
|
|
201
203
|
* @param {BarItemIdentifier} barItemIdentifier The bar item identifier.
|
|
202
204
|
*/
|
|
203
205
|
onItemClick: _propTypes.default.func,
|
|
206
|
+
/**
|
|
207
|
+
* The chart will try to wait for the parent container to resolve its size
|
|
208
|
+
* before it renders for the first time.
|
|
209
|
+
*
|
|
210
|
+
* This can be useful in some scenarios where the chart appear to grow after
|
|
211
|
+
* the first render, like when used inside a grid.
|
|
212
|
+
*
|
|
213
|
+
* @default false
|
|
214
|
+
*/
|
|
215
|
+
resolveSizeBeforeRender: _propTypes.default.bool,
|
|
204
216
|
/**
|
|
205
217
|
* Indicate which axis to display the right of the charts.
|
|
206
218
|
* Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
|
package/node/BarChart/BarPlot.js
CHANGED
package/node/BarChart/legend.js
CHANGED