import '../../../theme/index.mjs';
import { genCompactItemStyle } from '../../../theme/style/compact-item.mjs';
import { genCompactItemVerticalStyle } from '../../../theme/style/compact-item-vertical.mjs';
import genGroupStyle from './group.mjs';
import { genFocusStyle } from '../../../theme/style/index.mjs';
import { merge } from '../../../theme/token/util/statistic.mjs';
import genComponentStyleHook from '../../../theme/token/util/genComponentStyleHook.mjs';

function getColorByStatus(token, status) {
  let color = "";
  let colorHover = "";
  let colorBorderHover = "";
  let colorActive = "";
  let colorOutline = "";
  let colorBg = "";
  switch (status) {
    case "dangerous":
      color = token.colorError;
      colorBorderHover = token.colorErrorBorderHover;
      colorHover = token.colorErrorHover;
      colorActive = token.colorErrorActive;
      colorOutline = token.colorErrorOutline;
      colorBg = token.colorErrorBg;
      break;
    case "success":
      color = token.colorSuccess;
      colorBorderHover = token.colorSuccessBorderHover;
      colorHover = token.colorSuccessHover;
      colorActive = token.colorSuccessActive;
      colorOutline = token.colorSuccessOutline;
      colorBg = token.colorSuccessBg;
      break;
    case "warning":
      color = token.colorWarning;
      colorBorderHover = token.colorWarningBorderHover;
      colorHover = token.colorWarningHover;
      colorActive = token.colorWarningActive;
      colorOutline = token.colorWarningOutline;
      colorBg = token.colorWarningBg;
      break;
  }
  return { color, colorBorderHover, colorHover, colorActive, colorOutline, colorBg };
}
const genSharedButtonStyle = (token) => {
  const { componentCls, iconCls, buttonFontWeight } = token;
  return {
    [componentCls]: {
      "outline": "none",
      "position": "relative",
      "display": "inline-block",
      "fontWeight": buttonFontWeight,
      "whiteSpace": "nowrap",
      "textAlign": "center",
      "backgroundImage": "none",
      "backgroundColor": "transparent",
      "border": `${token.lineWidth}px ${token.lineType} transparent`,
      "cursor": "pointer",
      "transition": `all ${token.motionDurationMid} ${token.motionEaseInOut}`,
      "userSelect": "none",
      "touchAction": "manipulation",
      "lineHeight": token.lineHeight,
      "color": token.colorText,
      "&:disabled > *": {
        pointerEvents: "none"
      },
      "> span": {
        display: "inline-block"
      },
      [`${componentCls}-icon`]: {
        lineHeight: 0
      },
      // Leave a space between icon and text.
      [`> ${iconCls} + span, > span + ${iconCls}`]: {
        marginInlineStart: token.marginXS
      },
      [`&:not(${componentCls}-icon-only) > ${componentCls}-icon`]: {
        [`&${componentCls}-loading-icon, &:not(:last-child)`]: {
          marginInlineEnd: token.marginXS
        }
      },
      "> a": {
        color: "currentColor"
      },
      "&:not(:disabled)": {
        ...genFocusStyle(token)
      },
      // make `btn-icon-only` not too narrow
      [`&-icon-only${componentCls}-compact-item`]: {
        flex: "none"
      },
      // Special styles for Primary Button
      [`&-compact-item${componentCls}-primary`]: {
        [`&:not([disabled]) + ${componentCls}-compact-item${componentCls}-primary:not([disabled])`]: {
          "position": "relative",
          "&:before": {
            position: "absolute",
            top: -token.lineWidth,
            insetInlineStart: -token.lineWidth,
            display: "inline-block",
            width: token.lineWidth,
            height: `calc(100% + ${token.lineWidth * 2}px)`,
            backgroundColor: token.colorPrimaryHover,
            content: '""'
          }
        }
      },
      // Special styles for Primary Button
      "&-compact-vertical-item": {
        [`&${componentCls}-primary`]: {
          [`&:not([disabled]) + ${componentCls}-compact-vertical-item${componentCls}-primary:not([disabled])`]: {
            "position": "relative",
            "&:before": {
              position: "absolute",
              top: -token.lineWidth,
              insetInlineStart: -token.lineWidth,
              display: "inline-block",
              width: `calc(100% + ${token.lineWidth * 2}px)`,
              height: token.lineWidth,
              backgroundColor: token.colorPrimaryHover,
              content: '""'
            }
          }
        }
      }
    }
  };
};
function genHoverActiveButtonStyle(hoverStyle, activeStyle) {
  return {
    "&:not(:disabled)": {
      "&:hover": hoverStyle,
      "&:active": activeStyle
    }
  };
}
const genCircleButtonStyle = (token) => ({
  minWidth: token.controlHeight,
  paddingInlineStart: 0,
  paddingInlineEnd: 0,
  borderRadius: "50%"
});
const genRoundButtonStyle = (token) => ({
  borderRadius: token.controlHeight,
  paddingInlineStart: token.controlHeight / 2,
  paddingInlineEnd: token.controlHeight / 2
});
const genDisabledStyle = (token) => ({
  cursor: "not-allowed",
  borderColor: token.colorBorder,
  color: token.colorTextDisabled,
  backgroundColor: token.colorBgContainerDisabled,
  boxShadow: "none"
});
function genGhostButtonStyle(btnCls, textColor, borderColor, textColorDisabled, borderColorDisabled, hoverStyle, activeStyle) {
  return {
    [`&${btnCls}-background-ghost`]: {
      "color": textColor || void 0,
      "backgroundColor": "transparent",
      "borderColor": borderColor || void 0,
      "boxShadow": "none",
      ...genHoverActiveButtonStyle(
        {
          backgroundColor: "transparent",
          ...hoverStyle
        },
        {
          backgroundColor: "transparent",
          ...activeStyle
        }
      ),
      "&:disabled": {
        cursor: "not-allowed",
        color: textColorDisabled || void 0,
        borderColor: borderColorDisabled || void 0
      }
    }
  };
}
const genSolidDisabledButtonStyle = (token) => ({
  "&:disabled": {
    ...genDisabledStyle(token)
  }
});
const genSolidButtonStyle = (token) => ({
  ...genSolidDisabledButtonStyle(token)
});
const genPureDisabledButtonStyle = (token) => ({
  "&:disabled": {
    cursor: "not-allowed",
    color: token.colorTextDisabled
  }
});
const genStatusDefaultStyle = (token, status) => {
  const { color, colorHover, colorBorderHover, colorActive } = getColorByStatus(token, status);
  return {
    [`&${token.componentCls}-${status}`]: {
      color,
      borderColor: color,
      ...genHoverActiveButtonStyle(
        {
          color: colorHover,
          borderColor: colorBorderHover
        },
        {
          color: colorActive,
          borderColor: colorActive
        }
      ),
      ...genGhostButtonStyle(
        token.componentCls,
        color,
        color,
        token.colorTextDisabled,
        token.colorBorder
      ),
      ...genSolidDisabledButtonStyle(token)
    }
  };
};
const genDefaultButtonStyle = (token) => ({
  ...genSolidButtonStyle(token),
  backgroundColor: token.colorBgContainer,
  borderColor: token.colorBorder,
  boxShadow: `0 ${token.controlOutlineWidth}px 0 ${token.controlTmpOutline}`,
  ...genHoverActiveButtonStyle(
    {
      color: token.colorPrimaryHover,
      borderColor: token.colorPrimaryHover
    },
    {
      color: token.colorPrimaryActive,
      borderColor: token.colorPrimaryActive
    }
  ),
  ...genGhostButtonStyle(
    token.componentCls,
    token.colorBgContainer,
    token.colorBgContainer,
    token.colorTextDisabled,
    token.colorBorder
  ),
  ...genStatusDefaultStyle(token, "dangerous"),
  ...genStatusDefaultStyle(token, "success"),
  ...genStatusDefaultStyle(token, "warning")
});
const genStatusPrimaryStyle = (token, status) => {
  const { color, colorOutline, colorHover, colorActive } = getColorByStatus(token, status);
  return {
    [`&${token.componentCls}-${status}`]: {
      backgroundColor: color,
      boxShadow: `0 ${token.controlOutlineWidth}px 0 ${colorOutline}`,
      ...genHoverActiveButtonStyle(
        {
          backgroundColor: colorHover
        },
        {
          backgroundColor: colorActive
        }
      ),
      ...genGhostButtonStyle(
        token.componentCls,
        color,
        color,
        token.colorTextDisabled,
        token.colorBorder,
        {
          color: colorHover,
          borderColor: colorHover
        },
        {
          color: colorActive,
          borderColor: colorActive
        }
      ),
      ...genSolidDisabledButtonStyle(token)
    }
  };
};
const genPrimaryButtonStyle = (token) => ({
  ...genSolidButtonStyle(token),
  color: token.colorTextLightSolid,
  backgroundColor: token.colorPrimary,
  boxShadow: `0 ${token.controlOutlineWidth}px 0 ${token.controlOutline}`,
  ...genHoverActiveButtonStyle(
    {
      color: token.colorTextLightSolid,
      backgroundColor: token.colorPrimaryHover
    },
    {
      color: token.colorTextLightSolid,
      backgroundColor: token.colorPrimaryActive
    }
  ),
  ...genGhostButtonStyle(
    token.componentCls,
    token.colorPrimary,
    token.colorPrimary,
    token.colorTextDisabled,
    token.colorBorder,
    {
      color: token.colorPrimaryHover,
      borderColor: token.colorPrimaryHover
    },
    {
      color: token.colorPrimaryActive,
      borderColor: token.colorPrimaryActive
    }
  ),
  ...genStatusPrimaryStyle(token, "dangerous"),
  ...genStatusPrimaryStyle(token, "success"),
  ...genStatusPrimaryStyle(token, "warning")
});
const genDashedButtonStyle = (token) => ({
  ...genDefaultButtonStyle(token),
  borderStyle: "dashed"
});
const getStatusLinkStyle = (token, status) => {
  let colorHover = "";
  let colorActive = "";
  let color = "";
  switch (status) {
    case "dangerous":
      colorHover = token.colorErrorHover;
      colorActive = token.colorErrorActive;
      color = token.colorErrorHover;
      break;
    case "success":
      colorHover = token.colorSuccessHover;
      colorActive = token.colorSuccessActive;
      color = token.colorSuccess;
      break;
    case "warning":
      colorHover = token.colorWarningHover;
      colorActive = token.colorWarningActive;
      color = token.colorWarning;
      break;
  }
  return {
    [`&${token.componentCls}-${status}`]: {
      color,
      ...genHoverActiveButtonStyle(
        {
          color: colorHover
        },
        {
          color: colorActive
        }
      ),
      ...genPureDisabledButtonStyle(token)
    }
  };
};
const genLinkButtonStyle = (token) => ({
  color: token.colorLink,
  ...genHoverActiveButtonStyle(
    {
      color: token.colorLinkHover
    },
    {
      color: token.colorLinkActive
    }
  ),
  ...genPureDisabledButtonStyle(token),
  ...getStatusLinkStyle(token, "dangerous"),
  ...getStatusLinkStyle(token, "success"),
  ...getStatusLinkStyle(token, "warning")
});
const getStatusTextStyle = (token, status) => {
  const { color, colorHover, colorBg } = getColorByStatus(token, status);
  return {
    [`&${token.componentCls}-${status}`]: {
      color,
      ...genPureDisabledButtonStyle(token),
      ...genHoverActiveButtonStyle(
        {
          color: colorHover,
          backgroundColor: colorBg
        },
        {
          color: colorHover,
          backgroundColor: colorBg
        }
      )
    }
  };
};
const genTextButtonStyle = (token) => ({
  ...genHoverActiveButtonStyle(
    {
      color: token.colorText,
      backgroundColor: token.colorBgTextHover
    },
    {
      color: token.colorText,
      backgroundColor: token.colorBgTextActive
    }
  ),
  ...genPureDisabledButtonStyle(token),
  ...getStatusTextStyle(token, "dangerous"),
  ...getStatusTextStyle(token, "success"),
  ...getStatusTextStyle(token, "warning")
});
const genDisabledButtonStyle = (token) => ({
  ...genDisabledStyle(token),
  [`&${token.componentCls}:hover`]: {
    ...genDisabledStyle(token)
  }
});
const genTypeButtonStyle = (token) => {
  const { componentCls } = token;
  return {
    [`${componentCls}-default`]: genDefaultButtonStyle(token),
    [`${componentCls}-primary`]: genPrimaryButtonStyle(token),
    [`${componentCls}-dashed`]: genDashedButtonStyle(token),
    [`${componentCls}-link`]: genLinkButtonStyle(token),
    [`${componentCls}-text`]: genTextButtonStyle(token),
    [`${componentCls}-disabled`]: genDisabledButtonStyle(token)
  };
};
function genSizeButtonStyle(token, sizePrefixCls = "") {
  const {
    componentCls,
    iconCls,
    controlHeight,
    fontSize,
    lineHeight,
    lineWidth,
    borderRadius,
    buttonPaddingHorizontal
  } = token;
  const paddingVertical = Math.max(0, (controlHeight - fontSize * lineHeight) / 2 - lineWidth);
  const paddingHorizontal = buttonPaddingHorizontal - lineWidth;
  const iconOnlyCls = `${componentCls}-icon-only`;
  return [
    // Size
    {
      [`${componentCls}${sizePrefixCls}`]: {
        fontSize,
        height: controlHeight,
        padding: `${paddingVertical}px ${paddingHorizontal}px`,
        borderRadius,
        [`&${iconOnlyCls}`]: {
          width: controlHeight,
          paddingInlineStart: 0,
          paddingInlineEnd: 0,
          [`&${componentCls}-round`]: {
            width: "auto"
          },
          [iconCls]: {
            fontSize: token.buttonIconOnlyFontSize
          }
        },
        // Loading
        [`&${componentCls}-loading`]: {
          opacity: token.opacityLoading,
          cursor: "default"
        },
        [`${componentCls}-loading-icon`]: {
          transition: `width ${token.motionDurationSlow} ${token.motionEaseInOut}, opacity ${token.motionDurationSlow} ${token.motionEaseInOut}`
        },
        [`&:not(${iconOnlyCls}) ${componentCls}-loading-icon > ${iconCls}`]: {
          marginInlineEnd: token.marginXS
        }
      }
    },
    // Shape - patch prefixCls again to override solid border radius style
    {
      [`${componentCls}${componentCls}-circle${sizePrefixCls}`]: genCircleButtonStyle(token)
    },
    {
      [`${componentCls}${componentCls}-round${sizePrefixCls}`]: genRoundButtonStyle(token)
    }
  ];
}
const genSizeBaseButtonStyle = (token) => genSizeButtonStyle(token);
const genSizeSmallButtonStyle = (token) => {
  const smallToken = merge(token, {
    controlHeight: token.controlHeightSM,
    padding: token.paddingXS,
    buttonPaddingHorizontal: 8,
    // Fixed padding
    borderRadius: token.borderRadiusSM,
    buttonIconOnlyFontSize: token.fontSizeLG - 2
  });
  return genSizeButtonStyle(smallToken, `${token.componentCls}-sm`);
};
const genSizeLargeButtonStyle = (token) => {
  const largeToken = merge(token, {
    controlHeight: token.controlHeightLG,
    fontSize: token.fontSizeLG,
    borderRadius: token.borderRadiusLG,
    buttonIconOnlyFontSize: token.fontSizeLG + 2
  });
  return genSizeButtonStyle(largeToken, `${token.componentCls}-lg`);
};
const genBlockButtonStyle = (token) => {
  const { componentCls } = token;
  return {
    [componentCls]: {
      [`&${componentCls}-block`]: {
        width: "100%"
      }
    }
  };
};
var useStyle = genComponentStyleHook("Button", (token) => {
  const { controlTmpOutline, paddingContentHorizontal } = token;
  const buttonToken = merge(token, {
    colorOutlineDefault: controlTmpOutline,
    buttonPaddingHorizontal: paddingContentHorizontal,
    buttonIconOnlyFontSize: token.fontSizeLG,
    buttonFontWeight: 400
  });
  return [
    // Shared
    genSharedButtonStyle(buttonToken),
    // Size
    genSizeSmallButtonStyle(buttonToken),
    genSizeBaseButtonStyle(buttonToken),
    genSizeLargeButtonStyle(buttonToken),
    // Block
    genBlockButtonStyle(buttonToken),
    // Group (type, ghost, danger,warning,success, disabled, loading)
    genTypeButtonStyle(buttonToken),
    // Button Group
    genGroupStyle(buttonToken),
    // Space Compact
    genCompactItemStyle(token),
    genCompactItemVerticalStyle(token)
  ];
});

export { useStyle as default };
//# sourceMappingURL=index.mjs.map
