import "../../../../@ant-design/cssinjs/es/extractStyle.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useCacheToken.mjs";
import "react";
import "../../../../@ant-design/cssinjs/es/StyleContext.mjs";
import "../../../../@ant-design/cssinjs/es/theme/createTheme.mjs";
import "../../../../rc-util/es/warning.mjs";
import "../../../../@ant-design/cssinjs/es/theme/ThemeCache.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useCompatibleInsertionEffect.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useEffectCleanupRegister.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useHMR.mjs";
import s from "../../../../@ant-design/cssinjs/es/Keyframes.mjs";
import "../../../../@ant-design/cssinjs/es/transformers/legacyLogicalProperties.mjs";
import { CONTAINER_MAX_OFFSET as h } from "../../_util/hooks/useZIndex.mjs";
import { resetComponent as I } from "../../style/index.mjs";
import { genStyleHooks as O } from "../../theme/util/genComponentStyleHook.mjs";
import { merge as P } from "../../theme/util/statistic.mjs";
const w = (n) => {
  const {
    componentCls: o,
    iconCls: e,
    boxShadow: c,
    colorText: l,
    colorSuccess: g,
    colorError: d,
    colorWarning: u,
    colorInfo: $,
    fontSizeLG: v,
    motionEaseInOutCirc: i,
    motionDurationSlow: a,
    marginXS: r,
    paddingXS: t,
    borderRadiusLG: S,
    zIndexPopup: f,
    // Custom token
    contentPadding: x,
    contentBg: y
  } = n, p = `${o}-notice`, b = new s("MessageMoveIn", {
    "0%": {
      padding: 0,
      transform: "translateY(-100%)",
      opacity: 0
    },
    "100%": {
      padding: t,
      transform: "translateY(0)",
      opacity: 1
    }
  }), M = new s("MessageMoveOut", {
    "0%": {
      maxHeight: n.height,
      padding: t,
      opacity: 1
    },
    "100%": {
      maxHeight: 0,
      padding: 0,
      opacity: 0
    }
  }), m = {
    padding: t,
    textAlign: "center",
    [`${o}-custom-content > ${e}`]: {
      verticalAlign: "text-bottom",
      marginInlineEnd: r,
      // affected by ltr or rtl
      fontSize: v
    },
    [`${p}-content`]: {
      display: "inline-block",
      padding: x,
      background: y,
      borderRadius: S,
      boxShadow: c,
      pointerEvents: "all"
    },
    [`${o}-success > ${e}`]: {
      color: g
    },
    [`${o}-error > ${e}`]: {
      color: d
    },
    [`${o}-warning > ${e}`]: {
      color: u
    },
    [`${o}-info > ${e},
      ${o}-loading > ${e}`]: {
      color: $
    }
  };
  return [
    // ============================ Holder ============================
    {
      [o]: Object.assign(Object.assign({}, I(n)), {
        color: l,
        position: "fixed",
        top: r,
        width: "100%",
        pointerEvents: "none",
        zIndex: f,
        [`${o}-move-up`]: {
          animationFillMode: "forwards"
        },
        [`
        ${o}-move-up-appear,
        ${o}-move-up-enter
      `]: {
          animationName: b,
          animationDuration: a,
          animationPlayState: "paused",
          animationTimingFunction: i
        },
        [`
        ${o}-move-up-appear${o}-move-up-appear-active,
        ${o}-move-up-enter${o}-move-up-enter-active
      `]: {
          animationPlayState: "running"
        },
        [`${o}-move-up-leave`]: {
          animationName: M,
          animationDuration: a,
          animationPlayState: "paused",
          animationTimingFunction: i
        },
        [`${o}-move-up-leave${o}-move-up-leave-active`]: {
          animationPlayState: "running"
        },
        "&-rtl": {
          direction: "rtl",
          span: {
            direction: "rtl"
          }
        }
      })
    },
    // ============================ Notice ============================
    {
      [o]: {
        [`${p}-wrapper`]: Object.assign({}, m)
      }
    },
    // ============================= Pure =============================
    {
      [`${o}-notice-pure-panel`]: Object.assign(Object.assign({}, m), {
        padding: 0,
        textAlign: "start"
      })
    }
  ];
}, E = (n) => ({
  zIndexPopup: n.zIndexPopupBase + h + 10,
  contentBg: n.colorBgElevated,
  contentPadding: `${(n.controlHeightLG - n.fontSize * n.lineHeight) / 2}px ${n.paddingSM}px`
}), K = O("Message", (n) => {
  const o = P(n, {
    height: 150
  });
  return [w(o)];
}, E);
export {
  K as default,
  E as prepareComponentToken
};
