UNPKG

@ansible/react-json-chart-builder

Version:

A chart builder component in react, which uses JSON for schema.

67 lines 3.44 kB
"use strict"; var __assign = (this && this.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; var _a; Object.defineProperty(exports, "__esModule", { value: true }); var react_1 = __importDefault(require("react")); var victory_1 = require("@patternfly/react-charts/victory"); var types_1 = require("../types"); var helpers_1 = require("../Common/helpers"); var Functions_1 = require("../Functions"); var components = (_a = {}, _a[types_1.ChartType.bar] = victory_1.ChartBar, _a[types_1.ChartType.line] = victory_1.ChartLine, _a[types_1.ChartType.area] = victory_1.ChartArea, _a[types_1.ChartType.scatter] = victory_1.ChartScatter, _a); var getData = function (data, y, props) { var _a; if (y === void 0) { y = 'y'; } return data.hidden ? [(_a = {}, _a[y] = null, _a)] : data.serie.map(function (el) { return (__assign(__assign(__assign({}, el), { y: el[y] }), props)); }); }; var createChart = function (id, data, chartData) { var _a, _b, _c, _d, _e, _f; var charts = data.schema, functions = data.functions; var chart = charts.find(function (_a) { var i = _a.id; return i === id; }); var SelectedChart = components[chart.type]; var TooltipComponent = functions.tooltipComponent[(_b = (_a = chart.tooltip) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : types_1.ChartTooltipComponentFunctionNames.default]; var labelFnc = ((_c = chart.tooltip) === null || _c === void 0 ? void 0 : _c.standalone) ? functions.labelFormat[(_e = (_d = chart.tooltip) === null || _d === void 0 ? void 0 : _d.labelFormat) !== null && _e !== void 0 ? _e : Functions_1.ChartLabelFormatFunctionNames.default] : null; var DataComponentElement = chart.dataComponent ? functions.dataComponent[chart.dataComponent] : null; var props = __assign(__assign(__assign(__assign({}, chart.props), { labels: labelFnc, labelComponent: react_1.default.createElement(TooltipComponent, __assign({}, (_f = chart.tooltip) === null || _f === void 0 ? void 0 : _f.props, { dy: 0 })) }), (chart.onClick && { events: [ { target: 'data', eventHandlers: { onClick: functions.onClick[chart.onClick] } } ] })), (chart.dataComponent && { dataComponent: react_1.default.createElement(DataComponentElement, null) })); var getLabelName = function () { var _a; return chart.tooltip ? (_a = chart.tooltip.labelName) !== null && _a !== void 0 ? _a : (0, helpers_1.snakeToSentence)(chart.props.y) : ''; }; return (react_1.default.createElement(SelectedChart, __assign({}, props, { key: chartData.series[0].name, data: getData(chartData.series[0], props.y, __assign({ labelName: getLabelName() }, (!chart.tooltip && { ignored: 'true' }))), name: chart.name || chartData.series[0].name }))); }; exports.default = createChart; //# sourceMappingURL=createChart.js.map