@patternfly/react-charts
Version:
This library provides a set of React chart components for use with the PatternFly reference implementation.
58 lines • 3.54 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.ChartBulletPrimarySegmentedMeasure = 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_bar_1 = require("victory-bar");
const chart_bullet_data_1 = require("./utils/chart-bullet-data");
const ChartBar_1 = require("../ChartBar/ChartBar");
const ChartContainer_1 = require("../ChartContainer/ChartContainer");
const ChartStyles_1 = require("../ChartTheme/ChartStyles");
const ChartTooltip_1 = require("../ChartTooltip/ChartTooltip");
const chart_theme_types_1 = require("../ChartUtils/chart-theme-types");
const ChartBulletPrimarySegmentedMeasure = ({ allowTooltip = true, ariaDesc, ariaTitle, barWidth = ChartStyles_1.ChartBulletStyles.primarySegmentedMeasureWidth, constrainToVisibleArea = false, data, domain, horizontal = true, invert = false, labels, measureComponent = (0, jsx_runtime_1.jsx)(ChartBar_1.ChartBar, {}), padding, standalone = true, themeColor, y, y0,
// destructure last
theme = (0, chart_theme_types_1.getBulletPrimarySegmentedMeasureTheme)(themeColor), negativeMeasureTheme = (0, chart_theme_types_1.getBulletPrimaryNegativeMeasureTheme)(themeColor), height = theme.group.height, width = theme.group.width, labelComponent = (0, jsx_runtime_1.jsx)(ChartTooltip_1.ChartTooltip, {}) }) => {
const computedData = (0, chart_bullet_data_1.getPrimarySegmentedMeasureData)({
data,
invert,
negativeMeasureTheme,
theme,
y,
y0
});
// Label component
//
// Note: SVG height and width are provided by ChartBullet as a workaround to support constrainToVisibleArea
const tooltip = (0, react_1.cloneElement)(labelComponent, Object.assign({ constrainToVisibleArea, dx: () => {
if (horizontal) {
return 0;
}
const result = typeof barWidth === 'function' ? barWidth(data) : barWidth;
return result / 2;
}, dy: () => {
if (!horizontal) {
return 0;
}
const result = typeof barWidth === 'function' ? barWidth(data) : barWidth;
return -(result / 2);
}, orientation: 'top' }, labelComponent.props));
const measure = computedData.map((dataPoint, index) => (0, react_1.cloneElement)(measureComponent, Object.assign({ barWidth, data: [Object.assign({}, dataPoint)], domain,
height,
horizontal, key: `pf-chart-bullet-primary-segmented-measure-${index}`, labelComponent: allowTooltip ? tooltip : undefined, labels,
padding, standalone: false, style: {
data: {
fill: dataPoint._color
}
}, theme,
themeColor,
width }, measureComponent.props)));
return standalone ? ((0, jsx_runtime_1.jsx)(ChartContainer_1.ChartContainer, { desc: ariaDesc, height: height, title: ariaTitle, width: width, children: measure })) : ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: measure }));
};
exports.ChartBulletPrimarySegmentedMeasure = ChartBulletPrimarySegmentedMeasure;
exports.ChartBulletPrimarySegmentedMeasure.displayName = 'ChartBulletPrimarySegmentedMeasure';
// Note: VictoryBar.role must be hoisted
(0, hoist_non_react_statics_1.default)(exports.ChartBulletPrimarySegmentedMeasure, victory_bar_1.VictoryBar);
//# sourceMappingURL=ChartBulletPrimarySegmentedMeasure.js.map