161 lines
4.9 KiB
JavaScript
161 lines
4.9 KiB
JavaScript
"use strict";
|
|
'use client';
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.useBarChartProps = void 0;
|
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
var React = _interopRequireWildcard(require("react"));
|
|
var _useId = _interopRequireDefault(require("@mui/utils/useId"));
|
|
var _constants = require("../constants");
|
|
var _BarChart = require("./BarChart.plugins");
|
|
const _excluded = ["xAxis", "yAxis", "series", "width", "height", "margin", "colors", "dataset", "sx", "axisHighlight", "grid", "children", "slots", "slotProps", "skipAnimation", "loading", "layout", "onItemClick", "highlightedItem", "onHighlightChange", "borderRadius", "barLabel", "className", "hideLegend", "showToolbar"];
|
|
/**
|
|
* A helper function that extracts BarChartProps from the input props
|
|
* and returns an object with props for the children components of BarChart.
|
|
*
|
|
* @param props The input props for BarChart
|
|
* @returns An object with props for the children components of BarChart
|
|
*/
|
|
const useBarChartProps = props => {
|
|
const {
|
|
xAxis,
|
|
yAxis,
|
|
series,
|
|
width,
|
|
height,
|
|
margin,
|
|
colors,
|
|
dataset,
|
|
sx,
|
|
axisHighlight,
|
|
grid,
|
|
children,
|
|
slots,
|
|
slotProps,
|
|
skipAnimation,
|
|
loading,
|
|
layout,
|
|
onItemClick,
|
|
highlightedItem,
|
|
onHighlightChange,
|
|
borderRadius,
|
|
barLabel,
|
|
className
|
|
} = props,
|
|
rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
|
|
const id = (0, _useId.default)();
|
|
const clipPathId = `${id}-clip-path`;
|
|
const hasHorizontalSeries = layout === 'horizontal' || layout === undefined && series.some(item => item.layout === 'horizontal');
|
|
const defaultBandXAxis = React.useMemo(() => [{
|
|
id: _constants.DEFAULT_X_AXIS_KEY,
|
|
scaleType: 'band',
|
|
data: Array.from({
|
|
length: Math.max(...series.map(s => (s.data ?? dataset ?? []).length))
|
|
}, (_, index) => index)
|
|
}], [dataset, series]);
|
|
const defaultBandYAxis = React.useMemo(() => [{
|
|
id: _constants.DEFAULT_Y_AXIS_KEY,
|
|
scaleType: 'band',
|
|
data: Array.from({
|
|
length: Math.max(...series.map(s => (s.data ?? dataset ?? []).length))
|
|
}, (_, index) => index)
|
|
}], [dataset, series]);
|
|
const seriesWithDefault = React.useMemo(() => series.map(s => (0, _extends2.default)({
|
|
type: 'bar'
|
|
}, s, {
|
|
layout: hasHorizontalSeries ? 'horizontal' : 'vertical'
|
|
})), [hasHorizontalSeries, series]);
|
|
const defaultXAxis = hasHorizontalSeries ? undefined : defaultBandXAxis;
|
|
const processedXAxis = React.useMemo(() => {
|
|
if (!xAxis) {
|
|
return defaultXAxis;
|
|
}
|
|
return hasHorizontalSeries ? xAxis : xAxis.map(axis => (0, _extends2.default)({
|
|
scaleType: 'band'
|
|
}, axis));
|
|
}, [defaultXAxis, hasHorizontalSeries, xAxis]);
|
|
const defaultYAxis = hasHorizontalSeries ? defaultBandYAxis : undefined;
|
|
const processedYAxis = React.useMemo(() => {
|
|
if (!yAxis) {
|
|
return defaultYAxis;
|
|
}
|
|
return hasHorizontalSeries ? yAxis.map(axis => (0, _extends2.default)({
|
|
scaleType: 'band'
|
|
}, axis)) : yAxis;
|
|
}, [defaultYAxis, hasHorizontalSeries, yAxis]);
|
|
const chartContainerProps = (0, _extends2.default)({}, rest, {
|
|
series: seriesWithDefault,
|
|
width,
|
|
height,
|
|
margin,
|
|
colors,
|
|
dataset,
|
|
xAxis: processedXAxis,
|
|
yAxis: processedYAxis,
|
|
highlightedItem,
|
|
onHighlightChange,
|
|
disableAxisListener: slotProps?.tooltip?.trigger !== 'axis' && axisHighlight?.x === 'none' && axisHighlight?.y === 'none',
|
|
className,
|
|
skipAnimation,
|
|
plugins: _BarChart.BAR_CHART_PLUGINS
|
|
});
|
|
const barPlotProps = {
|
|
onItemClick,
|
|
slots,
|
|
slotProps,
|
|
borderRadius,
|
|
barLabel
|
|
};
|
|
const gridProps = {
|
|
vertical: grid?.vertical,
|
|
horizontal: grid?.horizontal
|
|
};
|
|
const clipPathGroupProps = {
|
|
clipPath: `url(#${clipPathId})`
|
|
};
|
|
const clipPathProps = {
|
|
id: clipPathId
|
|
};
|
|
const overlayProps = {
|
|
slots,
|
|
slotProps,
|
|
loading
|
|
};
|
|
const chartsAxisProps = {
|
|
slots,
|
|
slotProps
|
|
};
|
|
const axisHighlightProps = (0, _extends2.default)({}, hasHorizontalSeries ? {
|
|
y: 'band'
|
|
} : {
|
|
x: 'band'
|
|
}, axisHighlight);
|
|
const legendProps = {
|
|
slots,
|
|
slotProps
|
|
};
|
|
const chartsWrapperProps = {
|
|
sx,
|
|
legendPosition: props.slotProps?.legend?.position,
|
|
legendDirection: props.slotProps?.legend?.direction
|
|
};
|
|
return {
|
|
chartsWrapperProps,
|
|
chartContainerProps,
|
|
barPlotProps,
|
|
gridProps,
|
|
clipPathProps,
|
|
clipPathGroupProps,
|
|
overlayProps,
|
|
chartsAxisProps,
|
|
axisHighlightProps,
|
|
legendProps,
|
|
children
|
|
};
|
|
};
|
|
exports.useBarChartProps = useBarChartProps; |