import _extends from "@babel/runtime/helpers/esm/extends";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import { TinyColor } from '@ctrl/tinycolor';
import { genComponentStyleHook, mergeToken } from '../../theme';
import { resetComponent } from '../../style';

var genSwitchSmallStyle = function genSwitchSmallStyle(token) {
  var _$concat, _$concat2;

  return _defineProperty({}, "&".concat(token.componentCls, "-small"), (_$concat2 = {
    minWidth: token.switchMinWidthSM,
    height: token.switchHeightSM,
    lineHeight: "".concat(token.switchHeightSM, "px")
  }, _defineProperty(_$concat2, "".concat(token.componentCls, "-inner"), {
    marginInlineStart: token.switchInnerMarginMaxSM,
    marginInlineEnd: token.switchInnerMarginMinSM,
    fontSize: token.fontSizeSM
  }), _defineProperty(_$concat2, "".concat(token.componentCls, "-handle"), {
    width: token.switchPinSizeSM,
    height: token.switchPinSizeSM
  }), _defineProperty(_$concat2, "".concat(token.componentCls, "-loading-icon"), {
    top: (token.switchPinSizeSM - token.switchLoadingIconSize) / 2,
    fontSize: token.switchLoadingIconSize
  }), _defineProperty(_$concat2, "&".concat(token.componentCls, "-checked"), (_$concat = {}, _defineProperty(_$concat, "".concat(token.componentCls, "-inner"), {
    marginInlineStart: token.switchInnerMarginMinSM,
    marginInlineEnd: token.switchInnerMarginMaxSM
  }), _defineProperty(_$concat, "".concat(token.componentCls, "-handle"), {
    insetInlineStart: "calc(100% - ".concat(token.switchPinSizeSM + token.switchPadding, "px)")
  }), _$concat)), _$concat2));
};

var genSwitchLoadingStyle = function genSwitchLoadingStyle(token) {
  var _ref2;

  return _ref2 = {}, _defineProperty(_ref2, "".concat(token.componentCls, "-loading-icon").concat(token.iconCls), {
    position: 'relative',
    top: (token.switchPinSize - token.fontSize) / 2,
    color: token.switchLoadingIconColor,
    verticalAlign: 'top'
  }), _defineProperty(_ref2, "&".concat(token.componentCls, "-checked ").concat(token.componentCls, "-loading-icon"), {
    color: token.switchColor
  }), _ref2;
};

var genSwitchHandleStyle = function genSwitchHandleStyle(token) {
  var _not$concat, _ref3;

  var switchHandleCls = "".concat(token.componentCls, "-handle");
  return _ref3 = {}, _defineProperty(_ref3, switchHandleCls, {
    position: 'absolute',
    top: token.switchPadding,
    insetInlineStart: token.switchPadding,
    width: token.switchPinSize,
    height: token.switchPinSize,
    transition: "all ".concat(token.switchDuration, " ease-in-out"),
    '&::before': {
      position: 'absolute',
      top: 0,
      insetInlineEnd: 0,
      bottom: 0,
      insetInlineStart: 0,
      backgroundColor: token.switchBg,
      borderRadius: token.switchPinSize / 2,
      boxShadow: token.switchHandleShadow,
      transition: "all ".concat(token.switchDuration, " ease-in-out"),
      content: '""'
    }
  }), _defineProperty(_ref3, "&".concat(token.componentCls, "-checked ").concat(switchHandleCls), {
    insetInlineStart: "calc(100% - ".concat(token.switchPinSize + token.switchPadding, "px)")
  }), _defineProperty(_ref3, "&:not(".concat(token.componentCls, "-disabled):active"), (_not$concat = {}, _defineProperty(_not$concat, "".concat(switchHandleCls, "::before"), {
    insetInlineEnd: token.switchHandleActiveInset,
    insetInlineStart: 0
  }), _defineProperty(_not$concat, "&".concat(token.componentCls, "-checked ").concat(switchHandleCls, "::before"), {
    insetInlineEnd: 0,
    insetInlineStart: token.switchHandleActiveInset
  }), _not$concat)), _ref3;
};

var genSwitchInnerStyle = function genSwitchInnerStyle(token) {
  var _ref4;

  var switchInnerCls = "".concat(token.componentCls, "-inner");
  return _ref4 = {}, _defineProperty(_ref4, switchInnerCls, {
    display: 'block',
    marginInlineEnd: token.switchInnerMarginMin,
    marginInlineStart: token.switchInnerMarginMax,
    color: token.colorTextLightSolid,
    fontSize: token.fontSizeSM,
    transition: "margin-inline-end ".concat(token.switchDuration, ", margin-inline-start ").concat(token.switchDuration)
  }), _defineProperty(_ref4, "&".concat(token.componentCls, "-checked ").concat(switchInnerCls), {
    marginInlineEnd: token.switchInnerMarginMax,
    marginInlineStart: token.switchInnerMarginMin
  }), _ref4;
};

var genSwitchStyle = function genSwitchStyle(token) {
  var _extends2;

  var componentCls = token.componentCls;
  return _defineProperty({}, componentCls, _extends(_extends(_extends(_extends(_extends(_extends(_extends({}, resetComponent(token)), (_extends2 = {
    position: 'relative',
    display: 'inline-block',
    boxSizing: 'border-box',
    minWidth: token.switchMinWidth,
    height: token.switchHeight,
    lineHeight: "".concat(token.switchHeight, "px"),
    verticalAlign: 'middle',
    backgroundImage: "linear-gradient(to right, ".concat(token.colorTextDisabled, ", ").concat(token.colorTextDisabled, "), linear-gradient(to right, ").concat(token.colorBgContainer, ", ").concat(token.colorBgContainer, ")"),
    border: '0',
    borderRadius: 100,
    cursor: 'pointer',
    transition: "all ".concat(token.switchDuration),
    userSelect: 'none',
    '&:focus-visible': {
      outline: 0,
      boxShadow: "0 0 0 ".concat(token.controlOutlineWidth, "px ").concat(token.controlTmpOutline)
    }
  }, _defineProperty(_extends2, "&".concat(token.componentCls, "-checked:focus-visible"), {
    boxShadow: "0 0 0 ".concat(token.controlOutlineWidth, "px ").concat(token.controlOutline)
  }), _defineProperty(_extends2, '&:focus:hover', {
    boxShadow: 'none'
  }), _defineProperty(_extends2, "&".concat(token.componentCls, "-checked"), {
    background: token.switchColor
  }), _defineProperty(_extends2, "&".concat(token.componentCls, "-loading, &").concat(token.componentCls, "-disabled"), {
    cursor: 'not-allowed',
    opacity: token.switchDisabledOpacity,
    '*': {
      boxShadow: 'none',
      cursor: 'not-allowed'
    }
  }), _extends2)), genSwitchInnerStyle(token)), genSwitchHandleStyle(token)), genSwitchLoadingStyle(token)), genSwitchSmallStyle(token)), _defineProperty({}, "&".concat(token.componentCls, "-rtl"), {
    direction: 'rtl'
  })));
}; // ============================== Export ==============================


export default genComponentStyleHook('Switch', function (token) {
  var switchHeight = token.fontSize * token.lineHeight;
  var switchHeightSM = token.controlHeight / 2;
  var switchPadding = token.paddingXXS / 2;
  var switchPinSize = switchHeight - switchPadding * 2;
  var switchPinSizeSM = switchHeightSM - switchPadding * 2;
  var switchToken = mergeToken(token, {
    switchMinWidth: switchPinSize * 2 + switchPadding * 4,
    switchHeight: switchHeight,
    switchDuration: token.motionDurationMid,
    switchColor: token.colorPrimary,
    switchDisabledOpacity: token.opacityLoading,
    switchInnerMarginMin: switchPinSize / 2,
    switchInnerMarginMax: switchPinSize + switchPadding + token.paddingXXS,
    switchPadding: switchPadding,
    switchPinSize: switchPinSize,
    switchBg: token.colorBgContainer,
    switchMinWidthSM: switchPinSizeSM * 2 + switchPadding * 2,
    switchHeightSM: switchHeightSM,
    switchInnerMarginMinSM: switchPinSizeSM / 2,
    switchInnerMarginMaxSM: switchPinSizeSM + switchPadding + token.paddingXXS,
    switchPinSizeSM: switchPinSizeSM,
    switchHandleShadow: "0 2px 4px 0 ".concat(new TinyColor('#00230b').setAlpha(0.2).toRgbString()),
    switchLoadingIconSize: token.fontSizeIcon * 0.75,
    switchLoadingIconColor: "rgba(0, 0, 0, ".concat(token.opacityLoading, ")"),
    switchHandleActiveInset: '-30%'
  });
  return [genSwitchStyle(switchToken)];
});