var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

import React, { useContext } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { mapToCssModules, omit, tagPropType } from './Shared/helper.js';
import { Context } from './CDropdownCustom';

//component - CoreUI / CDropdownItem

var CDropdownItem = function CDropdownItem(props) {
  var _omit = omit(props, ['toggle']),
      Tag = _omit.tag,
      className = _omit.className,
      cssModule = _omit.cssModule,
      innerRef = _omit.innerRef,
      color = _omit.color,
      divider = _omit.divider,
      header = _omit.header,
      active = _omit.active,
      attributes = _objectWithoutProperties(_omit, ['tag', 'className', 'cssModule', 'innerRef', 'color', 'divider', 'header', 'active']);

  var context = useContext(Context);

  var onClick = function onClick(e) {
    if (props.disabled || props.header || props.divider) {
      e.preventDefault();
      return;
    }
    if (props.onClick) {
      props.onClick(e);
    }
    if (props.toggle) {
      context.toggle(e);
    }
  };

  var getTabIndex = function getTabIndex() {
    if (props.disabled || props.header || props.divider) {
      return '-1';
    }
    return '0';
  };

  //render

  var tabIndex = getTabIndex();
  var role = tabIndex > -1 ? 'menuitem' : undefined;

  var classes = mapToCssModules(classNames(className, header ? 'dropdown-header' : divider ? 'dropdown-divider' : 'dropdown-item', active ? 'active' : null, color ? 'bg-' + color : null, {
    disabled: attributes.disabled
  }), cssModule);

  if (Tag === 'button') {
    if (header) {
      Tag = 'h6';
    } else if (divider) {
      Tag = 'div';
    } else if (props.href) {
      Tag = 'a';
    }
  }

  return React.createElement(Tag, _extends({
    type: Tag === 'button' && (attributes.onClick || props.toggle) ? 'button' : undefined
  }, attributes, {
    tabIndex: tabIndex,
    role: role,
    className: classes,
    onClick: onClick,
    ref: innerRef
  }));
};

CDropdownItem.propTypes = process.env.NODE_ENV !== "production" ? {
  tag: tagPropType,
  children: PropTypes.node,
  className: PropTypes.string,
  cssModule: PropTypes.object,
  //
  innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
  color: PropTypes.string,
  divider: PropTypes.bool,
  header: PropTypes.bool,
  active: PropTypes.bool,
  disabled: PropTypes.bool,
  onClick: PropTypes.func,
  toggle: PropTypes.bool
} : {};

CDropdownItem.defaultProps = {
  tag: 'button',
  toggle: true
};

export default CDropdownItem;