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 { unit as e } from "../../../../@ant-design/cssinjs/es/util/index.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 "../../../../rc-util/es/warning.mjs";
import "../../../../@ant-design/cssinjs/es/theme/createTheme.mjs";
import "../../../../@ant-design/cssinjs/es/theme/ThemeCache.mjs";
import "../../../../@ant-design/cssinjs/es/transformers/legacyLogicalProperties.mjs";
import { genStyleHooks as I } from "../../theme/util/genComponentStyleHook.mjs";
import { merge as y } from "../../theme/util/statistic.mjs";
import v from "./motion.mjs";
const z = (t) => {
  const {
    componentCls: o,
    zIndexPopup: i,
    colorBgMask: s,
    colorBgElevated: a,
    motionDurationSlow: m,
    motionDurationMid: c,
    padding: x,
    paddingLG: l,
    fontSizeLG: r,
    lineHeightLG: d,
    lineWidth: p,
    lineType: g,
    colorSplit: h,
    marginSM: f,
    colorIcon: w,
    colorIconHover: b,
    colorText: S,
    fontWeightStrong: u,
    footerPaddingBlock: $,
    footerPaddingInline: D
  } = t, n = `${o}-content-wrapper`;
  return {
    [o]: {
      position: "fixed",
      inset: 0,
      zIndex: i,
      pointerEvents: "none",
      "&-pure": {
        position: "relative",
        background: a,
        [`&${o}-left`]: {
          boxShadow: t.boxShadowDrawerLeft
        },
        [`&${o}-right`]: {
          boxShadow: t.boxShadowDrawerRight
        },
        [`&${o}-top`]: {
          boxShadow: t.boxShadowDrawerUp
        },
        [`&${o}-bottom`]: {
          boxShadow: t.boxShadowDrawerDown
        }
      },
      "&-inline": {
        position: "absolute"
      },
      // ====================== Mask ======================
      [`${o}-mask`]: {
        position: "absolute",
        inset: 0,
        zIndex: i,
        background: s,
        pointerEvents: "auto"
      },
      // ==================== Content =====================
      [n]: {
        position: "absolute",
        zIndex: i,
        maxWidth: "100vw",
        transition: `all ${m}`,
        "&-hidden": {
          display: "none"
        }
      },
      // Placement
      [`&-left > ${n}`]: {
        top: 0,
        bottom: 0,
        left: {
          _skip_check_: !0,
          value: 0
        },
        boxShadow: t.boxShadowDrawerLeft
      },
      [`&-right > ${n}`]: {
        top: 0,
        right: {
          _skip_check_: !0,
          value: 0
        },
        bottom: 0,
        boxShadow: t.boxShadowDrawerRight
      },
      [`&-top > ${n}`]: {
        top: 0,
        insetInline: 0,
        boxShadow: t.boxShadowDrawerUp
      },
      [`&-bottom > ${n}`]: {
        bottom: 0,
        insetInline: 0,
        boxShadow: t.boxShadowDrawerDown
      },
      [`${o}-content`]: {
        width: "100%",
        height: "100%",
        overflow: "auto",
        background: a,
        pointerEvents: "auto"
      },
      // ===================== Panel ======================
      [`${o}-wrapper-body`]: {
        display: "flex",
        flexDirection: "column",
        width: "100%",
        height: "100%"
      },
      // Header
      [`${o}-header`]: {
        display: "flex",
        flex: 0,
        alignItems: "center",
        padding: `${e(x)} ${e(l)}`,
        fontSize: r,
        lineHeight: d,
        borderBottom: `${e(p)} ${g} ${h}`,
        "&-title": {
          display: "flex",
          flex: 1,
          alignItems: "center",
          minWidth: 0,
          minHeight: 0
        }
      },
      [`${o}-extra`]: {
        flex: "none"
      },
      [`${o}-close`]: {
        display: "inline-block",
        marginInlineEnd: f,
        color: w,
        fontWeight: u,
        fontSize: r,
        fontStyle: "normal",
        lineHeight: 1,
        textAlign: "center",
        textTransform: "none",
        textDecoration: "none",
        background: "transparent",
        border: 0,
        outline: 0,
        cursor: "pointer",
        transition: `color ${c}`,
        textRendering: "auto",
        "&:focus, &:hover": {
          color: b,
          textDecoration: "none"
        }
      },
      [`${o}-title`]: {
        flex: 1,
        margin: 0,
        color: S,
        fontWeight: t.fontWeightStrong,
        fontSize: r,
        lineHeight: d
      },
      // Body
      [`${o}-body`]: {
        flex: 1,
        minWidth: 0,
        minHeight: 0,
        padding: l,
        overflow: "auto"
      },
      // Footer
      [`${o}-footer`]: {
        flexShrink: 0,
        padding: `${e($)} ${e(D)}`,
        borderTop: `${e(p)} ${g} ${h}`
      },
      // ====================== RTL =======================
      "&-rtl": {
        direction: "rtl"
      }
    }
  };
}, H = (t) => ({
  zIndexPopup: t.zIndexPopupBase,
  footerPaddingBlock: t.paddingXS,
  footerPaddingInline: t.padding
}), j = I("Drawer", (t) => {
  const o = y(t, {});
  return [z(o), v(o)];
}, H);
export {
  j as default,
  H as prepareComponentToken
};
