import { resetComponent as $ } from "../../style/index.mjs";
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 l } 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 v } from "../../theme/util/genComponentStyleHook.mjs";
import { merge as B } from "../../theme/util/statistic.mjs";
import { TinyColor as C } from "../../../../@ctrl/tinycolor/dist/module/index.mjs";
const z = (r) => {
  const {
    componentCls: o,
    antCls: e,
    controlSize: a,
    dotSize: d,
    marginFull: n,
    marginPart: c,
    colorFillContentHover: t,
    handleColorDisabled: u,
    calc: i
  } = r;
  return {
    [o]: Object.assign(Object.assign({}, $(r)), {
      position: "relative",
      height: a,
      margin: `${l(c)} ${l(n)}`,
      padding: 0,
      cursor: "pointer",
      touchAction: "none",
      "&-vertical": {
        margin: `${l(n)} ${l(c)}`
      },
      [`${o}-rail`]: {
        position: "absolute",
        backgroundColor: r.railBg,
        borderRadius: r.borderRadiusXS,
        transition: `background-color ${r.motionDurationMid}`
      },
      [`${o}-track,${o}-tracks`]: {
        position: "absolute",
        transition: `background-color ${r.motionDurationMid}`
      },
      [`${o}-track`]: {
        backgroundColor: r.trackBg,
        borderRadius: r.borderRadiusXS
      },
      [`${o}-track-draggable`]: {
        boxSizing: "content-box",
        backgroundClip: "content-box",
        border: "solid rgba(0,0,0,0)"
      },
      "&:hover": {
        [`${o}-rail`]: {
          backgroundColor: r.railHoverBg
        },
        [`${o}-track`]: {
          backgroundColor: r.trackHoverBg
        },
        [`${o}-dot`]: {
          borderColor: t
        },
        [`${o}-handle::after`]: {
          boxShadow: `0 0 0 ${l(r.handleLineWidth)} ${r.colorPrimaryBorderHover}`
        },
        [`${o}-dot-active`]: {
          borderColor: r.dotActiveBorderColor
        }
      },
      [`${o}-handle`]: {
        position: "absolute",
        width: r.handleSize,
        height: r.handleSize,
        outline: "none",
        // 扩大选区
        "&::before": {
          content: '""',
          position: "absolute",
          insetInlineStart: i(r.handleLineWidth).mul(-1).equal(),
          insetBlockStart: i(r.handleLineWidth).mul(-1).equal(),
          width: i(r.handleSize).add(i(r.handleLineWidth).mul(2)).equal(),
          height: i(r.handleSize).add(i(r.handleLineWidth).mul(2)).equal(),
          backgroundColor: "transparent"
        },
        "&::after": {
          content: '""',
          position: "absolute",
          insetBlockStart: 0,
          insetInlineStart: 0,
          width: r.handleSize,
          height: r.handleSize,
          backgroundColor: r.colorBgElevated,
          boxShadow: `0 0 0 ${l(r.handleLineWidth)} ${r.handleColor}`,
          borderRadius: "50%",
          cursor: "pointer",
          transition: `
            inset-inline-start ${r.motionDurationMid},
            inset-block-start ${r.motionDurationMid},
            width ${r.motionDurationMid},
            height ${r.motionDurationMid},
            box-shadow ${r.motionDurationMid}
          `
        },
        "&:hover, &:active, &:focus": {
          "&::before": {
            // -(
            //   (token.handleSizeHover - token.handleSize) / 2 +
            //   token.handleLineWidthHover
            // ),
            insetInlineStart: i(r.handleSizeHover).sub(r.handleSize).div(2).add(r.handleLineWidthHover).mul(-1).equal(),
            insetBlockStart: i(r.handleSizeHover).sub(r.handleSize).div(2).add(r.handleLineWidthHover).mul(-1).equal(),
            width: i(r.handleSizeHover).add(i(r.handleLineWidthHover).mul(2)).equal(),
            height: i(r.handleSizeHover).add(i(r.handleLineWidthHover).mul(2)).equal()
          },
          "&::after": {
            boxShadow: `0 0 0 ${l(r.handleLineWidthHover)} ${r.handleActiveColor}`,
            width: r.handleSizeHover,
            height: r.handleSizeHover,
            insetInlineStart: r.calc(r.handleSize).sub(r.handleSizeHover).div(2).equal(),
            insetBlockStart: r.calc(r.handleSize).sub(r.handleSizeHover).div(2).equal()
          }
        }
      },
      [`${o}-mark`]: {
        position: "absolute",
        fontSize: r.fontSize
      },
      [`${o}-mark-text`]: {
        position: "absolute",
        display: "inline-block",
        color: r.colorTextDescription,
        textAlign: "center",
        wordBreak: "keep-all",
        cursor: "pointer",
        userSelect: "none",
        "&-active": {
          color: r.colorText
        }
      },
      [`${o}-step`]: {
        position: "absolute",
        background: "transparent",
        pointerEvents: "none"
      },
      [`${o}-dot`]: {
        position: "absolute",
        width: d,
        height: d,
        backgroundColor: r.colorBgElevated,
        border: `${l(r.handleLineWidth)} solid ${r.dotBorderColor}`,
        borderRadius: "50%",
        cursor: "pointer",
        transition: `border-color ${r.motionDurationSlow}`,
        pointerEvents: "auto",
        "&-active": {
          borderColor: r.dotActiveBorderColor
        }
      },
      [`&${o}-disabled`]: {
        cursor: "not-allowed",
        [`${o}-rail`]: {
          backgroundColor: `${r.railBg} !important`
        },
        [`${o}-track`]: {
          backgroundColor: `${r.trackBgDisabled} !important`
        },
        [`
          ${o}-dot
        `]: {
          backgroundColor: r.colorBgElevated,
          borderColor: r.trackBgDisabled,
          boxShadow: "none",
          cursor: "not-allowed"
        },
        [`${o}-handle::after`]: {
          backgroundColor: r.colorBgElevated,
          cursor: "not-allowed",
          width: r.handleSize,
          height: r.handleSize,
          boxShadow: `0 0 0 ${l(r.handleLineWidth)} ${u}`,
          insetInlineStart: 0,
          insetBlockStart: 0
        },
        [`
          ${o}-mark-text,
          ${o}-dot
        `]: {
          cursor: "not-allowed !important"
        }
      },
      [`&-tooltip ${e}-tooltip-inner`]: {
        minWidth: "unset"
      }
    })
  };
}, m = (r, o) => {
  const {
    componentCls: e,
    railSize: a,
    handleSize: d,
    dotSize: n,
    marginFull: c,
    calc: t
  } = r, u = o ? "paddingBlock" : "paddingInline", i = o ? "width" : "height", s = o ? "height" : "width", g = o ? "insetBlockStart" : "insetInlineStart", b = o ? "top" : "insetInlineStart", S = t(a).mul(3).sub(d).div(2).equal(), h = t(d).sub(a).div(2).equal(), p = o ? {
    borderWidth: `${l(h)} 0`,
    transform: `translateY(${l(t(h).mul(-1).equal())})`
  } : {
    borderWidth: `0 ${l(h)}`,
    transform: `translateX(${l(r.calc(h).mul(-1).equal())})`
  };
  return {
    [u]: a,
    [s]: t(a).mul(3).equal(),
    [`${e}-rail`]: {
      [i]: "100%",
      [s]: a
    },
    [`${e}-track,${e}-tracks`]: {
      [s]: a
    },
    [`${e}-track-draggable`]: Object.assign({}, p),
    [`${e}-handle`]: {
      [g]: S
    },
    [`${e}-mark`]: {
      // Reset all
      insetInlineStart: 0,
      top: 0,
      // https://github.com/ant-design/ant-design/issues/43731
      [b]: t(a).mul(3).add(o ? 0 : c).equal(),
      [i]: "100%"
    },
    [`${e}-step`]: {
      // Reset all
      insetInlineStart: 0,
      top: 0,
      [b]: a,
      [i]: "100%",
      [s]: a
    },
    [`${e}-dot`]: {
      position: "absolute",
      [g]: t(a).sub(n).div(2).equal()
    }
  };
}, H = (r) => {
  const {
    componentCls: o,
    marginPartWithMark: e
  } = r;
  return {
    [`${o}-horizontal`]: Object.assign(Object.assign({}, m(r, !0)), {
      [`&${o}-with-marks`]: {
        marginBottom: e
      }
    })
  };
}, W = (r) => {
  const {
    componentCls: o
  } = r;
  return {
    [`${o}-vertical`]: Object.assign(Object.assign({}, m(r, !1)), {
      height: "100%"
    })
  };
}, w = (r) => {
  const e = r.controlHeightLG / 4, a = r.controlHeightSM / 2, d = r.lineWidth + 1, n = r.lineWidth + 1 * 3;
  return {
    controlSize: e,
    railSize: 4,
    handleSize: e,
    handleSizeHover: a,
    dotSize: 8,
    handleLineWidth: d,
    handleLineWidthHover: n,
    railBg: r.colorFillTertiary,
    railHoverBg: r.colorFillSecondary,
    trackBg: r.colorPrimaryBorder,
    trackHoverBg: r.colorPrimaryBorderHover,
    handleColor: r.colorPrimaryBorder,
    handleActiveColor: r.colorPrimary,
    handleColorDisabled: new C(r.colorTextDisabled).onBackground(r.colorBgContainer).toHexShortString(),
    dotBorderColor: r.colorBorderSecondary,
    dotActiveBorderColor: r.colorPrimaryBorder,
    trackBgDisabled: r.colorBgContainerDisabled
  };
}, X = v("Slider", (r) => {
  const o = B(r, {
    marginPart: r.calc(r.controlHeight).sub(r.controlSize).div(2).equal(),
    marginFull: r.calc(r.controlSize).div(2).equal(),
    marginPartWithMark: r.calc(r.controlHeightLG).sub(r.controlSize).equal()
  });
  return [z(o), H(o), W(o)];
}, w);
export {
  X as default,
  w as prepareComponentToken
};
