@data-ui/xy-chart/esm/axis/XAxis.js

A package of charts with standard x- and y- axes. https://williaster.github.io/data-ui

function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }

import React from 'react';
import PropTypes from 'prop-types';
import { AxisBottom, AxisTop } from '@vx/axis';
import { axisStylesShape, tickStylesShape } from '../utils/propShapes';
var propTypes = {
  axisStyles: axisStylesShape,
  hideZero: PropTypes.bool,
  label: PropTypes.string,
  labelOffset: PropTypes.number,
  labelProps: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])),
  numTicks: PropTypes.number,
  orientation: PropTypes.oneOf(['bottom', 'top']),
  rangePadding: PropTypes.number,
  tickStyles: tickStylesShape,
  tickComponent: PropTypes.func,
  tickLabelProps: PropTypes.func,
  tickFormat: PropTypes.func,
  tickValues: PropTypes.arrayOf( // number or date/moment object
  PropTypes.oneOfType([PropTypes.number, PropTypes.object, PropTypes.string])),
  // probably injected by parent
  innerHeight: PropTypes.number,
  scale: PropTypes.func
};
var defaultProps = {
  axisStyles: {},
  hideZero: false,
  innerHeight: null,
  label: null,
  labelOffset: 14,
  labelProps: null,
  numTicks: null,
  orientation: 'bottom',
  rangePadding: null,
  scale: null,
  tickComponent: null,
  tickFormat: null,
  tickLabelProps: null,
  tickStyles: {},
  tickValues: undefined
};

var XAxis =
/*#__PURE__*/
function (_React$PureComponent) {
  _inheritsLoose(XAxis, _React$PureComponent);

  function XAxis() {
    return _React$PureComponent.apply(this, arguments) || this;
  }

  var _proto = XAxis.prototype;

  _proto.render = function render() {
    var _this$props = this.props,
        axisStyles = _this$props.axisStyles,
        innerHeight = _this$props.innerHeight,
        hideZero = _this$props.hideZero,
        label = _this$props.label,
        labelOffset = _this$props.labelOffset,
        labelProps = _this$props.labelProps,
        numTicks = _this$props.numTicks,
        orientation = _this$props.orientation,
        rangePadding = _this$props.rangePadding,
        scale = _this$props.scale,
        tickComponent = _this$props.tickComponent,
        tickFormat = _this$props.tickFormat,
        passedTickLabelProps = _this$props.tickLabelProps,
        tickStyles = _this$props.tickStyles,
        tickValues = _this$props.tickValues;
    if (!scale || !innerHeight) return null;
    var Axis = orientation === 'bottom' ? AxisBottom : AxisTop;
    var tickLabelProps = passedTickLabelProps;

    if (!tickLabelProps) {
      tickLabelProps = tickStyles.label && tickStyles.label[orientation] ? function () {
        return tickStyles.label[orientation];
      } : undefined;
    }

    return React.createElement(Axis, {
      top: orientation === 'bottom' ? innerHeight : 0,
      left: 0,
      rangePadding: rangePadding,
      hideTicks: numTicks === 0,
      hideZero: hideZero,
      label: label,
      labelOffset: labelOffset,
      labelProps: labelProps || (axisStyles.label || {})[orientation],
      numTicks: numTicks,
      scale: scale,
      stroke: axisStyles.stroke,
      strokeWidth: axisStyles.strokeWidth,
      tickComponent: tickComponent,
      tickFormat: tickFormat,
      tickLabelProps: tickLabelProps,
      tickLength: tickStyles.tickLength,
      tickStroke: tickStyles.stroke,
      tickValues: tickValues
    });
  };

  return XAxis;
}(React.PureComponent);

export { XAxis as default };
XAxis.propTypes = propTypes;
XAxis.defaultProps = defaultProps;
XAxis.displayName = 'XAxis';