import _extends from "@babel/runtime/helpers/esm/extends";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import { TinyColor } from '@ctrl/tinycolor';
import { genActiveStyle, genBasicInputStyle, genHoverStyle, initInputToken } from '../../input/style/css';
import { slideDownIn, slideDownOut, slideUpIn, slideUpOut } from '../../style/motion';
import { genComponentStyleHook, mergeToken } from '../../theme';
import { resetComponent, roundedArrow } from '../../style/css';

var genPikerPadding = function genPikerPadding(token, inputHeight, fontSize, paddingHorizontal) {
  var fontHeight = Math.floor(fontSize * token.lineHeight) + 2;
  var paddingTop = Math.max((inputHeight - fontHeight) / 2, 0);
  var paddingBottom = Math.max(inputHeight - fontHeight - paddingTop, 0);
  return {
    padding: "".concat(paddingTop, "px ").concat(paddingHorizontal, "px ").concat(paddingBottom, "px")
  };
};

var genPickerCellInnerStyle = function genPickerCellInnerStyle(token) {
  var _disabled, _ref;

  var componentCls = token.componentCls,
      pickerCellInnerCls = token.pickerCellInnerCls;
  return _ref = {
    '&::before': {
      position: 'absolute',
      top: '50%',
      insetInlineStart: 0,
      insetInlineEnd: 0,
      zIndex: 1,
      height: token.pickerPanelCellHeight,
      transform: 'translateY(-50%)',
      transition: "all ".concat(token.motionDurationSlow),
      content: '""'
    }
  }, _defineProperty(_ref, pickerCellInnerCls, {
    position: 'relative',
    zIndex: 2,
    display: 'inline-block',
    minWidth: token.pickerPanelCellHeight,
    height: token.pickerPanelCellHeight,
    lineHeight: "".concat(token.pickerPanelCellHeight, "px"),
    borderRadius: token.radiusBase,
    transition: "background ".concat(token.motionDurationSlow, ", border ").concat(token.motionDurationSlow)
  }), _defineProperty(_ref, "&:hover:not(&-in-view),\n    &:hover:not(&-selected):not(&-range-start):not(&-range-end):not(&-range-hover-start):not(&-range-hover-end)", _defineProperty({}, pickerCellInnerCls, {
    background: token.controlItemBgHover
  })), _defineProperty(_ref, "&-in-view:is(&-today) ".concat(pickerCellInnerCls), {
    '&::before': {
      position: 'absolute',
      top: 0,
      insetInlineEnd: 0,
      bottom: 0,
      insetInlineStart: 0,
      zIndex: 1,
      border: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorPrimary),
      borderRadius: token.radiusBase,
      content: '""'
    }
  }), _defineProperty(_ref, '&-in-view:is(&-in-range)', {
    position: 'relative',
    '&::before': {
      background: token.controlItemBgActive
    }
  }), _defineProperty(_ref, "&-in-view:is(&-selected) ".concat(pickerCellInnerCls, ",\n    &-in-view:is(&-range-start) ").concat(pickerCellInnerCls, ",\n    &-in-view:is(&-range-end) ").concat(pickerCellInnerCls), {
    color: token.colorTextLightSolid,
    background: token.colorPrimary
  }), _defineProperty(_ref, "&-in-view:is(&-range-start):not(&-range-start-single),\n      &-in-view:is(&-range-end):not(&-range-end-single)", {
    '&::before': {
      background: token.controlItemBgActive
    }
  }), _defineProperty(_ref, '&-in-view:is(&-range-start)::before', {
    insetInlineStart: '50%'
  }), _defineProperty(_ref, '&-in-view:is(&-range-end)::before', {
    insetInlineEnd: '50%'
  }), _defineProperty(_ref, "&-in-view:is(&-range-hover-start):not(&-in-range):not(&-range-start):not(&-range-end),\n      &-in-view:is(&-range-hover-end):not(&-in-range):not(&-range-start):not(&-range-end),\n      &-in-view:is(&-range-hover-start):is(&-range-start-single),\n      &-in-view:is(&-range-hover-start):is(&-range-start):is(&-range-end):is(&-range-end-near-hover),\n      &-in-view:is(&-range-hover-end):is(&-range-start):is(&-range-end):is(&-range-start-near-hover),\n      &-in-view:is(&-range-hover-end):is(&-range-end-single),\n      &-in-view:is(&-range-hover):not(&-in-range)", {
    '&::after': {
      position: 'absolute',
      top: '50%',
      zIndex: 0,
      height: token.controlHeightSM,
      borderTop: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
      borderBottom: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
      transform: 'translateY(-50%)',
      transition: "all ".concat(token.motionDurationSlow),
      content: '""'
    }
  }), _defineProperty(_ref, "&-range-hover-start::after,\n      &-range-hover-end::after,\n      &-range-hover::after", {
    insetInlineEnd: 0,
    insetInlineStart: token.pickerCellBorderGap
  }), _defineProperty(_ref, "&-in-view:is(&-in-range):is(&-range-hover)::before,\n      &-in-view:is(&-range-start):is(&-range-hover)::before,\n      &-in-view:is(&-range-end):is(&-range-hover)::before,\n      &-in-view:is(&-range-start):not(&-range-start-single):is(&-range-hover-start)::before,\n      &-in-view:is(&-range-end):not(&-range-end-single):is(&-range-hover-end)::before,\n      ".concat(componentCls, "-panel\n      > :not(").concat(componentCls, "-date-panel)\n      &-in-view:is(&-in-range):is(&-range-hover-start)::before,\n      ").concat(componentCls, "-panel\n      > :not(").concat(componentCls, "-date-panel)\n      &-in-view:is(&-in-range):is(&-range-hover-end)::before"), {
    background: token.pickerBasicCellHoverWithRangeColor
  }), _defineProperty(_ref, "&-in-view:is(&-range-start):not(&-range-start-single):not(&-range-end) ".concat(pickerCellInnerCls), {
    borderStartStartRadius: token.radiusBase,
    borderEndStartRadius: token.radiusBase,
    borderStartEndRadius: 0,
    borderEndEndRadius: 0
  }), _defineProperty(_ref, "&-in-view:is(&-range-end):not(&-range-end-single):not(&-range-start) ".concat(pickerCellInnerCls), {
    borderStartStartRadius: 0,
    borderEndStartRadius: 0,
    borderStartEndRadius: token.radiusBase,
    borderEndEndRadius: token.radiusBase
  }), _defineProperty(_ref, '&-range-hover:is(&-range-end)::after', {
    insetInlineStart: '50%'
  }), _defineProperty(_ref, "tr > &-in-view:is(&-range-hover):first-child::after,\n      tr > &-in-view:is(&-range-hover-end):first-child::after,\n      &-in-view:is(&-start):is(&-range-hover-edge-start):is(&-range-hover-edge-start-near-range)::after,\n      &-in-view:is(&-range-hover-edge-start):not(&-range-hover-edge-start-near-range)::after,\n      &-in-view:is(&-range-hover-start)::after", {
    insetInlineStart: (token.pickerPanelCellWidth - token.pickerPanelCellHeight) / 2,
    borderInlineStart: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
    borderStartStartRadius: token.controlLineWidth,
    borderEndStartRadius: token.controlLineWidth
  }), _defineProperty(_ref, "tr > &-in-view:is(&-range-hover):last-child::after,\n      tr > &-in-view:is(&-range-hover-start):last-child::after,\n      &-in-view:is(&-end):is(&-range-hover-edge-end):is(&-range-hover-edge-end-near-range)::after,\n      &-in-view:is(&-range-hover-edge-end):not(&-range-hover-edge-end-near-range)::after,\n      &-in-view:is(&-range-hover-end)::after", {
    insetInlineEnd: (token.pickerPanelCellWidth - token.pickerPanelCellHeight) / 2,
    borderInlineEnd: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
    borderStartEndRadius: token.controlLineWidth,
    borderEndEndRadius: token.controlLineWidth
  }), _defineProperty(_ref, '&-disabled', (_disabled = {
    color: token.colorTextDisabled,
    pointerEvents: 'none'
  }, _defineProperty(_disabled, pickerCellInnerCls, {
    background: 'transparent'
  }), _defineProperty(_disabled, '&::before', {
    background: token.colorBgContainerDisabled
  }), _disabled)), _defineProperty(_ref, "&-disabled:is(&-today) ".concat(pickerCellInnerCls, "::before"), {
    borderColor: token.colorTextDisabled
  }), _ref;
};

export var genPanelStyle = function genPanelStyle(token) {
  var _rtl, _decadePanel, _decadePanel2, _yearPanel, _selectedTd, _weekPanel, _datePanel, _datetimePanel, _$concat4, _timePanel, _componentCls;

  var componentCls = token.componentCls,
      pickerCellInnerCls = token.pickerCellInnerCls,
      pickerYearMonthCellWidth = token.pickerYearMonthCellWidth,
      pickerControlIconSize = token.pickerControlIconSize;
  var pickerPanelWidth = token.pickerPanelCellWidth * 7 + token.paddingSM * 2 + 4;
  var hoverCellFixedDistance = (pickerPanelWidth - token.paddingXS * 2) / 3 - pickerYearMonthCellWidth / 2;
  return _defineProperty({}, componentCls, (_componentCls = {
    '&-panel': {
      display: 'inline-flex',
      flexDirection: 'column',
      textAlign: 'center',
      background: token.colorBgContainer,
      border: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorBorder),
      borderRadius: token.radiusBase,
      outline: 'none',
      '&-focused': {
        borderColor: token.colorPrimary
      },
      '&-rtl': (_rtl = {
        direction: 'rtl'
      }, _defineProperty(_rtl, "".concat(componentCls, "-prev-icon,\n              ").concat(componentCls, "-super-prev-icon"), {
        transform: 'rotate(135deg)'
      }), _defineProperty(_rtl, "".concat(componentCls, "-next-icon,\n              ").concat(componentCls, "-super-next-icon"), {
        transform: 'rotate(-45deg)'
      }), _rtl)
    }
  }, _defineProperty(_componentCls, "&-decade-panel,\n        &-year-panel,\n        &-quarter-panel,\n        &-month-panel,\n        &-week-panel,\n        &-date-panel,\n        &-time-panel", {
    display: 'flex',
    flexDirection: 'column',
    width: pickerPanelWidth
  }), _defineProperty(_componentCls, '&-header', {
    display: 'flex',
    padding: "0 ".concat(token.paddingXS, "px"),
    color: token.colorTextHeading,
    borderBottom: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorSplit),
    '> *': {
      flex: 'none'
    },
    button: {
      padding: 0,
      color: token.colorIcon,
      lineHeight: "".concat(token.pickerTextHeight, "px"),
      background: 'transparent',
      border: 0,
      cursor: 'pointer',
      transition: "color ".concat(token.motionDurationSlow)
    },
    '> button': {
      minWidth: '1.6em',
      fontSize: token.fontSize,
      '&:hover': {
        color: token.colorIconHover
      }
    },
    '&-view': {
      flex: 'auto',
      fontWeight: token.fontWeightStrong,
      lineHeight: "".concat(token.pickerTextHeight, "px"),
      button: {
        color: 'inherit',
        fontWeight: 'inherit',
        '&:not(:first-child)': {
          marginInlineStart: token.paddingXS
        },
        '&:hover': {
          color: token.colorPrimary
        }
      }
    }
  }), _defineProperty(_componentCls, "&-prev-icon,\n        &-next-icon,\n        &-super-prev-icon,\n        &-super-next-icon", {
    position: 'relative',
    display: 'inline-block',
    width: pickerControlIconSize,
    height: pickerControlIconSize,
    '&::before': {
      position: 'absolute',
      top: 0,
      insetInlineStart: 0,
      display: 'inline-block',
      width: pickerControlIconSize,
      height: pickerControlIconSize,
      border: "0 solid currentcolor",
      borderBlockStartWidth: token.pickerControlIconBorderWidth,
      borderBlockEndWidth: 0,
      borderInlineStartWidth: token.pickerControlIconBorderWidth,
      borderInlineEndWidth: 0,
      content: '""'
    }
  }), _defineProperty(_componentCls, "&-super-prev-icon,\n        &-super-next-icon", {
    '&::after': {
      position: 'absolute',
      top: Math.ceil(pickerControlIconSize / 2),
      insetInlineStart: Math.ceil(pickerControlIconSize / 2),
      display: 'inline-block',
      width: pickerControlIconSize,
      height: pickerControlIconSize,
      border: '0 solid currentcolor',
      borderBlockStartWidth: token.pickerControlIconBorderWidth,
      borderBlockEndWidth: 0,
      borderInlineStartWidth: token.pickerControlIconBorderWidth,
      borderInlineEndWidth: 0,
      content: '""'
    }
  }), _defineProperty(_componentCls, "&-prev-icon,\n        &-super-prev-icon", {
    transform: 'rotate(-45deg)'
  }), _defineProperty(_componentCls, "&-next-icon,\n        &-super-next-icon", {
    transform: 'rotate(135deg)'
  }), _defineProperty(_componentCls, '&-content', {
    width: '100%',
    tableLayout: 'fixed',
    borderCollapse: 'collapse',
    'th, td': {
      position: 'relative',
      minWidth: token.pickerPanelCellHeight,
      fontWeight: 'normal'
    },
    th: {
      height: token.pickerPanelCellHeight + token.pickerCellPaddingVertical * 2,
      color: token.colorText,
      verticalAlign: 'middle'
    }
  }), _defineProperty(_componentCls, '&-cell', _extends({
    padding: "".concat(token.pickerCellPaddingVertical, "px 0"),
    color: token.colorTextDisabled,
    cursor: 'pointer',
    // In view
    '&-in-view': {
      color: token.colorText
    }
  }, genPickerCellInnerStyle(token))), _defineProperty(_componentCls, "&-date-panel ".concat(componentCls, "-cell-in-view").concat(componentCls, "-cell-in-range").concat(componentCls, "-cell-range-hover-start ").concat(pickerCellInnerCls, ",\n        &-date-panel ").concat(componentCls, "-cell-in-view").concat(componentCls, "-cell-in-range").concat(componentCls, "-cell-range-hover-end ").concat(pickerCellInnerCls), {
    '&::after': {
      position: 'absolute',
      top: 0,
      bottom: 0,
      zIndex: -1,
      background: token.pickerBasicCellHoverWithRangeColor,
      transition: "all ".concat(token.motionDurationSlow),
      content: '""'
    }
  }), _defineProperty(_componentCls, "&-date-panel\n        ".concat(componentCls, "-cell-in-view").concat(componentCls, "-cell-in-range").concat(componentCls, "-cell-range-hover-start\n        ").concat(pickerCellInnerCls, "::after"), {
    insetInlineEnd: (token.pickerPanelCellWidth - token.pickerPanelCellHeight) / 2,
    insetInlineStart: 0
  }), _defineProperty(_componentCls, "&-date-panel ".concat(componentCls, "-cell-in-view").concat(componentCls, "-cell-in-range").concat(componentCls, "-cell-range-hover-end ").concat(pickerCellInnerCls, "::after"), {
    insetInlineEnd: 0,
    insetInlineStart: (token.pickerPanelCellWidth - token.pickerPanelCellHeight) / 2
  }), _defineProperty(_componentCls, '&-range-hover:is(&-range-start)::after', {
    insetInlineEnd: '50%'
  }), _defineProperty(_componentCls, "&-decade-panel,\n        &-year-panel,\n        &-quarter-panel,\n        &-month-panel", (_decadePanel = {}, _defineProperty(_decadePanel, "".concat(componentCls, "-content"), {
    height: token.pickerPanelWithoutTimeCellHeight * 4
  }), _defineProperty(_decadePanel, pickerCellInnerCls, {
    padding: "0 ".concat(token.paddingXS, "px")
  }), _decadePanel)), _defineProperty(_componentCls, '&-quarter-panel', _defineProperty({}, "".concat(componentCls, "-content"), {
    height: token.pickerQuarterPanelContentHeight
  })), _defineProperty(_componentCls, "&-panel ".concat(componentCls, "-footer"), {
    borderTop: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorSplit)
  }), _defineProperty(_componentCls, '&-footer', {
    width: 'min-content',
    minWidth: '100%',
    lineHeight: "".concat(token.pickerTextHeight - 2 * token.controlLineWidth, "px"),
    textAlign: 'center',
    borderBottom: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorSplit),
    '&-extra': {
      padding: "0 ".concat(token.paddingSM),
      lineHeight: "".concat(token.pickerTextHeight - 2 * token.controlLineWidth, "px"),
      textAlign: 'start',
      '&:not(:last-child)': {
        borderBottom: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorBorder)
      }
    }
  }), _defineProperty(_componentCls, '&-now', {
    textAlign: 'start'
  }), _defineProperty(_componentCls, '&-today-btn', {
    color: token.colorLink,
    '&:hover': {
      color: token.colorLinkHover
    },
    '&:active': {
      color: token.colorLinkActive
    },
    '&:is(&-disabled)': {
      color: token.colorTextDisabled,
      cursor: 'not-allowed'
    }
  }), _defineProperty(_componentCls, '&-decade-panel', (_decadePanel2 = {}, _defineProperty(_decadePanel2, pickerCellInnerCls, {
    padding: "0 ".concat(token.paddingXS / 2, "px")
  }), _defineProperty(_decadePanel2, "".concat(componentCls, "-cell::before"), {
    display: 'none'
  }), _decadePanel2)), _defineProperty(_componentCls, "&-year-panel,\n        &-quarter-panel,\n        &-month-panel", (_yearPanel = {}, _defineProperty(_yearPanel, "".concat(componentCls, "-body"), {
    padding: "0 ".concat(token.paddingXS, "px")
  }), _defineProperty(_yearPanel, pickerCellInnerCls, {
    width: pickerYearMonthCellWidth
  }), _defineProperty(_yearPanel, "".concat(componentCls, "-cell-range-hover-start::after"), _defineProperty({
    insetInlineStart: hoverCellFixedDistance,
    borderInlineStart: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
    borderStartStartRadius: token.radiusBase,
    borderBottomStartRadius: token.radiusBase,
    borderStartEndRadius: 0,
    borderBottomEndRadius: 0
  }, "".concat(componentCls, "-panel-rtl &"), {
    insetInlineEnd: hoverCellFixedDistance,
    borderInlineEnd: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
    borderStartStartRadius: 0,
    borderBottomStartRadius: 0,
    borderStartEndRadius: token.radiusBase,
    borderBottomEndRadius: token.radiusBase
  })), _defineProperty(_yearPanel, "".concat(componentCls, "-cell-range-hover-end::after"), _defineProperty({
    insetInlineEnd: hoverCellFixedDistance,
    borderInlineEnd: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
    borderStartStartRadius: 0,
    borderBottomStartRadius: 0,
    borderStartEndRadius: token.radiusBase,
    borderBottomEndRadius: token.radiusBase
  }, "".concat(componentCls, "-panel-rtl &"), {
    insetInlineStart: hoverCellFixedDistance,
    borderInlineStart: "".concat(token.controlLineWidth, "px dashed ").concat(token.pickerDateHoverRangeBorderColor),
    borderStartStartRadius: token.radiusBase,
    borderBottomStartRadius: token.radiusBase,
    borderStartEndRadius: 0,
    borderBottomEndRadius: 0
  })), _yearPanel)), _defineProperty(_componentCls, '&-week-panel', (_weekPanel = {}, _defineProperty(_weekPanel, "".concat(componentCls, "-body"), {
    padding: "".concat(token.paddingXS, "px ").concat(token.paddingSM, "px")
  }), _defineProperty(_weekPanel, "".concat(componentCls, "-cell"), _defineProperty({}, "&:hover ".concat(pickerCellInnerCls, ",\n      &-selected ").concat(pickerCellInnerCls, ",\n      ").concat(pickerCellInnerCls), {
    background: 'transparent !important'
  })), _defineProperty(_weekPanel, '&-row', _defineProperty({
    td: {
      transition: "background ".concat(token.motionDurationSlow)
    },
    '&:hover td': {
      background: token.controlItemBgHover
    }
  }, "&-selected td,\n            &-selected:hover td", (_selectedTd = {
    background: token.colorPrimary
  }, _defineProperty(_selectedTd, "&".concat(componentCls, "-cell-week"), {
    color: new TinyColor(token.colorTextLightSolid).setAlpha(0.5).toHexString()
  }), _defineProperty(_selectedTd, "&".concat(componentCls, "-cell-today ").concat(pickerCellInnerCls, "::before"), {
    borderColor: token.colorTextLightSolid
  }), _defineProperty(_selectedTd, pickerCellInnerCls, {
    color: token.colorTextLightSolid
  }), _selectedTd))), _weekPanel)), _defineProperty(_componentCls, '&-date-panel', (_datePanel = {}, _defineProperty(_datePanel, "".concat(componentCls, "-body"), {
    padding: "".concat(token.paddingXS, "px ").concat(token.paddingSM, "px")
  }), _defineProperty(_datePanel, "".concat(componentCls, "-content"), {
    width: token.pickerPanelCellWidth * 7,
    th: {
      width: token.pickerPanelCellWidth
    }
  }), _datePanel)), _defineProperty(_componentCls, '&-datetime-panel', (_datetimePanel = {
    display: 'flex'
  }, _defineProperty(_datetimePanel, "".concat(componentCls, "-time-panel"), {
    borderInlineStart: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorBorder)
  }), _defineProperty(_datetimePanel, "".concat(componentCls, "-date-panel,\n          ").concat(componentCls, "-time-panel"), {
    transition: "opacity ".concat(token.motionDurationSlow)
  }), _defineProperty(_datetimePanel, '&-active', _defineProperty({}, "".concat(componentCls, "-date-panel,\n            ").concat(componentCls, "-time-panel"), {
    opacity: 0.3,
    '&-active': {
      opacity: 1
    }
  })), _datetimePanel)), _defineProperty(_componentCls, '&-time-panel', (_timePanel = {
    width: 'auto',
    minWidth: 'auto',
    direction: 'ltr'
  }, _defineProperty(_timePanel, "".concat(componentCls, "-content"), {
    display: 'flex',
    flex: 'auto',
    height: token.pickerTimePanelColumnHeight
  }), _defineProperty(_timePanel, '&-column', {
    flex: '1 0 auto',
    width: token.pickerTimePanelColumnWidth,
    margin: 0,
    padding: 0,
    overflowY: 'hidden',
    textAlign: 'start',
    listStyle: 'none',
    transition: "background ".concat(token.motionDurationSlow),
    '&::after': _defineProperty({
      display: 'block',
      height: token.pickerTimePanelColumnHeight - token.pickerTimePanelCellHeight,
      content: '""'
    }, "".concat(componentCls, "-datetime-panel &"), {
      height: token.pickerTimePanelColumnHeight - token.pickerPanelWithoutTimeCellHeight + 2 * token.controlLineWidth
    }),
    '&:not(:first-child)': {
      borderInlineStart: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorSplit)
    },
    '&-active': {
      background: new TinyColor(token.controlItemBgActive).setAlpha(0.2).toHexString()
    },
    '&:hover': {
      overflowY: 'auto'
    },
    '> li': _defineProperty({
      margin: 0,
      padding: 0
    }, "&".concat(componentCls, "-time-panel-cell"), (_$concat4 = {}, _defineProperty(_$concat4, "".concat(componentCls, "-time-panel-cell-inner"), {
      display: 'block',
      width: '100%',
      height: token.pickerTimePanelCellHeight,
      margin: 0,
      paddingBlock: 0,
      paddingInlineEnd: 0,
      paddingInlineStart: (token.pickerTimePanelColumnWidth - token.pickerTimePanelCellHeight) / 2,
      color: token.colorText,
      lineHeight: "".concat(token.pickerTimePanelCellHeight, "px"),
      borderRadius: 0,
      cursor: 'pointer',
      transition: "background ".concat(token.motionDurationSlow),
      '&:hover': {
        background: token.controlItemBgHover
      }
    }), _defineProperty(_$concat4, '&-selected', _defineProperty({}, "".concat(componentCls, "-time-panel-cell-inner"), {
      background: token.controlItemBgActive
    })), _defineProperty(_$concat4, '&-disabled', _defineProperty({}, "".concat(componentCls, "-time-panel-cell-inner"), {
      color: token.colorTextDisabled,
      background: 'transparent',
      cursor: 'not-allowed'
    })), _$concat4))
  }), _timePanel)), _componentCls));
};

var genPickerStatusStyle = function genPickerStatusStyle(token) {
  var componentCls = token.componentCls;
  return _defineProperty({}, componentCls, {
    '&-status-error&': _defineProperty({
      '&, &:not([disabled]):hover': {
        backgroundColor: token.colorBgContainer,
        borderColor: token.colorError
      },
      '&-focused, &:focus': _extends({}, genActiveStyle(mergeToken(token, {
        inputBorderActiveColor: token.colorError,
        inputBorderHoverColor: token.colorError,
        controlOutline: token.colorErrorOutline
      })))
    }, "".concat(componentCls, "-active-bar"), {
      background: token.colorError
    }),
    '&-status-warning&': _defineProperty({
      '&, &:not([disabled]):hover': {
        backgroundColor: token.colorBgContainer,
        borderColor: token.colorWarning
      },
      '&-focused, &:focus': _extends({}, genActiveStyle(mergeToken(token, {
        inputBorderActiveColor: token.colorWarning,
        inputBorderHoverColor: token.colorWarning,
        controlOutline: token.colorWarningOutline
      })))
    }, "".concat(componentCls, "-active-bar"), {
      background: token.colorWarning
    })
  });
};

var genPickerStyle = function genPickerStyle(token) {
  var _$concat6, _$concat8, _range, _$concat9, _$concat10, _$concat11, _extends3, _rtl2, _extends4;

  var componentCls = token.componentCls,
      antCls = token.antCls;
  return _defineProperty({}, componentCls, _extends(_extends(_extends({}, resetComponent(token)), genPikerPadding(token, token.controlHeight, token.fontSize, token.inputPaddingHorizontal)), (_extends4 = {
    position: 'relative',
    display: 'inline-flex',
    alignItems: 'center',
    background: token.colorBgContainer,
    border: "".concat(token.controlLineWidth, "px ").concat(token.controlLineType, " ").concat(token.colorBorder),
    borderRadius: token.radiusBase,
    transition: "border ".concat(token.motionDurationSlow, ", box-shadow ").concat(token.motionDurationSlow),
    '&:hover, &-focused': _extends({}, genHoverStyle(token)),
    '&-focused': _extends({}, genActiveStyle(token)),
    '&&-disabled': _defineProperty({
      background: token.colorBgContainerDisabled,
      borderColor: token.colorBorder,
      cursor: 'not-allowed'
    }, "".concat(componentCls, "-suffix"), {
      color: token.colorTextDisabled
    }),
    '&&-borderless': {
      backgroundColor: 'transparent !important',
      borderColor: 'transparent !important',
      boxShadow: 'none !important'
    }
  }, _defineProperty(_extends4, "".concat(componentCls, "-input"), {
    position: 'relative',
    display: 'inline-flex',
    alignItems: 'center',
    width: '100%',
    '> input': _extends(_extends({}, genBasicInputStyle(token)), {
      flex: 'auto',
      // Fix Firefox flex not correct:
      // https://github.com/ant-design/ant-design/pull/20023#issuecomment-564389553
      minWidth: 1,
      height: 'auto',
      padding: 0,
      background: 'transparent',
      border: 0,
      '&:focus': {
        boxShadow: 'none'
      },
      '&[disabled]': {
        background: 'transparent'
      }
    }),
    '&:hover': _defineProperty({}, "".concat(componentCls, "-clear"), {
      opacity: 1
    }),
    '&-placeholder': {
      '> input': {
        color: token.colorTextPlaceholder
      }
    }
  }), _defineProperty(_extends4, '&-large', _extends(_extends({}, genPikerPadding(token, token.controlHeightLG, token.fontSizeLG, token.inputPaddingHorizontal)), _defineProperty({}, "".concat(componentCls, "-input > input"), {
    fontSize: token.fontSizeLG
  }))), _defineProperty(_extends4, '&-small', _extends({}, genPikerPadding(token, token.controlHeightSM, token.fontSize, token.inputPaddingHorizontalSM))), _defineProperty(_extends4, "".concat(componentCls, "-suffix"), {
    display: 'flex',
    flex: 'none',
    alignSelf: 'center',
    marginInlineStart: token.paddingXS / 2,
    color: token.colorTextDisabled,
    lineHeight: 1,
    pointerEvents: 'none',
    '> *': {
      verticalAlign: 'top',
      '&:not(:last-child)': {
        marginInlineEnd: token.marginXS
      }
    }
  }), _defineProperty(_extends4, "".concat(componentCls, "-clear"), {
    position: 'absolute',
    top: '50%',
    insetInlineEnd: 0,
    color: token.colorTextDisabled,
    lineHeight: 1,
    background: token.colorBgContainer,
    transform: 'translateY(-50%)',
    cursor: 'pointer',
    opacity: 0,
    transition: "opacity ".concat(token.motionDurationSlow, ", color ").concat(token.motionDurationSlow),
    '> *': {
      verticalAlign: 'top'
    },
    '&:hover': {
      color: token.colorTextSecondary
    }
  }), _defineProperty(_extends4, "".concat(componentCls, "-separator"), (_$concat6 = {
    position: 'relative',
    display: 'inline-block',
    width: '1em',
    height: token.fontSizeLG,
    color: token.colorTextDisabled,
    fontSize: token.fontSizeLG,
    verticalAlign: 'top',
    cursor: 'default'
  }, _defineProperty(_$concat6, "".concat(componentCls, "-focused &"), {
    color: token.colorTextSecondary
  }), _defineProperty(_$concat6, "".concat(componentCls, "-range-separator &"), _defineProperty({}, "".concat(componentCls, "-disabled &"), {
    cursor: 'not-allowed'
  })), _$concat6)), _defineProperty(_extends4, '&-range', (_range = {
    position: 'relative',
    display: 'inline-flex'
  }, _defineProperty(_range, "".concat(componentCls, "-clear"), {
    insetInlineEnd: token.inputPaddingHorizontal
  }), _defineProperty(_range, '&:hover', _defineProperty({}, "".concat(componentCls, "-clear"), {
    opacity: 1
  })), _defineProperty(_range, "".concat(componentCls, "-active-bar"), {
    bottom: -token.controlLineWidth,
    height: token.lineWidthBold,
    marginInlineStart: token.inputPaddingHorizontal,
    background: token.colorPrimary,
    opacity: 0,
    transition: "all ".concat(token.motionDurationSlow, " ease-out"),
    pointerEvents: 'none'
  }), _defineProperty(_range, "&".concat(componentCls, "-focused"), _defineProperty({}, "".concat(componentCls, "-active-bar"), {
    opacity: 1
  })), _defineProperty(_range, "".concat(componentCls, "-range-separator"), {
    alignItems: 'center',
    padding: "0 ".concat(token.paddingXS, "px"),
    lineHeight: 1
  }), _defineProperty(_range, "&".concat(componentCls, "-small"), (_$concat8 = {}, _defineProperty(_$concat8, "".concat(componentCls, "-clear"), {
    insetInlineEnd: token.inputPaddingHorizontalSM
  }), _defineProperty(_$concat8, "".concat(componentCls, "-active-bar"), {
    marginInlineStart: token.inputPaddingHorizontalSM
  }), _$concat8)), _range)), _defineProperty(_extends4, '&-dropdown', _extends(_extends(_extends({}, resetComponent(token)), genPanelStyle(token)), (_extends3 = {
    position: 'absolute',
    // Fix incorrect position of picker popup
    // https://github.com/ant-design/ant-design/issues/35590
    top: -9999,
    left: {
      _skip_check_: true,
      value: -9999
    },
    zIndex: token.zIndexPopup,
    '&&-hidden': {
      display: 'none'
    },
    '&&-placement-bottomLeft': _defineProperty({}, "".concat(componentCls, "-range-arrow"), {
      top: "".concat(token.sizePopupArrow / 2 - token.sizePopupArrow / 3 + 0.7, "px"),
      display: 'block',
      transform: 'rotate(-135deg) translateY(1px)'
    }),
    '&&-placement-topLeft': _defineProperty({}, "".concat(componentCls, "-range-arrow"), {
      bottom: "".concat(token.sizePopupArrow / 2 - token.sizePopupArrow / 3 + 0.7, "px"),
      display: 'block',
      transform: 'rotate(45deg)'
    })
  }, _defineProperty(_extends3, "&".concat(antCls, "-slide-up-enter").concat(antCls, "-slide-up-enter-active&-placement-topLeft,\n          &").concat(antCls, "-slide-up-enter").concat(antCls, "-slide-up-enter-active&-placement-topRight,\n          &").concat(antCls, "-slide-up-appear").concat(antCls, "-slide-up-appear-active&-placement-topLeft,\n          &").concat(antCls, "-slide-up-appear").concat(antCls, "-slide-up-appear-active&-placement-topRight"), {
    animationName: slideDownIn
  }), _defineProperty(_extends3, "&".concat(antCls, "-slide-up-enter").concat(antCls, "-slide-up-enter-active&-placement-bottomLeft,\n          &").concat(antCls, "-slide-up-enter").concat(antCls, "-slide-up-enter-active&-placement-bottomRight,\n          &").concat(antCls, "-slide-up-appear").concat(antCls, "-slide-up-appear-active&-placement-bottomLeft,\n          &").concat(antCls, "-slide-up-appear").concat(antCls, "-slide-up-appear-active&-placement-bottomRight"), {
    animationName: slideUpIn
  }), _defineProperty(_extends3, "&".concat(antCls, "-slide-up-leave").concat(antCls, "-slide-up-leave-active&-placement-topLeft,\n          &").concat(antCls, "-slide-up-leave").concat(antCls, "-slide-up-leave-active&-placement-topRight"), {
    animationName: slideDownOut
  }), _defineProperty(_extends3, "&".concat(antCls, "-slide-up-leave").concat(antCls, "-slide-up-leave-active&-placement-bottomLeft,\n          &").concat(antCls, "-slide-up-leave").concat(antCls, "-slide-up-leave-active&-placement-bottomRight"), {
    animationName: slideUpOut
  }), _defineProperty(_extends3, "".concat(componentCls, "-panel > ").concat(componentCls, "-time-panel"), {
    paddingTop: token.paddingXS / 2
  }), _defineProperty(_extends3, "".concat(componentCls, "-ranges"), (_$concat9 = {
    marginBottom: 0,
    padding: "".concat(token.paddingXS / 2, "px ").concat(token.paddingSM, "px"),
    overflow: 'hidden',
    lineHeight: "".concat(token.pickerTextHeight - 2 * token.controlLineWidth - token.paddingXS / 2, "px"),
    textAlign: 'start',
    listStyle: 'none',
    display: 'flex',
    justifyContent: 'space-between',
    '> li': {
      display: 'inline-block'
    }
  }, _defineProperty(_$concat9, "".concat(componentCls, "-preset > ").concat(antCls, "-tag-blue"), {
    color: token.colorPrimary,
    background: token.controlItemBgActive,
    borderColor: token.colorPrimaryBorder,
    cursor: 'pointer'
  }), _defineProperty(_$concat9, "".concat(componentCls, "-ok"), {
    marginInlineStart: 'auto'
  }), _$concat9)), _defineProperty(_extends3, "".concat(componentCls, "-range-wrapper"), {
    display: 'flex'
  }), _defineProperty(_extends3, "".concat(componentCls, "-range-arrow"), _extends({
    position: 'absolute',
    zIndex: 1,
    display: 'none',
    width: token.sizePopupArrow,
    height: token.sizePopupArrow,
    marginInlineStart: token.inputPaddingHorizontal * 1.5,
    boxShadow: token.boxShadowPopoverArrowBottom,
    transition: "left ".concat(token.motionDurationSlow, " ease-out")
  }, roundedArrow(token.sizePopupArrow, 5, token.colorBgElevated))), _defineProperty(_extends3, "".concat(componentCls, "-panel-container"), (_$concat11 = {
    overflow: 'hidden',
    verticalAlign: 'top',
    background: token.colorBgElevated,
    borderRadius: token.radiusBase,
    boxShadow: token.boxShadow,
    transition: "margin ".concat(token.motionDurationSlow)
  }, _defineProperty(_$concat11, "".concat(componentCls, "-panels"), {
    display: 'inline-flex',
    flexWrap: 'nowrap',
    direction: 'ltr'
  }), _defineProperty(_$concat11, "".concat(componentCls, "-panel"), (_$concat10 = {
    verticalAlign: 'top',
    background: 'transparent',
    borderWidth: "0 0 ".concat(token.controlLineWidth, "px"),
    borderRadius: 0
  }, _defineProperty(_$concat10, "".concat(componentCls, "-content,\n            table"), {
    textAlign: 'center'
  }), _defineProperty(_$concat10, '&-focused', {
    borderColor: token.colorBorder
  }), _$concat10)), _$concat11)), _extends3))), _defineProperty(_extends4, '&-dropdown-range', {
    padding: "".concat(token.sizePopupArrow * 2 / 3, "px 0"),
    '&-hidden': {
      display: 'none'
    }
  }), _defineProperty(_extends4, '&-rtl', (_rtl2 = {
    direction: 'rtl'
  }, _defineProperty(_rtl2, "".concat(componentCls, "-separator"), {
    transform: 'rotate(180deg)'
  }), _defineProperty(_rtl2, "".concat(componentCls, "-footer"), {
    '&-extra': {
      direction: 'rtl'
    }
  }), _rtl2)), _extends4)));
};

export var initPickerPanelToken = function initPickerPanelToken(token) {
  var pickerTimePanelCellHeight = 28;
  return {
    pickerCellInnerCls: "".concat(token.componentCls, "-cell-inner"),
    pickerTextHeight: token.controlHeightLG,
    pickerPanelCellWidth: token.controlHeightSM * 1.5,
    pickerPanelCellHeight: token.controlHeightSM,
    pickerDateHoverRangeBorderColor: new TinyColor(token.colorPrimary).lighten(20).toHexString(),
    pickerBasicCellHoverWithRangeColor: new TinyColor(token.colorPrimary).lighten(35).toHexString(),
    pickerPanelWithoutTimeCellHeight: token.controlHeightLG * 1.65,
    pickerYearMonthCellWidth: token.controlHeightLG * 1.5,
    pickerTimePanelColumnHeight: pickerTimePanelCellHeight * 8,
    pickerTimePanelColumnWidth: token.controlHeightLG * 1.4,
    pickerTimePanelCellHeight: pickerTimePanelCellHeight,
    pickerQuarterPanelContentHeight: token.controlHeightLG * 1.4,
    pickerCellPaddingVertical: token.paddingXXS,
    pickerCellBorderGap: 2,
    pickerControlIconSize: 7,
    pickerControlIconBorderWidth: 1.5
  };
}; // ============================== Export ==============================

export default genComponentStyleHook('DatePicker', function (token) {
  var pickerToken = mergeToken(initInputToken(token), initPickerPanelToken(token));
  return [genPickerStyle(pickerToken), genPickerStatusStyle(pickerToken)];
}, function (token) {
  return {
    zIndexPopup: token.zIndexPopupBase + 50
  };
});