content: import _extends from "@babel/runtime/helpers/esm/extends";
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
  import React from 'react';
  import PropTypes from 'prop-types';
  import clsx from 'clsx';
  import Collapse from '../Collapse';
  import withStyles from '../styles/withStyles';
  export var styles = function styles(theme) {
    return {
      /* Styles applied to the root element. */
      root: {
        marginTop: 8,
        marginLeft: 12,
        // half icon
        paddingLeft: 8 + 12,
        // margin + half icon
        paddingRight: 8,
        borderLeft: "1px solid ".concat(theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[600])
      },
  
      /* Styles applied to the root element if `last={true}` (controlled by `Step`). */
      last: {
        borderLeft: 'none'
      },
  
      /* Styles applied to the Transition component. */
      transition: {}
    };
  };
  var StepContent = React.forwardRef(function StepContent(props, ref) {
    var active = props.active,
        alternativeLabel = props.alternativeLabel,
        children = props.children,
        classes = props.classes,
        className = props.className,
        completed = props.completed,
        expanded = props.expanded,
        last = props.last,
        optional = props.optional,
        orientation = props.orientation,
        _props$TransitionComp = props.TransitionComponent,
        TransitionComponent = _props$TransitionComp === void 0 ? Collapse : _props$TransitionComp,
        _props$transitionDura = props.transitionDuration,
        transitionDurationProp = _props$transitionDura === void 0 ? 'auto' : _props$transitionDura,
        TransitionProps = props.TransitionProps,
        other = _objectWithoutProperties(props, ["active", "alternativeLabel", "children", "classes", "className", "completed", "expanded", "last", "optional", "orientation", "TransitionComponent", "transitionDuration", "TransitionProps"]);
  
    if (process.env.NODE_ENV !== 'production') {
      if (orientation !== 'vertical') {
        console.error('Material-UI: <StepContent /> is only designed for use with the vertical stepper.');
      }
    }
  
    var transitionDuration = transitionDurationProp;
  
    if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
      transitionDuration = undefined;
    }
  
    return React.createElement("div", _extends({
      className: clsx(classes.root, className, last && classes.last),
      ref: ref
    }, other), React.createElement(TransitionComponent, _extends({
      in: active || expanded,
      className: classes.transition,
      timeout: transitionDuration,
      unmountOnExit: true
    }, TransitionProps), children));
  });
  process.env.NODE_ENV !== "production" ? StepContent.propTypes = {
    /**
     * @ignore
     * Expands the content.
     */
    active: PropTypes.bool,
  
    /**
     * @ignore
     * Set internally by Step when it's supplied with the alternativeLabel prop.
     */
    alternativeLabel: PropTypes.bool,
  
    /**
     * Step content.
     */
    children: PropTypes.node,
  
    /**
     * Override or extend the styles applied to the component.
     * See [CSS API](#css) below for more details.
     */
    classes: PropTypes.object.isRequired,
  
    /**
     * @ignore
     */
    className: PropTypes.string,
  
    /**
     * @ignore
     */
    completed: PropTypes.bool,
  
    /**
     * @ignore
     */
    expanded: PropTypes.bool,
  
    /**
     * @ignore
     */
    last: PropTypes.bool,
  
    /**
     * @ignore
     * Set internally by Step when it's supplied with the optional prop.
     */
    optional: PropTypes.bool,
  
    /**
     * @ignore
     */
    orientation: PropTypes.oneOf(['horizontal', 'vertical']),
  
    /**
     * The component used for the transition.
     * [Follow this guide](/components/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
     */
    TransitionComponent: PropTypes.elementType,
  
    /**
     * Adjust the duration of the content expand transition.
     * Passed as a prop to the transition component.
     *
     * Set to 'auto' to automatically calculate transition time based on height.
     */
    transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
      enter: PropTypes.number,
      exit: PropTypes.number
    }), PropTypes.oneOf(['auto'])]),
  
    /**
     * Props applied to the [`Transition`](http://reactcommunity.org/react-transition-group/transition#Transition-props) element.
     */
    TransitionProps: PropTypes.object
  } : void 0;
  export default withStyles(styles, {
    name: 'MuiStepContent'
  })(StepContent);