@patternfly/react-charts
Version:
This library provides a set of React chart components for use with the PatternFly reference implementation.
34 lines • 2.77 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.ChartAxis = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const hoist_non_react_statics_1 = tslib_1.__importDefault(require("hoist-non-react-statics"));
const victory_axis_1 = require("victory-axis");
const ChartContainer_1 = require("../ChartContainer/ChartContainer");
const ChartLabel_1 = require("../ChartLabel/ChartLabel");
const chart_theme_1 = require("../ChartUtils/chart-theme");
const chart_theme_types_1 = require("../ChartUtils/chart-theme-types");
const ChartAxis = (_a) => {
var { axisLabelComponent = (0, jsx_runtime_1.jsx)(ChartLabel_1.ChartLabel, {}), containerComponent = (0, jsx_runtime_1.jsx)(ChartContainer_1.ChartContainer, {}), name, showGrid = false, themeColor, tickLabelComponent = (0, jsx_runtime_1.jsx)(ChartLabel_1.ChartLabel, {}),
// destructure last
theme = (0, chart_theme_1.getTheme)(themeColor) } = _a, rest = tslib_1.__rest(_a, ["axisLabelComponent", "containerComponent", "name", "showGrid", "themeColor", "tickLabelComponent", "theme"]);
const componentTheme = (0, chart_theme_1.getComponentTheme)(themeColor);
// Clone so users can override container props
const container = (0, react_1.cloneElement)(containerComponent, Object.assign({ theme }, containerComponent.props));
const getAxisLabelComponent = () => (0, react_1.cloneElement)(axisLabelComponent, Object.assign(Object.assign(Object.assign({}, (name && {
id: () => `${name}-${axisLabelComponent.type.displayName}`
})), axisLabelComponent.props), ((componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.label) && componentTheme.label) // override backgroundStyle
));
const getTickLabelComponent = () => (0, react_1.cloneElement)(tickLabelComponent, Object.assign(Object.assign(Object.assign({}, (name && {
id: (props) => `${name}-${tickLabelComponent.type.displayName}-${props.index}`
})), tickLabelComponent.props), ((componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.label) && componentTheme.label) // override backgroundStyle
));
// Note: containerComponent is required for theme
return ((0, jsx_runtime_1.jsx)(victory_axis_1.VictoryAxis, Object.assign({ axisLabelComponent: getAxisLabelComponent(), containerComponent: container, name: name, theme: showGrid ? (0, chart_theme_types_1.getAxisTheme)(themeColor) : theme, tickLabelComponent: getTickLabelComponent() }, rest)));
};
exports.ChartAxis = ChartAxis;
exports.ChartAxis.displayName = 'ChartAxis';
(0, hoist_non_react_statics_1.default)(exports.ChartAxis, victory_axis_1.VictoryAxis);
//# sourceMappingURL=ChartAxis.js.map