import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import React, { useContext } from 'react';
import PropTypes from 'prop-types';
import Ripple from '../Ripple';
import Button from '../Button';
import { useClassNames } from '../utils';
import useToggleCaret from '../utils/useToggleCaret';
import { SidenavContext } from '../Sidenav/Sidenav';
var defaultProps = {
  as: Button,
  classPrefix: 'dropdown-toggle'
};
var DropdownToggle = /*#__PURE__*/React.forwardRef(function (props, ref) {
  var Component = props.as,
      className = props.className,
      classPrefix = props.classPrefix,
      renderTitle = props.renderTitle,
      children = props.children,
      icon = props.icon,
      noCaret = props.noCaret,
      placement = props.placement,
      rest = _objectWithoutPropertiesLoose(props, ["as", "className", "classPrefix", "renderTitle", "children", "icon", "noCaret", "placement"]);

  var sidenav = useContext(SidenavContext);

  var _useClassNames = useClassNames(classPrefix),
      prefix = _useClassNames.prefix,
      withClassPrefix = _useClassNames.withClassPrefix,
      merge = _useClassNames.merge;

  var classes = merge(className, withClassPrefix({
    'custom-title': typeof renderTitle === 'function',
    'no-caret': noCaret
  }));
  var inSidenav = !!sidenav; // Caret icon is down by default, when Dropdown is used in Sidenav.

  var Caret = useToggleCaret(inSidenav ? 'bottomStart' : placement);

  if (renderTitle) {
    return /*#__PURE__*/React.createElement(Component, _extends({}, rest, {
      ref: ref,
      className: classes
    }), renderTitle(children), /*#__PURE__*/React.createElement(Ripple, null));
  }

  var buttonProps = Component === Button ? {
    appearance: 'subtle'
  } : null;
  return /*#__PURE__*/React.createElement(Component, _extends({}, buttonProps, rest, {
    ref: ref,
    className: classes
  }), icon, children, noCaret ? null : /*#__PURE__*/React.createElement(Caret, {
    className: prefix('caret')
  }));
});
DropdownToggle.displayName = 'DropdownToggle';
DropdownToggle.defaultProps = defaultProps;
DropdownToggle.propTypes = {
  className: PropTypes.string,
  children: PropTypes.node,
  icon: PropTypes.node,
  classPrefix: PropTypes.string,
  noCaret: PropTypes.bool,
  as: PropTypes.elementType,
  renderTitle: PropTypes.func
};
export default DropdownToggle;