'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var presetColor = require('../../style/presetColor.js');
var index = require('../../style/index.js');
require('../../theme/index.js');
var util = require('../../_util/util.js');
var genComponentStyleHook = require('../../theme/util/genComponentStyleHook.js');
var statistic = require('../../theme/util/statistic.js');

const genTagStatusStyle = (token, status, cssVariableType) => {
  const capitalizedCssVariableType = util.capitalize(cssVariableType);
  return {
    [`${token.componentCls}-${status}`]: {
      color: token[`color${cssVariableType}`],
      background: token[`color${capitalizedCssVariableType}Bg`],
      borderColor: token[`color${capitalizedCssVariableType}Border`]
    }
  };
};
const genPresetStyle = (token) => presetColor.genPresetColor(token, (colorKey, { textColor, lightBorderColor, lightColor, darkColor }) => ({
  [`${token.componentCls}-${colorKey}`]: {
    "color": textColor,
    "background": lightColor,
    "borderColor": lightBorderColor,
    // Inverse color
    "&-inverse": {
      color: token.colorTextLightSolid,
      background: darkColor,
      borderColor: darkColor
    }
  }
}));
const genBaseStyle = (token) => {
  const { paddingXXS, lineWidth, tagPaddingHorizontal, componentCls } = token;
  const paddingInline = tagPaddingHorizontal - lineWidth;
  const iconMarginInline = paddingXXS - lineWidth;
  return {
    // Result
    [componentCls]: {
      ...index.resetComponent(token),
      "display": "inline-block",
      "height": "auto",
      "marginInlineEnd": token.marginXS,
      paddingInline,
      "fontSize": token.tagFontSize,
      "lineHeight": `${token.tagLineHeight}px`,
      "whiteSpace": "nowrap",
      "background": token.tagDefaultBg,
      "border": `${token.lineWidth}px ${token.lineType} ${token.colorBorder}`,
      "borderRadius": token.borderRadiusSM,
      "opacity": 1,
      "transition": `all ${token.motionDurationMid}`,
      "textAlign": "start",
      // RTL
      [`&${componentCls}-rtl`]: {
        direction: "rtl"
      },
      "&, a, a:hover": {
        color: token.tagDefaultColor
      },
      [`${componentCls}-close-icon`]: {
        "marginInlineStart": iconMarginInline,
        "color": token.colorTextDescription,
        "fontSize": token.tagIconSize,
        "cursor": "pointer",
        "transition": `all ${token.motionDurationMid}`,
        "&:hover": {
          color: token.colorTextHeading
        }
      },
      [`&${componentCls}-has-color`]: {
        borderColor: "transparent",
        [`&, a, a:hover, ${token.iconCls}-close, ${token.iconCls}-close:hover`]: {
          color: token.colorTextLightSolid
        }
      },
      "&-checkable": {
        "backgroundColor": "transparent",
        "borderColor": "transparent",
        "cursor": "pointer",
        [`&:not(${componentCls}-checkable-checked):hover`]: {
          color: token.colorPrimary,
          backgroundColor: token.colorFillSecondary
        },
        "&:active, &-checked": {
          color: token.colorTextLightSolid
        },
        "&-checked": {
          "backgroundColor": token.colorPrimary,
          "&:hover": {
            backgroundColor: token.colorPrimaryHover
          }
        },
        "&:active": {
          backgroundColor: token.colorPrimaryActive
        }
      },
      "&-hidden": {
        display: "none"
      },
      // To ensure that a space will be placed between character and `Icon`.
      [`> ${token.iconCls} + span, > span + ${token.iconCls}`]: {
        marginInlineStart: paddingInline
      }
    }
  };
};
var useStyle = genComponentStyleHook.default("Tag", (token) => {
  const { fontSize, lineHeight, lineWidth, fontSizeIcon } = token;
  const tagHeight = Math.round(fontSize * lineHeight);
  const tagFontSize = token.fontSizeSM;
  const tagLineHeight = tagHeight - lineWidth * 2;
  const tagDefaultBg = token.colorFillAlter;
  const tagDefaultColor = token.colorText;
  const tagToken = statistic.merge(token, {
    tagFontSize,
    tagLineHeight,
    tagDefaultBg,
    tagDefaultColor,
    tagIconSize: fontSizeIcon - 2 * lineWidth,
    // Tag icon is much more smaller
    tagPaddingHorizontal: 8
    // Fixed padding.
  });
  return [
    genBaseStyle(tagToken),
    genPresetStyle(tagToken),
    genTagStatusStyle(tagToken, "success", "Success"),
    genTagStatusStyle(tagToken, "processing", "Info"),
    genTagStatusStyle(tagToken, "error", "Error"),
    genTagStatusStyle(tagToken, "warning", "Warning")
  ];
});

exports.default = useStyle;
//# sourceMappingURL=index.js.map
