import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["expanded", "onChange", "className", "children"];
import React from "react";
import cx from "classnames";
import Box from "../../Box";
import ChevronDown from "../../Icon/ChevronDown";
import createComponent from "../../system/createComponent";
import getClasses from "./styles";
var AccordionHeader = /*#__PURE__*/React.forwardRef(function (props, ref) {
  var expanded = props.expanded,
      onChange = props.onChange,
      className = props.className,
      children = props.children,
      restProps = _objectWithoutProperties(props, _excluded);

  var classes = getClasses();
  var headerClasses = cx(className, classes.header, _defineProperty({}, classes.headerExpanded, expanded));
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, _extends({
    ref: ref,
    onClick: onChange,
    className: headerClasses
  }, restProps), children, /*#__PURE__*/React.createElement(ChevronDown, {
    className: expanded ? classes.expandedIcon : classes.icon
  })));
});
export default createComponent(AccordionHeader);