var __assign = this && this.__assign || function () {
  __assign = Object.assign || function (t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
      s = arguments[i];

      for (var p in s) {
        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
      }
    }

    return t;
  };

  return __assign.apply(this, arguments);
};

var __rest = this && this.__rest || function (s, e) {
  var t = {};

  for (var p in s) {
    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  }

  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  }
  return t;
};

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import classNames from 'classnames';
import Icon from "../icon";
import { IconButton } from "../button";
import Menu, { MenuItem, MenuItemGroup, SubMenu, MenuDivider } from "../menu";
import Dropdown from "./Dropdown";
import "./style/dropmenu.css";
var prefixCls = 'dmc-dropmenu';

var Dropmenu = function Dropmenu(props) {
  var _a;

  var type = props.type,
      size = props.size,
      _b = props.menus,
      menus = _b === void 0 ? [] : _b,
      values = props.values,
      defaultValues = props.defaultValues,
      onClickMenuItem = props.onClickMenuItem,
      onClickMenu = props.onClickMenu,
      icon = props.icon,
      iconType = props.iconType,
      children = props.children,
      block = props.block,
      className = props.className,
      onlyText = props.onlyText,
      dropIcon = props.dropIcon,
      renderOverlay = props.renderOverlay,
      renderDropNode = props.renderDropNode,
      overlayClassName = props.overlayClassName,
      popupClassName = props.popupClassName,
      dropKey = props.dropKey,
      dropNoBorder = props.dropNoBorder,
      noSelected = props.noSelected,
      disabled = props.disabled,
      trigger = props.trigger,
      restProps = __rest(props, ["type", "size", "menus", "values", "defaultValues", "onClickMenuItem", "onClickMenu", "icon", "iconType", "children", "block", "className", "onlyText", "dropIcon", "renderOverlay", "renderDropNode", "overlayClassName", "popupClassName", "dropKey", "dropNoBorder", "noSelected", "disabled", "trigger"]); // 非受控


  var _c = React.useState(defaultValues !== null && defaultValues !== void 0 ? defaultValues : []),
      unControlVal = _c[0],
      setUnControlVal = _c[1]; // 受控校验


  var isControl = ('values' in props); // 受控/非受控的value

  var bindValue = isControl ? values !== null && values !== void 0 ? values : [] : unControlVal; // 不记录选择

  var val = !noSelected ? bindValue : [];

  var _d = React.useState(!!props.visible),
      actived = _d[0],
      setActived = _d[1];

  var cls = classNames("" + prefixCls, (_a = {}, _a[prefixCls + "-compact"] = size === 'compact', _a[prefixCls + "-" + type] = type, _a[prefixCls + "-no-border"] = dropNoBorder, _a[prefixCls + "-actived"] = actived, _a[prefixCls + "-only-icon"] = icon, _a[prefixCls + "-only-text"] = onlyText, _a[prefixCls + "-block"] = block, _a[prefixCls + "-disabled"] = disabled, _a), className);

  var handleClickMenuItem = function handleClickMenuItem(params) {
    setActived(false);
    !isControl && setUnControlVal(params.keyPath);
    onClickMenuItem && onClickMenuItem(params);
  };

  var renderMenuChildren = function renderMenuChildren(item, index, arr) {
    var _a;

    var node;

    if (item.children) {
      var View = item.type === 'group' ? MenuItemGroup : SubMenu;
      var itemCls = item.type === 'group' ? '' : prefixCls + "-sub-menu-item";
      var cls_1 = item.type === 'group' ? '' : popupClassName || overlayClassName || '';
      node = _jsx(View, __assign({
        className: itemCls,
        popupClassName: cls_1,
        title: _jsx("span", {
          children: item.title
        }, void 0),
        disabled: item.disabled
      }, {
        children: item.children.map(function (it, index) {
          return renderMenuChildren(it, index, item.children);
        })
      }), item.key);
    } else {
      var select = classNames(prefixCls + "-menu-item", (_a = {}, _a[prefixCls + "-menu-item-actived"] = val.includes(item.key), _a));
      node = _jsx(MenuItem, __assign({
        onClick: handleClickMenuItem,
        disabled: item.disabled,
        selectable: false,
        danger: item.danger
      }, {
        children: _jsxs("div", __assign({
          className: select
        }, {
          children: [_jsx(Icon, {
            icon: 'done-check',
            className: prefixCls + "-drop-icon"
          }, void 0), item.icon && _jsx(Icon, {
            icon: item.icon,
            className: prefixCls + "-icon"
          }, void 0), item.title]
        }), void 0)
      }), item.key);
    } // 去掉最后一个item添加的divider


    var currentLength = (arr !== null && arr !== void 0 ? arr : []).length;
    var noDivider = currentLength - 1 === index;

    if (item.divider && !noDivider) {
      return [node, _jsx(MenuDivider, {}, item.key + "-divider")];
    }

    return node;
  };

  var overlay = renderOverlay ? renderOverlay() : function () {
    var menuType = type === 'assist-bg' ? 'assist-bg' : undefined;
    var overlayCls = classNames(overlayClassName);
    return _jsx(Menu, __assign({
      type: menuType,
      onClick: onClickMenu,
      className: overlayCls
    }, {
      children: menus.map(function (it, index) {
        return renderMenuChildren(it, index, menus);
      })
    }), void 0);
  };

  var onVisibleChange = function onVisibleChange(visible) {
    props.onVisibleChange && props.onVisibleChange(visible, dropKey);
    !disabled && setActived(visible);
  };

  var dropNode;

  if (icon) {
    if (iconType === 'border') {
      dropNode = _jsxs(IconButton, __assign({
        type: 'border',
        actived: actived,
        className: className,
        disabled: disabled
      }, {
        children: [_jsx(Icon, {
          icon: icon,
          size: 18
        }, void 0), _jsx(Icon, {
          icon: "arrow-down",
          size: 12
        }, void 0)]
      }), void 0);
    } else if (iconType === 'only-icon') {
      dropNode = _jsx(IconButton, {
        type: 'only-icon',
        icon: icon,
        actived: actived,
        ghost: true,
        className: className,
        disabled: disabled
      }, void 0);
    } else {
      dropNode = _jsx(IconButton, {
        icon: icon,
        actived: actived,
        ghost: true,
        className: className,
        disabled: disabled
      }, void 0);
    }
  } else if (onlyText) {
    dropNode = _jsxs("div", __assign({
      className: cls
    }, {
      children: [children, dropIcon !== false && _jsx(Icon, {
        icon: dropIcon || 'chevron-down',
        className: prefixCls + "-icon"
      }, void 0)]
    }), void 0);
  } else if (renderDropNode) {
    dropNode = renderDropNode(actived);
  } else {
    dropNode = _jsxs("div", __assign({
      className: cls
    }, {
      children: [children, dropIcon !== false && _jsx(Icon, {
        icon: dropIcon || 'arrow-down',
        className: prefixCls + "-icon"
      }, void 0)]
    }), void 0);
  }

  return _jsx(Dropdown, __assign({
    overlay: overlay
  }, restProps, {
    onVisibleChange: onVisibleChange,
    trigger: disabled ? [] : trigger
  }, {
    children: dropNode
  }), void 0);
};

Dropmenu.defaultProps = {
  placement: 'bottomLeft',
  trigger: 'click'
};
Dropmenu.displayName = 'Dropmenu';
export default Dropmenu;
var DropmenuMemo = /*#__PURE__*/React.memo(Dropmenu);
DropmenuMemo.displayName = 'DropmenuMemo';
export { DropmenuMemo };

