@mui/x-charts/BarChart/IndividualBarPlot.js

The community edition of MUI X Charts components.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.IndividualBarPlot = IndividualBarPlot;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));
var _BarElement = require("./BarElement");
var _barClasses = require("./barClasses");
var _BarClipPath = require("./BarClipPath");
var _jsxRuntime = require("react/jsx-runtime");
const _excluded = ["completedData", "masksData", "borderRadius", "onItemClick", "skipAnimation"];
function IndividualBarPlot(_ref) {
  let {
      completedData,
      masksData,
      borderRadius,
      onItemClick,
      skipAnimation
    } = _ref,
    other = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
  const classes = (0, _barClasses.useUtilityClasses)();
  const withoutBorderRadius = !borderRadius || borderRadius <= 0;
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
    children: [!withoutBorderRadius && masksData.map(({
      id,
      x,
      y,
      xOrigin,
      yOrigin,
      width,
      height,
      hasPositive,
      hasNegative,
      layout
    }) => {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarClipPath.BarClipPath, {
        maskId: id,
        borderRadius: borderRadius,
        hasNegative: hasNegative,
        hasPositive: hasPositive,
        layout: layout,
        x: x,
        y: y,
        xOrigin: xOrigin,
        yOrigin: yOrigin,
        width: width,
        height: height,
        skipAnimation: skipAnimation ?? false
      }, id);
    }), completedData.map(({
      seriesId,
      layout,
      xOrigin,
      yOrigin,
      data
    }) => {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
        "data-series": seriesId,
        className: classes.series,
        children: data.map(({
          dataIndex,
          color,
          maskId,
          x,
          y,
          width,
          height
        }) => {
          const barElement = /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarElement.BarElement, (0, _extends2.default)({
            id: seriesId,
            dataIndex: dataIndex,
            color: color,
            skipAnimation: skipAnimation ?? false,
            layout: layout ?? 'vertical',
            x: x,
            xOrigin: xOrigin,
            y: y,
            yOrigin: yOrigin,
            width: width,
            height: height
          }, other, {
            onClick: onItemClick && (event => {
              onItemClick(event, {
                type: 'bar',
                seriesId,
                dataIndex
              });
            })
          }), dataIndex);
          if (withoutBorderRadius) {
            return barElement;
          }
          return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
            clipPath: `url(#${maskId})`,
            children: barElement
          }, dataIndex);
        })
      }, seriesId);
    })]
  });
}