victory-bar/lib/victory-bar.js

Bar Component for Victory

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.VictoryBar = void 0;
var _react = _interopRequireDefault(require("react"));
var _helperMethods = require("./helper-methods");
var _bar = require("./bar");
var _victoryCore = require("victory-core");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
const fallbackProps = {
  width: 450,
  height: 300,
  padding: 50
};
const defaultData = [{
  x: 1,
  y: 1
}, {
  x: 2,
  y: 2
}, {
  x: 3,
  y: 3
}, {
  x: 4,
  y: 4
}];

// eslint-disable-next-line @typescript-eslint/no-empty-object-type

/**
 * Draw SVG bar charts with React. VictoryBar is a composable component, so it doesn"t include axes
 * Check out VictoryChart for complete bar charts and more.
 */
class VictoryBarBase extends _react.default.Component {
  static animationWhitelist = ["data", "domain", "height", "padding", "style", "width"];
  static displayName = "VictoryBar";
  static role = "bar";
  static defaultTransitions = {
    onLoad: {
      duration: 2000,
      before: () => ({
        _y: 0,
        _y1: 0,
        _y0: 0
      }),
      after: datum => ({
        _y: datum._y,
        _y1: datum._y1,
        _y0: datum._y0
      })
    },
    onExit: {
      duration: 500,
      before: () => ({
        _y: 0,
        yOffset: 0
      })
    },
    onEnter: {
      duration: 500,
      before: () => ({
        _y: 0,
        _y1: 0,
        _y0: 0
      }),
      after: datum => ({
        _y: datum._y,
        _y1: datum._y1,
        _y0: datum._y0
      })
    }
  };
  static defaultProps = {
    containerComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.VictoryContainer, null),
    data: defaultData,
    dataComponent: /*#__PURE__*/_react.default.createElement(_bar.Bar, null),
    groupComponent: /*#__PURE__*/_react.default.createElement("g", {
      role: "presentation"
    }),
    labelComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.VictoryLabel, null),
    samples: 50,
    sortOrder: "ascending",
    standalone: true,
    theme: _victoryCore.VictoryTheme.grayscale
  };
  static getDomain = _victoryCore.Domain.getDomainWithZero;
  static getData = _victoryCore.Data.getData;
  static getBaseProps(props) {
    return (0, _helperMethods.getBaseProps)(props, fallbackProps);
  }
  static expectedComponents = ["dataComponent", "labelComponent", "groupComponent", "containerComponent"];
  // passed to addEvents.renderData to prevent data props with undefined _x or _y from excluding data from render.
  // used when inside of VictoryZoomContainer
  static shouldRenderDatum = () => true;
  // Overridden in native versions
  shouldAnimate() {
    return !!this.props.animate;
  }
  render() {
    const {
      animationWhitelist,
      role
    } = VictoryBar;
    const props = _victoryCore.Helpers.modifyProps(this.props, fallbackProps, role);
    if (this.shouldAnimate()) {
      return this.animateComponent(props, animationWhitelist);
    }
    let children;
    // when inside a zoom container (the only place VictoryClipContainer is used), all data
    // should be renderable so bars won't dissappear before they've fully exited the container's bounds
    // see https://github.com/FormidableLabs/victory/pull/2970
    if (props.groupComponent?.type === _victoryCore.VictoryClipContainer) {
      children = this.renderData(props, VictoryBarBase.shouldRenderDatum);
    } else {
      children = this.renderData(props);
    }
    const component = props.standalone ? this.renderContainer(props.containerComponent, children) : children;
    return _victoryCore.UserProps.withSafeUserProps(component, props);
  }
}
const VictoryBar = exports.VictoryBar = (0, _victoryCore.addEvents)(VictoryBarBase);