import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _extends from "@babel/runtime/helpers/esm/extends";
import { TinyColor } from '@ctrl/tinycolor';
import { genCollapseMotion, initSlideMotion, initZoomMotion } from '../../style/motion';
import { genComponentStyleHook, mergeToken } from '../../theme';
import getHorizontalStyle from './horizontal';
import getRTLStyle from './rtl';
import getThemeStyle from './theme';
import getVerticalStyle from './vertical';
import { clearFix, resetComponent, resetIcon } from '../../style'; // =============================== Base ===============================

var getBaseStyle = function getBaseStyle(token) {
  var _$concat$concat, _$concat5, _extends3;

  var antCls = token.antCls,
      componentCls = token.componentCls,
      fontSize = token.fontSize,
      motionDurationSlow = token.motionDurationSlow,
      motionDurationMid = token.motionDurationMid,
      motionEaseInOut = token.motionEaseInOut,
      motionEaseOut = token.motionEaseOut,
      lineHeight = token.lineHeight,
      paddingXS = token.paddingXS,
      padding = token.padding,
      colorSplit = token.colorSplit,
      lineWidth = token.lineWidth,
      iconCls = token.iconCls,
      zIndexPopup = token.zIndexPopup,
      radiusBase = token.radiusBase,
      menuArrowSize = token.menuArrowSize,
      controlHeightSM = token.controlHeightSM,
      menuArrowOffset = token.menuArrowOffset,
      lineType = token.lineType,
      menuPanelMaskInset = token.menuPanelMaskInset;
  return [// Misc
  _defineProperty({
    '': _defineProperty({}, "".concat(componentCls), _extends(_extends({}, clearFix()), _defineProperty({}, "&-hidden", {
      display: 'none'
    })))
  }, "".concat(componentCls, "-submenu-hidden"), {
    display: 'none'
  }), _defineProperty({}, componentCls, _extends(_extends({}, resetComponent(token)), (_extends3 = {
    marginBottom: 0,
    paddingInlineStart: 0,
    // Override default ul/ol
    fontSize: fontSize,
    lineHeight: 0,
    listStyle: 'none',
    outline: 'none',
    transition: ["background ".concat(motionDurationSlow), // Magic cubic here but smooth transition
    "width ".concat(motionDurationSlow, " cubic-bezier(0.2, 0, 0, 1) 0s")].join(',')
  }, _defineProperty(_extends3, "ul, ol", {
    margin: 0,
    padding: 0,
    listStyle: 'none'
  }), _defineProperty(_extends3, "&-overflow", _defineProperty({
    display: 'flex'
  }, "".concat(componentCls, "-item"), {
    flex: 'none'
  })), _defineProperty(_extends3, "".concat(componentCls, "-item,").concat(componentCls, "-submenu,"), {
    borderRadius: token.radiusItem
  }), _defineProperty(_extends3, "".concat(componentCls, "-item-group-title"), {
    padding: "".concat(paddingXS, "px ").concat(padding, "px"),
    fontSize: fontSize,
    lineHeight: lineHeight,
    transition: "all ".concat(motionDurationSlow)
  }), _defineProperty(_extends3, "&-horizontal ".concat(componentCls, "-submenu"), {
    transition: ["border-color ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "background ".concat(motionDurationSlow, " ").concat(motionEaseInOut)].join(',')
  }), _defineProperty(_extends3, "".concat(componentCls, "-submenu, ").concat(componentCls, "-submenu-inline"), {
    transition: ["border-color ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "background ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "padding ".concat(motionDurationMid, " ").concat(motionEaseInOut)].join(',')
  }), _defineProperty(_extends3, "".concat(componentCls, "-submenu ").concat(componentCls, "-sub"), {
    cursor: 'initial',
    transition: ["background ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "padding ".concat(motionDurationSlow, " ").concat(motionEaseInOut)]
  }), _defineProperty(_extends3, "".concat(componentCls, "-title-content"), {
    transition: "color ".concat(motionDurationSlow)
  }), _defineProperty(_extends3, "".concat(componentCls, "-item a"), {
    '&::before': {
      position: 'absolute',
      inset: 0,
      backgroundColor: 'transparent',
      content: '""'
    }
  }), _defineProperty(_extends3, "".concat(componentCls, "-item-divider"), {
    overflow: 'hidden',
    lineHeight: 0,
    borderColor: colorSplit,
    borderStyle: lineType,
    borderTopWidth: lineWidth,
    marginBlock: lineWidth,
    padding: 0,
    '&-dashed': {
      borderStyle: 'dashed'
    }
  }), _defineProperty(_extends3, "".concat(componentCls, "-item, ").concat(componentCls, "-submenu-title"), (_$concat$concat = {
    position: 'relative',
    display: 'block',
    margin: 0,
    // paddingInline: menuItemPaddingInline,
    whiteSpace: 'nowrap',
    cursor: 'pointer',
    transition: ["border-color ".concat(motionDurationSlow), "background ".concat(motionDurationSlow), "padding ".concat(motionDurationSlow, " ").concat(motionEaseInOut)].join(',')
  }, _defineProperty(_$concat$concat, "".concat(componentCls, "-item-icon, ").concat(iconCls), {
    minWidth: fontSize,
    fontSize: fontSize,
    transition: ["font-size ".concat(motionDurationMid, " ").concat(motionEaseOut), "margin ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "color ".concat(motionDurationSlow)].join(','),
    '+ span': {
      marginInlineStart: controlHeightSM - fontSize,
      opacity: 1,
      transition: ["opacity ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "margin ".concat(motionDurationSlow), "color ".concat(motionDurationSlow)].join(',')
    }
  }), _defineProperty(_$concat$concat, "".concat(componentCls, "-item-icon"), _extends({}, resetIcon())), _defineProperty(_$concat$concat, "&.".concat(componentCls, "-item-only-child"), _defineProperty({}, "> ".concat(iconCls, ", > ").concat(componentCls, "-item-icon"), {
    marginInlineEnd: 0
  })), _$concat$concat)), _defineProperty(_extends3, "".concat(componentCls, "-item-disabled, ").concat(componentCls, "-submenu-disabled"), _defineProperty({
    background: 'none !important',
    cursor: 'not-allowed',
    '&::after': {
      borderColor: 'transparent !important'
    },
    a: {
      color: 'inherit !important',
      pointerEvents: 'none'
    }
  }, "> ".concat(componentCls, "-submenu-title"), {
    color: 'inherit !important',
    cursor: 'not-allowed'
  })), _defineProperty(_extends3, "".concat(componentCls, "-item-group"), _defineProperty({}, "".concat(componentCls, "-item-group-list"), _defineProperty({
    margin: 0,
    padding: 0
  }, "".concat(componentCls, "-item, ").concat(componentCls, "-submenu-title"), {
    paddingInline: "".concat(fontSize * 2, "px ").concat(padding, "px")
  }))), _defineProperty(_extends3, '&-submenu', _defineProperty({
    '&-popup': {
      position: 'absolute',
      zIndex: zIndexPopup,
      background: 'transparent',
      borderRadius: radiusBase,
      boxShadow: 'none',
      transformOrigin: '0 0',
      // https://github.com/ant-design/ant-design/issues/13955
      '&::before': {
        position: 'absolute',
        inset: "".concat(menuPanelMaskInset, "px 0 0"),
        zIndex: -1,
        width: '100%',
        height: '100%',
        opacity: 0,
        content: '""'
      }
    },
    // https://github.com/ant-design/ant-design/issues/13955
    '&-placement-rightTop::before': {
      top: 0,
      insetInlineStart: menuPanelMaskInset
    }
  }, "> ".concat(componentCls), _defineProperty({
    borderRadius: radiusBase
  }, "".concat(componentCls, "-submenu-title::after"), {
    transition: "transform ".concat(motionDurationSlow, " ").concat(motionEaseInOut)
  }))), _defineProperty(_extends3, "".concat(componentCls, "-submenu"), (_$concat5 = {}, _defineProperty(_$concat5, "&-expand-icon, &-arrow", {
    position: 'absolute',
    top: '50%',
    insetInlineEnd: token.margin,
    width: menuArrowSize,
    color: 'currentcolor',
    transform: 'translateY(-50%)',
    transition: "transform ".concat(motionDurationSlow, " ").concat(motionEaseInOut)
  }), _defineProperty(_$concat5, '&-arrow', {
    // →
    '&::before, &::after': {
      position: 'absolute',
      width: menuArrowSize * 0.6,
      height: menuArrowSize * 0.15,
      backgroundColor: 'currentcolor',
      borderRadius: radiusBase,
      transition: ["background ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "transform ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "top ".concat(motionDurationSlow, " ").concat(motionEaseInOut), "color ".concat(motionDurationSlow, " ").concat(motionEaseInOut)].join(','),
      content: '""'
    },
    '&::before': {
      transform: "rotate(45deg) translateY(-".concat(menuArrowOffset, ")")
    },
    '&::after': {
      transform: "rotate(-45deg) translateY(".concat(menuArrowOffset, ")")
    }
  }), _$concat5)), _defineProperty(_extends3, "&-inline-collapsed ".concat(componentCls, "-submenu-arrow,\n        &-inline ").concat(componentCls, "-submenu-arrow"), {
    // ↓
    '&::before': {
      transform: "rotate(-45deg) translateX(".concat(menuArrowOffset, ")")
    },
    '&::after': {
      transform: "rotate(45deg) translateX(-".concat(menuArrowOffset, ")")
    }
  }), _defineProperty(_extends3, "".concat(componentCls, "-submenu-open").concat(componentCls, "-submenu-inline > ").concat(componentCls, "-submenu-title > ").concat(componentCls, "-submenu-arrow"), {
    // ↑
    transform: "translateY(-".concat(menuArrowSize * 0.2, "px)"),
    '&::after': {
      transform: "rotate(-45deg) translateX(-".concat(menuArrowOffset, ")")
    },
    '&::before': {
      transform: "rotate(45deg) translateX(".concat(menuArrowOffset, ")")
    }
  }), _extends3))), // Integration with header element so menu items have the same height
  _defineProperty({}, "".concat(antCls, "-layout-header"), _defineProperty({}, componentCls, {
    lineHeight: 'inherit'
  }))];
}; // ============================== Export ==============================


export default (function (prefixCls, injectStyle) {
  var useOriginHook = genComponentStyleHook('Menu', function (token, _ref5) {
    var overrideComponentToken = _ref5.overrideComponentToken;

    // Dropdown will handle menu style self. We do not need to handle this.
    if (injectStyle === false) {
      return [];
    }

    var colorPrimary = token.colorPrimary,
        colorError = token.colorError,
        colorErrorHover = token.colorErrorHover,
        colorTextLightSolid = token.colorTextLightSolid,
        colorTextSecondary = token.colorTextSecondary;
    var controlHeightLG = token.controlHeightLG,
        fontSize = token.fontSize;
    var menuArrowSize = fontSize / 7 * 5; // Menu Token

    var menuToken = mergeToken(token, {
      menuItemHeight: controlHeightLG,
      menuItemPaddingInline: token.margin,
      menuItemMarginInline: token.marginXXS,
      menuArrowSize: menuArrowSize,
      menuHorizontalHeight: controlHeightLG * 1.15,
      menuArrowOffset: "".concat(menuArrowSize * 0.25, "px"),
      menuPanelMaskInset: -7 // Still a hardcode here since it's offset by rc-align

    });
    var menuDarkToken = mergeToken(menuToken, {
      colorItemText: new TinyColor(colorTextLightSolid).setAlpha(0.65).toRgbString(),
      colorItemTextHover: colorTextLightSolid,
      colorGroupTitle: colorTextSecondary,
      colorItemTextSelected: colorTextLightSolid,
      colorItemBg: '#001529',
      colorSubItemBg: '#000c17',
      colorItemBgActive: 'transparent',
      colorItemBgSelected: colorPrimary,
      colorActiveBarWidth: 0,
      colorActiveBarHeight: 0,
      colorActiveBarBorderSize: 0,
      // Disabled
      colorItemTextDisabled: new TinyColor(colorTextLightSolid).setAlpha(0.25).toRgbString(),
      // Danger
      colorDangerItemText: colorError,
      colorDangerItemTextHover: colorErrorHover,
      colorDangerItemTextSelected: colorTextLightSolid,
      colorDangerItemBgActive: colorError,
      colorDangerItemBgSelected: colorError
    }, _extends({}, overrideComponentToken));
    return [// Basic
    getBaseStyle(menuToken), // Horizontal
    getHorizontalStyle(menuToken), // Vertical
    getVerticalStyle(menuToken), // Theme
    getThemeStyle(menuToken, 'light'), getThemeStyle(menuDarkToken, 'dark'), // RTL
    getRTLStyle(menuToken), // Motion
    genCollapseMotion(menuToken), initSlideMotion(menuToken, 'slide-up'), initSlideMotion(menuToken, 'slide-down'), initZoomMotion(menuToken, 'zoom-big')];
  }, function (token) {
    var colorPrimary = token.colorPrimary,
        colorError = token.colorError,
        colorTextDisabled = token.colorTextDisabled,
        colorErrorBg = token.colorErrorBg,
        colorText = token.colorText,
        colorTextDescription = token.colorTextDescription,
        colorBgContainer = token.colorBgContainer,
        colorFillAlter = token.colorFillAlter,
        controlItemBgActive = token.controlItemBgActive,
        lineWidth = token.lineWidth,
        lineWidthBold = token.lineWidthBold;
    return {
      dropdownWidth: 160,
      zIndexPopup: token.zIndexPopupBase + 50,
      radiusItem: 0,
      colorItemText: colorText,
      colorItemTextHover: colorPrimary,
      colorGroupTitle: colorTextDescription,
      colorItemTextSelected: colorPrimary,
      colorItemBg: colorBgContainer,
      colorSubItemBg: colorFillAlter,
      colorItemBgActive: controlItemBgActive,
      colorItemBgSelected: controlItemBgActive,
      colorItemBgSelectedHorizontal: 'transparent',
      colorActiveBarWidth: lineWidthBold + lineWidth,
      colorActiveBarHeight: lineWidthBold,
      colorActiveBarBorderSize: lineWidth,
      // Disabled
      colorItemTextDisabled: colorTextDisabled,
      // Danger
      colorDangerItemText: colorError,
      colorDangerItemTextHover: colorError,
      colorDangerItemTextSelected: colorError,
      colorDangerItemBgActive: colorErrorBg,
      colorDangerItemBgSelected: colorErrorBg
    };
  });
  return useOriginHook(prefixCls);
});