content: import _extends from "@babel/runtime/helpers/esm/extends";
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
  import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
  
  var _collapseStyles;
  
  import classNames from 'classnames';
  import css from 'dom-helpers/style';
  import React from 'react';
  import onEnd from 'dom-helpers/transition/end';
  import Transition, { EXITED, ENTERED, ENTERING, EXITING } from 'react-transition-group/Transition';
  import triggerBrowserReflow from './utils/triggerBrowserReflow';
  import createChainedFunction from './utils/createChainedFunction';
  var MARGINS = {
    height: ['marginTop', 'marginBottom'],
    width: ['marginLeft', 'marginRight']
  };
  
  function getDimensionValue(dimension, elem) {
    var offset = "offset" + dimension[0].toUpperCase() + dimension.slice(1);
    var value = elem[offset];
    var margins = MARGINS[dimension];
    return value + parseInt(css(elem, margins[0]), 10) + parseInt(css(elem, margins[1]), 10);
  }
  
  var collapseStyles = (_collapseStyles = {}, _collapseStyles[EXITED] = 'collapse', _collapseStyles[EXITING] = 'collapsing', _collapseStyles[ENTERING] = 'collapsing', _collapseStyles[ENTERED] = 'collapse show', _collapseStyles);
  var defaultProps = {
    in: false,
    timeout: 300,
    mountOnEnter: false,
    unmountOnExit: false,
    appear: false,
    dimension: 'height',
    getDimensionValue: getDimensionValue
  };
  
  var Collapse =
  /*#__PURE__*/
  function (_React$Component) {
    _inheritsLoose(Collapse, _React$Component);
  
    function Collapse() {
      var _this;
  
      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
        args[_key] = arguments[_key];
      }
  
      _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
  
      _this.handleEnter = function (elem) {
        elem.style[_this.getDimension()] = '0';
      };
  
      _this.handleEntering = function (elem) {
        var dimension = _this.getDimension();
  
        elem.style[dimension] = _this._getScrollDimensionValue(elem, dimension);
      };
  
      _this.handleEntered = function (elem) {
        elem.style[_this.getDimension()] = null;
      };
  
      _this.handleExit = function (elem) {
        var dimension = _this.getDimension();
  
        elem.style[dimension] = _this.props.getDimensionValue(dimension, elem) + "px";
        triggerBrowserReflow(elem);
      };
  
      _this.handleExiting = function (elem) {
        elem.style[_this.getDimension()] = '0';
      };
  
      return _this;
    }
  
    var _proto = Collapse.prototype;
  
    _proto.getDimension = function getDimension() {
      return typeof this.props.dimension === 'function' ? this.props.dimension() : this.props.dimension;
    }
    /* -- Expanding -- */
    ;
  
    // for testing
    _proto._getScrollDimensionValue = function _getScrollDimensionValue(elem, dimension) {
      var scroll = "scroll" + dimension[0].toUpperCase() + dimension.slice(1);
      return elem[scroll] + "px";
    };
  
    _proto.render = function render() {
      var _this2 = this;
  
      var _this$props = this.props,
          onEnter = _this$props.onEnter,
          onEntering = _this$props.onEntering,
          onEntered = _this$props.onEntered,
          onExit = _this$props.onExit,
          onExiting = _this$props.onExiting,
          className = _this$props.className,
          children = _this$props.children,
          props = _objectWithoutPropertiesLoose(_this$props, ["onEnter", "onEntering", "onEntered", "onExit", "onExiting", "className", "children"]);
  
      delete props.dimension;
      delete props.getDimensionValue;
      var handleEnter = createChainedFunction(this.handleEnter, onEnter);
      var handleEntering = createChainedFunction(this.handleEntering, onEntering);
      var handleEntered = createChainedFunction(this.handleEntered, onEntered);
      var handleExit = createChainedFunction(this.handleExit, onExit);
      var handleExiting = createChainedFunction(this.handleExiting, onExiting);
      return React.createElement(Transition, _extends({
        addEndListener: onEnd
      }, props, {
        "aria-expanded": props.role ? props.in : null,
        onEnter: handleEnter,
        onEntering: handleEntering,
        onEntered: handleEntered,
        onExit: handleExit,
        onExiting: handleExiting
      }), function (state, innerProps) {
        return React.cloneElement(children, _extends({}, innerProps, {
          className: classNames(className, children.props.className, collapseStyles[state], _this2.getDimension() === 'width' && 'width')
        }));
      });
    };
  
    return Collapse;
  }(React.Component);
  
  Collapse.defaultProps = defaultProps;
  export default Collapse;