@ansible/react-json-chart-builder/dist/esm/components/Renderers/createChart.js

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

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 _a;
import React from 'react';
import { ChartBar, ChartLine, ChartArea, ChartScatter } from '@patternfly/react-charts/victory';
import { ChartTooltipComponentFunctionNames, ChartType } from '../types';
import { snakeToSentence } from '../Common/helpers';
import { ChartLabelFormatFunctionNames } from '../Functions';
var components = (_a = {},
    _a[ChartType.bar] = ChartBar,
    _a[ChartType.line] = ChartLine,
    _a[ChartType.area] = ChartArea,
    _a[ChartType.scatter] = 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 : 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 : ChartLabelFormatFunctionNames.default]
        : null;
    var DataComponentElement = chart.dataComponent
        ? functions.dataComponent[chart.dataComponent]
        : null;
    var props = __assign(__assign(__assign(__assign({}, chart.props), { labels: labelFnc, labelComponent: React.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.createElement(DataComponentElement, null)
    }));
    var getLabelName = function () { var _a; return chart.tooltip ? (_a = chart.tooltip.labelName) !== null && _a !== void 0 ? _a : snakeToSentence(chart.props.y) : ''; };
    return (React.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 })));
};
export default createChart;
//# sourceMappingURL=createChart.js.map