@douyinfe/semi-ui/lib/cjs/dropdown/dropdownItem.js

A modern, comprehensive, flexible design system and UI library. Connect DesignOps & DevOps. Quickly build beautiful React apps. Maintained by Douyin-fe team.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _noop2 = _interopRequireDefault(require("lodash/noop"));
var _react = _interopRequireDefault(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _constants = require("@douyinfe/semi-foundation/lib/cjs/dropdown/constants");
var _context = _interopRequireDefault(require("./context"));
var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
var _semiIcons = require("@douyinfe/semi-icons");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const prefixCls = _constants.cssClasses.PREFIX;
class DropdownItem extends _baseComponent.default {
  render() {
    const {
      children,
      disabled,
      className,
      forwardRef,
      style,
      type,
      active,
      icon,
      onKeyDown,
      showTick,
      hover
    } = this.props;
    const {
      showTick: contextShowTick
    } = this.context;
    const realShowTick = contextShowTick !== null && contextShowTick !== void 0 ? contextShowTick : showTick;
    const itemclass = (0, _classnames.default)(className, {
      [`${prefixCls}-item`]: true,
      [`${prefixCls}-item-disabled`]: disabled,
      [`${prefixCls}-item-hover`]: hover,
      [`${prefixCls}-item-withTick`]: realShowTick,
      [`${prefixCls}-item-${type}`]: type,
      [`${prefixCls}-item-active`]: active
    });
    const events = {};
    if (!disabled) {
      ['onClick', 'onMouseEnter', 'onMouseLeave', 'onContextMenu'].forEach(eventName => {
        const isInAnotherDropdown = this.context.level !== 1;
        if (isInAnotherDropdown && eventName === "onClick") {
          events["onMouseDown"] = e => {
            var _a, _b;
            if (e.button === 0) {
              (_b = (_a = this.props)[eventName]) === null || _b === void 0 ? void 0 : _b.call(_a, e);
            }
          };
        } else {
          events[eventName] = this.props[eventName];
        }
      });
    }
    let tick = null;
    switch (true) {
      case realShowTick && active:
        tick = /*#__PURE__*/_react.default.createElement(_semiIcons.IconTick, null);
        break;
      case realShowTick && !active:
        tick = /*#__PURE__*/_react.default.createElement(_semiIcons.IconTick, {
          style: {
            color: 'transparent'
          }
        });
        break;
      default:
        tick = null;
        break;
    }
    let iconContent = null;
    if (icon) {
      iconContent = /*#__PURE__*/_react.default.createElement("div", {
        className: `${prefixCls}-item-icon`
      }, icon);
    }
    return /*#__PURE__*/_react.default.createElement("li", Object.assign({
      role: "menuitem",
      tabIndex: -1,
      "aria-disabled": disabled
    }, events, {
      onKeyDown: onKeyDown,
      ref: ref => forwardRef(ref),
      className: itemclass,
      style: style
    }, this.getDataAttr(this.props)), tick, iconContent, children);
  }
}
DropdownItem.propTypes = {
  children: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
  name: _propTypes.default.string,
  disabled: _propTypes.default.bool,
  selected: _propTypes.default.bool,
  onClick: _propTypes.default.func,
  onMouseEnter: _propTypes.default.func,
  onMouseLeave: _propTypes.default.func,
  onContextMenu: _propTypes.default.func,
  className: _propTypes.default.string,
  style: _propTypes.default.object,
  forwardRef: _propTypes.default.func,
  type: _propTypes.default.oneOf(_constants.strings.ITEM_TYPE),
  active: _propTypes.default.bool,
  icon: _propTypes.default.node
};
DropdownItem.contextType = _context.default;
DropdownItem.defaultProps = {
  disabled: false,
  divided: false,
  selected: false,
  onMouseEnter: _noop2.default,
  onMouseLeave: _noop2.default,
  forwardRef: _noop2.default
};
DropdownItem.elementType = 'Dropdown.Item';
var _default = exports.default = DropdownItem;